王震
2023-09-08 9e2144ae9eaed728cc12e75f7ae1b53e5874d5bf
Merge remote-tracking branch 'origin/master'
已修改7个文件
2557 ■■■■■ 文件已修改
src/assets/api/controller.js 28 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/Processingproducts.vue 564 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/raw-ins.vue 379 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/rawInsDetail.vue 838 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/rawUnqualified/raw.vue 490 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/rawUnqualifiedBox.vue 13 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/unqualifiedManagement.vue 245 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/api/controller.js
@@ -17,19 +17,30 @@
}
// 原材料检验
const raw = {
    selectRawInspectsList: "rawInspect/selectRawInspectsList", //查询原材料检验单列表
    selectRawInspectsListById: "rawInspect/selectRawInspectsListById/", //根据检验单id获取检验单详情
    updaterawInsProduct: 'rawInsProduct/updaterawInsProduct', //修改项目的检验值
    selectRawInspectsList: "/rawInspect/selectRawInspectsList", //查询原材料检验单列表
    selectRawInspectsListById: "/rawInspect/selectRawInspectsListById/", //根据检验单id获取检验单详情
    updaterawInsProduct: '/rawInsProduct/updaterawInsProduct', //修改项目的检验值
    updateRawInspectsById: "/rawInspect/updateRawInspectsById/", //上报,
    selectRawMaterial: "/rawInspect/selectMaterial", //查询原材料信息
    selectDevice: "/rawInsProduct/selectDevice", //查询设备信息
    selectSpBySt: "/rawInspect/selectSpBySt", //根据材料id查询所有型号,
    addRawInspects: "/rawInspect/addRawInspects"
}
//不合格原材料
const unqualifiedaa ={
    selectUnRawInspectsList: "/inspectUnaccepted/selectUnRawInspectsList"
    selectUnRawInspectsList: "/inspectUnaccepted/selectURawMaterials"
}
// 查询成品不合格品管理
const unRawInspects ={
    inspectUnaccepted: "/inspectUnaccepted/selectUnRawInspectsList"
}
//不合格品处置
const dispose = {
    getTable: "/inspectUnaccepted/selectDisposal", // 不合格品分页列表
    descriptionUpdate: "/inspectUnaccepted/descriptionUpdate", // 失焦更新现像描述
    viewEditorial: "/inspectUnaccepted/viewEditorial", // 查看编辑意见
    clickEditing: "/inspectUnaccepted/clickEditing", // 点击编辑意见触发查询
    addOpinion: "/inspectUnaccepted/addOpinion" // 编辑意见-->确定按钮
}
// 成品检验
const finishedIns = {
    finishedInsListPage: "/finished-inspect/list_page", //获取成品检验列表
@@ -54,10 +65,6 @@
  tableDeviceList: "/device/table_list", // 实验室模块表格数据
  deleteDevice: "/device/delete", // 删除实验室设备
  deleteIdorFather: "/device/deleteIdorFather" // 删除树模块数据
}
//不合格品处置
const dispose = {
    gettable:"/opinion/list_page"
}
// QMS计量管理
@@ -123,6 +130,7 @@
    ...unqualifiedaa,
    ...dispose,
    ...Basicdata,
    ...unRawInspects,
    // ...gettable,
    selectSaleList: "sale/selectSaleList", //查询销售单列表
    selectSaleDatilById: "sale/selectSaleDatilById", //根据销售单id查看详情,
