From 050326c507ddbc3af1f73d198b06324626890094 Mon Sep 17 00:00:00 2001
From: gongchunyi <deslre0381@gmail.com>
Date: 星期一, 19 一月 2026 11:45:19 +0800
Subject: [PATCH] fix: 修复原材料检验编辑时指标不显示、供应商回填异常问题

---
 src/views/qualityManagement/rawMaterialInspection/components/formDia.vue |  538 ++++++++++++++++++++++++++++-------------------------------
 1 files changed, 255 insertions(+), 283 deletions(-)

diff --git a/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue b/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
index a20d642..7a61e9c 100644
--- a/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
+++ b/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
@@ -1,140 +1,82 @@
 <template>
   <div>
-    <el-dialog v-model="dialogFormVisible"
-               :title="operationType === 'add' ? '鏂板鍘熸潗鏂欐楠�' : '缂栬緫鍘熸潗鏂欐楠�'"
-               width="70%"
-               @close="closeDia">
-      <el-form :model="form"
-               label-width="140px"
-               label-position="top"
-               :rules="rules"
-               ref="formRef">
+    <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '鏂板鍘熸潗鏂欐楠�' : '缂栬緫鍘熸潗鏂欐楠�'" width="70%"
+      @close="closeDia">
+      <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef">
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="渚涘簲鍟嗭細"
-                          prop="supplier">
-              <el-select v-model="form.supplier"
-                         placeholder="璇烽�夋嫨"
-                         clearable
-                         :disabled="operationType === 'edit'"
-                         filterable
-                         readonly>
-                <el-option v-for="item in supplierList"
-                           :key="item.id"
-                           :label="item.supplierName"
-                           :value="item.supplierName" />
+            <el-form-item label="渚涘簲鍟嗭細" prop="supplier">
+              <el-select v-model="form.supplier" placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'edit'"
+                filterable readonly>
+                <el-option v-for="item in supplierList" :key="item.id" :label="item.supplierName"
+                  :value="item.supplierName" />
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="浜у搧鍚嶇О锛�"
-                          prop="productId">
-              <el-tree-select v-model="form.productId"
-                              placeholder="璇烽�夋嫨"
-                              clearable
-                              :disabled="operationType === 'edit'"
-                              check-strictly
-                              readonly
-                              @change="getModels"
-                              :data="productOptions"
-                              :render-after-expand="false"
-                              style="width: 100%" />
+            <el-form-item label="浜у搧鍚嶇О锛�" prop="productId">
+              <el-tree-select v-model="form.productId" placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'edit'"
+                check-strictly @change="getModels" :data="productOptions"
+                :props="{ label: 'label', value: 'value', children: 'children' }" node-key="value"
+                :render-after-expand="false" style="width: 100%" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="瑙勬牸鍨嬪彿锛�"
-                          prop="productModelId">
-              <el-select v-model="form.productModelId"
-                         placeholder="璇烽�夋嫨"
-                         clearable
-                         :disabled="operationType === 'edit'"
-                         filterable
-                         readonly>
-                <el-option v-for="item in modelOptions"
-                           :key="item.id"
-                           :label="item.model"
-                           :value="item.id" />
+            <el-form-item label="瑙勬牸鍨嬪彿锛�" prop="productModelId">
+              <el-select v-model="form.productModelId" placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'edit'"
+                filterable readonly>
+                <el-option v-for="item in modelOptions" :key="item.id" :label="item.model" :value="item.id" />
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="鍗曚綅锛�"
-                          prop="unit">
-              <el-input v-model="form.unit"
-                        :disabled="operationType === 'edit'"
-                        placeholder="璇疯緭鍏�"
-                        clearable />
+            <el-form-item label="鍗曚綅锛�" prop="unit">
+              <el-input v-model="form.unit" :disabled="operationType === 'edit'" placeholder="璇疯緭鍏�" clearable />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="鏁伴噺锛�"
-                          prop="quantity">
-              <el-input-number :step="0.01"
-                               :min="0"
-                               :disabled="operationType === 'edit'"
-                               style="width: 100%"
-                               v-model="form.quantity"
-                               placeholder="璇疯緭鍏�"
-                               clearable
-                               :precision="2" />
+            <el-form-item label="鏁伴噺锛�" prop="quantity">
+              <el-input-number :step="0.01" :min="0" :disabled="operationType === 'edit'" style="width: 100%"
+                v-model="form.quantity" placeholder="璇疯緭鍏�" clearable :precision="2" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="妫�娴嬪崟浣嶏細"
-                          prop="checkCompany">
-              <el-input v-model="form.checkCompany"
-                        placeholder="璇疯緭鍏�"
-                        clearable />
+            <el-form-item label="妫�娴嬪崟浣嶏細" prop="checkCompany">
+              <el-input v-model="form.checkCompany" placeholder="璇疯緭鍏�" clearable />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="妫�娴嬬粨鏋滐細"
-                          prop="checkResult">
+            <el-form-item label="妫�娴嬬粨鏋滐細" prop="checkResult">
               <el-select v-model="form.checkResult">
