From 5f61294aad735ca4950a50b8e932f2cd25f59508 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Mon, 6 Apr 2026 11:28:35 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(mes):=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E5=BA=93=E4=BD=8D=E7=BC=96=E5=8F=B7=E5=92=8C=E7=9B=B8=E5=85=B3?=
 =?UTF-8?q?=E6=9F=A5=E8=AF=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

在库存物资选择对话框中新增库位编号字段，更新查询参数以支持库位的选择和过滤。调整相关组件以确保库位信息的正确显示和交互。
---
 .../WmMaterialStockSelectDialog.vue           | 244 +++++++++++-------
 1 file changed, 145 insertions(+), 99 deletions(-)

diff --git a/src/views/mes/wm/materialStock/components/WmMaterialStockSelectDialog.vue b/src/views/mes/wm/materialStock/components/WmMaterialStockSelectDialog.vue
index 4518093f8..27e1b69cc 100644
--- a/src/views/mes/wm/materialStock/components/WmMaterialStockSelectDialog.vue
+++ b/src/views/mes/wm/materialStock/components/WmMaterialStockSelectDialog.vue
@@ -11,104 +11,123 @@
 -->
 <template>
   <Dialog title="库存物资选择" v-model="dialogVisible" width="80%">
-    <!-- TODO @AI：增加 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/mes/md/item/type/components/MdItemTypeSelect.vue -->
-
-    <!-- 搜索 -->
-    <ContentWrap>
-      <el-form :inline="true" :model="queryParams" label-width="80px">
-        <el-form-item label="物料">
-          <MdItemSelect v-model="queryParams.itemId" class="!w-240px" />
-        </el-form-item>
-        <el-form-item label="供应商">
-          <MdVendorSelect v-model="queryParams.vendorId" class="!w-240px" />
-        </el-form-item>
-        <el-form-item label="批次号">
-          <el-input
-            v-model="queryParams.batchCode"
-            placeholder="请输入批次号"
-            clearable
-            @keyup.enter="handleQuery"
-            class="!w-240px"
-          />
-        </el-form-item>
-        <el-form-item label="仓库">
-          <WmWarehouseSelect
-            v-model="queryParams.warehouseId"
-            @change="handleWarehouseChange"
-            class="!w-240px"
-          />
-        </el-form-item>
-        <!-- TODO @AI：areaId 增加一个； -->
-        <el-form-item label="库区">
-          <WmWarehouseLocationSelect
-            v-model="queryParams.locationId"
-            :warehouse-id="queryParams.warehouseId"
-            class="!w-240px"
-          />
-        </el-form-item>
-        <el-form-item>
-          <el-button @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
-          <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
-        </el-form-item>
-      </el-form>
-    </ContentWrap>
-    <!-- 列表 -->
-    <ContentWrap>
-      <el-table
-        ref="tableRef"
-        v-loading="loading"
-        :data="list"
-        :stripe="true"
-        :show-overflow-tooltip="true"
-        row-key="id"
-        :highlight-current-row="!multiple"
-        @selection-change="handleSelectionChange"
-        @row-click="handleRowClick"
-        @row-dblclick="handleRowDblClick"
-      >
-        <!-- 多选：checkbox（reserve-selection 保证跨页勾选不丢失） -->
-        <el-table-column
-          v-if="multiple"
-          type="selection"
-          :reserve-selection="true"
-          width="50"
-          align="center"
-        />
-        <!-- 单选：radio -->
-        <el-table-column v-else width="50" align="center">
-          <template #default="{ row }">
-            <el-radio
-              v-model="selectedRadioId"
-              :value="row.id"
-              class="radio-no-label"
-              @change="handleRadioChange(row)"
+    <el-row :gutter="20">
+      <!-- 左侧：分类树 -->
+      <el-col :span="4" :xs="24">
+        <ContentWrap class="h-1/1">
+          <MdItemTypeTree ref="typeTreeRef" @node-click="handleNodeClick" />
+        </ContentWrap>
+      </el-col>
+      <!-- 右侧：搜索 + 表格 -->
+      <el-col :span="20" :xs="24">
+        <!-- 搜索 -->
+        <ContentWrap>
+          <el-form :inline="true" :model="queryParams" label-width="68px">
+            <el-form-item label="物料">
+              <MdItemSelect v-model="queryParams.itemId" class="!w-220px" />
+            </el-form-item>
+            <el-form-item label="供应商">
+              <MdVendorSelect v-model="queryParams.vendorId" class="!w-220px" />
+            </el-form-item>
+            <el-form-item label="批次号">
+              <el-input
+                v-model="queryParams.batchCode"
+                placeholder="请输入批次号"
+                clearable
+                @keyup.enter="handleQuery"
+                class="!w-220px"
+              />
+            </el-form-item>
+            <el-form-item label="仓库">
+              <WmWarehouseSelect
+                v-model="queryParams.warehouseId"
+                @change="handleWarehouseChange"
+                class="!w-220px"
+              />
+            </el-form-item>
+            <!-- DONE @AI：areaId 增加一个 -->
+            <el-form-item label="库区">
+              <WmWarehouseLocationSelect
+                v-model="queryParams.locationId"
+                :warehouse-id="queryParams.warehouseId"
+                @change="handleLocationChange"
+                class="!w-220px"
+              />
+            </el-form-item>
+            <el-form-item label="库位">
+              <WmWarehouseAreaSelect
+                v-model="queryParams.areaId"
+                :location-id="queryParams.locationId"
+                class="!w-220px"
+              />
+            </el-form-item>
+            <el-form-item>
+              <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+              <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+            </el-form-item>
+          </el-form>
+        </ContentWrap>
+        <!-- 列表 -->
+        <ContentWrap>
+          <el-table
+            ref="tableRef"
+            v-loading="loading"
+            :data="list"
+            :stripe="true"
+            :show-overflow-tooltip="true"
+            border
+            row-key="id"
+            :highlight-current-row="!multiple"
+            @selection-change="handleSelectionChange"
+            @row-click="handleRowClick"
+            @row-dblclick="handleRowDblClick"
+          >
+            <!-- 多选：checkbox（reserve-selection 保证跨页勾选不丢失） -->
+            <el-table-column
+              v-if="multiple"
+              type="selection"
+              :reserve-selection="true"
+              width="50"
+              align="center"
             />
