From a6c21fd31331c29306c06ac172bd15e82e357aa2 Mon Sep 17 00:00:00 2001
From: yueli <yueli@example.com>
Date: Mon, 31 Aug 2026 14:05:46 +0800
Subject: [PATCH] =?UTF-8?q?style(purchase):=20=E5=88=97=E8=A1=A8=E5=AE=BD?=
 =?UTF-8?q?=E5=BA=A6=E4=BC=98=E5=8C=96=20+=20=E7=89=A9=E5=93=81=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E5=90=8D=E7=A7=B0=E8=B4=A7=E5=8F=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 主表格/展开明细表格加 width:100% + fit
- 自适应列用 min-width（批次号/物品），固定列保留 width（金额/日期/操作）
- 批次主行物品列：单个显示 名称+货号，多个显示 'N 种物料'
- 展开明细物品列：名称+货号 合并显示
---
 inventory-web/src/views/purchase/index.vue | 28 +++++++++++++++-------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/inventory-web/src/views/purchase/index.vue b/inventory-web/src/views/purchase/index.vue
index 018326d..3458ccb 100644
--- a/inventory-web/src/views/purchase/index.vue
+++ b/inventory-web/src/views/purchase/index.vue
@@ -18,16 +18,21 @@
     </div>
 
     <!-- ★ 按批次分组的列表 -->
-    <el-table v-loading="loading" :data="list" border stripe style="margin-top: 16px;" row-key="batchKey">
+    <el-table v-loading="loading" :data="list" border stripe fit style="width: 100%; margin-top: 16px;" row-key="batchKey">
       <!-- ★ 展开/收起 + 批次信息 -->
       <el-table-column type="expand" width="50" align="center">
         <template #default="{ row }">
           <div style="padding: 12px 24px; background: #f5f7fa;">
             <div style="font-weight: bold; margin-bottom: 8px;">批次明细（{{ row.itemCount }} 项）</div>
-            <el-table :data="row.items" border size="small" style="width: 100%;">
-              <el-table-column prop="request_no" label="申请单号" width="200" />
-              <el-table-column prop="name" label="采购物品" min-width="140" show-overflow-tooltip />
-              <el-table-column prop="spec_model" label="规格型号" min-width="120" show-overflow-tooltip />
+            <el-table :data="row.items" border fit size="small" style="width: 100%;">
+              <el-table-column prop="request_no" label="申请单号" min-width="200" show-overflow-tooltip />
+              <!-- ★ 采购物品：显示 名称+货号 -->
+              <el-table-column label="采购物品" min-width="180" show-overflow-tooltip>
+                <template #default="{ row: it }">
+                  <span>{{ it.name }}</span>
+                  <span v-if="it.spec_model" style="color:#909399; font-size:12px; margin-left:6px;">{{ it.spec_model }}</span>
+                </template>
+              </el-table-column>
               <el-table-column prop="quantity" label="数量" width="70" align="center" />
               <el-table-column prop="purchase_date" label="采购日期" width="110" />
               <el-table-column v-if="userStore.hasPermission('inbound_purchase:unit_price')" label="单价" width="90" align="right">
@@ -60,16 +65,23 @@
       </el-table-column>
 
       <!-- 批次主行 -->
-      <el-table-column label="批次号" width="220">
+      <el-table-column label="批次号" min-width="200">
         <template #default="{ row }">
           <el-link type="primary" :underline="false" @click="openBatchDialog(row.batchKey)">
             {{ row.batchKey }}
           </el-link>
         </template>
       </el-table-column>
-      <el-table-column label="物品" width="70" align="center">
+      <!-- ★ 物品列：单个显示 名称+货号，多个显示数量 -->
+      <el-table-column label="采购物品" min-width="200" show-overflow-tooltip>
         <template #default="{ row }">
-          <el-tag size="small" type="info">{{ row.itemCount }} 项</el-tag>
+          <template v-if="row.itemCount === 1">
+            <span>{{ row.items[0].name }}</span>
+            <span v-if="row.items[0].spec_model" style="color:#909399; font-size:12px; margin-left:6px;">{{ row.items[0].spec_model }}</span>
+          </template>
+          <template v-else>
+            <el-tag size="small" type="info">{{ row.itemCount }} 种物料</el-tag>
+          </template>
         </template>
       </el-table-column>
       <el-table-column v-if="userStore.hasPermission('inbound_purchase:total_price')" label="批次总价" width="120" align="right">