-                <el-option label="鍚堟牸"
-                           value="鍚堟牸" />
-                <el-option label="涓嶅悎鏍�"
-                           value="涓嶅悎鏍�" />
+                <el-option label="鍚堟牸" value="鍚堟牸" />
+                <el-option label="涓嶅悎鏍�" value="涓嶅悎鏍�" />
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row v-if="form.checkResult == '涓嶅悎鏍�'"
-                :gutter="30">
+        <el-row v-if="form.checkResult == '涓嶅悎鏍�'" :gutter="30">
           <el-col :span="12">
-            <el-form-item label="涓嶅悎鏍肩幇璞★細"
-                          prop="checkCompany">
-              <el-input v-model="form.defectivePhenomena"
-                        placeholder="璇疯緭鍏�"
-                        clearable />
+            <el-form-item label="涓嶅悎鏍肩幇璞★細" prop="checkCompany">
+              <el-input v-model="form.defectivePhenomena" placeholder="璇疯緭鍏�" clearable />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="妫�楠屽憳锛�"
-                          prop="checkName">
-              <el-input v-model="form.checkName"
-                        placeholder="璇疯緭鍏�"
-                        clearable />
+            <el-form-item label="妫�楠屽憳锛�" prop="checkName">
+              <el-input v-model="form.checkName" placeholder="璇疯緭鍏�" clearable />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="妫�娴嬫棩鏈燂細"
-                          prop="checkTime">
-              <el-date-picker v-model="form.checkTime"
-                              type="date"
-                              placeholder="璇烽�夋嫨鏃ユ湡"
-                              value-format="YYYY-MM-DD"
-                              format="YYYY-MM-DD"
-                              clearable
-                              style="width: 100%" />
+            <el-form-item label="妫�娴嬫棩鏈燂細" prop="checkTime">
+              <el-date-picker v-model="form.checkTime" type="date" placeholder="璇烽�夋嫨鏃ユ湡" value-format="YYYY-MM-DD"
+                format="YYYY-MM-DD" clearable style="width: 100%" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -142,20 +84,14 @@
       <!--      <div style="margin-bottom: 10px;text-align: right">-->
       <!--        <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>-->
       <!--      </div>-->
-      <PIMTable rowKey="id"
-                :column="tableColumn"
-                :tableData="tableData"
-                :tableLoading="tableLoading"
-                height="400">
+      <PIMTable rowKey="id" :column="tableColumn" :tableData="tableData" :tableLoading="tableLoading" height="400">
         <template #slot="{ row }">
-          <el-input v-model="row.testValue"
-                    clearable />
+          <el-input v-model="row.testValue" clearable />
         </template>
       </PIMTable>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary"
-                     @click="submitForm">纭</el-button>
+          <el-button type="primary" @click="submitForm">纭</el-button>
           <el-button @click="closeDia">鍙栨秷</el-button>
         </div>
       </template>
@@ -164,199 +100,235 @@
 </template>
 
 <script setup>
