refactor(wms): 优化库存报警页面展示和分页逻辑

- 移除批次码、库位编码和仓库名称等不必要字段
- 添加物料编码和物料名称字段
- 修改库存上下限字段名称
- 优化表格样式和布局
- 重构分页逻辑，使用前端本地分页- 更新API调用，使用新的getListInventoryAlarm接口

src/views/wms/inventoryAlarm/index.vue

@@ -72,18 +72,21 @@
           <el-col :span="1.5">
             <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:inventory:export']">导出</el-button>
           </el-col>
-          <right-toolbar v-model:showSearch="showSearch" :columns="columns" :search="true" @queryTable="getList"></right-toolbar>
+          <right-toolbar v-model:showSearch="showSearch" :search="true" @queryTable="getList"></right-toolbar>
         </el-row>
       </template>
 
-      <el-table v-loading="loading" :data="inventoryList" @selection-change="handleSelectionChange" :row-class-name="getRowClass">
+      <el-table v-loading="loading" :data="displayList" @selection-change="handleSelectionChange" :row-class-name="getRowClass" row-key="materialId">
         <el-table-column type="selection" width="55" align="center" />
         <!-- <el-table-column label="表主键" align="center" prop="inventoryId" v-if="columns[0].visible"/> -->
-        <el-table-column label="批次码" align="center" prop="batchCode" v-if="columns[2].visible"/>
+        <!-- 聚合查询后批次码为空，隐藏 -->
+        <!-- <el-table-column label="批次码" align="center" prop="batchCode" v-if="columns[2].visible"/> -->
         <!-- <el-table-column label="物料id" align="center" prop="materialId" v-if="columns[3].visible"/> -->
-        <el-table-column label="库位编码" align="center" prop="locationCode" v-if="columns[4].visible"/>
+        <!-- 聚合查询后库位编码为空，隐藏 -->
-        <el-table-column label="物料" align="center" prop="materialName" v-if="columns[6].visible"/>
+        <!-- <el-table-column label="库位编码" align="center" prop="locationCode" v-if="columns[4].visible"/> -->
-        <el-table-column label="库存数量" align="center" prop="inventoryQty" v-if="columns[6].visible">
+        <el-table-column label="物料编码" align="center" prop="materialCode" />
+        <el-table-column label="物料名称" align="center" prop="materialName" />
+        <el-table-column label="库存数量" align="center" prop="inventoryQty" >
           <template #default="scope">
             <el-tooltip
               v-if="scope.row.inventoryQty > scope.row.maxStockAmount || scope.row.inventoryQty < scope.row.minStockAmount"
