From 8b950f652924357f783958c58ac37a8c6db977f6 Mon Sep 17 00:00:00 2001
From: sky121113 <sky121113@gmail.com>
Date: Tue, 10 Feb 2026 13:02:11 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AF=A6=E4=BD=9C=E5=BA=AB=E5=AD=98?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E5=B1=95=E9=96=8B=E7=8B=80=E6=85=8B=E4=BF=9D?=
 =?UTF-8?q?=E7=95=99=20(=E4=BD=BF=E7=94=A8=20sessionStorage)=20=E6=94=B9?=
 =?UTF-8?q?=E8=89=AF=E9=A1=AF=E7=A4=BA=E8=88=87=E4=BF=AE=E6=AD=A3=E7=9B=B8?=
 =?UTF-8?q?=E9=97=9C=E5=95=8F=E9=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Warehouse/Inventory/InventoryTable.tsx    | 36 ++++++++++++++-----
 .../Warehouse/Inventory/TransactionTable.tsx  |  2 +-
 .../js/Pages/Inventory/StockQuery/Index.tsx   | 10 +++---
 3 files changed, 33 insertions(+), 15 deletions(-)

diff --git a/resources/js/Components/Warehouse/Inventory/InventoryTable.tsx b/resources/js/Components/Warehouse/Inventory/InventoryTable.tsx
index a4fea8f..16685d2 100644
--- a/resources/js/Components/Warehouse/Inventory/InventoryTable.tsx
+++ b/resources/js/Components/Warehouse/Inventory/InventoryTable.tsx
@@ -3,7 +3,8 @@
  * 顯示庫存項目列表（依商品分組並支援折疊）
  */
 
-import { useState } from "react";
+import { useState, useEffect } from "react";
+
 import { AlertTriangle, Trash2, Eye, ChevronDown, ChevronRight, CheckCircle, Package } from "lucide-react";
 import {
     Table,
@@ -47,10 +48,29 @@ export default function InventoryTable({
     // 判斷是否為販賣機倉庫
     const isVending = warehouse?.type === "vending";
 
-    // 每個商品的展開/折疊狀態
-    const [expandedProducts, setExpandedProducts] = useState<Set<string>>(new Set());
+    // 每個商品的展開/折疊狀態 - 使用 sessionStorage 保留狀態 (改用 Array 以利序列化)
+    // 解決使用 Link 返回時 State 被重置的問題
+    const storageKey = `inventory_expanded_${warehouse.id}`;
+    const [expandedProducts, setExpandedProducts] = useState<string[]>(() => {
+        if (typeof window === 'undefined') return [];
+        try {
+            const saved = sessionStorage.getItem(storageKey);
+            return saved ? JSON.parse(saved) : [];
+        } catch (e) {
+            console.error("Failed to parse expanded state", e);
+            return [];
+        }
+    });
 
+    useEffect(() => {
+        try {
+            sessionStorage.setItem(storageKey, JSON.stringify(expandedProducts));
+        } catch (e) {
+            console.error("Failed to save expanded state", e);
+        }
+    }, [expandedProducts, storageKey]);
 
+    // console.log('InventoryTable Rendered', { warehouseId: warehouse.id, expandedProducts });
 
     if (inventories.length === 0) {
         return (
@@ -68,13 +88,11 @@ export default function InventoryTable({
 
     const toggleProduct = (productId: string) => {
         setExpandedProducts((prev) => {
-            const newSet = new Set(prev);
-            if (newSet.has(productId)) {
-                newSet.delete(productId);
+            if (prev.includes(productId)) {
+                return prev.filter(id => id !== productId);
             } else {
-                newSet.add(productId);
+                return [...prev, productId];
             }
-            return newSet;
         });
     };
 
@@ -111,7 +129,7 @@ export default function InventoryTable({
                     const status = group.status;
 
                     const isLowStock = status === "低於";
-                    const isExpanded = expandedProducts.has(group.productId);
+                    const isExpanded = expandedProducts.includes(group.productId);
                     const hasInventory = group.batches.length > 0;
 
                     return (
diff --git a/resources/js/Components/Warehouse/Inventory/TransactionTable.tsx b/resources/js/Components/Warehouse/Inventory/TransactionTable.tsx
index b43cc37..4ba7c28 100644
--- a/resources/js/Components/Warehouse/Inventory/TransactionTable.tsx
+++ b/resources/js/Components/Warehouse/Inventory/TransactionTable.tsx
@@ -42,7 +42,7 @@ export default function TransactionTable({ transactions, showBatchNumber = false
                         <th className="px-4 py-3">類型</th>
                         <th className="px-4 py-3 text-right">變動數量</th>
                         <th className="px-4 py-3 text-right">結餘</th>
-                        {shouldShowSlot && <th className="px-4 py-3">儲位</th>}
+                        {shouldShowSlot && <th className="px-4 py-3">貨道</th>}
                         <th className="px-4 py-3">經手人</th>
                         <th className="px-4 py-3">原因/備註</th>
                     </tr>
diff --git a/resources/js/Pages/Inventory/StockQuery/Index.tsx b/resources/js/Pages/Inventory/StockQuery/Index.tsx
index 740452b..79e4892 100644
--- a/resources/js/Pages/Inventory/StockQuery/Index.tsx
+++ b/resources/js/Pages/Inventory/StockQuery/Index.tsx
@@ -1,4 +1,5 @@
-import { Head, router, useRemember } from "@inertiajs/react";
+import { useState } from "react";
+import { Head, router } from "@inertiajs/react";
 import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout";
 import {
     Search,
@@ -120,10 +121,9 @@ export default function StockQueryIndex({
     warehouses,
     categories,
 }: Props) {
-    const [search, setSearch] = useRemember(filters.search || "", "StockQuery/search");
-    const [perPage, setPerPage] = useRemember(
-        filters.per_page || "10",
-        "StockQuery/perPage"
+    const [search, setSearch] = useState(filters.search || "");
+    const [perPage, setPerPage] = useState<string>(
+        filters.per_page || "10"
     );
 
     // 執行篩選