-  import { ref } from "vue";
-  import { getOptions } from "@/api/procurementManagement/procurementLedger.js";
-  import {modelList, productTreeList} from "@/api/basicData/product.js";
-  import {
-    qualityInspectAdd,
-    qualityInspectUpdate,
-  } from "@/api/qualityManagement/rawMaterialInspection.js";
-  import { ElMessageBox } from "element-plus";
-  import {
-    qualityInspectParamDel,
-    qualityInspectParamInfo,
-  } from "@/api/qualityManagement/qualityInspectParam.js";
-  import { qualityInspectDetailByProductId } from "@/api/qualityManagement/metricMaintenance.js";
+import { ref, reactive, toRefs, nextTick, getCurrentInstance, watch } from "vue";
+import { getOptions } from "@/api/procurementManagement/procurementLedger.js";
+import { modelList, productTreeList } from "@/api/basicData/product.js";
+import {
+  qualityInspectAdd,
+  qualityInspectUpdate,
+} from "@/api/qualityManagement/rawMaterialInspection.js";
+import {
+  qualityInspectParamInfo,
+} from "@/api/qualityManagement/qualityInspectParam.js";
+import { qualityInspectDetailByProductId } from "@/api/qualityManagement/metricMaintenance.js";
 
-  const { proxy } = getCurrentInstance();
-  const emit = defineEmits(["close"]);
+const { proxy } = getCurrentInstance();
+const emit = defineEmits(["close"]);
 
