新增库存增加厂家下拉框，并且在其他位置回显

zhangwencui

3 天以前 f300d2d0d34ec8e6725fb2410ca5465546171a25

新增库存增加厂家下拉框，并且在其他位置回显

 src/views/inventoryManagement/receiptManagement/Record.vue

@@ -110,6 +110,13 @@
        <el-table-column label="入库时间"
                         prop="createTime"
                         show-overflow-tooltip />
        <el-table-column label="厂家"
                         prop="manufacturerId"
                         show-overflow-tooltip>
          <template #default="scope">
            {{ getManufacturerName(scope.row.manufacturerId) }}
          </template>
        </el-table-column>
        <el-table-column label="产品大类"
                         prop="productName"
                         show-overflow-tooltip />
@@ -129,10 +136,9 @@
                         prop="createBy"
                         show-overflow-tooltip />
        <el-table-column label="来源"
                         prop="recordType"
                         show-overflow-tooltip>
          <template #default="scope">
            {{ getRecordType(scope.row.recordType) }}
            {{ scope.row.qualifiedSourceText || scope.row.unQualifiedSourceText || getRecordType(scope.row.recordType) || "--" }}
          </template>
        </el-table-column>
        <el-table-column v-if="showSourceOrderNoColumn"
@@ -162,6 +168,60 @@
                  :limit="page.size"
                  @pagination="pageProductChange" />
    </div>
    <!-- 审批弹窗 -->
    <el-dialog v-model="approveDialogVisible"
               title="审批"
               width="800px"
               append-to-body>
      <el-form :model="approveForm"
               label-width="80px">
        <el-form-item label="审批结果">
          <el-radio-group v-model="approveForm.approvalStatus">
            <el-radio :label="1">通过</el-radio>
            <el-radio :label="2">驳回</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="明细确认"
                      v-if="approveForm.approvalStatus === 1">
          <div class="approve-items-list">
            <div class="list-header">
              <span class="header-product">产品信息</span>
              <span class="header-num">入库数量</span>
            </div>
            <div v-for="item in approveForm.items"
                 :key="item.id"
                 class="approve-item">
              <div class="item-info">
                <div class="product-name"
                     :title="item.productName">{{ item.productName }}</div>
                <div class="product-info-sub">
                  <span class="product-model"
                        :title="item.model">{{ item.model }}</span>
                  <span class="product-batch"
                        v-if="item.batchNo"
                        :title="'批号: ' + item.batchNo"> | 批号: {{ item.batchNo }}</span>
                </div>
              </div>
              <div class="item-input">
                <el-input-number v-model="item.stockInNum"
                                 :min="0"
                                 :precision="2"
                                 controls-position="right"
                                 style="width: 130px" />
              </div>
            </div>
          </div>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="approveDialogVisible = false">取消</el-button>
          <el-button type="primary"
                     @click="submitApprove"
                     :loading="approveLoading">确定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

@@ -186,6 +246,7 @@
    findAllQualifiedStockInRecordTypeOptions,
    // findAllUnQualifiedStockInRecordTypeOptions,
  } from "@/api/basicData/enum.js";
  import { getManufacturerOptions } from "@/api/inspectionManagement/manufacturerManageFile.js";

  const { proxy } = getCurrentInstance();

