From 44abffdc3e07917282d958b4f88faacdbcc4d998 Mon Sep 17 00:00:00 2001
From: hwj <huangweijie@gdngsk.com>
Date: Wed, 24 Jun 2026 17:55:54 +0800
Subject: [PATCH] =?UTF-8?q?style=EF=BC=9A=E5=BA=93=E5=AD=98=E6=9F=A5?=
 =?UTF-8?q?=E8=AF=A2-=E5=BA=93=E5=8C=BA=E5=BA=93=E5=AD=98=E5=88=97?=
 =?UTF-8?q?=E5=AD=97=E6=AE=B5=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/erp/stock/stock/index.vue | 85 ++++++-----------------------
 1 file changed, 17 insertions(+), 68 deletions(-)

diff --git a/src/views/erp/stock/stock/index.vue b/src/views/erp/stock/stock/index.vue
index 9f3c577d..e8e15614 100644
--- a/src/views/erp/stock/stock/index.vue
+++ b/src/views/erp/stock/stock/index.vue
@@ -117,36 +117,19 @@
       </el-table-column>
       <el-table-column :label="t('ErpStock.Stock.areaStockDisplay')" align="center" min-width="260">
         <template #default="{ row }">
-          <el-popover
+          <div
             v-if="getAreaStockDisplayList(row.areaStocks).length"
-            trigger="hover"
-            placement="top"
-            width="320"
+            class="area-stock-list"
+            :style="getStockDisplayStyle(row.categoryType)"
           >
-            <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
+              v-for="item in getAreaStockDisplayList(row.areaStocks)"
+              :key="item"
+              class="area-stock-list__item"
+            >
+              {{ item }}
             </div>
-          </el-popover>
+          </div>
           <span v-else>-</span>
         </template>
       </el-table-column>
@@ -244,8 +227,6 @@ 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
@@ -253,14 +234,6 @@ const getAreaStockDisplayList = (value: StockVO['areaStocks']) => {
     .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)) {
@@ -399,40 +372,16 @@ onMounted(async () => {
   white-space: nowrap;
 }
 
-.area-stock-summary {
-  display: inline-flex;
+.area-stock-list {
+  display: flex;
+  flex-direction: column;
   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;
+  gap: 4px;
   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;
+.area-stock-list__item {
+  max-width: 100%;
+  word-break: break-all;
 }
 </style>