-  const dialogFormVisible = ref(false);
-  const operationType = ref("");
-  const data = reactive({
-    form: {
-      checkTime: "",
-      supplier: "",
-      checkName: "",
-      productName: "",
-      productId: "",
-      productModelId: undefined,
-      unit: "",
-      quantity: "",
-      checkCompany: "",
-      checkResult: "",
-      defectivePhenomena: "",
-    },
-    rules: {
-      checkTime: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-      supplier: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-      checkName: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
-      productId: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-      productModelId: [{ required: false, message: "璇烽�夋嫨", trigger: "blur" }],
-      unit: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
-      quantity: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-      checkCompany: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
-      checkResult: [
-        { required: true, message: "璇烽�夋嫨妫�娴嬬粨鏋�", trigger: "change" },
-      ],
-    },
+const dialogFormVisible = ref(false);
+const operationType = ref("");
+const tableLoading = ref(false);
+const isInitializing = ref(false);
+const currentProductId = ref(null);
+
+const data = reactive({
+  form: {
+    checkTime: "",
+    supplier: "",
+    checkName: "",
+    productName: "",
+    productId: "",
+    productModelId: undefined,
+    unit: "",
+    quantity: "",
+    checkCompany: "",
+    checkResult: "",
+    defectivePhenomena: "",
+  },
+  rules: {
+    checkTime: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    supplier: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    productId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }],
+    quantity: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    checkResult: [{ required: true, message: "璇烽�夋嫨妫�娴嬬粨鏋�", trigger: "change" }],
+  },
+});
+
+const { form, rules } = toRefs(data);
+
+const supplierList = ref([]);
+const productOptions = ref([]);
+const modelOptions = ref([]);
+const tableData = ref([]);
+
+const tableColumn = ref([
+  { label: "鎸囨爣", prop: "parameterItem" },
+  { label: "鍗曚綅", prop: "unit" },
+  { label: "鏍囧噯鍊�", prop: "standardValue" },
+  { label: "鍐呮帶鍊�", prop: "controlValue" },
+  {
+    label: "妫�楠屽��",
+    prop: "testValue",
+    dataType: "slot",
+    slot: "slot",
+  },
+]);
+
+// 鎵撳紑寮圭獥
+const openDialog = async (type, row) => {
+  operationType.value = type;
+  dialogFormVisible.value = true;
+  isInitializing.value = true;
+
+  // 閲嶇疆
+  tableData.value = [];
+  currentProductId.value = null;
+  Object.assign(form.value, {
+    checkTime: "",
+    supplier: "",
+    checkName: "",
+    productName: "",
+    productId: "",
+    productModelId: undefined,
+    unit: "",
+    quantity: "",
+    checkCompany: "",
+    checkResult: "",
+    defectivePhenomena: "",
   });
-  const tableColumn = ref([
-    {
-      label: "鎸囨爣",
-      prop: "parameterItem",
-    },
-    {
-      label: "鍗曚綅",
-      prop: "unit",
-    },
-    {
-      label: "鏍囧噯鍊�",
-      prop: "standardValue",
-    },
-    {
-      label: "鍐呮帶鍊�",
-      prop: "controlValue",
-    },
-    {
-      label: "妫�楠屽��",
-      prop: "testValue",
-      dataType: "slot",
-      slot: "slot",
-    },
-  ]);
-  const tableData = ref([]);
-  const tableLoading = ref(false);
 
-  const { form, rules } = toRefs(data);
-  const supplierList = ref([]);
-  const productOptions = ref([]);
-  const modelOptions = ref([]);
-  const currentProductId = ref(0);
+  await nextTick();
 
-  // 鎵撳紑寮规
-  const openDialog = (type, row) => {
-    operationType.value = type;
-    dialogFormVisible.value = true;
-    getOptions().then(res => {
-      supplierList.value = res.data;
-    });
-    form.value = {};
-    getProductOptions();
-    if (operationType.value === "edit") {
-      getModels(row.productId || 0);
-      form.value = { ...row };
-      currentProductId.value = row.productId || 0;
-      getQualityInspectParamList(row.id);
+  try {
+    const [optionsRes, productTreeRes] = await Promise.all([
+      getOptions(),
+      productTreeList(),
+    ]);
+
+    supplierList.value = optionsRes.data;
+    productOptions.value = convertIdToValue(productTreeRes);
+
+    if (type === "edit") {
+      currentProductId.value = row.productId;
+      Object.assign(form.value, row);
+
+      // 鍔犺浇鍨嬪彿锛屼絾涓嶈Е鍙戞寚鏍�
+      await getModels(row.productId, true);
+
+      // 鍔犺浇宸蹭繚瀛樼殑璐ㄦ鍙傛暟
+      await getQualityInspectParamList(row.id);
     }
-  };
-  const getProductOptions = () => {
-    productTreeList().then(res => {
-      productOptions.value = convertIdToValue(res);
-    });
-  };
-  const getModels = value => {
-    currentProductId.value = value;
+  } finally {
+    // 馃憞 鍒濆鍖栧畬鎴�
+    isInitializing.value = false;
+  }
+};
+
+// 浜у搧鍨嬪彿
+const getModels = async (productId, skipList = false) => {
+  if (!productId) return;
+
+  currentProductId.value = productId;
+  if (!skipList) {
     form.value.productModelId = undefined;
-    form.value.productName = findNodeById(productOptions.value, value);
-    modelList({ id: value }).then((res) => {
-      modelOptions.value = res;
-    });
-    if (currentProductId) {
-      getList();
-    }
-  };
-  const findNodeById = (nodes, productId) => {
-    for (let i = 0; i < nodes.length; i++) {
-      if (nodes[i].value === productId) {
-        return nodes[i].label; // 鎵惧埌鑺傜偣锛岃繑鍥炶鑺傜偣
-      }
-      if (nodes[i].children && nodes[i].children.length > 0) {
-        const foundNode = findNodeById(nodes[i].children, productId);
-        if (foundNode) {
-          return foundNode; // 鍦ㄥ瓙鑺傜偣涓壘鍒帮紝杩斿洖璇ヨ妭鐐�
-        }
-      }
-    }
-    return null; // 娌℃湁鎵惧埌鑺傜偣锛岃繑鍥瀗ull
-  };
-
-  function convertIdToValue(data) {
-    return data.map(item => {
-      const { id, children, ...rest } = item;
-      const newItem = {
-        ...rest,
-        value: id, // 灏� id 鏀逛负 value
-      };
-      if (children && children.length > 0) {
-        newItem.children = convertIdToValue(children);
-      }
-
-      return newItem;
-    });
   }
 
-  // 鎻愪氦浜у搧琛ㄥ崟
-  const submitForm = () => {
-    if (form.value.checkResult == "鍚堟牸") {
-      form.value.defectivePhenomena = "";
+  form.value.productName = findNodeById(productOptions.value, productId);
+
+  const res = await modelList({ id: productId });
+  modelOptions.value = res;
+
+  // add 鍦烘櫙锛氱珛鍗冲姞杞芥寚鏍�
+  if (!skipList && !isInitializing.value) {
+    getList();
+  }
+};
+
+// 鎷夋寚鏍�
+const getList = async () => {
+  console.log("getList鎵ц");
+
+  if (!currentProductId.value || isInitializing.value) return;
+
+  tableLoading.value = true;
+  try {
+    const res = await qualityInspectDetailByProductId(currentProductId.value);
+    tableData.value = res.data || [];
+  } finally {
+    tableLoading.value = false;
+  }
+};
+
+// edit 鍒濆鍖栧畬鎴愬悗瑙﹀彂涓�娆�
+watch(isInitializing, (val) => {
+  if (
+    val === false &&
+    operationType.value === "edit" &&
+    currentProductId.value
+  ) {
+    getList();
+  }
+});
+
+// 鍥炲~鍙傛暟
+const getQualityInspectParamList = async (id) => {
+  tableLoading.value = true;
+  try {
+    const res = await qualityInspectParamInfo(id);
+    tableData.value = res.data || [];
+  } finally {
+    tableLoading.value = false;
+  }
+};
+
+// 鎻愪氦
+const submitForm = () => {
+  if (form.value.checkResult === "鍚堟牸") {
+    form.value.defectivePhenomena = "";
+  }
+
+  proxy.$refs.formRef.validate(async (valid) => {
+    if (!valid) return;
+
+    form.value.inspectType = 0;
+    if (operationType.value === "add") {
+      tableData.value.forEach((i) => delete i.id);
     }
-    proxy.$refs.formRef.validate(valid => {
-      if (valid) {
-        form.value.inspectType = 0;
-        if (operationType.value === "add") {
-          tableData.value.forEach(item => {
-            delete item.id;
-          });
-        }
-        const data = { ...form.value, qualityInspectParams: tableData.value };
-        if (operationType.value === "add") {
-          qualityInspectAdd(data).then(res => {
-            proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
-            closeDia();
-          });
-        } else {
-          qualityInspectUpdate(data).then(res => {
-            proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
-            closeDia();
-          });
-        }
-      }
-    });
-  };
 
-  const getList = () => {
-    qualityInspectDetailByProductId(currentProductId.value).then(res => {
-      tableData.value = res.data;
-    });
-  };
+    const submitData = {
+      ...form.value,
+      qualityInspectParams: tableData.value,
+    };
 
-  const getQualityInspectParamList = id => {
-    qualityInspectParamInfo(id).then(res => {
-      tableData.value = res.data;
-    });
-  };
-  // 鍏抽棴寮规
-  const closeDia = () => {
-    proxy.resetForm("formRef");
-    tableData.value = [];
-    dialogFormVisible.value = false;
-    emit("close");
-  };
-  defineExpose({
-    openDialog,
+    const api =
+      operationType.value === "add"
+        ? qualityInspectAdd
+        : qualityInspectUpdate;
+
+    await api(submitData);
+    proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
+    closeDia();
   });
+};
+
+// 鍏抽棴
+const closeDia = () => {
+  proxy.resetForm("formRef");
+  tableData.value = [];
+  dialogFormVisible.value = false;
+  emit("close");
+};
+
+function findNodeById(list, id) {
+  for (const item of list) {
+    if (item.value === id) return item.label;
+    if (item.children) {
+      const res = findNodeById(item.children, id);
+      if (res) return res;
+    }
+  }
+  return "";
+}
+
+function convertIdToValue(data = []) {
+  return data.map((item) => ({
+    label: item.productName,
+    value: item.id,
+    children: item.children ? convertIdToValue(item.children) : [],
+  }));
+}
+
+defineExpose({ openDialog });
 </script>
 
-<style scoped>
-</style>
\ No newline at end of file
+<style scoped></style>
\ No newline at end of file

--
Gitblit v1.9.3