@@ -206,11 +267,20 @@
  const tableLoading = ref(false);
  // 来源类型选项
  const stockRecordTypeOptions = ref([]);
  const manufacturerOptions = ref([]);
  const page = reactive({
    current: 1,
    size: 10,
  });
  const total = ref(0);

  // 审批相关
  const approveDialogVisible = ref(false);
  const approveLoading = ref(false);
  const approveForm = reactive({
    approvalStatus: 1,
    items: [], // 存储每个选中的条目及其入库数量
  });

  const data = reactive({
    searchForm: {
@@ -234,6 +304,13 @@
    return (
      stockRecordTypeOptions.value.find(item => item.value === recordType)
        ?.label || ""
    );
  };

  const getManufacturerName = manufacturerId => {
    return (
      manufacturerOptions.value.find(item => item.id === manufacturerId)?.name ||
      "--"
    );
  };

@@ -370,6 +447,12 @@
    //     })
  };

  const fetchManufacturerOptions = () => {
    getManufacturerOptions().then(res => {
      manufacturerOptions.value = res.data || [];
    });
  };

  // 表格选择数据
  const handleSelectionChange = selection => {
    selectedRows.value = selection.filter(
@@ -410,36 +493,49 @@
      proxy.$modal.msgWarning("请选择待审批的数据");
      return;
    }
    const ids = selectedRows.value.map(item => item.id);
    ElMessageBox.confirm("请选择审批结果", "审批", {
      confirmButtonText: "通过",
      cancelButtonText: "驳回",
      type: "warning",
      distinguishCancelAndClose: true,
    })
    // 初始化审批表单
    approveForm.approvalStatus = 1;
    approveForm.items = selectedRows.value.map(row => ({
      id: row.id,
      productName: row.productName,
      model: row.model,
      batchNo: row.batchNo,
      stockInNum: row.stockInNum || 0,
    }));
    approveDialogVisible.value = true;
  };

  const submitApprove = () => {
    const params = {
      approvalStatus: approveForm.approvalStatus,
    };

    // 只有在通过时才传包含数量的明细列表，否则仅传 ID 列表
    if (approveForm.approvalStatus === 1) {
      params.items = approveForm.items.map(item => ({
        id: item.id,
        stockInNum: item.stockInNum,
      }));
    } else {
      params.ids = approveForm.items.map(item => item.id);
    }

    approveLoading.value = true;
    batchApproveStockInRecords(params)
      .then(() => {
        batchApproveStockInRecords({ ids, approvalStatus: 1 })
          .then(() => {
            proxy.$modal.msgSuccess("审批通过成功");
            getList();
          })
          .catch(() => {
            proxy.$modal.msgError("审批通过失败");
          });
        proxy.$modal.msgSuccess(
          approveForm.approvalStatus === 1 ? "审批通过成功" : "审批驳回成功"
        );
        approveDialogVisible.value = false;
        getList();
      })
      .catch(action => {
        if (action === "cancel") {
          batchApproveStockInRecords({ ids, approvalStatus: 2 })
            .then(() => {
              proxy.$modal.msgSuccess("审批驳回成功");
              getList();
            })
            .catch(() => {
              proxy.$modal.msgError("审批驳回失败");
            });
          return;
        }
        proxy.$modal.msg("已取消");
      .catch(() => {
        proxy.$modal.msgError(
          approveForm.approvalStatus === 1 ? "审批通过失败" : "审批驳回失败"
        );
      })
      .finally(() => {
        approveLoading.value = false;
      });
  };

@@ -494,6 +590,7 @@
  onMounted(() => {
    getList();
    fetchStockRecordTypeOptions();
    fetchManufacturerOptions();
  });

  watch(
@@ -511,4 +608,81 @@
    justify-content: flex-end;
    margin-bottom: 10px;
  }

  .approve-items-list {
    max-height: 400px;
    overflow-y: auto;
    width: 100%;
    border: 1px solid #ebeef5;
    border-radius: 4px;

    .list-header {
      display: flex;
      background-color: #f5f7fa;
      padding: 8px 12px;
      font-weight: bold;
      border-bottom: 1px solid #ebeef5;
      font-size: 13px;

      .header-product {
        flex: 1;
      }

      .header-num {
        width: 130px;
        text-align: center;
      }
    }

    .approve-item {
      display: flex;
      align-items: center;
      padding: 10px 12px;
      border-bottom: 1px solid #ebeef5;

      &:last-child {
        border-bottom: none;
      }

      .item-info {
        flex: 1;
        min-width: 0;
        margin-right: 15px;

        .product-name {
          font-weight: bold;
          font-size: 13px;
          color: #303133;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }

        .product-info-sub {
          display: flex;
          align-items: center;
          font-size: 12px;
          color: #909399;
          margin-top: 2px;
          white-space: nowrap;
          overflow: hidden;

          .product-model,
          .product-batch {
            overflow: hidden;
            text-overflow: ellipsis;
          }

          .product-batch {
            margin-left: 4px;
            color: #409eff;
          }
        }
      }

      .item-input {
        width: 130px;
      }
    }
  }
</style>

 src/views/inventoryManagement/stockManagement/BatchNoQtyDetail.vue

@@ -1,227 +1,241 @@
<template>
  <el-dialog
    v-model="isShow"
    title="库存详情"
    width="90%"
    top="3vh"
    class="batch-no-qty-detail-dialog"
    @close="closeModal"
  >
  <el-dialog v-model="isShow"
             title="库存详情"
             width="90%"
             top="3vh"
             class="batch-no-qty-detail-dialog"
             @close="closeModal">
    <div class="detail-content">
      <div class="detail-table-wrapper">
        <el-table
          :data="tableData"
          border
          v-loading="tableLoading"
          style="width: 100%"
          height="100%"
        >
          <el-table-column
            label="产品名称"
            prop="productName"
            show-overflow-tooltip
          />
          <el-table-column label="规格型号" prop="model" show-overflow-tooltip />
          <el-table-column label="单位" prop="unit" show-overflow-tooltip />
          <el-table-column label="批号" prop="batchNo" show-overflow-tooltip />
          <el-table-column
            label="合格库存数量"
            prop="qualifiedQuantity"
            show-overflow-tooltip
          />
          <el-table-column
            label="不合格库存数量"
            prop="unQualifiedQuantity"
            show-overflow-tooltip
          />
          <el-table-column
            label="合格冻结数量"
            prop="qualifiedLockedQuantity"
            show-overflow-tooltip
          />
          <el-table-column
            label="不合格冻结数量"
            prop="unQualifiedLockedQuantity"
            show-overflow-tooltip
          />
          <el-table-column
            label="库存预警数量"
            prop="warnNum"
            show-overflow-tooltip
          />
          <el-table-column label="备注" prop="remark" show-overflow-tooltip />
          <el-table-column
            label="最近更新时间"
            prop="updateTime"
            show-overflow-tooltip
          />
          <el-table-column fixed="right" label="操作" min-width="180" align="center">
        <el-table :data="tableData"
                  border
                  v-loading="tableLoading"
                  style="width: 100%"
                  height="100%">
          <el-table-column label="产品名称"
                           prop="productName"
                           show-overflow-tooltip />
          <el-table-column label="规格型号"
                           prop="model"
                           show-overflow-tooltip />
          <el-table-column label="厂家"
                           prop="manufacturerId"
                           show-overflow-tooltip>
            <template #default="scope">
              <el-button
                link
                type="primary"
                @click="handleSubtract(scope.row)"
                :disabled="
              {{ getManufacturerName(scope.row.manufacturerId) }}
            </template>
          </el-table-column>
          <el-table-column label="来源"
                           show-overflow-tooltip>
            <template #default="scope">
              {{ scope.row.qualifiedSourceText || scope.row.unQualifiedSourceText || "--" }}
            </template>
          </el-table-column>
          <el-table-column label="单位"
                           prop="unit"
                           show-overflow-tooltip />
          <el-table-column label="批号"
                           prop="batchNo"
                           show-overflow-tooltip />
          <el-table-column label="合格库存数量"
                           prop="qualifiedQuantity"
                           show-overflow-tooltip />
          <el-table-column label="不合格库存数量"
                           prop="unQualifiedQuantity"
                           show-overflow-tooltip />
          <el-table-column label="合格冻结数量"
                           prop="qualifiedLockedQuantity"
                           show-overflow-tooltip />
          <el-table-column label="不合格冻结数量"
                           prop="unQualifiedLockedQuantity"
                           show-overflow-tooltip />
          <el-table-column label="库存预警数量"
                           prop="warnNum"
                           show-overflow-tooltip />
          <el-table-column label="备注"
                           prop="remark"
                           show-overflow-tooltip />
          <el-table-column label="最近更新时间"
                           prop="updateTime"
                           show-overflow-tooltip />
          <el-table-column fixed="right"
                           label="操作"
                           min-width="180"
                           align="center">
            <template #default="scope">
              <el-button link
                         type="primary"
                         @click="handleSubtract(scope.row)"
                         :disabled="
                  (scope.row.qualifiedUnLockedQuantity || 0) +
                    (scope.row.qualifiedPendingOutQuantity || 0) <=
                    0 &&
                  (scope.row.unQualifiedUnLockedQuantity || 0) +
                    (scope.row.unQualifiedPendingOutQuantity || 0) <=
                    0
                "
                >领用</el-button
              >
              <el-button
                link
                type="primary"
                v-if="
                ">领用</el-button>
              <el-button link
                         type="primary"
                         v-if="
                  scope.row.unQualifiedUnLockedQuantity > 0 ||
                  scope.row.qualifiedUnLockedQuantity > 0
                "
                @click="handleFrozen(scope.row)"
                >冻结</el-button
              >
              <el-button
                link
                type="primary"
                v-if="
                         @click="handleFrozen(scope.row)">冻结</el-button>
              <el-button link
                         type="primary"
                         v-if="
                  scope.row.qualifiedLockedQuantity > 0 ||
                  scope.row.unQualifiedLockedQuantity > 0
                "
                @click="handleThaw(scope.row)"
                >解冻</el-button
              >
                         @click="handleThaw(scope.row)">解冻</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <pagination
        v-show="total > 0"
        :total="total"
        layout="total, sizes, prev, pager, next, jumper"
        :page="page.current"
        :limit="page.size"
        @pagination="paginationChange"
      />
      <pagination v-show="total > 0"
                  :total="total"
                  layout="total, sizes, prev, pager, next, jumper"
                  :page="page.current"
                  :limit="page.size"
                  @pagination="paginationChange" />
    </div>
  </el-dialog>
</template>

<script setup>
import pagination from "@/components/PIMTable/Pagination.vue";
import { computed, reactive, ref, watch } from "vue";
import { getStockInventoryBatchNoQty } from "@/api/inventoryManagement/stockInventory.js";
  import pagination from "@/components/PIMTable/Pagination.vue";
  import { computed, reactive, ref, watch, onMounted } from "vue";
  import { getStockInventoryBatchNoQty } from "@/api/inventoryManagement/stockInventory.js";
  import { getManufacturerOptions } from "@/api/inspectionManagement/manufacturerManageFile.js";

const props = defineProps({
  visible: {
    type: Boolean,
    required: true,
  },
  record: {
    type: Object,
    default: () => ({}),
  },
});
  const props = defineProps({
    visible: {
      type: Boolean,
      required: true,
    },
    record: {
      type: Object,
      default: () => ({}),
    },
  });

const emit = defineEmits(["update:visible", "subtract", "frozen", "thaw"]);
  const emit = defineEmits(["update:visible", "subtract", "frozen", "thaw"]);

const isShow = computed({
  get() {
    return props.visible;
  },
  set(val) {
    emit("update:visible", val);
  },
});
  const isShow = computed({
    get() {
      return props.visible;
    },
    set(val) {
      emit("update:visible", val);
    },
  });

const tableData = ref([]);
const tableLoading = ref(false);
const total = ref(0);
const page = reactive({
  current: 1,
  size: 20,
});
  const tableData = ref([]);
  const tableLoading = ref(false);
  const manufacturerOptions = ref([]);
  const total = ref(0);
  const page = reactive({
    current: 1,
    size: 20,
  });

const getList = () => {
  if (!props.record?.productId || !props.record?.productModelId) {
    tableData.value = [];
    total.value = 0;
    return;
  }
  const getManufacturerName = manufacturerId => {
    return (
      manufacturerOptions.value.find(item => item.id === manufacturerId)?.name ||
      "--"
    );
  };

  tableLoading.value = true;
  getStockInventoryBatchNoQty({
    current: page.current,
    size: page.size,
    productId: props.record.productId,
    productModelId: props.record.productModelId,
  })
    .then((res) => {
      tableData.value = res.data?.records || [];
      total.value = res.data?.total || 0;
    })
    .finally(() => {
      tableLoading.value = false;
  const fetchManufacturerOptions = () => {
    getManufacturerOptions().then(res => {
      manufacturerOptions.value = res.data || [];
    });
};
  };

const paginationChange = (obj) => {
  page.current = obj.page;
  page.size = obj.limit;
  getList();
};
  onMounted(() => {
    fetchManufacturerOptions();
  });

const handleSubtract = (row) => {
  emit("subtract", row);
};

const handleFrozen = (row) => {
  emit("frozen", row);
};

const handleThaw = (row) => {
  emit("thaw", row);
};

const closeModal = () => {
  isShow.value = false;
  page.current = 1;
  page.size = 20;
  tableData.value = [];
  total.value = 0;
};

watch(
  () => props.visible,
  (visible) => {
    if (!visible) {
  const getList = () => {
    if (!props.record?.productId || !props.record?.productModelId) {
      tableData.value = [];
      total.value = 0;
      return;
    }
    page.current = 1;

    tableLoading.value = true;
    getStockInventoryBatchNoQty({
      current: page.current,
      size: page.size,
      productId: props.record.productId,
      productModelId: props.record.productModelId,
    })
      .then(res => {
        tableData.value = res.data?.records || [];
        total.value = res.data?.total || 0;
      })
      .finally(() => {
        tableLoading.value = false;
      });
  };

  const paginationChange = obj => {
    page.current = obj.page;
    page.size = obj.limit;
    getList();
  },
  { immediate: true }
);
  };

  const handleSubtract = row => {
    emit("subtract", row);
  };

  const handleFrozen = row => {
    emit("frozen", row);
  };

  const handleThaw = row => {
    emit("thaw", row);
  };

  const closeModal = () => {
    isShow.value = false;
    page.current = 1;
    page.size = 20;
    tableData.value = [];
    total.value = 0;
  };

  watch(
    () => props.visible,
    visible => {
      if (!visible) {
        return;
      }
      page.current = 1;
      getList();
    },
    { immediate: true }
  );
</script>

<style scoped lang="scss">
.detail-content {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 170px);
  min-height: 520px;
}
  .detail-content {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 170px);
    min-height: 520px;
  }

.detail-table-wrapper {
  flex: 1;
  min-height: 0;
}
  .detail-table-wrapper {
    flex: 1;
    min-height: 0;
  }

:deep(.batch-no-qty-detail-dialog .el-dialog) {
  max-width: calc(100vw - 48px);
}
  :deep(.batch-no-qty-detail-dialog .el-dialog) {
    max-width: calc(100vw - 48px);
  }

:deep(.batch-no-qty-detail-dialog .el-dialog__body) {
  padding-top: 12px;
}
  :deep(.batch-no-qty-detail-dialog .el-dialog__body) {
    padding-top: 12px;
  }
</style>

 src/views/inventoryManagement/stockManagement/New.vue

@@ -33,8 +33,8 @@
                    disabled />
        </el-form-item>
        <el-form-item label="厂家"
                      prop="manufacturer">
          <el-select v-model="formState.manufacturer"
                      prop="manufacturerId">
          <el-select v-model="formState.manufacturerId"
                     placeholder="请选择厂家"
                     clearable
                     filterable
@@ -78,9 +78,9 @@
          <el-select v-model="formState.source"
                     placeholder="请选择来源">
            <el-option v-for="item in sourceOptions"
                       :key="item"
                       :label="item"
                       :value="item" />
                       :key="item.value"
                       :label="item.label"
                       :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="库存数量"
@@ -155,7 +155,7 @@
    productModelName: "",
    unit: "",
    type: undefined,
    manufacturer: "",
    manufacturerId: "",
    source: "",
    qualitity: 0,
    batchNo: null,
@@ -165,19 +165,24 @@

  const sourceOptions = computed(() => {
    if (formState.value.type === "qualified") {
      return ["采购入库", "生产入库", "外协入库", "修复入库"];
      return [
        { value: "purchaseReceipt", label: "采购入库" },
        { value: "productionReceipt", label: "生产入库" },
        { value: "outsourcedReceipt", label: "外协入库" },
        { value: "repairReceipt", label: "修复入库" },
      ];
    } else if (formState.value.type === "waste") {
      return ["生产产生", "运输产生", "裁剪产生"];
      return [
        { value: "prodGenerated", label: "生产产生" },
        { value: "transGenerated", label: "运输产生" },
        { value: "cuttingGenerated", label: "裁剪产生" },
      ];
    }
    return [];
  });

  const handleTypeChange = val => {
    if (val === "unqualified") {
      formState.value.source = "自定义";
    } else {
      formState.value.source = "";
    }
    formState.value.source = "";
  };

  const isShow = computed({
@@ -223,7 +228,7 @@
      productModelName: "",
      unit: "",
      type: undefined,
      manufacturer: "",
      manufacturerId: "",
      source: "",
      qualitity: 0,
      batchNo: null,