From c0fe7c94bb405d1610b1df0bc5f5e8e480cd2173 Mon Sep 17 00:00:00 2001
From: duxingchen <duxingchen@iris-rs.cn>
Date: Mon, 10 Aug 2026 11:18:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BA=A7=E5=93=81=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E9=BB=98=E8=AE=A4=E6=8C=89=E8=AE=BE=E5=A4=87=E5=88=86=E7=BB=84?=
 =?UTF-8?q?+=E8=87=AA=E5=8A=A8=E5=85=A8=E9=83=A8=E5=B1=95=E5=BC=80+?=
 =?UTF-8?q?=E5=85=A8=E9=83=A8=E5=B1=95=E5=BC=80/=E6=8A=98=E5=8F=A0?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/pages/admin/AdminProductsPage.tsx     | 31 +++++++++++++------
 1 file changed, 22 insertions(+), 9 deletions(-)

diff --git a/frontend/src/pages/admin/AdminProductsPage.tsx b/frontend/src/pages/admin/AdminProductsPage.tsx
index 286db3b..ee7705d 100644
--- a/frontend/src/pages/admin/AdminProductsPage.tsx
+++ b/frontend/src/pages/admin/AdminProductsPage.tsx
@@ -35,7 +35,7 @@ export default function AdminProductsPage() {
   // 搜索 & 筛选 & 分组
   const [keyword, setKeyword] = useState("");
   const [statusFilter, setStatusFilter] = useState("");
-  const [groupBy, setGroupBy] = useState<"order" | "device">("order");
+  const [groupBy, setGroupBy] = useState<"order" | "device">("device");
   const [expandedGroups, setExpandedGroups] = useState<Set<string>>(new Set());
 
   // 打印
@@ -71,7 +71,7 @@ export default function AdminProductsPage() {
 
   useEffect(() => { loadProducts(); }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
-  function handleSearch(e?: React.FormEvent) { e?.preventDefault(); setExpandedGroups(new Set()); loadProducts(); }
+  function handleSearch(e?: React.FormEvent) { e?.preventDefault(); loadProducts(); }
 
   // ---- 分组 + 状态过滤 ----
   const productGroups = useMemo<ProductGroup[]>(() => {
@@ -93,6 +93,11 @@ export default function AdminProductsPage() {
     }));
   }, [products, statusFilter, groupBy]);
 
+  // 🔧 默认全部展开：productGroups 变化时自动展开所有面板
+  useEffect(() => {
+    setExpandedGroups(new Set(productGroups.map(g => g.groupKey)));
+  }, [productGroups]);
+
   function toggleGroup(key: string) {
     setExpandedGroups(prev => { const n = new Set(prev); if (n.has(key)) n.delete(key); else n.add(key); return n; });
   }
@@ -130,13 +135,21 @@ export default function AdminProductsPage() {
 
       {/* 搜索 + 分组 + 状态过滤（移植自 AdminTasksPage） */}
       <div className="mb-6 rounded-xl bg-white p-4 shadow-sm">
-        <div className="mb-3 flex items-center gap-2">
-          <span className="text-xs text-gray-400">分组:</span>
-          {(["order", "device"] as const).map(m => (
-            <button key={m} onClick={() => setGroupBy(m)} className={`rounded-full px-3 py-1 text-xs font-medium transition-colors ${groupBy === m ? "bg-blue-600 text-white" : "bg-gray-100 text-gray-500 hover:bg-gray-200"}`}>
-              {m === "order" ? "按订单" : "按设备"}
-            </button>
-          ))}
+        <div className="mb-3 flex items-center justify-between">
+          <div className="flex items-center gap-2">
+            <span className="text-xs text-gray-400">分组:</span>
+            {(["order", "device"] as const).map(m => (
+              <button key={m} onClick={() => setGroupBy(m)} className={`rounded-full px-3 py-1 text-xs font-medium transition-colors ${groupBy === m ? "bg-blue-600 text-white" : "bg-gray-100 text-gray-500 hover:bg-gray-200"}`}>
+                {m === "order" ? "按订单" : "按设备"}
+              </button>
+            ))}
+          </div>
+          <div className="flex gap-1">
+            <button onClick={() => setExpandedGroups(new Set(productGroups.map(g => g.groupKey)))}
+              className="rounded px-2 py-1 text-[11px] text-blue-600 hover:bg-blue-50">全部展开</button>
+            <button onClick={() => setExpandedGroups(new Set())}
+              className="rounded px-2 py-1 text-[11px] text-gray-400 hover:bg-gray-100">全部折叠</button>
+          </div>
         </div>
         <form onSubmit={handleSearch} className="flex items-center gap-2">
           <div className="relative flex-1 max-w-xl">