style：库存查询添加库区库存、总包数、总个数字段

src/api/erp/stock/stock/index.ts

@@ -22,6 +22,16 @@ export interface StockVO {
   packagingRule?: string
   // 库存展示
   stockDisplay?: string
+  areaStocks?: Array<{
+    areaId?: number
+    areaName?: string
+    count?: number
+    packageCount?: number
+    baseCount?: number
+    stockDisplay?: string
+  }>
+  totalPackageCount?: number
+  totalBaseCount?: number
   // 库存数量
   count: number
   latestInTime?: number | string

src/locales/en.ts

@@ -416,6 +416,9 @@ export default {
       area: 'Area',
       packagingRule: 'Packaging / Conversion Rule',
       stockDisplay: 'Stock Display',
+      areaStockDisplay: 'Area Stock',
+      totalPackageCount: 'Total Packages',
+      totalBaseCount: 'Total Base Count',
       unit: 'Unit',
       count: 'Base Quantity',
       latestInTime: 'Latest Inbound',

src/locales/zh-CN.ts

@@ -416,6 +416,9 @@ export default {
       area: '库区',
       packagingRule: '包装/换算规则',
       stockDisplay: '库存展示',
+      areaStockDisplay: '库区库存',
+      totalPackageCount: '总包数',
+      totalBaseCount: '总个数',
       unit: '单位',
       count: '基本数量',
       latestInTime: '最近入库',

src/views/erp/stock/stock/index.vue

@@ -97,7 +97,6 @@
       <el-table-column :label="t('ErpStock.Stock.subCategory')" align="center" prop="categoryName" min-width="120" sortable />
       <el-table-column :label="t('ErpStock.Stock.packagingRule')" align="center" prop="packagingRule" min-width="180" />
       <el-table-column :label="t('ErpStock.Stock.warehouse')" align="center" prop="warehouseName" min-width="140" sortable />
-      <el-table-column :label="t('ErpStock.Stock.area')" align="center" prop="areaName" min-width="120" sortable />
       <el-table-column :label="t('ErpStock.Stock.stockDisplay')" align="center" prop="stockDisplay" min-width="220">
         <template #default="{ row }">
           <span
@@ -116,6 +115,51 @@
           <span v-else>-</span>
         </template>
       </el-table-column>
+      <el-table-column :label="t('ErpStock.Stock.areaStockDisplay')" align="center" min-width="260">
+        <template #default="{ row }">
+          <el-popover
+            v-if="getAreaStockDisplayList(row.areaStocks).length"
+            trigger="hover"
+            placement="top"
+            width="320"
+          >
+            <template #reference>
+              <span class="area-stock-summary" :style="getStockDisplayStyle(row.categoryType)">
+                <span
+                  v-for="item in getVisibleAreaStockDisplayList(row.areaStocks)"
+                  :key="item"
+                  class="area-stock-tag"
+                >
+                  {{ item }}
+                </span>
+                <span v-if="getHiddenAreaStockCount(row.areaStocks)" class="area-stock-more">
+                  +{{ getHiddenAreaStockCount(row.areaStocks) }}
+                </span>
+              </span>
+            </template>
+            <div class="area-stock-detail">
+              <div
+                v-for="item in getAreaStockDisplayList(row.areaStocks)"
+                :key="item"
+                class="area-stock-detail__item"
+              >
+                {{ item }}
+              </div>
+            </div>
+          </el-popover>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column :label="t('ErpStock.Stock.totalPackageCount')" align="center" sortable prop="totalPackageCount" min-width="120">
+        <template #default="{ row }">
+          {{ formatStockCount(row.totalPackageCount) }}
+        </template>
+      </el-table-column>
+      <el-table-column :label="t('ErpStock.Stock.totalBaseCount')" align="center" sortable prop="totalBaseCount" min-width="120">
+        <template #default="{ row }">
+          {{ formatStockCount(row.totalBaseCount) }}
+        </template>
+      </el-table-column>
       <el-table-column :label="t('ErpStock.Stock.count')" align="center" sortable prop="count" min-width="120">
         <template #default="{ row }">
           {{ formatStockCount(row.count) }}
@@ -200,6 +244,23 @@ const formatStockDisplay = (value: string | undefined) => {
     .filter(Boolean)
 }
 
+const AREA_STOCK_VISIBLE_COUNT = 2
+
+const getAreaStockDisplayList = (value: StockVO['areaStocks']) => {
+  if (!Array.isArray(value)) return []
+  return value
+    .map((item) => item?.stockDisplay?.trim())
+    .filter((item): item is string => Boolean(item))
+}
+
+const getVisibleAreaStockDisplayList = (value: StockVO['areaStocks']) => {
+  return getAreaStockDisplayList(value).slice(0, AREA_STOCK_VISIBLE_COUNT)
+}
+
+const getHiddenAreaStockCount = (value: StockVO['areaStocks']) => {
+  return Math.max(getAreaStockDisplayList(value).length - AREA_STOCK_VISIBLE_COUNT, 0)
+}
+
 const getStockDisplayStyle = (categoryType: number | string | undefined) => {
   const dict = getDictObj(DICT_TYPE.MATERIAL_CLASSIFICATION_TYPE, categoryType)
   if (dict?.cssClass && isHexColor(dict.cssClass)) {
@@ -326,4 +387,41 @@ onMounted(async () => {
 .stock-display__item {
   white-space: nowrap;
 }
+
+.area-stock-summary {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  max-width: 100%;
+  vertical-align: middle;
+}
+
+.area-stock-tag {
+  max-width: 108px;
+  padding: 1px 6px;
+  overflow: hidden;
+  line-height: 20px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  background: var(--el-fill-color-light);
+  border: 1px solid var(--el-border-color-light);
+  border-radius: 4px;
+}
+
+.area-stock-more {
+  flex-shrink: 0;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.area-stock-detail {
+  max-height: 260px;
+  overflow-y: auto;
+  line-height: 22px;
+}
+
+.area-stock-detail__item + .area-stock-detail__item {
+  margin-top: 6px;
+}
 </style>