refactor(ui): 优化数据加载逻辑和缓存处理

- 移除不必要的初始化数据加载，保留关键数据请求
- 重构产品/原材料信息组件，改用计算属性替代watch
- 分批加载产品/原材料数据，避免大请求阻塞
- 为数据加载添加loading状态提示
- 优化统计面板数据加载方式，改为顺序请求

klp-ui/src/store/modules/category.js

@@ -48,38 +48,104 @@ const actions = {
     });
   },
   getProductMap({ state, commit }) {
+    // 若已有缓存数据，直接返回
     if (Object.keys(state.productMap).length > 0) {
       return Promise.resolve(state.productMap);
     }
-    return listProduct({ pageNum: 1, pageSize: 10000 }).then(res => {
-      const map = {};
-      res.rows.forEach(item => {
-        map[item.productId] = item;
+
+    const pageSize = 2000; // 每次获取2000条
+    const allRows = []; // 存储所有批次的列表数据
+    const productMap = {}; // 最终的产品映射表
+
+    // 异步处理分批次获取逻辑
+    const fetchAllProducts = async () => {
+      // 1. 获取第一页数据，拿到总条数total
+      let currentPage = 1;
+      const firstRes = await listProduct({ pageNum: currentPage, pageSize });
+      const total = firstRes.total || 0;
+      const firstRows = firstRes.rows || [];
+
+      // 处理第一页数据
+      allRows.push(...firstRows);
+      firstRows.forEach(item => {
+        productMap[item.productId.toString()] = item;
       });
-      commit('SET_PRODUCT_MAP', map);
-      commit('SET_PRODUCT_LIST', res.rows || []);
-      return map;
-    });
+
+      // 2. 计算总页数，循环获取剩余页面数据
+      const totalPages = Math.ceil(total / pageSize);
+      for (currentPage = 2; currentPage <= totalPages; currentPage++) {
+        const res = await listProduct({ pageNum: currentPage, pageSize });
+        const rows = res.rows || [];
+
+        // 合并当前页数据到总列表和映射表
+        allRows.push(...rows);
+        rows.forEach(item => {
+          productMap[item.productId.toString()] = item;
+        });
+      }
+
+      // 3. 所有数据获取完成后，更新状态
+      commit('SET_PRODUCT_MAP', productMap);
+      commit('SET_PRODUCT_LIST', allRows);
+
+      return productMap;
+    };
+
+    // 返回Promise，确保外部可通过.then获取结果
+    return fetchAllProducts();
   },
   getRawMaterialMap({ state, commit }) {
+    // 若已有缓存数据，直接返回
     if (Object.keys(state.rawMaterialMap).length > 0) {
       return Promise.resolve(state.rawMaterialMap);
     }
-    return listRawMaterial({ pageNum: 1, pageSize: 10000 }).then(res => {
-      const map = {};
-      res.rows.forEach(item => {
-        map[item.rawMaterialId] = item;
+
+    const pageSize = 2000; // 每次获取2000条
+    const allRows = []; // 存储所有批次的原材料列表
+    const rawMaterialMap = {}; // 最终的原材料映射表
+
+    // 异步处理分批次获取逻辑
+    const fetchAllRawMaterials = async () => {
+      // 1. 获取第一页数据，拿到总条数total
+      let currentPage = 1;
+      const firstRes = await listRawMaterial({ pageNum: currentPage, pageSize });
+      const total = firstRes.total || 0;
+      const firstRows = firstRes.rows || [];
+
+      // 处理第一页数据
+      allRows.push(...firstRows);
+      firstRows.forEach(item => {
+        rawMaterialMap[item.rawMaterialId.toString()] = item;
       });
-      commit('SET_RAW_MATERIAL_MAP', map);
-      commit('SET_RAW_MATERIAL_LIST', res.rows || []);
-      return map;
-    });
+
+      // 2. 计算总页数，循环获取剩余页面数据
+      const totalPages = Math.ceil(total / pageSize);
+      for (currentPage = 2; currentPage <= totalPages; currentPage++) {
+        const res = await listRawMaterial({ pageNum: currentPage, pageSize });
+        const rows = res.rows || [];
+
+        // 合并当前页数据到总列表和映射表
+        allRows.push(...rows);
+        rows.forEach(item => {
+          rawMaterialMap[item.rawMaterialId.toString()] = item;
+        });
+      }
+
+      // 3. 所有数据获取完成后，更新状态
+      commit('SET_RAW_MATERIAL_MAP', rawMaterialMap);
+      commit('SET_RAW_MATERIAL_LIST', allRows);
+
+      return rawMaterialMap;
+    };
+
+    // 返回Promise，确保外部可通过.then获取结果
+    return fetchAllRawMaterials();
   },
   getBomMap({ state, commit }) {
     if (Object.keys(state.bomMap).length > 0) {
       return Promise.resolve(state.bomMap);
     }
-    return listBomItem({ pageNum: 1, pageSize: 10000 }).then(res => {
+    return listBomItem({ pageNum: 1, pageSize: 100000 }).then(res => {
       console.log('bomItem', res)
       const map = {};
       res.rows.forEach(item => {
@@ -115,9 +181,9 @@ export function findItemWithBom(itemType, itemId) {
     return null;
   }
   const bomItems = state.bomMap[bomId];
-  
-  return { 
-    ...item, 
+
+  return {
+    ...item,
     boms: bomItems || [],
     itemName: itemType === 'product' ? item.productName : item.rawMaterialName,
     itemType,