From 08c921fe6685c4d1a2ccef7129bf112cae36f125 Mon Sep 17 00:00:00 2001
From: DXC <duxingchen@iris-rs.cn>
Date: Mon, 23 Mar 2026 14:38:08 +0800
Subject: [PATCH] feat: standardize default page size to 20, add pagination to
 pick list, and fix table horizontal scrollbar visibility

---
 .../src/views/outbound/Selection.vue          | 23 ++++++++++++++++++-
 inventory-web/src/views/stock/inbound/buy.vue |  5 ++--
 .../src/views/stock/inbound/product.vue       | 15 ++++++++++--
 .../src/views/stock/inbound/semi.vue          |  5 ++--
 4 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/inventory-web/src/views/outbound/Selection.vue b/inventory-web/src/views/outbound/Selection.vue
index 9b3e6f3..e98de10 100644
--- a/inventory-web/src/views/outbound/Selection.vue
+++ b/inventory-web/src/views/outbound/Selection.vue
@@ -106,7 +106,7 @@
       </div>
       <el-table
           ref="manualTableRef"
-          :data="filteredStockData"
+          :data="paginatedStockData"
           height="500"
           border
           row-key="uniqueKey"
@@ -141,6 +141,17 @@
           </template>
         </el-table-column>
       </el-table>
+      <el-pagination
+          style="margin-top: 12px; justify-content: flex-end; display: flex;"
+          v-model:current-page="stockPage"
+          v-model:page-size="stockPageSize"
+          :total="filteredStockData.length"
+          :page-sizes="[20, 50, 100, 200]"
+          layout="total, prev, pager, next"
+          background
+          @size-change="() => { stockPage = 1 }"
+          @current-change="() => {}"
+      />
       <template #footer>
           <span style="float: left; line-height: 32px; color: #909399;">
              已勾选 {{ tempSelection.length }} 项
@@ -338,6 +349,8 @@ const allStockData = ref<any[]>([])
 const filteredStockData = ref<any[]>([])
 const searchKeyword = ref('')
 const tempSelection = ref<any[]>([])
+const stockPage = ref(1)
+const stockPageSize = ref(20)
 
 // 表格引用
 const manualTableRef = ref<InstanceType<typeof ElTable>>()
