From 9d295992107fcd4a2310c6ab96ef59bdd6e39ab2 Mon Sep 17 00:00:00 2001
From: zhang96110 <zhang96110@users.noreply.gitee.com>
Date: Wed, 1 Apr 2026 09:20:48 +0000
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=80=97=E6=9D=90?=
 =?UTF-8?q?=E6=89=AB=E7=A0=81=E5=85=A5=E5=BA=93=E4=B8=8B=E6=8B=89=E6=A1=86?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E4=B8=8D=E5=85=A8=E5=92=8C=E6=90=9C=E7=B4=A2?=
 =?UTF-8?q?=E6=8A=A5=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增 allConsumablesForScan 获取全部活跃耗材，解决下拉框只显示分页数据
- Select 改用 optionFilterProp=label 替代 option.children.toLowerCase() 修复 TypeError
---
 frontend/src/pages/ConsumableManagement.jsx | 30 +++++++++++++++------
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/frontend/src/pages/ConsumableManagement.jsx b/frontend/src/pages/ConsumableManagement.jsx
index 74b3373..bdb4867 100644
--- a/frontend/src/pages/ConsumableManagement.jsx
+++ b/frontend/src/pages/ConsumableManagement.jsx
@@ -103,6 +103,7 @@ const animations = {
 
 function ConsumableManagement() {
   const [consumables, setConsumables] = useState([]);
+  const [allConsumablesForScan, setAllConsumablesForScan] = useState([]);
   const [loading, setLoading] = useState(true);
   const [modalVisible, setModalVisible] = useState(false);
   const [editingConsumable, setEditingConsumable] = useState(null);
@@ -182,6 +183,8 @@ function ConsumableManagement() {
         const data = response.data.consumables || [];
         setConsumables(data);
         setPagination(prev => ({ ...prev, current: page, pageSize, total: response.data.total }));
+        // 同步刷新扫码入库用的全量列表
+        fetchAllConsumablesForScan();
       } catch (error) {
         message.error('获取耗材列表失败');
         console.error('获取耗材列表失败:', error);
@@ -189,7 +192,7 @@ function ConsumableManagement() {
         setLoading(false);
       }
     },
-    [debouncedKeyword, category, status]
+    [debouncedKeyword, category, status, fetchAllConsumablesForScan]
   );
 
   const fetchCategories = useCallback(async () => {
@@ -201,10 +204,23 @@ function ConsumableManagement() {
     }
   }, []);
 
+  // 获取全部耗材（用于扫码入库下拉框，不受分页限制）
+  const fetchAllConsumablesForScan = useCallback(async () => {
+    try {
+      const response = await axios.get('/api/consumables', {
+        params: { page: 1, pageSize: 9999, status: 'active' },
+      });
+      setAllConsumablesForScan(response.data.consumables || []);
+    } catch (error) {
+      console.error('获取全部耗材失败:', error);
+    }
+  }, []);
+
   useEffect(() => {
     fetchConsumables();
     fetchCategories();
-  }, [fetchConsumables, fetchCategories]);
+    fetchAllConsumablesForScan();
+  }, [fetchConsumables, fetchCategories, fetchAllConsumablesForScan]);
 
   const showModal = useCallback(
     (consumable = null) => {
@@ -3845,15 +3861,13 @@ function ConsumableManagement() {
                   placeholder="选择要入库的耗材"
                   style={{ width: '100%' }}
                   showSearch
-                  optionFilterProp="children"
-                  filterOption={(input, option) =>
-                    option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
-                  }
+                  optionFilterProp="label"
                   value={selectedScanInConsumable}
                   onChange={value => setSelectedScanInConsumable(value)}
+                  filterOption={true}
                 >
-                  {consumables.map(item => (
-                    <Option key={item.consumableId} value={item.consumableId}>
+                  {allConsumablesForScan.map(item => (
+                    <Option key={item.consumableId} value={item.consumableId} label={`${item.name} ${item.category}`}>
                       {item.name} ({item.category}) - 库存: {item.currentStock}
                     </Option>
                   ))}