新增入库选择器修改

zhangwencui

昨天 7cb0cf9a36e263d29be61a44b8caae2a896f3461

新增入库选择器修改

 src/views/inventoryManagement/receiptManagement/index.vue

@@ -246,7 +246,7 @@
        <el-form :model="directQuery"
                 class="mb-2">
          <el-form-item label="产品大类">
            <el-select v-model="directQuery.productCategory"
            <!-- <el-select v-model="directQuery.productCategory"
                       placeholder="请选择产品大类"
                       clearable
                       filterable
@@ -255,14 +255,22 @@
                         :key="item.id"
                         :label="item.productName"
                         :value="item.productName" />
            </el-select>
            </el-select> -->
            <el-tree-select v-model="directQuery.productId"
                            placeholder="请选择产品大类"
                            clearable
                            check-strictly
                            @change="handleProductCategoryChange"
                            :data="productList"
                            :render-after-expand="false"
                            style="width: 100%" />
          </el-form-item>
          <el-form-item label="规格型号">
            <el-select v-model="directQuery.productModelId"
                       placeholder="请先选择产品大类"
                       clearable
                       filterable
                       :disabled="!directQuery.productCategory">
                       :disabled="!directQuery.productId">
              <el-option v-for="item in productModelList"
                         :key="item.id"
                         :label="item.model"
@@ -671,6 +679,7 @@
    directQuery.value = {
      productId: null,
      productModelId: null,
      productCategory: "",
      inboundQuantity: 0,
      warnNum: 0,
      outStockQuantity: 0,
@@ -691,33 +700,76 @@
    if (type === "edit" && row) {
      // 编辑模式，回显数据
      directForm.value = { ...row };
      // 回显产品大类
      const selectedProduct = productList.value.find(
        item => item.productName === row.productCategory
      );
      if (selectedProduct) {
        directQuery.value.productId = selectedProduct.id;
        // 根据产品大类加载规格型号列表并回显
        loadProductModelList(selectedProduct.id).then(() => {
          // 回显规格型号
          directQuery.value.productCategory = row.productCategory || "";
          directQuery.value.productModelId = row.productModelId;
          // 回显其他字段
          directQuery.value.inboundQuantity =
            row.inboundNum || row.inboundQuantity;
      directQuery.value.inboundQuantity = row.inboundNum || row.inboundQuantity;
          directQuery.value.warnNum = row.warnNum || 0;
          directQuery.value.outStockQuantity = row.outStockQuantity || 0;
          directQuery.value.shortageDescription = row.shortageDescription || "";
      // 回显产品大类和规格型号
      if (row.productModelId) {
        // 这里需要根据实际情况获取产品大类ID，暂时假设row中有productId字段
        if (row.productId) {
          directQuery.value.productId = row.productId;
          // 更新产品类别名称
          const productCategory = findNodeById(productList.value, row.productId);
          if (productCategory) {
            directQuery.value.productCategory = productCategory;
          }
          // 根据产品大类加载规格型号列表并回显
          loadProductModelList(row.productId).then(() => {
            directQuery.value.productModelId = row.productModelId;
          });
        } else {
          // 如果没有productId字段，尝试根据productCategory查找
          // 这里需要根据实际情况调整查找逻辑
          directQuery.value.productCategory = row.productCategory || "";
        }
      }
    }
  };

  // 转换产品树数据格式为 el-tree-select 所需格式
  function convertIdToValue(data) {
    return data.map(item => {
      const { id, children, ...rest } = item;
      const newItem = {
        ...rest,
        value: id,
        label: item.productName,
      };
      if (children && children.length > 0) {
        newItem.children = convertIdToValue(children);
      }
      return newItem;
        });
      }

  // 根据 ID 查找节点名称
  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;
  };

  // 加载产品大类列表
  const loadProductList = async () => {
    try {
      const res = await productTreeList();
      productList.value = res;
      // 确保数据格式符合 el-tree-select 要求
      if (Array.isArray(res)) {
        productList.value = convertIdToValue(res);
      } else {
        productList.value = [];
      }
    } catch (error) {
      console.error("加载产品大类失败:", error);
      proxy.$modal.msgError("加载产品大类失败");
@@ -726,16 +778,18 @@

  // 处理产品大类变化
  const handleProductCategoryChange = value => {
    directQuery.value.specificationModel = "";
    directQuery.value.productModelId = "";
    productModelList.value = [];
    if (value) {
      // 根据产品大类加载规格型号列表
      const selectedProduct = productList.value.find(
        item => item.productName === value
      );
      if (selectedProduct) {
        loadProductModelList(selectedProduct.id);
      loadProductModelList(value);
      // 更新产品类别名称
      const productCategory = findNodeById(productList.value, value);
      if (productCategory) {
        directQuery.value.productCategory = productCategory;
      }
    } else {
      directQuery.value.productCategory = "";
    }
  };