优化主生产计划表单产品相关

huminmin

2026-03-12 45ebf67583fb4ab6be9c437c39b78ae254407654

 src/views/productionPlan/productionPlan/index.vue

@@ -18,7 +18,7 @@
                    @keyup.enter="handleQuery" />
        </el-form-item>
        <el-form-item label="产品规格:">
          <el-input v-model="searchForm.productSpec"
          <el-input v-model="searchForm.specification"
                    placeholder="请输入"
                    clearable
                    style="width: 160px;"
@@ -102,7 +102,7 @@
        <el-row :gutter="20">
          <el-col :span="10">
            <el-form-item label="产品规格">
              <div class="info-display">{{ mergeForm.productSpec || '-' }}</div>
              <div class="info-display">{{ mergeForm.specification || '-' }}</div>
            </el-form-item>
          </el-col>
          <el-col :span="10">
@@ -234,19 +234,27 @@
                    placeholder="请输入客户名称" />
        </el-form-item>
        <el-form-item label="产品名称"
                      prop="productName">
          <el-input v-model="form.productName"
                    placeholder="请输入产品名称" />
                      prop="productMaterialId">
          <el-tree-select v-model="form.productMaterialId"
                          placeholder="请选择"
                          clearable
                          :data="productOptions"
                          :render-after-expand="false"
                          filterable
                          @change="handleProductChange"
                          style="width: 100%" />
        </el-form-item>

        <el-form-item label="产品规格"
                      prop="productSpec">
          <el-input v-model="form.productSpec"
                    placeholder="请输入产品规格" />
        </el-form-item>
        <el-form-item label="物料编码"
                      prop="materialCode">
          <el-input v-model="form.materialCode"
                    placeholder="请输入物料编码" />
                      prop="productMaterialSkuId">
          <el-select v-model="form.productMaterialSkuId"
                     @change="handleChangeSpecification"
                     placeholder="请选择">
            <el-option v-for="item in specificationOptions"
                       :key="item.skuId"
                       :label="item.specification"
                       :value="item.skuId" />
          </el-select>
        </el-form-item>
        <el-form-item label="块数"
                      prop="quantity">
@@ -335,6 +343,7 @@
    productionPlanCombine,
  } from "@/api/productionPlan/productionPlan.js";
  import PIMTable from "./components/PIMTable.vue";
  import {modelListPage, productTreeList} from "@/api/basicData/newProduct.js";

  const { proxy } = getCurrentInstance();

@@ -365,7 +374,7 @@
    },
    {
      label: "产品规格",
      prop: "productSpec",
      prop: "specification",
      width: "150px",
      className: "spec-cell",
    },
@@ -484,7 +493,7 @@
            // 设置表单数据
            mergeForm.materialCode = row.materialCode;
            mergeForm.productName = row.productName || "";
            mergeForm.productSpec = row.productSpec || "";
            mergeForm.specification = row.specification || "";
            mergeForm.length = row.length || 0;
            mergeForm.width = row.width || 0;
            mergeForm.height = row.height || 0;