src/components/view/Processingproducts.vue
@@ -1,192 +1,400 @@
<template>
    <div>
        <div class="article-main" style="overflow: hidden;">
            <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>
                <div style="margin-top: 10px;">
                    <el-card shadow="hover" class="margin-30">
                            <el-form ref="form" :model="searchform" label-width="80px">
                            <el-row :gutter="25">
                                <el-col :span="7" >
                                    <el-form-item label="产品名称:">
                                        <el-input v-model="searchform.name" placeholder="请输入"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="7" >
                                    <el-form-item label="规格型号:">
                                        <el-input v-model="searchform.stude" placeholder="请输入"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5">
                                    <el-button size="default"  @click="">重置</el-button>
                                    <el-button type="primary" size="default" style="background:0, 78, 162 ;" @click="getDetailInfo">查询</el-button>
                                </el-col>
                            </el-row>
                            </el-form>
                    </el-card>
                </div>
                <div style="margin-top: 30px;">
                    <el-card shadow="hover" class="margin-30">
                        <el-table
                            ref="multipleTable"
                            :data="tableData"
                            tooltip-effect="dark"
                            style="width: 100%"
                            @selection-change="handleSelectionChange">
                            <el-table-column
                            type="selection"
                            width="55">
                            </el-table-column>
                            <el-table-column
                            label="日期"
                            width="120">
                            <template slot-scope="scope">{{ scope.row.date }}</template>
                            </el-table-column>
                            <el-table-column
                            prop="name"
                            label="姓名"
                            width="120">
                            </el-table-column>
                            <el-table-column
                            prop="address"
                            label="地址"
                            show-overflow-tooltip>
                            </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="4"
                        :page-sizes="[1,10, 20, 30, 50]"
                        :page-size="4"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="countSize">
                        </el-pagination>
                    </el-col>
                </div>
            </div>
  <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-input
            size="small"
            v-model="search.productName"
            style="width: 224px;margin-right: 30px;"
            placeholder="请输入"
            clearable
          ></el-input>
          <span>规格型号:</span>
          <el-input
            size="small"
            v-model="search.specificationModel"
            style="width: 224px;margin-right: 30px;"
            placeholder="请输入"
            clearable
          ></el-input>
          <span>产品大类:</span>
          <el-select
            v-model="search.productCategories"
            size="small"
            placeholder="请选择"
            style="width: 224px;margin-right: 30px;"
          >
            <el-option label="原材料" :value="0"></el-option>
            <el-option label="成品" :value="1"></el-option>
            <el-option label="半成品" :value="2"></el-option>
          </el-select>
          <span>状态:</span>
          <el-select
            v-model="search.state"
            size="small"
            placeholder="请选择"
            style="width: 224px;margin-right: 30px;"
          >
            <el-option label="返修中" :value="1"></el-option>
            <el-option label="待处理" :value="0"></el-option>
          </el-select>
          <el-button size="mini" @click="clean()"><span>重 置</span></el-button>
          <el-button
            size="mini"
            type="primary"
            style="background: #004EA2;"
            @click="
              unqualifiedTable = [];
              getDetailInfo();
            "
            ><span>查 询</span></el-button
          >
        </div>
    </div>
      </el-card>
    </div>
    <div class="tableno" style="height:300px">
      <el-card shadow="hover" class="margin-30">
        <el-table
          :data="unqualifiedTable"
          border
          ref="multipleTable"
          tooltip-effect="dark"
          height="calc(100vh - 340px)"
          style="width: 100%"
        >
          <el-table-column type="selection" min-width="50"> </el-table-column>
          <el-table-column type="index" label="序号" width="60">
            <template scope="scope">
              {{ (search.pageSize - 1) * search.countSize + scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column prop="dateArrival" label="产品大类">
            <template scope="scope">
              <span v-if="scope.row.type == 0">原材料</span>
              <span v-if="scope.row.type == 1">成品</span>
              <span v-if="scope.row.type == 2">半成品</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="productName"
            label="产品名称"
            min-width="90"
            show-overflow-tooltip
          >
          </el-table-column>
          <el-table-column prop="specifications" label="规格型号">
          </el-table-column>
          <el-table-column prop="number" label="不合格品数量">
          </el-table-column>
          <el-table-column label="现像描述" min-width="150">
            <template scope="scope">
              <el-input
                size="small"
                v-model="scope.row.description"
                @blur="outOfFocusDescription(scope)"
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column label="处置意见">
            <template scope="scope">
              <el-button type="text" @click="showDisposalOpinions(scope)"
                >查看处置意见</el-button
              >
            </template>
          </el-table-column>
          <el-table-column prop="user_name" label="申请人"> </el-table-column>
          <el-table-column prop="date" label="日期"> </el-table-column>
          <el-table-column prop="deal_state" label="状态">
            <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 label="操作" width="130">
            <template 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="clickEditorialOpinion(scope)"
                  >编辑意见</el-button
                >
              </div>
            </template>
          </el-table-column>
        </el-table>
        <el-col
          style="height: 50px;display: flex;align-items: center;justify-content: right;"
        >
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="search.pageSize"
            :page-sizes="[10, 15, 20, 30, 50]"
            :page-size="search.countSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </el-col>
      </el-card>
    </div>
    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
      <el-form label-width="130px">
        <div v-for="item in updateEditList" :key="item.$index">
          <el-form-item
            :label="
              item.type == 0
                ? '技术部处置意见:'
                : item.type == 1
                ? '生产部处置意见:'
                : item.type == 2
                ? '质量部处置意见:'
                : '总经办处置意见:'
            "
          >
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入内容"
              v-model="item.tell"
            >
            </el-input>
          </el-form-item>
          <el-row v-if="isShow == true">
            <el-col :span="12">
              <el-form-item label="填写人:" v-if="isShow == true">
                {{ item.name }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="填写日期:" v-if="isShow == true">
                {{ item.fillDate }}
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="处置方式:">
            <el-radio-group v-model="item.way">
              <el-radio :label="0">返工</el-radio>
              <el-radio :label="1">返修</el-radio>
              <el-radio :label="2">让步接收</el-radio>
              <el-radio :label="3">拒收</el-radio>
              <el-radio :label="4">降级使用</el-radio>
              <el-radio :label="5">报废</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-divider v-if="item.type != 3"></el-divider>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="updateEditDevided()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { watch } from "vue";
export default {
    data() {
      return {
        searchform:{
            name:'',
            stude:''
        },
        tableData: [
            {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-08',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-06',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-07',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }
    ],
        pageSize:3,
        countSize:1,
        currentPage:2,
        multipleSelection:''
      }
    },
    created(){
        // this.getDetailInfo()
    },
    methods:{
        handleSelectionChange(val) {
            // console.log(val);
        // this.multipleSelection = val;
  data() {
    return {
      isShow: false,
      search: {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        productCategories: "", // 产品大类
        productName: "", // 产品名称
        specificationModel: "", // 规格型号
        state: "" // 状态
      },
        handleSizeChange(val) {
            console.log(val);
        // this.pageSize = 1
        // this.countSize= val
        // this.getDetailInfo()
        },
        handleCurrentChange(val) {
        // this.pageSize = val
        // this.getDetailInfo()
        },
        getDetailInfo() {
            let aa = [0,5]
            aa.map(el =>{
                console.log(el);
            })
            console.log(this.searchform.name);
            console.log(this.searchform.stude);
            // this.tableData
            // this.axios.get(this.$api.url.gettable,{
            //     params:{pageNo:10,
            //         pageSize:1,
            //         productName:this.searchform.name,
            //         specificationsModels:this.searchform.stude
            //     },
            // }).then(res=>{
            //     console.log(res);
            //     this.tableData = res.data.row
            // })
      unqualifiedTable: [], // 页面表格数据
      total: 0, // 总条数
      dialogVisible: false, // 显示弹出框
      updateEditList: []
    };
  },
  mounted() {
    this.getDetailInfo();
  },
  methods: {
    // 分页
    handleSizeChange(val) {
      this.search.countSize = val;
      this.getDetailInfo();
    },
    // 分页
    handleCurrentChange(val) {
      this.search.pageSize = val;
      this.getDetailInfo();
    },
    // 分页表格数据
    getDetailInfo() {
      this.axios
        .get(this.$api.url.getTable, {
          params: this.search
        })
        .then(res => {
          this.unqualifiedTable = res.data.row;
          this.total = res.data.total;
        });
    },
    // 重置按钮
    clean() {
      this.search = {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        productCategories: "", // 产品大类
        productName: "", // 产品名称
        specificationModel: "", // 规格型号
        state: "" // 状态
      };
      this.getDetailInfo();
    },
    // 点击查看处置意见
    showDisposalOpinions(scope) {
      this.isShow = true;
      this.dialogVisible = true;
      this.$axios
        .get(this.$api.url.viewEditorial, {
          params: {
            rawUnacceptedId: scope.row.id
          }
        })
        .then(res => {
          this.updateEditList = res.data;
        });
    },
    // 点击编辑意见
    clickEditorialOpinion(scope) {
      this.dialogVisible = true;
      this.axios
        .get(this.$api.url.clickEditing, {
          params: { rawUnacceptedId: scope.row.id }
        })
        .then(res => {
          this.updateEditList = res.data;
        });
    },
    // 失去现像描述焦点触发
    outOfFocusDescription(scope) {
      this.axios
        .get(this.$api.url.descriptionUpdate, {
          params: {
            rawUnacceptedId: scope.row.id,
            tell: scope.row.description
          }
        })
        .then(res => {
          this.$message({
            message: res.message,
            type: "success"
          });
        });
    },
    // 点击确定按钮
    updateEditDevided() {
      this.$axios
        .post(this.$api.url.addOpinion, this.updateEditList, {
          headers: { "Content-Type": "application/json" }
        })
        .then(res => {
          console.log(`output->res`, res);
          this.dialogVisible = false;
        });
    }
  },
  watch: {
    dialogVisible: {
      handler(newVal, oldVal) {
        if (newVal == false) {
          this.isShow = false;
        }
}}
    //   methods:{
    //     toggleSelection(rows) {
    //     if (rows) {
    //       rows.forEach(row => {
    //         this.$refs.multipleTable.toggleRowSelection(row);
    //       });
    //     } else {
    //       this.$refs.multipleTable.clearSelection();
    //     }
    //   },
    //  }
    // }
      }
    }
  }
};
</script>
<style scoped>
.card-2{
    display: flex;
    margin-top: 30px;
.main_div {
  padding-top: 15px;
}
.el-radio__label {
  font-size: 16px;
}
.el-radio {
  margin-right: 60px;
  margin-top: 10px;
}
.el-form-item {
  margin-bottom: 6px;
  font-size: 16px;
}
.unqualifiedBox {
  width: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  /* overflow-y: scroll; */
}
.unqualifiedBox .title .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
/deep/ .el-table__cell {
  padding: 5px 0;
}
.unqualifiedBox .title {
  margin-bottom: 10px;
  padding: 0 20px;
}
<!-- /* 条件查询头部样式 */ -->
    .choose {
  padding: 21px 24px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border-bottom: 3px solid rgb(245, 247, 251);
}
.ssss{
    background-color: #fff;
.choose {
  font-size: 14px;
}
.choose .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  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: 10px;
}
</style>
src/components/view/raw-ins.vue
@@ -1,79 +1,79 @@
<style scoped>
  .raw_ins {
    height: 100%;
  }
.raw_ins {
  height: 100%;
}
  .raw_ins .title .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
.raw_ins .title .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
  .raw_ins .title {
    margin-bottom: 10px;
    padding: 0 20px;
  }
.raw_ins .title {
  margin-bottom: 10px;
  padding: 0 20px;
}
  .choose {
    padding: 21px 24px;
    display: flex;
    align-items: center;
    background-color: #fff;
    border-bottom: 3px solid rgb(245, 247, 251);
  }
.choose {
  padding: 21px 24px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border-bottom: 3px solid rgb(245, 247, 251);
}
  .choose * {
    font-size: 14px;
  }
.choose * {
  font-size: 14px;
}
  .choose .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
.choose .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
  .thing {
    width: calc(100% - 44px);
    height: calc(100% - 42px - 82px - 66px);
    background-color: #fff;
    overflow: auto;
    padding: 33px 22px;
  }
.thing {
  width: calc(100% - 44px);
  height: calc(100% - 42px - 82px - 66px);
  background-color: #fff;
  overflow: auto;
  padding: 33px 22px;
}
  .table_do {
    color: #004ea0;
    cursor: pointer;
  }
.table_do {
  color: #004ea0;
  cursor: pointer;
}
</style>
<style>
  .raw_ins .thing * {
    font-size: 14px;
  }
.raw_ins .thing * {
  font-size: 14px;
}
  .raw_ins .has-gutter .el-table__cell {
    background-color: #F0F1F5 !important;
    color: #333;
  }
.raw_ins .has-gutter .el-table__cell {
  background-color: #f0f1f5 !important;
  color: #333;
}
  .raw_ins .has-gutter .el-table__cell .cell {
    font-size: 16px;
    font-weight: 500;
  }
.raw_ins .has-gutter .el-table__cell .cell {
  font-size: 16px;
  font-weight: 500;
}
  .raw_ins .cell {
    color: #333;
    padding-left: 17px !important;
  }
.raw_ins .cell {
  color: #333;
  padding-left: 17px !important;
}
  .raw_ins .el-table__body-wrapper {
    height: 100%;
  }
.raw_ins .el-table__body-wrapper {
  height: 100%;
}
  .raw_ins .el-table__body {
    height: 100%;
  }
.raw_ins .el-table__body {
  height: 100%;
}
</style>
<template>
@@ -82,81 +82,128 @@
      <el-row>
        <el-col :span="12" style="line-height: 32px;">原材料检验</el-col>
        <el-col :span="12" style="text-align: right;">
          <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;" @click="goDetail(null)">新增</el-button>
          <el-button icon="el-icon-download">删除</el-button>
          <el-button
            type="primary"
            icon="el-icon-plus"
            style="background: #004EA2;"
            @click="goDetail(null)"
            >新增</el-button
          >
          <el-button icon="el-icon-download">导出</el-button>
        </el-col>
      </el-row>
    </div>
    <div class="choose">
      <span>来料日期:</span>
      <el-date-picker v-model="search.formTime" size="small" placeholder="请输入" style="width: 224px;margin-right: 30px;"
        clearable value-format="yyyy-MM-dd"></el-date-picker>
      <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>
      <el-date-picker
        v-model="search.formTime"
        size="small"
        placeholder="请输入"
        style="width: 224px;margin-right: 30px;"
        clearable
        value-format="yyyy-MM-dd"
      ></el-date-picker>
      <span>原材料编码:</span>
      <el-input
        v-model="search.code"
        size="small"
        placeholder="请输入"
        style="width: 224px;margin-right: 30px;"
        clearable
      ></el-input>
      <span>检测状态:</span>
      <el-select v-model="search.insState" size="small" placeholder="请选择" style="width: 224px;margin-right: 30px;">
      <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>
      <span>合格状态:</span>
      <el-select v-model="search.judgeState" 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>
      <span>原材料名称:</span>
      <el-input
        v-model="search.name"
        size="small"
        placeholder="请输入"
        style="width: 224px;margin-right: 30px;"
        clearable
      ></el-input>
      <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>
      <el-button
        size="mini"
        type="primary"
        style="background: #004EA2;"
        @click="selectRawInspectsList()"
        ><span>查 询</span></el-button
      >
    </div>
    <div class="thing">
      <el-table :data="tableData" border style="width: 100%;overflow-y: auto;min-height: calc(100% - 50px)"
        max-height="calc(100% - 50px)" @selection-change="handleSelectionChange"  default-expand-all
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}" row-key="id">
        <el-table-column type="selection" width="50">
        </el-table-column>
      <el-table
        :data="tableData"
        border
        style="width: 100%;overflow-y: auto;min-height: calc(100% - 50px)"
        max-height="calc(100% - 50px)"
        @selection-change="handleSelectionChange"
        default-expand-all
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
        row-key="id"
      >
        <el-table-column type="selection" width="50"> </el-table-column>
        <el-table-column type="index" label="序号" width="70">
        </el-table-column>
        <el-table-column prop="formTime" label="来料日期">
        </el-table-column>
        <el-table-column prop="code" label="原材料编码">
        </el-table-column>
        <el-table-column prop="name" label="原材料名称">
        </el-table-column>
        <el-table-column prop="formTime" label="来料日期"> </el-table-column>
        <el-table-column prop="code" label="原材料编码"> </el-table-column>
        <el-table-column prop="name" label="原材料名称"> </el-table-column>
        <el-table-column prop="specifications" label="规格型号">
        </el-table-column>
        <el-table-column prop="unit" label="单位">
        </el-table-column>
        <el-table-column prop="number" label="数量">
        </el-table-column>
        <el-table-column prop="createTime" label="报检日期">
        </el-table-column>
        <el-table-column prop="userName" label="报检人">
        </el-table-column>
        <el-table-column prop="judgeState" label="合格状态" width="100">
        <el-table-column prop="unit" label="单位"> </el-table-column>
        <el-table-column prop="number" label="数量"> </el-table-column>
        <el-table-column prop="createTime" label="报检日期"> </el-table-column>
        <el-table-column prop="user_name" label="报检人"> </el-table-column>
        <el-table-column prop="createTime" label="检验日期"> </el-table-column>
        <el-table-column prop="createTime" label="检测状态" width="100">
          <template slot-scope="scope">
            <span style="color: #34BD66;" v-if="scope.row.judgeState==1">合格</span>
            <span style="color: #E84738;" v-else-if="scope.row.judgeState==0">不合格</span>
            <span style="color: #34BD66;" v-if="scope.row.ins_state == 1"
              >已检测</span
            >
            <span style="color: #E84738;" v-else-if="scope.row.ins_state == 0"
              >未检测</span
            >
          </template>
        </el-table-column>
        <el-table-column prop="insState" label="检测状态" width="100">
        <el-table-column prop="judge_state" label="合格状态" width="100">
          <template slot-scope="scope">
            <span style="color: #34BD66;" v-if="scope.row.insState==1">已检测</span>
            <span style="color: #E84738;" v-else-if="scope.row.insState==0">未检测</span>
            <span style="color: #34BD66;" v-if="scope.row.judge_state == 1"
              >合格</span
            >
            <span style="color: #E84738;" v-else-if="scope.row.judge_state == 0"
              >不合格</span
            >
          </template>
        </el-table-column>
        <el-table-column label="操作" width="100">
          <template slot-scope="scope">
            <span class="table_do" @click="changeShowDetail(scope.row)">查看</span>
            <span class="table_do" @click="changeShowDetail(scope.row)"
              >查看</span
            >
            <span class="table_do">打印</span>
          </template>
        </el-table-column>
      </el-table>
      <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-col
        style="height: 50px;display: flex;align-items: center;justify-content: right;"
      >
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="1"
          :page-sizes="[10, 15, 20, 30, 50]"
          :page-size="search.co"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        >
        </el-pagination>
      </el-col>
    </div>
@@ -164,71 +211,63 @@
</template>
<script>
  export default {
    data() {
      return {
        search: {
          formTime: null,
          createTime: null,
          insState: 2,
          judgeState: 10
        },
        tableData: [],
        selects: [],
        currentPage: 1,
        countSize: 0,
        pageSize: 2
      }
export default {
  data() {
    return {
      search: {
        formTime: "", // 来料时间
        code: "", // 原材料编码
        insState: "", // 检测状态
        name: "", //
        countSize: 10, // 条数/页
        pageSize: 1 // 页数
      },
      total: 0,
      tableData: [],
      selects: []
    };
  },
  props: ["goDetail"],
  mounted() {
    this.selectRawInspectsList();
  },
  methods: {
    handleSelectionChange(val) {
      this.selects = val;
    },
    props:['goDetail'],
    mounted() {
      this.selectRawInspectsList()
    handleSizeChange(val) {
      this.search.countSize = val;
      this.selectRawInspectsList();
    },
    methods: {
      handleSelectionChange(val) {
        this.selects = val;
      },
      handleSizeChange(val) {
        this.pageSize = val
        this.selectRawInspectsList()
      },
      handleCurrentChange(val) {
        this.currentPage = val
        this.selectRawInspectsList()
      },
      selectRawInspectsList() {
        this.axios.post(this.$api.url.selectRawInspectsList, {
          pageSize: this.currentPage,
          countSize: this.pageSize,
          formTime: this.search.formTime,
          createTime: this.search.createTime,
          insState: this.search.insState,
          judgeState: this.search.judgeState
        }).then(res => {
          this.tableData = res.data.data
          this.countSize = res.data.count
        })
      },
      clean() {
        this.selects = []
        this.currentPage = 1
        this.countSize = 0
        this.pageSize = 10
        this.search = {
            formTime: null,
            createTime: null,
            insState: 2,
            judgeState: 2
          },
          this.selectRawInspectsList()
      },
       changeShowDetail({id}){
        this.goDetail(id)
        // console.log(id)
        // const res = await this.$axios.post(this.$api.url.selectRawInspectsListById,{params:{id}})
        // console.log(res)
      }
    handleCurrentChange(val) {
      this.search.pageSize = val;
      this.selectRawInspectsList();
    },
    selectRawInspectsList() {
      this.axios
        .post(this.$api.url.selectRawInspectsList, this.search)
        .then(res => {
          this.tableData = res.data.row;
          this.total = res.data.total;
        });
    },
    clean() {
      this.search = {
        formTime: "", // 来料时间
        code: "", // 原材料编码
        insState: "", // 检测状态
        name: "", //
        countSize: 10, // 条数/页
        pageSize: 1 // 页数
      };
      this.selectRawInspectsList();
    },
    changeShowDetail({ id }) {
      this.goDetail(id);
      // console.log(id)
      // const res = await this.$axios.post(this.$api.url.selectRawInspectsListById,{params:{id}})
      // console.log(res)
    }
  }
};
</script>
src/components/view/rawInsDetail.vue
@@ -1,290 +1,220 @@
<style scoped>
  .rawInsBox{
        height: 100%;
        width: 100%;
        overflow-y: scroll;
        display: flex;
        flex-direction: column;
  }
  .rawInsBox .title .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
  .rawInsBox .title {
    margin-bottom: 10px;
    padding: 0 20px;
  }
  /* 检验详情 */
  .raw-detail-info{
    background: #fff;
    padding: 26px 0px 11px 80px;
  }
  .raw-detail-info >>>.el-form-item__label{
        color: rgb(51, 51, 51);
        font-family: 微软雅黑;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0px;
  }
  .raw-detail-info .el-input{
        width: auto;
  }
  .raw-detail-info.raw-detail-info-edit >>>.el-input__inner{
    background:#fff;
  }
  .raw-detail-info >>>.el-input__inner{
    width: 224px;
    height: 32px;
    box-sizing: border-box;
    background: rgb(238, 238, 238);
    border: 1px solid rgb(221, 221, 221);
    border-radius:4px;
  }
  .raw-detail-info .el-form-item{
    margin-bottom: 24px;
  }
  .raw-detail-info .el-form-item .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
  /* 检验项目 */
  .raw-project-table{
    padding: 24px 14px;
    background: #fff;
    flex: 1;
    /* max-height: 360px; */
    /* overflow-y: hidden; */
  }
  /* 检验结论 */
  .raw-conclusion-table{
    padding: 9px 14px;
    background: #fff;
  }
</style>
<template>
  <div class="rawInsBox">
    <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="()=>{goBack()}">返 回</el-button>
          <el-button
            icon="el-icon-circle-plus-outline"
            v-show="detailId === null"
            @click="addNewRawInspect"
            style="background-color: #004ea2; color: #ffffff;"
            >提 交</el-button
          >
          <el-button
            icon="el-icon-download"
            @click="
              () => {
                goBack();
              }
            "
            >返 回</el-button
          >
        </el-col>
      </el-row>
    </div>
    <div class="raw-detail-info" :class="detailId===null?'raw-detail-info-edit':''">
        <el-form v-model="detailInfo" label-position="right" label-width="120px" >
            <el-row>
                <el-col :span="7">
                  <el-form-item label="原材料名称:">
                        <el-input v-if="detailId!==null" :disabled="detailId!==null" v-model="detailInfo.name"></el-input>
                        <el-select @change="checkRawName" v-else  placeholder="请选择项目名称" v-model="detailInfo.name">
                          <el-option v-for="item in materialOptions" :key="item.id" :label="item.name" :value="item.name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="规格型号:">
                        <el-input v-if="detailId!==null" :disabled="detailId!==null" v-model="detailInfo.specifications"></el-input>
                         <el-cascader
                          placeholder="请选择规格型号"
                          v-else
                          :disabled="specificationOptions.length===0"
                          :props="{label:'name',value:'name'}"
                          v-model="detailInfo.specificationsArr"
                          :options="specificationOptions"
                          ></el-cascader>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="原材料编码:">
                        <el-input disabled v-model="detailInfo.code"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <el-col :span="7">
                    <el-form-item label="来料日期:">
                        <el-input v-if="detailId!==null" :disabled="detailId!==null" v-model="detailInfo.formTime"></el-input>
                        <el-date-picker
                          v-else
                          type="date"
                          value-format="yyyy-MM-dd"
                          v-model="detailInfo.formTime"
                          placeholder="选择日期">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="数量:">
                        <el-input placeholder="请输入检验数量" :disabled="detailId!==null" v-model="detailInfo.number"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="单位:">
                        <el-input placeholder="请输入检验单位" :disabled="detailId!==null" v-model="detailInfo.unit"></el-input>
                    </el-form-item>
                </el-col>
                <el-col  :span="3">
                    <el-form-item v-show="detailId===null" label="" label-width="50px">
                        <el-button  @click="addNewRawInspect">保存提交</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <el-col :span="7">
                    <el-form-item v-show="detailId!==null" label="报检日期:">
                        <el-input :disabled="detailId!==null" v-model="detailInfo.createTime"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="14">
                    <el-form-item v-show="detailId!==null" label="报检人:">
                        <el-input :disabled="detailId!==null" v-model="detailInfo.userName"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <!-- <el-form v-show="detailId ===null" v-model="rawInsParams" label-position="right" label-width="120px" >
            <el-row>
                <el-col :span="7">
                    <el-form-item label="订单号:">
                        <el-input placeholder="请输入订单号" v-model="rawInsParams.orderNumber"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="客户名称:">
                        <el-input placeholder="请输入客户名称" v-model="rawInsParams.customerName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="工程名称:">
                        <el-input placeholder="请输入工程名称"  v-model="rawInsParams.projectName"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <el-col :span="7">
                    <el-form-item label="质量追溯号:">
                        <el-input  placeholder="请输入质量追溯号"  v-model="rawInsParams.qualityTraceability"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="项目名称:">
                        <el-select placeholder="请输入项目名称" v-model="rawInsParams.material">
                          <el-option v-for="item in materialOptions" :key="item.id" :label="item.name" :value="item.name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="产品编码:">
                        <el-input placeholder="产品编码" disabled  v-model="code"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <el-col :span="7">
                    <el-form-item label="规格型号:">
                        <el-input  v-model="detailInfo.specificationsModel"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="7">
                    <el-form-item label="单位:">
                        <el-input placeholder="请输入单位"  v-model="rawInsParams.unit"></el-input>
                    </el-form-item>
                </el-col>
                <el-col  :span="7">
                    <el-form-item label="数量">
                      <el-input  placeholder="请输入产品编码"  v-model="rawInsParams.qualityTraceability"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <el-col :span="21">
                    <el-form-item label="主机工:">
                        <el-input placeholder="请输入主机工"  v-model="rawInsParams.userId"></el-input>
                    </el-form-item>
                </el-col>
                <el-col  :span="3">
                    <el-form-item label="" label-width="100px">
                        <el-button  @click="addNewRawInspect">保存提交</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form> -->
    <div
      class="raw-detail-info"
      :class="detailId === null ? 'raw-detail-info-edit' : ''"
    >
      <el-form v-model="detailInfo" label-position="right" label-width="120px">
        <el-row>
          <el-col :span="7">
            <el-form-item label="来料日期:">
              <el-input
                v-if="detailId !== null"
                :disabled="detailId !== null"
                v-model="detailInfo.formTime"
              ></el-input>
              <el-date-picker
                v-else
                type="date"
                value-format="yyyy-MM-dd"
                v-model="detailInfo.formTime"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="原材料名称:">
              <el-input
                v-if="detailId !== null"
                :disabled="detailId !== null"
                v-model="detailInfo.name"
              ></el-input>
              <el-input
                v-else
                v-model="detailInfo.name"
                placeholder="请输入"
              ></el-input> </el-form-item
          ></el-col>
          <el-col :span="7">
            <el-form-item label="原材料编码:">
              <el-input
                :disabled="detailId !== null"
                v-model="detailInfo.code"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="7">
            <el-form-item label="规格型号:">
              <el-input
                v-if="detailId !== null"
                :disabled="detailId !== null"
                v-model="detailInfo.specifications"
              ></el-input>
              <el-input
                v-else
                v-model="detailInfo.specificationsArr"
                placeholder="请输入规格型号"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="单位:">
              <el-input
                placeholder="请输入检验单位"
                :disabled="detailId !== null"
                v-model="detailInfo.unit"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="数量:">
              <el-input
                placeholder="请输入检验数量"
                :disabled="detailId !== null"
                v-model="detailInfo.number"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="7">
            <el-form-item label="供应商名称:">
              <el-input
                placeholder="请输入检验数量"
                :disabled="detailId !== null"
                v-model="detailInfo.number"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item v-show="detailId !== null" label="报检日期:">
              <el-input
                :disabled="detailId !== null"
                v-model="detailInfo.createTime"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item v-show="detailId !== null" label="报检人:">
              <el-input
                :disabled="detailId !== null"
                v-model="detailInfo.userName"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="title">
      <el-row>
        <el-col :span="12" style="line-height: 32px;">检验项目</el-col>
        <el-col :span="12" style="line-height: 32px; padding-top: 6px;">
          <el-button v-if="detailId == null" style="float: right;"
            >添加检验值列</el-button
          >
          <el-button
            v-if="detailId == null"
            style="float: right;margin-right: 30px;"
            @click="clickAddLine()"
            >添加检验行</el-button
          >
        </el-col>
      </el-row>
    </div>
    <div class="raw-project-table">
        <el-table
            :data="projectTable"
            style="width: 100%"
            max-height="320"
      <el-table :data="projectTable" style="width: 100%" height="320">
        <el-table-column type="index" label="序号" width="100">
        </el-table-column>
        <el-table-column prop="name" label="项目" width="212">
          <template scope="scope">
            <el-input
              v-model="scope.row.name"
              placeholder="请输入项目名称"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="unit" label="单位" width="148">
          <template scope="scope">
            <el-input
              v-model="scope.row.unit"
              placeholder="请输入单位"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="required" label="标准" width="254">
          <template scope="scope">
            <el-input
              v-model="scope.row.required"
              placeholder="请输入标准值"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="internal" label="内控值" width="254">
          <template scope="scope">
            <el-input
              v-model="scope.row.internal"
              placeholder="请输入内控值"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="testValue" label="检查值" width="254">
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.testValue"
              @blur="changeState(scope.row)"
              placeholder="请输入检测值"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="deviceName" label="试验设备">
          <el-button type="text">选择</el-button>
        </el-table-column>
        <el-table-column prop="testState" label="结论">
          <template slot-scope="scope">
            <span
              v-show="scope.row.testState != null"
              :style="{
                color: scope.row.testState === 1 ? '#67C23A' : '#F56C6C'
              }"
              >{{ scope.row.testState === 1 ? "合格" : "不合格" }}</span
            >
            <el-table-column
                type="index"
                label="序号"
                width="100"
                >
            </el-table-column>
            <el-table-column
                prop="name"
                label="项目"
                width="212">
            </el-table-column>
            <el-table-column
                prop="unit"
                label="单位"
                width="148">
            </el-table-column>
            <el-table-column
                prop="required"
                label="标准"
                width="254">
            </el-table-column>
            <el-table-column
                prop="internal"
                label="内控值"
                width="291">
            </el-table-column>
            <el-table-column
                prop="testValue"
                label="检查值"
                width="371">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.testValue" @blur="changeState(scope.row)"></el-input>
                </template>
            </el-table-column>
            <el-table-column
                prop="deviceName"
                label="试验设备"
                width="248"
                >
            </el-table-column>
            <el-table-column
                prop="testState"
                label="结论"
                 width="98"
                >
                <template slot-scope="scope">
                  <span v-show="scope.row.testState!=null" :style="{color: scope.row.testState===1?'#67C23A':'#F56C6C'}">{{scope.row.testState===1?'合格':'不合格'}}</span>
                  <span v-show="scope.row.testState==null">暂未结论</span>
                </template>
            </el-table-column>
    </el-table>
            <span v-show="scope.row.testState == null">暂未结论</span>
          </template>
        </el-table-column>
        <el-table-column v-if="detailId == null" label="操作" fixed="right">
          <template scope="scope">
            <el-button type="text" @click="clickDeleteline(scope)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="title">
      <el-row>
@@ -292,154 +222,238 @@
      </el-row>
    </div>
    <div class="raw-conclusion-table">
        <el-table :data="conclusionTable">
            <el-table-column
                prop="code"
                label="物料编号"
                width="353">
            </el-table-column>
            <el-table-column
                prop="name"
                label="物料名称"
                width="353">
            </el-table-column>
            <el-table-column
                prop="names"
                label="检验员"
                width="542">
                <template slot-scope="scope">
                  <span v-for="item in scope.row.names" :key="item&&item.userName" :style="{marginRight:'8px'}">{{item}}</span>
                </template>
            </el-table-column>
            <el-table-column
                prop="testState"
                label="检验结论"
                width="362">
                 <template slot-scope="scope">
                  <span v-show="scope.row.testState!=null" :style="{color: scope.row.testState===1?'#67C23A':'#F56C6C'}">{{scope.row.testState===1?'合格':'不合格'}}</span>
                  <span v-show="scope.row.testState==null">暂未结论</span>
                </template>
            </el-table-column>
             <el-table-column
                label="操作"
                width="120">
                <template>
                    <el-button type="text" size="small" @click.once="submitSave">上报</el-button>
                </template>
            </el-table-column>
        </el-table>
      <el-table :data="conclusionTable" style="100%">
        <el-table-column prop="code" label="物料编号"> </el-table-column>
        <el-table-column prop="name" label="物料名称"> </el-table-column>
        <el-table-column prop="names" label="检验员">
          <template slot-scope="scope">
            <span
              v-for="item in scope.row.names"
              :key="item && item.userName"
              :style="{ marginRight: '8px' }"
              >{{ item }}</span
            >
          </template>
        </el-table-column>
        <el-table-column prop="testState" label="检验结论">
          <template slot-scope="scope">
            <span
              v-show="scope.row.testState != null"
              :style="{
                color: scope.row.testState === 1 ? '#67C23A' : '#F56C6C'
              }"
              >{{ scope.row.testState === 1 ? "合格" : "不合格" }}</span
            >
            <span v-show="scope.row.testState == null">暂未结论</span>
          </template>
        </el-table-column>
        <el-table-column v-if="detailId !== null" label="操作" width="120">
          <template>
            <el-button type="text" size="small" @click.once="submitSave"
              >上报</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import RawIns from './raw-ins.vue'
import RawIns from "./raw-ins.vue";
export default {
    components:{RawIns},
    props:['goBack','detailId'],
    created(){
      // 清空
      this.detailInfo = {}
      if(this.detailId){
        console.log(this.detailId)
        this.getDetailInfo()
      }else{
        this.getOptions()
  components: { RawIns },
  props: ["goBack", "detailId"],
  created() {
    // 清空
    this.detailInfo = {};
    if (this.detailId) {
      this.getDetailInfo();
    } else {
      this.getOptions();
    }
  },
  mounted() {},
  computed: {
    conclusionTable() {
      const conclusion = {};
      conclusion.name = this.detailInfo.name;
      conclusion.code = this.detailInfo.code;
      conclusion.names = [
        ...new Set(this.projectTable.map(item => item.userName))
      ];
      if (
        this.projectTable.filter(item => item.testState === null).length ===
        this.projectTable.length
      ) {
        conclusion.testState = null;
        return [conclusion];
      }
    },
    mounted(){
    },
    computed:{
      conclusionTable(){
        // console.log(this.projectTable)
        // console.log(this.projectTable.map(item=>item.userName))
        const conclusion = {}
        conclusion.name = this.detailInfo.name
        conclusion.code = this.detailInfo.code
        conclusion.names= [...new Set(this.projectTable.map(item=>item.userName))]
        console.log(conclusion,this.projectTable)
        console.log(this.projectTable.filter(item=>item.testState===null).length)
        if(this.projectTable.filter(item=>item.testState===null).length===this.projectTable.length){
          conclusion.testState = null
          return [conclusion]
        }
        if(this.projectTable.filter(item=>item.testState===0).length>0){
          conclusion.testState= 0
        }else{
          conclusion.testState= 1
        }
        return [conclusion]
      },
      // 产品编码
      // code(){
      //   const material= this.materialOptions.filter(item=>item.name===this.rawInsParams.material)[0]
      //   return  material && material.code
      // }
    },
    data() {
        return {
          // 详情页就是详情信息
          detailInfo:{},
          projectTable:[],
          // 新建检验单参数对象
          rawInsParams:{},
          // 项目名称options
          materialOptions:[],
          specificationOptions:[]
        }
    },
    methods:{
      // 获取报检单详情信息
      async getDetailInfo() {
        const {data} = await this.$axios.get(this.$api.url.selectRawInspectsListById+`${this.detailId}`,{params:{id:this.detailId}})
        this.detailInfo  = data
        this.projectTable = data.rawInsProducts
        console.log(data)
      },
      // 新增检验单
      async addNewRawInspect() {
        this.detailInfo.specifications = this.detailInfo.specificationsArr.join("-")
        // const time = this.detailInfo.formTime
        // this.detailInfo.formTime = `${time.getFullYear()}-${time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1}-${time.getDate() < 10 ? '0' + time.getDate() : time.getDate()}`
        const res = await this.$axios.post(this.$api.url.addRawInspects,{...this.detailInfo},{headers:{'Content-Type':'application/json'}})
        console.log(res)
        this.detailId = res.data
        this.getDetailInfo()
        this.$message.success('提交成功')
      },
      // 修改项目的检测值改变结论
      async changeState(row){
        // console.log(row)
        const res = await this.$axios.post(this.$api.url.updaterawInsProduct,{...row},{headers:{'Content-Type':'application/json'}})
        this.$message.success('提交成功')
        this.getDetailInfo()//重新刷新信息数据
      },
      async submitSave() {
        const res = await this.$axios.post(this.$api.url.updateRawInspectsById+`${this.detailId}`)
        this.$message.success('提交成功')
        this.getDetailInfo()
      },
      async getOptions() {
        // const {data} = await this.$axios.get(this.$api.url.listMaterial)
        // this.materialOptions = data
        const {data} = await this.$axios.get(this.$api.url.selectRawMaterial)
        this.materialOptions = data
        console.log(this.materialOptions)
      },
      checkRawName(data) {
        console.log('选择原材料名称',data)
        this.materialOptions.forEach(item=>{
          if(item.name===data){
            console.log(item.id)
            this.detailInfo.code = item.code
            this.$axios.get(this.$api.url.selectSpBySt,{params:{id:item.id}}).then(res=>{
              this.specificationOptions= res.data
            })
          }
        })
      if (this.projectTable.filter(item => item.testState === 0).length > 0) {
        conclusion.testState = 0;
      } else {
        conclusion.testState = 1;
      }
     }
}
      return [conclusion];
    }
  },
  data() {
    return {
      // 详情页就是详情信息
      detailInfo: {},
      projectTable: [],
      // 新建检验单参数对象
      rawInsParams: {},
      // 项目名称options
      materialOptions: [],
      specificationOptions: []
    };
  },
  methods: {
    // 获取报检单详情信息
    async getDetailInfo() {
      const { data } = await this.$axios.get(
        this.$api.url.selectRawInspectsListById + `${this.detailId}`,
        { params: { id: this.detailId } }
      );
      this.detailInfo = data;
      this.projectTable = data.rawInsProducts;
    },
    // 新增检验单
    async addNewRawInspect() {
      this.detailInfo.specifications = this.detailInfo.specificationsArr.join(
        "-"
      );
      // const time = this.detailInfo.formTime
      // this.detailInfo.formTime = `${time.getFullYear()}-${time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1}-${time.getDate() < 10 ? '0' + time.getDate() : time.getDate()}`
      const res = await this.$axios.post(
        this.$api.url.addRawInspects,
        { ...this.detailInfo },
        { headers: { "Content-Type": "application/json" } }
      );
      this.detailId = res.data;
      this.getDetailInfo();
      this.$message.success("提交成功");
    },
    // 修改项目的检测值改变结论
    async changeState(row) {
      const res = await this.$axios.post(
        this.$api.url.updaterawInsProduct,
        { ...row },
        { headers: { "Content-Type": "application/json" } }
      );
      this.$message.success("提交成功");
      this.getDetailInfo(); //重新刷新信息数据
    },
    async submitSave() {
      const res = await this.$axios.post(
        this.$api.url.updateRawInspectsById + `${this.detailId}`
      );
      this.$message.success("提交成功");
      this.getDetailInfo();
    },
    async getOptions() {
      const { data } = await this.$axios.get(this.$api.url.selectDevice);
      this.materialOptions = data;
    },
    checkRawName(data) {
      this.materialOptions.forEach(item => {
        if (item.name === data) {
          this.detailInfo.code = item.code;
          this.$axios
            .get(this.$api.url.selectSpBySt, { params: { id: item.id } })
            .then(res => {
              this.specificationOptions = res.data;
            });
        }
      });
    },
    // 添加行
    clickAddLine() {
      let obj = {
        deviceId: 0,
        internal: "",
        name: "",
        required: "",
        testValue: "",
        unit: ""
      };
      this.projectTable.push(obj);
    },
    // 删除行
    clickDeleteline(scope) {
      this.projectTable.splice(scope.$index, 1);
    }
  }
};
</script>
<style scoped>
.rawInsBox {
  height: 100%;
  width: 100%;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
}
.rawInsBox .title .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
.rawInsBox .title {
  margin-bottom: 10px;
  padding: 0 20px;
}
/* 检验详情 */
.raw-detail-info {
  background: #fff;
  padding: 26px 0px 11px 80px;
}
.raw-detail-info >>> .el-form-item__label {
  color: rgb(51, 51, 51);
  font-family: 微软雅黑;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0px;
}
.raw-detail-info .el-input {
  width: auto;
}
.raw-detail-info.raw-detail-info-edit >>> .el-input__inner {
  background: #fff;
}
.raw-detail-info >>> .el-input__inner {
  width: 224px;
  height: 32px;
  box-sizing: border-box;
  background: rgb(238, 238, 238);
  border: 1px solid rgb(221, 221, 221);
  border-radius: 4px;
}
.raw-detail-info .el-form-item {
  margin-bottom: 24px;
}
.raw-detail-info .el-form-item .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
/* 检验项目 */
.raw-project-table {
  padding: 24px 14px;
  background: #fff;
  flex: 1;
  /* max-height: 360px; */
  /* overflow-y: hidden; */
}
/* 检验结论 */
.raw-conclusion-table {
  padding: 9px 14px;
  background: #fff;
}
</style>
src/components/view/rawUnqualified/raw.vue
@@ -1,271 +1,255 @@
<style scoped>
.unqualifiedBox{
    width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
   /* overflow-y: scroll; */
}
  .unqualifiedBox .title .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
    padding: 0 12px;
  }
  .unqualifiedBox .title {
    margin-bottom: 10px;
    padding: 0 20px;
  }
<!-- /* 条件查询头部样式 */ -->
  .choose {
    padding: 21px 24px;
    display: flex;
    align-items: center;
    background-color: #fff;
    border-bottom: 3px solid rgb(245, 247, 251);
  }
  .choose {
    font-size: 14px;
  }
  .choose .el-button {
    height: 32px;
    border: 1px solid rgba(190, 190, 190, 0.44);
    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">
    <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>
      <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>
      <el-card shadow="hover" class="margin-30" style="height: 80px;">
        <div class="choose">
          <span>产品名称:</span>
          <el-input
            size="small"
            v-model="search.productName"
            style="width: 224px;margin-right: 30px;"
            placeholder="请输入"
            clearable
          ></el-input>
          <span>来料日期:</span>
          <el-date-picker
            v-model="search.formTime"
            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.processingStatus"
            size="small"
            placeholder="请选择"
            style="width: 224px;margin-right: 30px;"
          >
            <el-option label="已处理" :value="1"></el-option>
            <el-option label="待处理" :value="0"></el-option>
          </el-select>
          <span>供应商:</span>
          <el-input
            size="small"
            v-model="search.supplier"
            style="width: 224px;margin-right: 20px;"
            placeholder="请输入"
          ></el-input>
          <el-button size="mini" @click="clean()"><span>重 置</span></el-button>
          <el-button
            size="mini"
            type="primary"
            style="background: #004EA2;"
            @click="
              unqualifiedTable = [];
              getDetailInfo();
            "
            ><span>查 询</span></el-button
          >
        </div>
      </el-card>
    </div>
      <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;">
    <div class="tableno" style="height:300px">
      <el-card shadow="hover" class="margin-30">
        <el-table
          :data="unqualifiedTable"
          border
          ref="multipleTable"
          tooltip-effect="dark"
          height="calc(100vh - 340px)"
          style="width: 100%"
        >
          <el-table-column type="selection" width="50"> </el-table-column>
          <el-table-column type="index" label="序号" width="60">
            <template scope="scope">
              {{ (search.pageSize - 1) * search.countSize + scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column prop="dateArrival" label="来料日期">
          </el-table-column>
          <el-table-column prop="supplier" label="供应商"> </el-table-column>
          <el-table-column
            prop="reason"
            label="缺陷名称"
            min-width="120"
            show-overflow-tooltip
          >
          </el-table-column>
          <el-table-column prop="code" label="材料编码"> </el-table-column>
          <el-table-column prop="id" label="材料名称"> </el-table-column>
          <el-table-column prop="specifications" label="规格型号">
          </el-table-column>
          <el-table-column prop="unit" label="单位"> </el-table-column>
          <el-table-column prop="number" label="数量"> </el-table-column>
          <el-table-column prop="inspectionDate" label="报检日期">
          </el-table-column>
          <el-table-column prop="name" label="报检人"> </el-table-column>
          <el-table-column prop="processingDate" 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>
              <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 ;"
                  >查看</el-button
                >
              </div>
            </template>
          </el-table-column>
        </el-table>
        <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>
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="search.pageSize"
            :page-sizes="[10, 15, 20, 30, 50]"
            :page-size="search.countSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </el-col>
      </el-card>
    </div>
  </div>
</template>
<script>
export default {
    data() {
        return {
            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()
  data() {
    return {
      search: {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        formTime: "", // 来料日期
        processingStatus: "", // 处理状态
        productName: "", // 产品名称
        supplier: "" // 供应商
      },
      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()
      }
      unqualifiedTable: [], // 页面表格数据
      total: 0
    };
  },
  mounted() {
    this.getDetailInfo();
  },
  methods: {
    handleSizeChange(val) {
      this.search.countSize = val;
      this.getDetailInfo();
    },
    handleCurrentChange(val) {
      this.search.pageSize = val;
      this.getDetailInfo();
    },
    getDetailInfo() {
      this.axios
        .get(this.$api.url.selectUnRawInspectsList, {
          params: this.search
        })
        .then(res => {
          this.unqualifiedTable = res.data.row;
          this.total = res.data.total;
        });
    },
    clean() {
      this.search = {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        formTime: "", // 来料日期
        processingStatus: "", // 处理状态
        productName: "", // 产品名称
        supplier: "" // 供应商
      };
      this.getDetailInfo();
    }
  }
}
};
</script>
<style scoped>
.unqualifiedBox {
  width: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  /* overflow-y: scroll; */
}
.unqualifiedBox .title .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
.unqualifiedBox .title {
  margin-bottom: 10px;
  padding: 0 20px;
}
<!-- /* 条件查询头部样式 */ -->
  .choose {
  padding: 21px 24px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border-bottom: 3px solid rgb(245, 247, 251);
}
.choose {
  font-size: 14px;
}
.choose .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  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: 10px;
}
</style>
src/components/view/rawUnqualifiedBox.vue
@@ -1,7 +1,4 @@
<style scoped>
</style>
<style scoped></style>
<template>
  <div class="rawUnqualifiedBox">
@@ -10,8 +7,8 @@
</template>
<script>
import Unqualified from './rawUnqualified/raw.vue'
import Unqualified from "./rawUnqualified/raw.vue";
export default {
  components:{Unqualified}
}
</script>
  components: { Unqualified }
};
</script>
src/components/view/unqualifiedManagement.vue
@@ -1,19 +1,240 @@
<style scoped>
</style>
<template>
  <div class="rawUnqualifiedBox">
    <Unqualified></Unqualified>
  <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.dealState"
            size="small"
            placeholder="请选择"
            style="width: 224px;margin-right: 30px;"
          >
            <el-option label="已处理" :value="1"></el-option>
            <el-option label="待处理" :value="0"></el-option>
          </el-select>
          <span>来料日期:</span>
          <el-date-picker
            v-model="search.formTime"
            size="small"
            placeholder="请输入"
            style="width: 224px;margin-right: 30px;"
            clearable
            value-format="yyyy-MM-dd"
          ></el-date-picker>
          <el-button size="mini" @click="clean()"><span>重 置</span></el-button>
          <el-button
            size="mini"
            type="primary"
            style="background: #004EA2;"
            @click="
              unqualifiedTable = [];
              getDetailInfo();
            "
            ><span>查 询</span></el-button
          >
        </div>
      </el-card>
    </div>
    <div class="tableno" style="height:300px">
      <el-card shadow="hover" class="margin-30">
        <el-table
          :data="unqualifiedTable"
          border
          ref="multipleTable"
          tooltip-effect="dark"
          height="calc(100vh - 340px)"
          style="width: 100%"
        >
          <el-table-column type="selection" width="50"> </el-table-column>
          <el-table-column type="index" label="序号" width="60">
            <template scope="scope">
              {{ (search.pageSize - 1) * search.countSize + scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column prop="dateArrival" label="来料日期">
          </el-table-column>
          <el-table-column
            prop="reason"
            label="缺陷名称"
            min-width="120"
            show-overflow-tooltip
          >
          </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="规格型号"
            min-width="120"
          >
          </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="inspectionDate" label="报检日期">
          </el-table-column>
          <el-table-column prop="name" label="报检人"> </el-table-column>
          <el-table-column prop="processingDate" 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>
              <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 ;"
                  >查看</el-button
                >
              </div>
            </template>
          </el-table-column>
        </el-table>
        <el-col
          style="height: 50px;display: flex;align-items: center;justify-content: right;"
        >
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="search.pageSize"
            :page-sizes="[10, 15, 20, 30, 50]"
            :page-size="search.countSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </el-col>
      </el-card>
    </div>
  </div>
</template>
<script>
import Unqualified from './rawUnqualified/raw.vue'
// import Unqualified from './rawUnqualified/Subqualified.vue'
export default {
  components:{Unqualified}
}
  data() {
    return {
      search: {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        formTime: "", // 来料日期
        dealState: "" // 处理状态
      },
      unqualifiedTable: [], // 页面表格数据
      total: 0
    };
  },
  mounted() {
    this.getDetailInfo();
  },
  methods: {
    handleSizeChange(val) {
      this.search.countSize = val;
      this.getDetailInfo();
    },
    handleCurrentChange(val) {
      this.search.pageSize = val;
      this.getDetailInfo();
    },
    getDetailInfo() {
      this.axios
        .get(this.$api.url.inspectUnaccepted, {
          params: this.search
        })
        .then(res => {
          this.unqualifiedTable = res.data.row;
          this.total = res.data.total;
        });
    },
    clean() {
      this.search = {
        countSize: 10, // 条数/页
        pageSize: 1, // 起始页
        formTime: "", // 来料日期
        dealState: "" // 处理状态
      };
      this.getDetailInfo();
    }
  }
};
</script>
<style scoped>
.unqualifiedBox {
  width: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  /* overflow-y: scroll; */
}
.unqualifiedBox .title .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
  padding: 0 12px;
}
.unqualifiedBox .title {
  margin-bottom: 10px;
  padding: 0 20px;
}
<!-- /* 条件查询头部样式 */ -->
  .choose {
  padding: 21px 24px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border-bottom: 3px solid rgb(245, 247, 251);
}
.choose {
  font-size: 14px;
}
.choose .el-button {
  height: 32px;
  border: 1px solid rgba(190, 190, 190, 0.44);
  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: 10px;
}
</style>