@@ -95,19 +98,20 @@
             <span v-else>{{ scope.row.inventoryQty }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="锁定状态" align="center" prop="lockState" v-if="columns[8].visible">
+        <el-table-column label="锁定状态" align="center" prop="lockState" >
           <template #default="scope">
             <dict-tag :options="lock_state" :value="scope.row.lockState"/>
           </template>
         </el-table-column>
-        <el-table-column label="库存状态" align="center" prop="inventoryStatus" v-if="columns[9].visible">
+        <el-table-column label="库存状态" align="center" prop="inventoryStatus" >
           <template #default="scope">
             <dict-tag :options="inventory_status" :value="scope.row.inventoryStatus"/>
           </template>
         </el-table-column>
-        <el-table-column label="仓库" align="center" prop="warehouseName" v-if="columns[10].visible"/>
+        <!-- 聚合查询后仓库名称为空，隐藏 -->
-        <el-table-column label="上限" align="center" prop="maxStockAmount"/>
+        <!-- <el-table-column label="仓库" align="center" prop="warehouseName" v-if="columns[10].visible"/> -->
-        <el-table-column label="下限" align="center" prop="minStockAmount"/>
+        <el-table-column label="库存下限" align="center" prop="minStockAmount"/>
+        <el-table-column label="库存上限" align="center" prop="maxStockAmount"/>
         <!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
           <template #default="scope">
             <el-tooltip content="修改" placement="top">
@@ -120,8 +124,9 @@
         </el-table-column> -->
       </el-table>
 
-      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="handleLocalPagination" />
     </el-card>
+
     <!-- 添加或修改物料库存对话框 -->
     <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
       <el-form ref="inventoryFormRef" :model="form" :rules="rules" label-width="80px">
@@ -177,7 +182,7 @@
 </template>
 
 <script setup name="Inventory" lang="ts">
-import { listInventory, getInventory, delInventory, addInventory, updateInventory, listInventoryAlarm } from '@/api/wms/inventory';
+import { listInventory, getInventory, delInventory, addInventory, updateInventory, getListInventoryAlarm } from '@/api/wms/inventory';
 import { InventoryVO, InventoryQuery, InventoryForm } from '@/api/wms/inventory/types';
 import {getBaseWarehouseList} from "@/api/wms/baseWarehouse";
 
@@ -203,22 +208,22 @@ const dialog = reactive<DialogOption>({
 });
 
 // 列显隐信息
-const columns = ref<FieldOption[]>([
+// const columns = ref<FieldOption[]>([
-        { key: 0, label: `表主键`, visible: false },
+//         { key: 0, label: `表主键`, visible: false },
-        { key: 1, label: `租户号`, visible: true },
+//         { key: 1, label: `租户号`, visible: true },
-        { key: 2, label: `批次码`, visible: true },
+//         { key: 2, label: `批次码`, visible: false },
-        { key: 3, label: `物料`, visible: true },
+//         { key: 3, label: `物料`, visible: true },
-        { key: 4, label: `库位编码`, visible: true },
+//         { key: 4, label: `库位编码`, visible: false },
-        { key: 5, label: `物料大类`, visible: false },
+//         { key: 5, label: `物料大类`, visible: false },
-        { key: 6, label: `库存数量`, visible: true },
+//         { key: 6, label: `库存数量`, visible: true },
-        { key: 7, label: `更新时间`, visible: true },
+//         { key: 7, label: `更新时间`, visible: true },
-        { key: 8, label: `锁定状态`, visible: true },
+//         { key: 8, label: `锁定状态`, visible: true },
-        { key: 9, label: `库存状态`, visible: true },
+//         { key: 9, label: `库存状态`, visible: true },
-        { key: 10, label: `仓库`, visible: true },
+//         { key: 10, label: `仓库`, visible: false },
-        // { key: 11, label: `${comment}`, visible: true },
+//         // { key: 11, label: `${comment}`, visible: true },
-        // { key: 12, label: `${comment}`, visible: true },
+//         // { key: 12, label: `${comment}`, visible: true },
-        // { key: 13, label: `${comment}`, visible: true },
+//         // { key: 13, label: `${comment}`, visible: true },
-]);
+// ]);
 
 const initFormData: InventoryForm = {
   inventoryId: undefined,
@@ -288,12 +293,12 @@ const getBaseWarehouseListsss = async () => {
   let res = await getBaseWarehouseList(null);
   baseStoreList.value = res.data;
 };
-/** 查询物料库存告警列表 */
+/** 查询物料库存告警列表（不分页） */
 const getList = async () => {
   loading.value = true;
-  const res = await listInventoryAlarm(queryParams.value);
+  const res = await getListInventoryAlarm(queryParams.value);
-  inventoryList.value = res.rows;
+  inventoryList.value = res.data ?? [];
-  total.value = res.total;
+  total.value = inventoryList.value.length;
   loading.value = false;
 }
 
@@ -399,6 +404,20 @@ onMounted(() => {
   getBaseWarehouseListsss();
   getList();
 });
+
+// 前端分页显示数据
+const displayList = computed(() => {
+  const page = queryParams.value.pageNum || 1;
+  const size = queryParams.value.pageSize || 10;
+  const start = (page - 1) * size;
+  const end = start + size;
+  return inventoryList.value.slice(start, end);
+});
+
+// 本地分页事件处理（无需重新请求后端，依赖v-model更新computed展示）
+const handleLocalPagination = () => {
+  // no-op
+};
 </script>
 
 <style scoped>