kd-aiot-frontend-qms/src/views/inspectionPlan/components/edit.vue

<!-- 用户编辑弹窗 -->
<template>
  <ele-modal :title="title" :visible.sync="visible" :before-close="handleClose" :close-on-click-modal="false"
    :close-on-press-escape="false" append-to-body width="80%" :maxable="true">
    <header-title title="基本信息"></header-title>
    <base-info ref="baseInfoRefs" v-if="baseForm" :form="baseForm" :btnType="btnType" @resetTable="resetTable"
      @getList="getList" @changeModel="changeModel" @changeNumber="changeNumber" @table2="table2"></base-info>

    <el-row>
      <header-title title="质检内容"></header-title>
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="来源清单" name="1"></el-tab-pane>
        <el-tab-pane label="样品清单" name="2"></el-tab-pane>
        <el-tab-pane label="质检方案" name="3"></el-tab-pane>
      </el-tabs>
    </el-row>

    <el-row style="margin-top: 24px">
      <!-- 来料列表表格 -->
      <el-table v-show="activeName === '1'" v-if="packingList.length > 0" ref="showPackingListTable"
        :data="paginatedPackingList" tooltip-effect="dark" :max-height="300" border
        @selection-change="handleSelectionChange" row-key="id">
        <el-table-column type="selection" width="55" align="center" :reserve-selection="true"
          :selectable="checkSelectable"></el-table-column>
        <el-table-column label="序号" type="index" width="50" align="center"></el-table-column>
        <!--  label-class-name="DisabledSelection" -->
        <template v-for="column in tableColumns">
          <el-table-column :label="column.label" :prop="column.prop" :show-overflow-tooltip="true" :width="column.width"
            :align="column.align"></el-table-column>
        </template>
      </el-table>
      <!-- 分页 -->
      <el-pagination v-show="activeName === '1' && packingList.length > 0" @size-change="handleSizeChange"
        @current-change="handleCurrentChange" :current-page="pagination.currentPage" :page-sizes="[10, 20, 50, 100]"
        :page-size="pagination.pageSize" layout="total, sizes, prev, pager, next" :total="packingList.length"
        style="margin-top: 16px" />
      <!-- 样品列表表格 -->
      <el-table v-show="activeName === '2'" v-if="sampleList.length > 0" ref="showSampleListTable"
        :data="paginatedSampleList" tooltip-effect="dark" :max-height="300" border row-key="id">
        <el-table-column label="序号" type="index" width="50" align="center"></el-table-column>
        <template v-for="column in tableColumns">
          <el-table-column :label="column.label" :prop="column.prop" :show-overflow-tooltip="true" :width="column.width"
            :align="column.align"></el-table-column>
        </template>
      </el-table>
      <el-pagination v-show="activeName === '2' && sampleList.length > 0" @size-change="handleSampleSizeChange"
        @current-change="handleSampleCurrentChange" :current-page="samplePagination.currentPage"
        :page-sizes="[10, 20, 50, 100]" :page-size="samplePagination.pageSize"
        layout="total, sizes, prev, pager, next, jumper" :total="sampleList.length"
        style="margin-top: 10px"></el-pagination>
      <!-- 质检方案 -->
      <el-table v-show="activeName === '3'" v-if="schemeList.length > 0" ref="showSchemeListTable"
        :data="paginatedSchemeList" tooltip-effect="dark" :max-height="300" border row-key="id">
        <el-table-column label="序号" type="index" width="50" align="center"></el-table-column>
        <el-table-column label="质检方案编码" prop="qualitySchemeTemplateCode" align="center">
        </el-table-column>
        <el-table-column label="质检方案名称" prop="qualitySchemeTemplateName" align="center"></el-table-column>
        <el-table-column label="质检类型" prop="categoryLevelClassName" align="center"></el-table-column>
        <el-table-column label="质检项编码" prop="inspectionCode" align="center"></el-table-column>
        <el-table-column label="质检项名称" prop="inspectionName" align="center"></el-table-column>
        <el-table-column label="工艺参数" prop="defaultValue" align="center">
        </el-table-column>
      </el-table>
      <el-pagination v-show="activeName === '3' && schemeList.length > 0" @size-change="handleSchemeSizeChange"
        @current-change="handleSchemeCurrentChange" :current-page="schemePagination.currentPage"
        :page-sizes="[10, 20, 50, 100]" :page-size="schemePagination.pageSize"
        layout="total, sizes, prev, pager, next, jumper" :total="schemeList.length"
        style="margin-top: 10px"></el-pagination>
    </el-row>

    <!-- <div class="add-product" @click="addProduct" v-if="btnType != 'detail'">
      <i class="el-icon-circle-plus-outline"></i>
    </div> -->

    <template v-slot:footer>
      <el-button @click="handleClose">取消</el-button>
      <el-button v-if="btnType != 'detail' && btnType != 'issued'" type="primary" :loading="loading"
        @click="handleSave">
        保存
      </el-button>
      <el-button v-if="btnType != 'detail'" type="primary" :loading="loading" @click="handleIssued">
        下发
      </el-button>
    </template>
  </ele-modal>