@@ -526,7 +535,7 @@
  const mergeForm = reactive({
    materialCode: "",
    productName: "",
    productSpec: "",
    specification: "",
    length: 0,
    width: 0,
    height: 0,
@@ -557,13 +566,17 @@
  // 新增/编辑相关
  const dialogVisible = ref(false);
  const operationType = ref("add"); // add | edit
  const productOptions = ref([])
  const specificationOptions = ref([])
  const formRef = ref(null);
  const form = reactive({
    id: undefined,
    applyNo: "",
    customerName: "",
    productMaterialId: undefined,
    productMaterialSkuId: undefined,
    productName: "",
    productSpec: "",
    specification: "",
    materialCode: "",
    quantity: 0,
    volume: 0,
@@ -581,10 +594,11 @@
    customerName: [
      { required: true, message: "请输入客户名称", trigger: "blur" },
    ],
    productName: [{ required: true, message: "请输入产品名称", trigger: "blur" }],
    productSpec: [{ required: true, message: "请输入产品规格", trigger: "blur" }],
    materialCode: [
      { required: true, message: "请输入物料编码", trigger: "blur" },
    productMaterialSkuId: [
      { required: true, message: "请选择产品规格", trigger: "change" },
    ],
    productMaterialId: [
      { required: true, message: "请选择产品", trigger: "change" },
    ],
  });

@@ -610,6 +624,53 @@
    // 限制四位小数
    mergeForm.totalAssignedQuantity = Number(value.toFixed(4));
  };

  const fetchProductOptions = () => {
    return productTreeList().then(res => {
      productOptions.value = convertIdToValue(res.data);
      return res;
    });
  }

  const convertIdToValue = (data) => {
    return data.map((item) => {
      const newItem = {
        value: `config_${item.configId}`, // 使用config_前缀确保唯一性
        label: item.configName,
        disabled: item.materialList.length === 0,
      };
      if (item.materialList && item.materialList.length > 0) {
        newItem.children = item.materialList.map(material => ({
          value: material.id, // 使用material的id作为value
          label: material.materialName, // 使用materialName作为label
        }));
      }

      return newItem;
    });
  }

  const handleProductChange = (value) => {
    form.productMaterialSkuId = undefined
    fetchSpecificationOptions(value)
  }

  const fetchSpecificationOptions = (materialId) => {
    specificationOptions.value = []
    if (materialId) {
      modelListPage({ materialId: materialId}).then(res => {
        specificationOptions.value = res.data;
      });
    }
  }

  const handleChangeSpecification = (value) => {
    form.materialCode = undefined
    const selectedModel = specificationOptions.value.find((item) => item.id === value)
    if (selectedModel) {
      form.materialCode = selectedModel.materialCode
    }
  }

  // 生成模拟进度详情数据
  const generateProgressDetails = status => {
@@ -686,7 +747,7 @@
    searchForm: {
      customerName: "",
      productName: "",
      productSpec: "",
      specification: "",
      materialCode: "",
      applyNo: "",
      dateRange: [],
@@ -706,7 +767,7 @@
    Object.assign(searchForm.value, {
      customerName: "",
      productName: "",
      productSpec: "",
      specification: "",
      materialCode: "",
      applyNo: "",
      dateRange: [],
@@ -820,7 +881,7 @@
    const firstRow = selectedRows.value[0];
    mergeForm.materialCode = selectedserialNo.value;
    mergeForm.productName = firstRow.productName || "";
    mergeForm.productSpec = firstRow.productSpec || "";
    mergeForm.specification = firstRow.specification || "";
    mergeForm.length = firstRow.length || 0;
    mergeForm.width = firstRow.width || 0;
    mergeForm.height = firstRow.height || 0;
@@ -948,7 +1009,9 @@
      applyNo: "",
      customerName: "",
      productName: "",
      productSpec: "",
      productMaterialId: undefined,
      productMaterialSkuId: undefined,
      specification: "",
      materialCode: "",
      quantity: 0,
      volume: 0,
@@ -962,6 +1025,7 @@
      remarkTwo: "",
    });
    dialogVisible.value = true;
    fetchProductOptions();
  };

  // 编辑
@@ -972,7 +1036,9 @@
      applyNo: row.applyNo || "",
      customerName: row.customerName || "",
      productName: row.productName || "",
      productSpec: row.productSpec || "",
      productMaterialId: row.productMaterialId || undefined,
      productMaterialSkuId: row.productMaterialSkuId || undefined,
      specification: row.specification || "",
      materialCode: row.materialCode || "",
      quantity: row.quantity || 0,
      volume: row.volume || 0,
@@ -986,6 +1052,8 @@
      remarkTwo: row.remarkTwo || "",
    });
    dialogVisible.value = true;
    fetchProductOptions();
    fetchSpecificationOptions(row.productMaterialId);
  };

  // 删除