src/views/qualityManagement/nonconformingManagement/components/formDia.vue
@@ -42,8 +42,21 @@
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="规格型号:" prop="model">
              <el-input v-model="form.model" placeholder="请输入" clearable/>
            <el-form-item label="规格型号:" prop="productModelId">
              <el-select
                v-model="form.productModelId"
                placeholder="请选择"
                clearable
                @change="getProductModel"
                style="width: 100%"
              >
                <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>
@@ -123,8 +136,8 @@
</template>
<script setup>
import {ref} from "vue";
import {productTreeList} from "@/api/basicData/product.js";
import {ref, reactive, toRefs, getCurrentInstance} from "vue";
import {modelList, productTreeList} from "@/api/basicData/product.js";
import {
  getQualityUnqualifiedInfo,
  qualityUnqualifiedAdd,
@@ -142,6 +155,7 @@
    checkName: "",
    productName: "",
    productId: "",
    productModelId: "",
    model: "",
    unit: "",
    quantity: "",
@@ -157,6 +171,7 @@
    process: [{ required: true, message: "请输入", trigger: "blur" }],
    checkName: [{ required: false, message: "请输入", trigger: "blur" }],
    productId: [{ required: true, message: "请输入", trigger: "blur" }],
    productModelId: [{required: true, message: "请选择规格型号", trigger: "change"}],
    model: [{ required: false, message: "请输入", trigger: "blur" }],
    unit: [{ required: false, message: "请输入", trigger: "blur" }],
    quantity: [{ required: true, message: "请输入", trigger: "blur" }],
@@ -166,16 +181,23 @@
});
const { form, rules } = toRefs(data);
const productOptions = ref([]);
const modelOptions = ref([]);
// 打开弹框
const openDialog = (type, row) => {
  operationType.value = type;
  dialogFormVisible.value = true;
  form.value = {}
  modelOptions.value = [];
  getProductOptions();
  if (operationType.value === 'edit') {
    getQualityUnqualifiedInfo(row.id).then(res => {
      form.value = {...res.data}
      if (form.value.productId) {
        modelList({ id: form.value.productId }).then((res) => {
          modelOptions.value = res;
        });
      }
    })
  }
}
@@ -186,6 +208,24 @@
};
const getModels = (value) => {
  form.value.productName = findNodeById(productOptions.value, value);
  modelOptions.value = [];
  form.value.productModelId = "";
  form.value.model = "";
  if (value) {
    modelList({ id: value }).then((res) => {
      modelOptions.value = res;
    });
  }
};
const getProductModel = (value) => {
  const index = modelOptions.value.findIndex((item) => item.id === value);
  if (index !== -1) {
    form.value.model = modelOptions.value[index].model;
    form.value.unit = modelOptions.value[index].unit;
  } else {
    form.value.model = "";
    form.value.unit = "";
  }
};
const findNodeById = (nodes, productId) => {
  for (let i = 0; i < nodes.length; i++) {