王震
2023-08-18 5cafe90e9e91127889a948ecb44dec61d6185bd4
src/components/view/rawUnqualified/raw.vue
@@ -4,7 +4,7 @@
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
   /* overflow-y: scroll; */
}
  .unqualifiedBox .title .el-button {
    height: 32px;
@@ -16,7 +16,7 @@
    margin-bottom: 10px;
    padding: 0 20px;
  }
/* 条件查询头部样式 */
<!-- /* 条件查询头部样式 */ -->
  .choose {
    padding: 21px 24px;
    display: flex;
@@ -25,7 +25,7 @@
    border-bottom: 3px solid rgb(245, 247, 251);
  }
  .choose * {
  .choose {
    font-size: 14px;
  }
@@ -35,193 +35,237 @@
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
  /* 不合格表格样式 */
  <!-- /* 不合格表格样式 */
  .unqualifiedTable{
    flex: 1;
    background: #fff;
    margin-top: 11px;
    padding: 23px 21px;
  }
  .tableno{
    margin-top: 30px;
  }
</style>
<template>
<div class="unqualifiedBox">
    <div class="title">
      <el-row>
        <el-col :span="12" style="line-height: 32px;">原材料不合格</el-col>
        <el-col :span="12" style="text-align: right;">
          <el-button icon="el-icon-download" @click="()=>{}">导出</el-button>
        </el-col>
      </el-row>
  <div class="unqualifiedBox">
    <el-row>
          <el-col :span="12" style="line-height: 32px;">原材料不合格</el-col>
          <el-col :span="12" style="text-align: right;">
            <el-button icon="el-icon-download" size="mini" @click="()=>{}">导出</el-button>
          </el-col>
        </el-row>
    <div style="margin-top: 10px;">
    <el-card shadow="hover" class="margin-30" style="height: 80px;">
      <div class="choose" >
        <span>处理状态:</span>
        <el-select v-model="search.insState" size="small" placeholder="请选择" style="width: 224px;margin-right: 30px;">
          <el-option label="已处理" :value="2"></el-option>
          <el-option label="待处理" :value="0"></el-option>
        </el-select>
        <span>来料日期:</span>
        <el-date-picker v-model="search.createTime" size="small" placeholder="请输入"
          style="width: 224px;margin-right: 30px;" clearable value-format="yyyy-MM-dd"></el-date-picker>
        <span>供应商:</span>
        <el-select v-model="search.insState" size="small" placeholder="请选择" style="width: 224px;margin-right: 30px;">
          <el-option label="全部" :value="2"></el-option>
          <el-option label="未检测" :value="0"></el-option>
          <el-option label="已检测" :value="1"></el-option>
        </el-select>
        <el-button size="mini" @click="clean()"><span>重 置</span></el-button>
        <el-button size="mini" type="primary" style="background: #004EA2;" @click="selectRawInspectsList()"><span>查
            询</span></el-button>
      </div>
    </el-card>
    </div>
    <div class="choose">
      <span>处理状态:</span>
      <el-select v-model="search.insState" size="small" placeholder="请选择" style="width: 224px;margin-right: 30px;">
        <el-option label="已处理" :value="2"></el-option>
        <el-option label="待处理" :value="0"></el-option>
      </el-select>
      <span>来料日期:</span>
      <el-date-picker v-model="search.createTime" size="small" placeholder="请输入"
        style="width: 224px;margin-right: 30px;" clearable value-format="yyyy-MM-dd"></el-date-picker>
      <span>供应商:</span>
      <el-select v-model="search.insState" size="small" placeholder="请选择" style="width: 224px;margin-right: 30px;">
        <el-option label="全部" :value="2"></el-option>
        <el-option label="未检测" :value="0"></el-option>
        <el-option label="已检测" :value="1"></el-option>
      </el-select>
      <el-button size="mini" @click="clean()"><span>重 置</span></el-button>
      <el-button size="mini" type="primary" style="background: #004EA2;" @click="selectRawInspectsList()"><span>查
          询</span></el-button>
      <div class="tableno" style="height:300px">
        <!-- <el-table :data=" unqualifiedTable"  border style ="width: 100%;overflow-y: auto;min-height: calc(100% - 50px)"
              max-height="calc(100% - 50px)"  row-key="id"
              :tree-props="{children: 'children', hasChildren: 'hasChildren'}"> -->
              <el-card shadow="hover" class="margin-30">
              <el-table :data=" unqualifiedTable" border ref="multipleTable" tooltip-effect="dark"
              style="width: 100%"  @selection-change="handleSelectionChange">
              <el-table-column
                  type="selection"
                  width="50">
              </el-table-column>
              <el-table-column
                  type="index"
                  label="序号"
                  >
              </el-table-column>
              <el-table-column
                  prop="来料日期"
                  label="来料日期"
                  >
              </el-table-column>
              <el-table-column
                  prop="reason"
                  label="缺陷名称"
                  >
              </el-table-column>
              <el-table-column
                  prop="material_code"
                  label="材料编码"
                  >
              </el-table-column>
              <el-table-column
                  prop="id"
                  label="材料名称">
              </el-table-column>
              <el-table-column
                  prop="specifications_model"
                  label="规格型号"
                  >
              </el-table-column>
              <el-table-column
                  prop="unit"
                  label="单位"
                  >
              </el-table-column>
              <el-table-column
                  prop="quantity"
                  label="数量"
                  >
              </el-table-column>
              <el-table-column
                  prop="报检日期"
                  label="报检日期"
                  >
              </el-table-column>
              <el-table-column
                  prop="name"
                  label="报检人"
                  >
              </el-table-column>
              <el-table-column
                  prop="报检日期"
                  label="报检日期"
                  >
              </el-table-column>
              <el-table-column
                  prop="deal_state"
                  label="处理状态"
                  width="100">
                  <template slot-scope="scope">
                    <span style="color:#34BD66;" v-if="scope.row.deal_state==1">已处理</span>
                    <span style="color:#E84738;" v-else-if="scope.row.deal_state==0">待处理</span>
                  </template>
              </el-table-column>
              <el-table-column
                  prop="deal_reasult"
                  label="处理结果"
                  width="100">
                  <template slot-scope="scope">
                    <span style="color:#34BD66;" v-if="scope.row.deal_reasult==1">不通过</span>
                    <span style="color:#E84738;" v-else-if="scope.row.deal_reasult==0">通过</span>
                  </template>
              </el-table-column>
              <el-table-column
                  label="操作"
                  width="100"
                  >
                  <template slot-scope="scope">
                  <div style="display: flex;">
                    <el-button type="text" siae="small"  size="mini">评审</el-button>
                    <el-button type="text" siae="small"  size="mini" style=" color:87, 138, 193 ;" @click="">查看</el-button>
                  </div>
                  </template>
              </el-table-column>
            </el-table>
          </el-card>
          <el-col style="height: 50px;display: flex;align-items: center;justify-content: right;">
          <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[1,10, 20, 30, 50]"
              :page-size="pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="countSize">
            </el-pagination>
          </el-col>
    </div>
    <div class="unqualifiedTable">
        <el-table :data="unqualifiedData" height="620">
            <el-table-column
                type="selection"
                width="55">
            </el-table-column>
            <el-table-column
                type="index"
                label="序号"
                width="60">
            </el-table-column>
            <el-table-column
                prop="name"
                label="缺陷名称"
                width="97">
            </el-table-column>
            <el-table-column
                prop="address"
                label="材料编码"
                width="141">
            </el-table-column>
            <el-table-column
                prop="name"
                label="材料名称"
                width="214">
            </el-table-column>
            <el-table-column
                prop="address"
                label="规格型号">
            </el-table-column>
            <el-table-column
                prop="address"
                label="单位"
                width="250">
            </el-table-column>
            <el-table-column
                prop="address"
                label="数量"
                width="75">
            </el-table-column>
            <el-table-column
                prop="address"
                label="报检日期"
                width="128">
            </el-table-column>
            <el-table-column
                prop="address"
                label="报检人"
                width="78">
            </el-table-column>
            <el-table-column
                prop="address"
                label="处理日期"
                width="120">
            </el-table-column>
            <el-table-column
                prop="address"
                label="处理状态"
                width="100">
            </el-table-column>
            <el-table-column
                prop="address"
                label="处理结果"
                width="100">
            </el-table-column>
            <el-table-column
                prop="address"
                label="操作"
                width="118">
            </el-table-column>
        </el-table>
        <el-col style="height: 50px;display: flex;align-items: center;justify-content: right;">
        <el-pagination
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 50]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="countSize">
        </el-pagination>
      </el-col>
    </div>
