工艺路线和BOM修改

zhangwencui

13 小时以前 ff1e38350372a20b673c211b88843c48d96b48ca

 src/views/productionManagement/processRoute/Edit.vue

@@ -8,21 +8,25 @@
               :model="formState"
               label-position="top"
               ref="formRef">
        <el-form-item label="产品名称"
                      prop="productModelId"
        <el-form-item label="产品类型"
                      prop="dictCode"
                      :rules="[
                {
                required: true,
                message: '请选择产品',
                message: '请选择产品类型',
                trigger: 'change',
              }
            ]">
          <el-button type="primary"
                     @click="showProductSelectDialog = true">
            {{ formState.productName && formState.productModelName 
              ? `${formState.productName} - ${formState.productModelName}` 
              : '选择产品' }}
          </el-button>
          <el-select v-model="formState.dictCode"
                     placeholder="请选择产品类型"
                     clearable
                     style="width: 100%"
                     @change="handleProductTypeChange">
            <el-option v-for="item in productTypeOptions"
                       :key="item.dictCode"
                       :label="item.dictLabel"
                       :value="item.dictCode" />
          </el-select>
        </el-form-item>
        <el-form-item label="BOM"
                      prop="bomId"
@@ -36,7 +40,7 @@
          <el-select v-model="formState.bomId"
                     placeholder="请选择BOM"
                     clearable
                     :disabled="!formState.productModelId || bomOptions.length === 0"
                     :disabled="!formState.dictCode || bomOptions.length === 0"
                     style="width: 100%">
            <el-option v-for="item in bomOptions"
                       :key="item.id"
@@ -50,10 +54,7 @@
                    type="textarea" />
        </el-form-item>
      </el-form>
      <!-- 产品选择弹窗 -->
      <ProductSelectDialog v-model="showProductSelectDialog"
                           @confirm="handleProductSelect"
                           single />

      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary"
