From 3287fa3770c5f06a558e4296d123026c316e54f7 Mon Sep 17 00:00:00 2001
From: hwj <huangweijie@gdngsk.com>
Date: Tue, 3 Feb 2026 14:06:37 +0800
Subject: [PATCH] =?UTF-8?q?style=EF=BC=9A=E4=BB=93=E5=82=A8=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86-=E5=85=A5=E5=BA=93/=E5=87=BA=E5=BA=93-=E4=BA=A7?=
 =?UTF-8?q?=E5=93=81=E5=90=8D=E7=A7=B0=E4=B8=8B=E6=8B=89=E6=A1=86=E6=94=B9?=
 =?UTF-8?q?=E4=B8=BA=E7=BA=A7=E8=81=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../stock/in/components/StockInItemForm.vue   | 45 +++++++++++++++----
 .../stock/out/components/StockOutItemForm.vue | 45 +++++++++++++++----
 2 files changed, 72 insertions(+), 18 deletions(-)

diff --git a/src/views/erp/stock/in/components/StockInItemForm.vue b/src/views/erp/stock/in/components/StockInItemForm.vue
index 35129660..0dd20319 100644
--- a/src/views/erp/stock/in/components/StockInItemForm.vue
+++ b/src/views/erp/stock/in/components/StockInItemForm.vue
@@ -37,20 +37,17 @@
       <el-table-column label="产品名称" min-width="180">
         <template #default="{ row, $index }">
           <el-form-item :prop="`${$index}.productId`" :rules="formRules.productId" class="mb-0px!">
-            <el-select
+            <el-cascader
               v-model="row.productId"
+              :options="productCascaderOptions"
+              :props="productCascaderProps"
+              :show-all-levels="false"
               clearable
               filterable
               @change="onChangeProduct($event, row)"
               placeholder="请选择产品"
-            >
-              <el-option
-                v-for="item in productList"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
-              />
-            </el-select>
+              class="!w-100%"
+            />
           </el-form-item>
         </template>
       </el-table-column>
@@ -156,6 +153,36 @@ const productList = ref<ProductVO[]>([]) // 产品列表
 const warehouseList = ref<WarehouseVO[]>([]) // 仓库列表
 const defaultWarehouse = ref<WarehouseVO>(undefined) // 默认仓库
 
+const productCascaderProps = {
+  emitPath: false,
+  value: 'value',
+  label: 'label',
+  children: 'children'
+}
+
+const productCascaderOptions = computed(() => {
+  const map = new Map<number | string, { value: number | string; label: string; children: any[] }>()
+  for (const item of productList.value) {
+    const categoryKey = item.categoryId ?? item.categoryName ?? ''
+    const categoryLabel = item.categoryName ?? String(categoryKey)
+    if (!map.has(categoryKey)) {
+      map.set(categoryKey, {
+        value: categoryKey,
+        label: categoryLabel,
+        children: []
+      })
+    }
+    const group = map.get(categoryKey)
+    if (group) {
+      group.children.push({
+        value: item.id,
+        label: item.name
+      })
+    }
+  }
+  return Array.from(map.values())
+})
+
 /** 初始化设置入库项 */
 watch(
   () => props.items,
diff --git a/src/views/erp/stock/out/components/StockOutItemForm.vue b/src/views/erp/stock/out/components/StockOutItemForm.vue
index e8c4332b..86dd62f7 100644
--- a/src/views/erp/stock/out/components/StockOutItemForm.vue
+++ b/src/views/erp/stock/out/components/StockOutItemForm.vue
@@ -37,20 +37,17 @@
       <el-table-column label="产品名称" min-width="180">
         <template #default="{ row, $index }">
           <el-form-item :prop="`${$index}.productId`" :rules="formRules.productId" class="mb-0px!">
-            <el-select
+            <el-cascader
               v-model="row.productId"
+              :options="productCascaderOptions"
+              :props="productCascaderProps"
+              :show-all-levels="false"
               clearable
               filterable
               @change="onChangeProduct($event, row)"
               placeholder="请选择产品"
-            >
-              <el-option
-                v-for="item in productList"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
-              />
-            </el-select>
+              class="!w-100%"
+            />
           </el-form-item>
         </template>
       </el-table-column>
@@ -156,6 +153,36 @@ const productList = ref<ProductVO[]>([]) // 产品列表
 const warehouseList = ref<WarehouseVO[]>([]) // 仓库列表
 const defaultWarehouse = ref<WarehouseVO>(undefined) // 默认仓库
 
+const productCascaderProps = {
+  emitPath: false,
+  value: 'value',
+  label: 'label',
+  children: 'children'
+}
+
+const productCascaderOptions = computed(() => {
+  const map = new Map<number | string, { value: number | string; label: string; children: any[] }>()
+  for (const item of productList.value) {
+    const categoryKey = item.categoryId ?? item.categoryName ?? ''
+    const categoryLabel = item.categoryName ?? String(categoryKey)
+    if (!map.has(categoryKey)) {
+      map.set(categoryKey, {
+        value: categoryKey,
+        label: categoryLabel,
+        children: []
+      })
+    }
+    const group = map.get(categoryKey)
+    if (group) {
+      group.children.push({
+        value: item.id,
+        label: item.name
+      })
+    }
+  }
+  return Array.from(map.values())
+})
+
 /** 初始化设置出库项 */
 watch(
   () => props.items,