mec-cloud_-intelligent-manufacturing_client/zkqy-ui/src/views/bussiness/dialogCompments/GongYi/PhysicalInspection.vue

<template>
  <div class="form-wrap">
    <div class="cardwrap">
      <el-row :gutter="20">
        <el-col :span="24">
          <div class="title">
            <span class="desc">产品名称:</span>
            <span class="content">{{ productName }}</span>
          </div>
        </el-col>
        <el-form
          v-if="dict.type.physical_index.length > 0 && formShow"
          :model="dictForm"
          ref="formRef"
          label-width="120px"
          :inline="true"
          size="normal"
        >
          <el-col
            v-for="item of dict.type.physical_index"
            :key="item.value"
            :span="12"
          >
            <el-form-item :label="item.label">
              <el-input
                @input="change()"
                v-model="dictForm[item.value]"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注">
              <el-input type="textarea" v-model="dictForm.remark"></el-input>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>
      <div class="btn">
        <el-button
          :disabled="isAddSuccess && !isEdit"
          class="mt10"
          type="primary"
          size="default"
          @click="record"
          >{{ isEdit ? "确认修改" : "记录" }}</el-button
        >
      </div>
    </div>
  </div>
</template>

<script>
import getNodeSequence from "@/utils/bpmn/getNodeSequence";
import { xmlStr2XmlObj } from "@/utils/bpmn/xml";
import { mapState } from "vuex";
import { v4 as uuidv4 } from "uuid";
import {
  addQualityInspectionCertificate,
  editQualityInspectionCertificate,
  addInspectionList,
  updateInspectionList,
} from "@/api/bussiness/bpmExcuteProcess";
import moment from "moment";
import { getDicts } from "@/api/system/dict/data";
export default {
  name: "PhysicalInspection",
  props: ["formData", "row"],
  dicts: ["physical_index"],
  components: {},
  data() {
    return {
      saleProductsData: {},
      isAddSuccess: false,
      productName: "",
      productNo: "",
      saleProductNo: "",
      inspectionId: "",
      remark: "",
      rowData: {},
      isEdit: false,
      inspectionListNo: "",
      dictData: [],
      dictForm: {
        remark: "",
      },
      tableData: [
        {
          productName: "",
          productNo: "",
          // 物理指标
          intensity: "", //强度
          elongation: "", //伸长率
          titer: "", //纤度
          oilContent: "", //含油率
          crimpRate: "", //卷缩率
          boilingWaterShrinkage: "", //沸水收缩率
          // 外观指标
          fuzz: "", //毛丝
          coilWire: "", //圈丝
          arachnoidSilk: "", //蛛网丝
          takeShapeBadness: "", //成型不良
          oilFree: "", //无油
          chromaticAberrationWire: "", //色差丝
          filaments: "", //污丝
        },
      ],
      formShow: true,
    };
  },
  watch: {
    myFormData: {
      immediate: true,
      deep: true,
      async handler(val) {
        console.log(val);
        this.saleProductsData = val.resultMap.saleProducts.resultMap;
        await this.initFormInfo(); //初始化表单数据
        this.isEdit = Object.keys(val.resultMap.inspectionList.resultMap).length
          ? true
          : false;
        let { product_name, product_no, sale_product_no } =
          val.resultMap.saleProducts.resultMap;
        this.productName = product_name;
        this.productNo = product_no;
        this.saleProductNo = sale_product_no;
        if (this.isEdit) {
          //第二次修改
          this.inspectionListNo =
            val.resultMap.inspectionList.resultMap.inspection_list_no;
          this.dictForm.remark = val.resultMap.inspectionList.resultMap.remark;
          this.inspectionId = val.resultMap.inspectionList.resultMap.id;
          let fieldList = val.resultMap.inspectionListInfo.map(
            (item) => item.resultMap
          );
          this.dictData.forEach((item) => {
            let prop = item.value;
            let target = fieldList.find((item) => item.indexName == prop);
            if (target) {
              this.dictForm[prop] = target.indexContent;
              item.id = target.id;
            } else {
              console.log("没有找到");
            }
          });
          this.formShow = false;
          this.$nextTick(() => {
            this.formShow = true;
          });
        }
      },
    },
    myRow: {
      immediate: true,
      deep: true,
      handler(val) {
        this.rowData = val;
      },
    },
  },
  computed: {
    myFormData() {
      return this.formData;
    },
    myRow() {
      return this.row;
    },
    ...mapState({
      nickName: (state) => state.user.nickName,
    }),
  },
  created() {},
  methods: {
    change() {
      this.$forceUpdate(); //强制刷新
    },
    // 初始化表单数据
    async initFormInfo() {
      try {
        let res = await getDicts("physical_index");
        if (res.code == 200) {
          console.log(res.data);
          this.dictData = res.data.map((item) => {
            return {
              value: item.dictValue,
              label: item.dictLabel,
              data: item,
            };
          });
        }
      } catch (error) {}
      console.log(this.dict.type.physical_index);
      this.dict.type.physical_index.map((item) => {
        // this.dictForm[item.key] = "";
        this.$set(this.dictForm, item.key, "");
      });
      this.dictForm.remark = "";
    },
    // 记录质检结果
    async record() {
      let uuid = uuidv4();
      let { bepTaskName, bepTaskKey, benTaskNodeKey } = this.rowData;
      let { lot_number, materieColorNumber } = this.saleProductsData;
      let payLoad = {
        id: this.isEdit ? this.inspectionId : null,
        inspectionListNo: this.isEdit ? this.inspectionListNo : uuid, //检验单编号
        saleNo: bepTaskName, // 销售单编号
        taskProcessKey: bepTaskKey, //任务编码
        taskNodeKey: benTaskNodeKey, //任务节点编码
        inspectionTime: moment(new Date()).format("YYYY-MM-DD HH:mm:ss"), //检验时间
        inspectionPersonnel: this.nickName, //检验人员
        remark: this.dictForm.remark, //备注
        indexType: "1", //1:物理指标  2:外观指标
        saleProductNo: this.saleProductNo, //销售产品编号
        inspectionListInfoList: [],
        lotNumber: lot_number,
        colourNumber: materieColorNumber,
      };
      // payLoad.inspectionListInfo = {
      //   ...this.dictForm,
      //   taskProcessKey: bepTaskKey, //任务编码
      //   taskNodeKey: benTaskNodeKey, //任务节点编码
      // };
      payLoad.inspectionListInfoList = this.dict.type.physical_index.map(
        (item) => {
          if (this.isEdit) {
            return {
              id: this.dictData.find((i) => i.value == item.value).id,
              inspectionListNo: this.inspectionListNo, //检验单编号
              productNo: this.productNo,
              productName: this.productName,
              indexName: item.value,
              indexContent: this.dictForm[item.value],
            };
          } else {
            return {
              inspectionListNo: uuid, //检验单编号
              productNo: this.productNo,
              productName: this.productName,
              indexName: item.value,
              indexContent: this.dictForm[item.value],
            };
          }
        }
      );
      console.log(payLoad);
      // return;
      // payLoad.inspectionListInfo = this.tableData.map((item) => {
      //   return {
      //     inspectionListNo: payLoad.inspectionList.inspectionListNo,
      //     ...item,
      //     taskProcessKey: bepTaskKey, //任务编码
      //     taskNodeKey: benTaskNodeKey, //任务节点编码
      //   };
      // });
      try {
        let apiFun = this.isEdit ? updateInspectionList : addInspectionList;
        let res = await apiFun(payLoad);
        if (res.code == 200) {
          let msg = this.isEdit ? "修改成功" : "添加成功";
          if (!this.isEdit) {
            this.isAddSuccess = true;
          }
          this.$message.success(msg);
        } else {
          this.$message.error(res.msg);
        }
      } catch (error) {
        console.log(error);
      }
    },
    async getFormData() {
      let formData = {
        flag: false,
        msg: "",
      };

      return {
        flag: true,
        data: {},
      };
    },
  },
};
</script>

<style scoped lang="scss">
.title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
  .desc {
    margin-right: 10px;
  }
}
.btn {
  display: flex;
  flex-direction: row-reverse;
}
.remark {
  display: flex;
  margin-top: 10px;
  .label {
    display: block;
    width: 100px;
    text-align: center;
  }
}
</style>
./PhysicalInSpection.vue