@@ -75,8 +76,8 @@
    watch,
  } from "vue";
  import { update } from "@/api/productionManagement/processRoute.js";
  import { getByModel } from "@/api/productionManagement/productBom.js";
  import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
  import { listPage } from "@/api/productionManagement/productBom.js";
  import { getDicts } from "@/api/system/dict/data.js";

  const props = defineProps({
    visible: {
@@ -94,10 +95,8 @@

  // 响应式数据（替代选项式的 data）
  const formState = ref({
    productId: undefined,
    productModelId: undefined,
    productName: "",
    productModelName: "",
    dictCode: undefined,
    dictLabel: "",
    bomId: undefined,
    description: "",
  });
@@ -111,10 +110,48 @@
    },
  });

  const showProductSelectDialog = ref(false);
  const productTypeOptions = ref([]);
  const bomOptions = ref([]);

  let { proxy } = getCurrentInstance();

  // 获取产品类型字典
  const getProductTypeOptions = () => {
    getDicts("product_type")
      .then(res => {
        if (res.code === 200) {
          productTypeOptions.value = res.data;
        }
      })
      .catch(err => {
        console.error("获取产品类型字典失败：", err);
      });
  };

  // 根据产品类型获取BOM列表
  const getBomListByProductType = async dictCode => {
    if (!dictCode) {
      bomOptions.value = [];
      return;
    }
    try {
      // 使用listPage接口，根据dictCode查询BOM
      const res = await listPage({ dictCode });
      // 处理返回的BOM数据
      let bomList = [];
      if (res.data && res.data.records) {
        bomList = res.data.records;
      }
      bomOptions.value = bomList;
      if (bomList.length === 0) {
        proxy.$modal.msgError("该产品类型没有BOM，请先创建BOM");
      }
    } catch (error) {
      // 如果接口返回404或其他错误，说明没有BOM
      proxy.$modal.msgError("该产品类型没有BOM，请先创建BOM");
      bomOptions.value = [];
    }
  };

  const closeModal = () => {
    isShow.value = false;
@@ -125,94 +162,42 @@
    if (props.record) {
      formState.value = {
        ...props.record,
        productId: props.record.productId,
        productModelId: props.record.productModelId,
        productName: props.record.productName || "",
        // 注意：record中的字段是model，需要映射到productModelName
        productModelName:
          props.record.model || props.record.productModelName || "",
        dictCode: props.record.dictCode,
        dictLabel: props.record.dictLabel || "",
        bomId: props.record.bomId,
        description: props.record.description || "",
      };
      // 如果有产品型号ID，加载BOM列表
      if (props.record.productModelId) {
        loadBomList(props.record.productModelId);
      // 如果有产品类型，加载BOM列表
      if (props.record.dictCode) {
        getBomListByProductType(props.record.dictCode);
      }
    }
  };

  // 加载BOM列表
  const loadBomList = async productModelId => {
    if (!productModelId) {
      bomOptions.value = [];
      return;
    }
    try {
      const res = await getByModel(productModelId);
      // 处理返回的BOM数据：可能是数组、对象或包含data字段
      let bomList = [];
      if (Array.isArray(res)) {
        bomList = res;
      } else if (res && res.data) {
        bomList = Array.isArray(res.data) ? res.data : [res.data];
      } else if (res && typeof res === "object") {
        bomList = [res];
  // 产品类型选择处理
  const handleProductTypeChange = async dictCode => {
    if (dictCode) {
      const selectedType = productTypeOptions.value.find(item => item.dictCode === dictCode);
      if (selectedType) {
        formState.value.dictLabel = selectedType.dictLabel;
      }
      bomOptions.value = bomList;
    } catch (error) {
      console.error("加载BOM列表失败：", error);
      // 如果当前选择的BOM不在新列表中，则重置BOM选择
      formState.value.bomId = undefined;
      await getBomListByProductType(dictCode);
      // 触发表单验证更新
      proxy.$refs["formRef"]?.validateField("dictCode");
    } else {
      formState.value.dictLabel = "";
      bomOptions.value = [];
    }
  };

  // 产品选择处理
  const handleProductSelect = async products => {
    if (products && products.length > 0) {
      const product = products[0];
      // 先查询BOM列表（必选）
      try {
        const res = await getByModel(product.id);
        // 处理返回的BOM数据：可能是数组、对象或包含data字段
        let bomList = [];
        if (Array.isArray(res)) {
          bomList = res;
        } else if (res && res.data) {
          bomList = Array.isArray(res.data) ? res.data : [res.data];
        } else if (res && typeof res === "object") {
          bomList = [res];
        }

        if (bomList.length > 0) {
          formState.value.productModelId = product.id;
          formState.value.productName = product.productName;
          formState.value.productModelName = product.model;
          // 如果当前选择的BOM不在新列表中，则重置BOM选择
          const currentBomExists = bomList.some(
            bom => bom.id === formState.value.bomId
          );
          if (!currentBomExists) {
            formState.value.bomId = undefined;
          }
          bomOptions.value = bomList;
          showProductSelectDialog.value = false;
          // 触发表单验证更新
          proxy.$refs["formRef"]?.validateField("productModelId");
        } else {
          proxy.$modal.msgError("该产品没有BOM，请先创建BOM");
        }
      } catch (error) {
        // 如果接口返回404或其他错误，说明没有BOM
        proxy.$modal.msgError("该产品没有BOM，请先创建BOM");
      }
    }
  };

  const handleSubmit = () => {
    proxy.$refs["formRef"].validate(valid => {
      if (valid) {
        // 验证是否选择了产品和BOM
        if (!formState.value.productModelId) {
          proxy.$modal.msgError("请选择产品");
        // 验证是否选择了产品类型和BOM
        if (!formState.value.dictCode) {
          proxy.$modal.msgError("请选择产品类型");
          return;
        }
        if (!formState.value.bomId) {
@@ -250,6 +235,7 @@
  );

  onMounted(() => {
    getProductTypeOptions();
    if (props.visible && props.record) {
      setFormData();
    }