</div>
  </div>
</template>
<script>
export default {
    data() {
        return {
            // 搜索条件
            search:{},
            unqualifiedData:[
                {
                    date: '2016-05-02',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市'
                }, {
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市'
                }
            ],
            countSize:1,
            pageSize:10,
            currentPage:1
            search:{
              formTime: "null",
              deal_state:2,
              deal_reasult:2,
            },
            unqualifiedTable:[],
            // articlelist:[] ,
            selects:[],
            countSize: 0,
            pageSize: 2,
            currentPage: 10
        }
    },
    props:['godata'],
    created(){
        this.getDetailInfo()
    },
   mounted() {
      this.getDetailInfo()
    },
    methods:{
      handleSizeChange(val) {
        this.pageSize = 1
        this.countSize= val
        this.getDetailInfo()
      },
      handleCurrentChange(val) {
        this.pageSize = val
        this.getDetailInfo()
      },
      getDetailInfo() {
        // console.log(this.$api.url.selectUnRawInspectsList);
          this.axios.get(this.$api.url.selectUnRawInspectsList, {
            params:{countSize:this.currentPage, pageSize:this.pageSize},
              // pageSize: this.currentPage,
              // countSize: this.pageSize,
              // formTime: this.search.formTime,
              // deal_state: this.search. deal_state,
              // deal_reasult: this.search.deal_reasult,
          }).then(res=>{
            // console.log(res);
            this.unqualifiedTable = res.data.row
            // console.log(this.unqualifiedTable);
            // this.countSize = res.data.count
            // console.log(111);
          })
      },
      changeShowDetail({id}){
        this.godata()
      }
  }
}
</script>
</script>