</template>

<script>
import baseInfo from './baseInfo.vue';

import { getCode } from '@/api/login';
import { save, update, planIssued } from '@/api/inspectionPlan';
import {
  getPurchaseWarehouseGoods,
  getQualityTemplateList,
  getTemplateListByPlanId,
  getSampleListByPlanId,
  getInventoryListByPlanId,
  outInRecordsPage,
  getByCategoryId,
  getBatchInfoData
} from '@/api/inspectionPlan/index.js';
export default {
  components: {
    baseInfo
  },
  data() {
    const defaultForm = function () {
      return {
        id: '',
        code: '',
        name: '',
        type: '',
        qualityMode: '',
        inspectionStandards: '',
        autoOrder: '',
        groupId: '',
        groupName: '',
        executeId: '',
        executeName: '',
        planStartTime: '',
        planEndTime: '',
        standard: '',
        planSource: '',
        planSourceCode: '',
        productName: '',
        productCode: '',
        batchNo: '',
        specification: '',
        modelType: '',
        brandNo: '',
        productNumber: '',
        qualifiedNumber: '',
        unqualifiedNumber: '',
        qualificationRate: '',
        totalWeight: '',
        sampleNumber: null,
        sampleProportion: '',
        supplierMark: '',
        // planReceiveId: '',

        remark: '',
        accessory: []
      };
    };
    return {
      defaultForm,
      // 表单数据
      baseForm: { ...defaultForm() },
      tableColumns: [
        {
          label: '编码',
          prop: 'categoryCode',
          width: '150',
          align: 'center'
        },
        {
          label: '名称',
          prop: 'categoryName',
          width: '150',
          align: 'center'
        },
        { label: '批次号', prop: 'batchNo', align: 'center' },
        { label: '发货条码', prop: 'barcodes', align: 'center' },
        { label: '包装编码', prop: 'packageNo', align: 'center' },
        // { label: '包装数量', prop: 'packingQuantity', align: 'center' },
        { label: '包装单位', prop: 'packingUnit', align: 'center' },
        { label: '计量数量', prop: 'measureQuantity', align: 'center' },
        { label: '计量单位', prop: 'measureUnit', align: 'center' },
        { label: '物料代号', prop: 'materielDesignation', align: 'center' },
        { label: '客户代号', prop: 'clientCode', align: 'center' },
        { label: '供应商名称', prop: 'supplierName', align: 'center' ,width: '120' },
        { label: '供应商代号', prop: 'supplierCode', align: 'center' ,width: '120'},
        { label: '刻码', prop: 'engrave', align: 'center' },
        { label: '重量', prop: 'weight', align: 'center' },
        { label: '重量单位', prop: 'weightUnit', align: 'center' },
        { label: '仓库', prop: 'warehouseName', align: 'center' },
        { label: '货区', prop: 'areaName', align: 'center' },
        { label: '货架', prop: 'goodsShelfName', align: 'center' },
        { label: '货位', prop: 'goodsAllocationName', align: 'center' },
        { label: '生产日期', prop: 'productionDate', align: 'center' },
        { label: '采购日期', prop: 'purchaseDate', align: 'center' }
      ],
      packingList: [],
      pagination: {
        currentPage: 1,
        pageSize: 10,
        total: 0
      },

      sampleList: [],
      samplePagination: {
        currentPage: 1,
        pageSize: 10,
        total: 0
      },

      schemeList: [],
      schemePagination: {
        currentPage: 1,
        pageSize: 10,
        total: 0
      },

      // 表单验证规则
      visible: false,
      btnType: null,
      title: null,
      loading: false,
      listPage: [],

      activeName: '1',
      selectedList: [],
      isCheck: false
    };
  },
  computed: {
    paginatedPackingList() {
      const start =
        (this.pagination.currentPage - 1) * this.pagination.pageSize;
      const end = start + this.pagination.pageSize;
      return this.packingList.slice(start, end);
    },
    // 分页后的样品列表
    paginatedSampleList() {
      const { currentPage, pageSize } = this.samplePagination;
      const start = (currentPage - 1) * pageSize;
      const end = start + pageSize;
      return this.sampleList.slice(start, end);
    },
    // 分页后的质检方案列表
    paginatedSchemeList() {
      const { currentPage, pageSize } = this.schemePagination;
      const start = (currentPage - 1) * pageSize;
      const end = start + pageSize;
      return this.schemeList.slice(start, end);
    }
  },

  created() { },
  methods: {
    // 切换质检内容
    handleClick(tab) {
      this.activeName = tab.name;
    },

    checkSelectable(row, index) {
      // 只有当质检方式为抽检(qualityMode=2)时才可选
      return this.btnType != 'issued' || this.baseForm.qualityMode === 2;
    },
    async open(type, row) {
      this.activeName = '1';
      this.btnType = type;
      this.title =
        type == 'add'
          ? '新增'
          : type == 'edit'
            ? '编辑'
            : type == 'issued'
              ? '下发'
              : '详情';
      if (this.btnType != 'add') {
        row.accessory = row.accessory || [];
        console.log('row====', row);

        this.baseForm.groupId = row.groupId;
        this.baseForm.qualityMode = row.qualityMode;
        this.baseForm = JSON.parse(JSON.stringify(row));

        //根据类型获取计划来源
        if (this.baseForm.type) {
          this.$nextTick(() => {
            if (this.$refs.baseInfoRefs) {
              this.$refs.baseInfoRefs.typeChange(this.baseForm.type);
            }
          });
        }
        // 获取人员
        if (this.baseForm.groupId) {
          this.$nextTick(() => {
            if (this.$refs.baseInfoRefs) {
              this.$refs.baseInfoRefs.getUserList({
                groupId: this.baseForm.groupId
              });
            }
          });
        }
        // 如果是编辑或者详情，则查询物料清单、质检方案和样品列表
        if (row.id) {
          // this.getGoodsList(
          //   this.baseForm?.planSourceCode,
          //   this.baseForm?.productCode,
          //   row?.id
          // );
          //操作行点击时查询清单
          await this.getInventoryList(row?.id);
          //操作行点击时查询质检
          await this.getTemplateList(row?.id);
          //操作行点击时查询样品
          await this.getSampleList(row?.id);

          if (this.baseForm.qualityMode == 1) {
            this.sampleList = this.packingList;
            this.samplePagination.currentPage = 1;
            this.samplePagination.total = this.packingList.length;
          } else {
            this.sampleList = [];
          }
        }
      } else {
        const code = await getCode('qms_plan_code');
        this.baseForm.code = code;
      }
      this.visible = true;
    },
    async getInventoryList(id) {
      let res = await getInventoryListByPlanId({
        planId: id
      });
      console.log(res.list, 'yyyyyyyyyyyyyy清单----------------------------');

      this.packingList = res?.list || [];
      this.pagination.currentPage = 1;
      this.pagination.total = this.packingList.length;
    },
    async getSampleList(id) {
      let res = await getSampleListByPlanId({
        planId: id
      });
      console.log(res.list, 'yyyyyyyyyyyyyy样品----------------------------');

      this.sampleList = res?.list || [];
      this.samplePagination.currentPage = 1;
      this.samplePagination.total = this.sampleList.length;
    },

    async getTemplateList(id) {
      let res = await getTemplateListByPlanId({
        planId: id
      });
      console.log(res.list, 'fffffffffffffff方案--------------------------');
      this.schemeList = res?.list || [];
      this.schemePagination.currentPage = 1;
      this.schemePagination.total = this.schemeList.length;
    },
    async getList(receiveNo, productCode, productCategoryId, productCategoryName, categoryid, batchNo,supplierName, supplierMark) {
      //通过来源和产品 获取来料清单
      await this.getGoodsList(receiveNo, productCode, null, productCategoryId, productCategoryName, categoryid, batchNo,supplierName, supplierMark);

      //通过来源和产品 获取质检方案
      this.getQualityTemplate(productCode);
    },
    async getGoodsList(receiveNo, productCode, ids, productCategoryId, productCategoryName, categoryid, batchNo,supplierName, supplierMark) {
      let res;
      const res1 = await outInRecordsPage({
        sourceBizNo: receiveNo,
        categoryCode: productCode,
        categoryId: categoryid,
        qualityQlanId: ids,
        size: -1
      });
      console.log(res1, 'res1')
      if (res1.list.length > 0) {
        console.log(res1.list[0].status, 'status=2 不赋值')
        if (res1.list[0].status != 2) {
          // res1.list.forEach(item => ({
          //   ...item,
          //   supplierName :supplierName,
          //   supplierMark :supplierMark,
          // }))
          res = res1.list
          this.isCheck = true;
        } else {
          res = []
          this.$message.error('此数据已质检，无需再次质检！');
          return
        }
      } else {
        let resData = await getBatchInfoData({
          sourceBizNo: receiveNo,
          categoryCode: productCode,
          batchNo: batchNo,
        });
        console.log(resData, 'resData')
        if (resData) {
          if (resData.qualityControl != 2) {
            this.isCheck = false;
            // resData.supplierName = supplierName;
            // resData.supplierMark = supplierMark;
            res = [resData];
          } else {
            res = []
            this.$message.error('此数据已质检，无需再次质检！');
            return
          }
        }
      }

      console.log(res, '来料清单');
      if (res.length > 0) {
        let _arr1 = [];
        _arr1 = res.map((m) => {
          m.sourceId = m.id;
          m.productCategoryId = productCategoryId;
          m.productCategoryName = productCategoryName;
          delete m.id;
          return {
            ...m
          };
        });
        this.packingList = _arr1;
        this.pagination.total = this.packingList.length;
        console.log(this.packingList, '来料清单');
        if (this.packingList.length > 1) {
          this.baseForm.productNumber = this.packingList.length;
        } else {
          this.baseForm.productNumber = this.packingList[0].measureQuantity;
        }
        this.aaa();
      } else {
        this.packingList = [];
      }
    },
    aaa() {
      console.log('aaa')
      if (this.baseForm.qualityMode == 1) {
        this.sampleList = [];
        if (this.baseForm.isUnpack != null && this.baseForm.isUnpack != undefined && this.baseForm.isUnpack != '') {
          if (this.baseForm.isUnpack == 2) {
            const num = Number(this.baseForm.productNumber || 0);
            if (num) {
              this.getUnpackSamList(this.packingList, num)
            }
          } else if (this.baseForm.isUnpack == 1) {
            if (this.baseForm.qualityMode == 1) {
              this.sampleList = this.packingList;
              this.samplePagination.currentPage = 1;
              this.samplePagination.total = this.packingList.length;
            } else {
              this.sampleList = [];
            }
          }
        } else {
          if (!this.isCheck) {
            const num = Number(this.baseForm.productNumber || 0);
            if (num) {
              this.getUnpackSamList(this.packingList, num)
            }
          } else {
            if (this.baseForm.qualityMode == 1) {
              this.sampleList = this.packingList;
              this.samplePagination.currentPage = 1;
              this.samplePagination.total = this.packingList.length;
            } else {
              this.sampleList = [];
            }
          }
        }
      } else {
        this.sampleList = [];
      }

    },
    getUnpackSamList(list, num) {
      let data = [];
      list.forEach(oldItem => {
        const newMeasureQuantity = oldItem.measureQuantity / this.baseForm.productNumber;
        const newWeight = parseFloat((oldItem.weight / this.baseForm.productNumber).toFixed(2))

        delete oldItem.id;

        for (let i = 0; i < num; i++) {
          data.push({
            ...oldItem,
            measureQuantity: newMeasureQuantity,
            weight: newWeight
          });
        }
      });

      console.log(data, 'datadatadatadatadatadata', num)

      this.sampleList = data;
      this.samplePagination.currentPage = 1;
      this.samplePagination.total = data.length;

    },
    async getQualityTemplate(productCode, ids) {

      await getQualityTemplateList({
        productCode: productCode,
        qualityQlanId: ids
      }).then((res) => {
        if (Object.keys(res).length === 0) {
          this.$message.error('请确认该物品是否配置质检方案！');
          return;
        }
        this.baseForm.sampleProportion = res.checkProportion;
        this.baseForm.inspectionStandards = res?.inspectionStandards;

        let combinedList = [];
        for (let i = 0; i < res.qualityTemplateVOList.length; i++) {

          res.qualityTemplateVOList[i].inspectionItemVOList = res.qualityTemplateVOList[i]?.inspectionItemVOList.map(
            (item) => {
              item.templateId = res.qualityTemplateVOList[i]?.id;
              item.qualitySchemeTemplateCode =
                res.qualityTemplateVOList[i]?.qualitySchemeTemplateCode;
              item.qualitySchemeTemplateName =
                res.qualityTemplateVOList[i]?.qualitySchemeTemplateName;

              delete item.id;

              return {
                ...item
              };
            }
          );
          combinedList = combinedList.concat(res.qualityTemplateVOList[i].inspectionItemVOList);
          console.log(combinedList, '质检方案');
          this.schemeList = combinedList;
          this.schemePagination.currentPage = 1;
          this.schemePagination.total = this.schemeList.length;
        }
      });


    },
    handleSelectionChange(selection) {
      if (this.baseForm.qualityMode === 2) {
        this.selectedList = selection;

        this.sampleList = selection;
        // console.log(this.sampleList, 'sampleList勾选列表')
        // this.samplePagination.currentPage = 1;
        // this.samplePagination.total = selection.length;
        this.baseForm.sampleNumber = selection.length;
      }
    },

    // 来料清单列表分页方法
    handleSizeChange(val) {
      this.pagination.pageSize = val;
      this.pagination.currentPage = 1;
    },
    handleCurrentChange(val) {
      this.pagination.currentPage = val;
    },

    // 样品列表分页方法
    handleSampleSizeChange(val) {
      this.samplePagination.pageSize = val;
      this.samplePagination.currentPage = 1;
    },
    handleSampleCurrentChange(val) {
      this.samplePagination.currentPage = val;
    },

    // 质检方案分页方法
    handleSchemeSizeChange(val) {
      this.schemePagination.pageSize = val;
      this.schemePagination.currentPage = 1;
    },
    handleSchemeCurrentChange(val) {
      this.schemePagination.currentPage = val;
    },
    changeModel(val) {
      this.baseForm.qualityMode = val;
      console.log(this.baseForm.productNumber, 'productNumberproductNumber数量')
      if (this.baseForm.qualityMode == 1) {
        this.aaa()
      } else {
        this.sampleList = [];
      }
    },

    changeNumber(val) {
      if (this.baseForm.qualityMode !== 2) {
        return;
      }
      if (val <= 0) {
        this.$refs.showPackingListTable.clearSelection();
        return;
      }
      console.log('取样数量', val, this.isCheck)

      if (this.isCheck) {
        if (val > this.packingList.length) {
          this.$message.warning('取样数量不能大于来源清单数量！');
          return;
        }
        const rows = this.packingList.slice(0, val);
        rows.forEach((row) => {
          this.$refs.showPackingListTable.toggleRowSelection(row);
        });
        if (this.baseForm.qualityMode == 1) {
          this.sampleList = this.packingList;
          this.samplePagination.currentPage = 1;
          this.samplePagination.total = this.packingList.length;
        } else {
          this.sampleList = this.selectedList;
        }

      } else {
        if (val > this.packingList[0].measureQuantity) {
          this.$message.warning('取样数量不能大于计量数量！');
          return;
        }
        const num = Number(val);
        if (num) {
          this.getUnpackSamList(this.packingList, num);
        }
      }
    },

    resetTable() {
      this.$nextTick(() => {
        this.table1();
        this.table2();
      });
    },
    table1() {
      this.packingList = [];
      this.schemeList = [];
    },
    table2() {
      this.$nextTick(() => {
        this.sampleList = [];
      });
    },
    resetForm() {
      this.baseForm = { ...this.defaultForm() };
    },
    handleClose() {
      this.resetForm();
      this.resetTable();
      this.visible = false;
    },

    /* 保存编辑 */
    handleSave() {
      this.$refs.baseInfoRefs.$refs.form1.validate((valid) => {
        if (!valid) {
          return false;
        }

        this.loading = true;
        if (this.baseForm.isUnpack == null || this.baseForm.isUnpack == '') {
          this.baseForm.isUnpack = this.isCheck ? 1 : 2;
        }
        let params = {
          ...this.baseForm,
          qualityInventoryList: this.packingList,
          sampleList: this.sampleList,
          planTemplateList: this.schemeList,
        };
        console.log(params, 'params');

        if (this.btnType == 'issued' && this.schemeList.length < 1) {
          this.$message.warning('质检方案不能为空！');
          return;
        }
        let URL =
          this.btnType == 'add' ? save : this.btnType == 'edit' ? update : '';
        console.log(params, 'params')

        URL(params)
          .then((msg) => {
            this.loading = false;
            this.$message.success(msg);
            this.handleClose();
            this.$emit('done');
          })
          .catch((e) => {
            this.loading = false;
          });
      });
      this.loading = false;
    },
    handleIssued() {
      if (this.sampleList.length == 0) {
        this.$message.warning('样品清单为空！先进行修改操作再下发！');
        return;
      }
      this.$refs.baseInfoRefs.$refs.form1.validate((valid) => {
        if (!valid) {
          return false;
        }
        this.loading = true;

        if (this.baseForm.isUnpack == null || this.baseForm.isUnpack == '') {
          this.baseForm.isUnpack = this.isCheck ? 1 : 2;
        }

        let params = {
          ...this.baseForm,
          qualityInventoryList: this.packingList,
          sampleList: this.sampleList,
          planTemplateList: this.schemeList,
        };

        console.log(params, 'params');

        if (this.btnType == 'issued' && this.schemeList.length < 1) {
          this.$message.warning('质检方案不能为空！');
          return;
        }

        planIssued(params)
          .then((msg) => {
            this.loading = false;
            this.$message.success(msg);
            this.handleClose();
            this.$emit('done');
          })
          .catch((e) => {
            this.loading = false;
          });
      });
      this.loading = false;
    }
  }
};
</script>

<style lang="scss" scoped>
.location-warp {
  display: flex;

  .detail {
    margin-left: 10px;
  }
}

:deep(.el-form-item__content .el-input-group__prepend) {
  background-color: #fff;
}

:deep(.el-dialog:not(.ele-dialog-form) .el-dialog__body .el-form .el-form-item:last-child) {
  margin-bottom: 22px;
}

.add-product {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 30px;
  color: #1890ff;
  margin: 10px 0;
  cursor: pointer;
}

.el-pagination {
  padding: 12px 16px;
  background: #fff;
  border: 1px solid#ebeef5;
  border-top: none;
}
</style>