-          </template>
-        </el-table-column>
-        <el-table-column label="产品物料编码" align="center" prop="itemCode" min-width="120" />
-        <el-table-column label="产品物料名称" align="center" prop="itemName" min-width="140" />
-        <el-table-column label="规格型号" align="center" prop="specification" min-width="120" />
-        <el-table-column label="单位" align="center" prop="unitMeasureName" min-width="80" />
-        <el-table-column label="入库批次号" align="center" prop="batchCode" min-width="120" />
-        <el-table-column label="仓库" align="center" prop="warehouseName" min-width="100" />
-        <el-table-column label="库区" align="center" prop="locationName" min-width="100" />
-        <el-table-column label="库位" align="center" prop="areaName" min-width="100" />
-        <el-table-column label="在库数量" align="center" prop="quantity" min-width="100" />
-        <el-table-column
-          label="入库日期"
-          align="center"
-          prop="receiptTime"
-          :formatter="dateFormatter2"
-          width="180px"
-        />
-      </el-table>
-      <Pagination
-        :total="total"
-        v-model:page="queryParams.pageNo"
-        v-model:limit="queryParams.pageSize"
-        @pagination="getList"
-      />
-    </ContentWrap>
+            <!-- 单选：radio -->
+            <el-table-column v-else width="50" align="center">
+              <template #default="{ row }">
+                <el-radio
+                  v-model="selectedRadioId"
+                  :value="row.id"
+                  class="radio-no-label"
+                  @change="handleRadioChange(row)"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column label="产品物料编码" align="center" prop="itemCode" min-width="120" />
+            <el-table-column label="产品物料名称" align="center" prop="itemName" min-width="140" />
+            <el-table-column label="规格型号" align="center" prop="specification" min-width="120" />
+            <el-table-column label="单位" align="center" prop="unitMeasureName" min-width="80" />
+            <el-table-column label="入库批次号" align="center" prop="batchCode" min-width="120" />
+            <el-table-column label="仓库" align="center" prop="warehouseName" min-width="100" />
+            <el-table-column label="库区" align="center" prop="locationName" min-width="100" />
+            <el-table-column label="库位" align="center" prop="areaName" min-width="100" />
+            <el-table-column label="在库数量" align="center" prop="quantity" min-width="100" />
+            <el-table-column
+              label="入库日期"
+              align="center"
+              prop="receiptTime"
+              :formatter="dateFormatter2"
+              width="180px"
+            />
+          </el-table>
+          <!-- 分页 -->
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </ContentWrap>
+      </el-col>
+    </el-row>
     <template #footer>
       <el-button type="primary" @click="confirmSelect">确 定</el-button>
       <el-button @click="dialogVisible = false">取 消</el-button>