@@ -414,6 +427,12 @@ const shortageList = computed(() => {
 
 const hasShortage = computed(() => shortageList.value.length > 0 && bomSets.value > maxBuildableSets.value)
 
+// ★ 出库选单分页数据（固定 height="500" 时仍需分页减轻渲染压力）
+const paginatedStockData = computed(() => {
+  const start = (stockPage.value - 1) * stockPageSize.value
+  return filteredStockData.value.slice(start, start + stockPageSize.value)
+})
+
 // --- 辅助方法 ---
 const getTypeTag = (type: string) => {
   switch (type) {
@@ -428,6 +447,7 @@ const getTypeTag = (type: string) => {
 
 const openManualSelect = async () => {
   manualDialogVisible.value = true
+  stockPage.value = 1
 
   if (allStockData.value.length === 0) {
     try {
@@ -461,6 +481,7 @@ const openManualSelect = async () => {
 }
 
 const filterStock = () => {
+  stockPage.value = 1
   const kw = searchKeyword.value.trim().toLowerCase()
   if (!kw) {
     filteredStockData.value = allStockData.value
diff --git a/inventory-web/src/views/stock/inbound/buy.vue b/inventory-web/src/views/stock/inbound/buy.vue
index 604adb1..c42924c 100644
--- a/inventory-web/src/views/stock/inbound/buy.vue
+++ b/inventory-web/src/views/stock/inbound/buy.vue
@@ -139,6 +139,7 @@
         highlight-current-row
         header-cell-class-name="table-header-gray"
         @sort-change="handleSortChange"
+        height="calc(100vh - 300px)"
     >
       <template v-for="col in allColumns" :key="col.prop">
         <el-table-column
@@ -239,7 +240,7 @@
         v-model:current-page="queryParams.page"
         v-model:page-size="queryParams.pageSize"
         :total="total"
-        :page-sizes="[100, 200, 500, 1000]"
+        :page-sizes="[20, 50, 100, 200]"
         layout="total, sizes, prev, pager, next, jumper"
         background
         @size-change="fetchData"
@@ -794,7 +795,7 @@ const companyOptions = ref<string[]>([])
 
 const queryParams = reactive({
   page: 1,
-  pageSize: 50,
+  pageSize: 20,
   keyword: '',
   searchField: 'all',
   sku: '',
diff --git a/inventory-web/src/views/stock/inbound/product.vue b/inventory-web/src/views/stock/inbound/product.vue
index 3d5240a..1f28615 100644
--- a/inventory-web/src/views/stock/inbound/product.vue
+++ b/inventory-web/src/views/stock/inbound/product.vue
@@ -143,6 +143,7 @@
         header-cell-class-name="table-header-gray"
         @sort-change="handleSortChange"
         :key="hasColumnPermission('sn_bn') ? 'sn' : 'nosn'"
+        height="calc(100vh - 300px)"
     >
       <template v-for="col in allColumns" :key="col.prop">
         <el-table-column
@@ -231,7 +232,17 @@
       </el-table-column>
     </el-table>
 
-    <el-pagination class="pagination-bar" v-model:current-page="queryParams.page" v-model:page-size="queryParams.pageSize" :total="total" layout="total, sizes, prev, pager, next" background @change="fetchData" />
+    <el-pagination
+        class="pagination-bar"
+        v-model:current-page="queryParams.page"
+        v-model:page-size="queryParams.pageSize"
+        :total="total"
+        :page-sizes="[20, 50, 100, 200]"
+        layout="total, sizes, prev, pager, next, jumper"
+        background
+        @size-change="fetchData"
+        @current-change="fetchData"
+    />
 
     <el-dialog v-model="visible" :title="dialogStatus === 'create' ? '成品入库' : '编辑成品'" width="min(1000px, 95vw)" top="5vh" :close-on-click-modal="!isUploading" :close-on-press-escape="!isUploading" :show-close="!isUploading" class="stylish-dialog compact-layout">
       <div class="dialog-scroll-container">
@@ -615,7 +626,7 @@ const formRef = ref()
 // 上传锁定状态
 const isUploading = ref(false)
 
-const queryParams = reactive({ page: 1, pageSize: 50, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
+const queryParams = reactive({ page: 1, pageSize: 20, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
 const categoryOptions = ref<string[]>([])
 const typeOptions = ref<string[]>([])
 const companyOptions = ref<string[]>([]) // [新增]
diff --git a/inventory-web/src/views/stock/inbound/semi.vue b/inventory-web/src/views/stock/inbound/semi.vue
index 728148d..1327765 100644
--- a/inventory-web/src/views/stock/inbound/semi.vue
+++ b/inventory-web/src/views/stock/inbound/semi.vue
@@ -155,6 +155,7 @@
         highlight-current-row
         header-cell-class-name="table-header-gray"
         @sort-change="handleSortChange"
+        height="calc(100vh - 300px)"
     >
       <template v-for="col in allColumns" :key="col.prop">
         <el-table-column
@@ -263,7 +264,7 @@
         v-model:current-page="queryParams.page"
         v-model:page-size="queryParams.pageSize"
         :total="total"
-        :page-sizes="[100, 200, 500, 1000]"
+        :page-sizes="[20, 50, 100, 200]"
         layout="total, sizes, prev, pager, next, jumper"
         background
         @size-change="fetchData"
@@ -684,7 +685,7 @@ const formRef = ref()
 // 上传锁定状态
 const isUploading = ref(false)
 
-const queryParams = reactive({ page: 1, pageSize: 50, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
+const queryParams = reactive({ page: 1, pageSize: 20, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
 const categoryOptions = ref<string[]>([])
 const typeOptions = ref<string[]>([])
 const companyOptions = ref<string[]>([]) // [新增]