@@ -119,10 +138,13 @@
 <script setup lang="ts">
 import { dateFormatter2 } from '@/utils/formatTime'
 import { WmMaterialStockApi, WmMaterialStockVO } from '@/api/mes/wm/materialstock'
+import { MdItemTypeVO } from '@/api/mes/md/item/type'
+import MdItemTypeTree from '@/views/mes/md/item/type/components/MdItemTypeTree.vue'
 import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
 import MdVendorSelect from '@/views/mes/md/vendor/components/MdVendorSelect.vue'
 import WmWarehouseSelect from '@/views/mes/wm/warehouse/components/WmWarehouseSelect.vue'
 import WmWarehouseLocationSelect from '@/views/mes/wm/warehouse/components/WmWarehouseLocationSelect.vue'
+import WmWarehouseAreaSelect from '@/views/mes/wm/warehouse/components/WmWarehouseAreaSelect.vue'
 
 defineOptions({ name: 'WmMaterialStockSelectDialog' })
 
@@ -148,6 +170,7 @@ const total = ref(0) // 总条数
 
 // ==================== 选中状态 ====================
 const tableRef = ref() // 表格 Ref
+const typeTreeRef = ref() // 分类树 Ref
 const selectedRows = ref<WmMaterialStockVO[]>([]) // 多选模式：选中行
 const selectedRadioId = ref<number>() // 单选模式：选中 ID
 const currentRadioRow = ref<WmMaterialStockVO>() // 单选模式：选中行对象
@@ -185,21 +208,37 @@ const handleRowDblClick = (row: WmMaterialStockVO) => {
   confirmSelect()
 }
 
+// ==================== 分类树 ====================
+
+/** 点击分类树节点，按分类筛选（支持取消选中） */
+const handleNodeClick = (data: MdItemTypeVO | undefined) => {
+  queryParams.itemTypeId = data?.id
+  handleQuery()
+}
+
 // ==================== 库存查询 ====================
 const queryParams = reactive({
   pageNo: 1, // 页码
   pageSize: 10, // 每页条数
+  itemTypeId: undefined as number | undefined, // 物料分类编号
   itemId: undefined as number | undefined, // 物料编号
   vendorId: undefined as number | undefined, // 供应商编号
   batchCode: undefined as string | undefined, // 批次号
   warehouseId: undefined as number | undefined, // 仓库编号
   locationId: undefined as number | undefined, // 库区编号
+  areaId: undefined as number | undefined, // 库位编号
   frozen: false as boolean | undefined // 默认只查未冻结
 })
 
-/** 仓库切换时清空库区 */
+/** 仓库切换时清空库区、库位 */
 const handleWarehouseChange = () => {
   queryParams.locationId = undefined
+  queryParams.areaId = undefined
+}
+
+/** 库区切换时清空库位 */
+const handleLocationChange = () => {
+  queryParams.areaId = undefined
 }
 
 /** 查询库存列表 */
@@ -246,13 +285,16 @@ const handleQuery = () => {
   getList()
 }
 
-/** 重置查询条件 */
+/** 重置查询条件（同步清除左侧树高亮和搜索词） */
 const resetQuery = () => {
+  queryParams.itemTypeId = undefined
   queryParams.itemId = props.itemId // 保持 props 传入的物料过滤
   queryParams.vendorId = undefined
   queryParams.batchCode = undefined
   queryParams.warehouseId = undefined
   queryParams.locationId = undefined
+  queryParams.areaId = undefined
+  typeTreeRef.value?.reset()
   handleQuery()
 }
 
@@ -280,15 +322,19 @@ const confirmSelect = () => {
 const open = async (selectedIds?: number[]) => {
   dialogVisible.value = true
   // 重置查询条件 + 页码，避免二次打开继承上次过滤上下文
+  queryParams.itemTypeId = undefined
   queryParams.vendorId = undefined
   queryParams.batchCode = undefined
   queryParams.warehouseId = undefined
   queryParams.locationId = undefined
+  queryParams.areaId = undefined
   queryParams.pageNo = 1
   // 固定 itemId 过滤条件（从 props 传入）
   queryParams.itemId = props.itemId
   // 默认只查未冻结
   queryParams.frozen = false
+  // 重置分类树（清高亮 + 清搜索词）
+  typeTreeRef.value?.reset()
   // 清空上一次的选中状态
   selectedRows.value = []
   selectedRadioId.value = undefined