| @@ -67,6 +67,7 @@ export default function ProductionSchedulePage() { | |||||
| const [isDailyOutPanelOpen, setIsDailyOutPanelOpen] = useState(false); | const [isDailyOutPanelOpen, setIsDailyOutPanelOpen] = useState(false); | ||||
| const [settingsTab, setSettingsTab] = useState<"items" | "rules">("items"); | const [settingsTab, setSettingsTab] = useState<"items" | "rules">("items"); | ||||
| const [itemDailyOutList, setItemDailyOutList] = useState<ItemDailyOutRow[]>([]); | const [itemDailyOutList, setItemDailyOutList] = useState<ItemDailyOutRow[]>([]); | ||||
| const [itemDailyOutFilter, setItemDailyOutFilter] = useState(""); | |||||
| const [itemDailyOutLoading, setItemDailyOutLoading] = useState(false); | const [itemDailyOutLoading, setItemDailyOutLoading] = useState(false); | ||||
| const [dailyOutSavingCode, setDailyOutSavingCode] = useState<string | null>(null); | const [dailyOutSavingCode, setDailyOutSavingCode] = useState<string | null>(null); | ||||
| const [dailyOutClearingCode, setDailyOutClearingCode] = useState<string | null>(null); | const [dailyOutClearingCode, setDailyOutClearingCode] = useState<string | null>(null); | ||||
| @@ -338,10 +339,21 @@ export default function ProductionSchedulePage() { | |||||
| const openSettingsPanel = () => { | const openSettingsPanel = () => { | ||||
| setSettingsTab("items"); | setSettingsTab("items"); | ||||
| setItemDailyOutFilter(""); | |||||
| setIsDailyOutPanelOpen(true); | setIsDailyOutPanelOpen(true); | ||||
| fetchItemDailyOut(); | fetchItemDailyOut(); | ||||
| }; | }; | ||||
| const filteredItemDailyOutList = useMemo(() => { | |||||
| const q = itemDailyOutFilter.trim().toLowerCase(); | |||||
| if (!q) return itemDailyOutList; | |||||
| return itemDailyOutList.filter( | |||||
| (row) => | |||||
| row.itemCode.toLowerCase().includes(q) || | |||||
| row.itemName.toLowerCase().includes(q) | |||||
| ); | |||||
| }, [itemDailyOutFilter, itemDailyOutList]); | |||||
| const handleRefreshInventoryOnHand = async () => { | const handleRefreshInventoryOnHand = async () => { | ||||
| if (refreshOnHandInFlightRef.current) return; | if (refreshOnHandInFlightRef.current) return; | ||||
| refreshOnHandInFlightRef.current = true; | refreshOnHandInFlightRef.current = true; | ||||
| @@ -1204,9 +1216,17 @@ export default function ProductionSchedulePage() { | |||||
| </button> | </button> | ||||
| </div> | </div> | ||||
| {settingsTab === "items" && ( | {settingsTab === "items" && ( | ||||
| <p className="px-4 py-2 text-sm text-slate-600 dark:text-slate-400"> | |||||
| {t("itemsHint")} | |||||
| </p> | |||||
| <div className="flex flex-wrap items-center gap-3 px-4 py-2"> | |||||
| <p className="text-sm text-slate-600 dark:text-slate-400"> | |||||
| {t("itemsHint")} | |||||
| </p> | |||||
| <input | |||||
| value={itemDailyOutFilter} | |||||
| onChange={(e) => setItemDailyOutFilter(e.target.value)} | |||||
| placeholder={t("searchItem")} | |||||
| className="ml-auto w-56 rounded border border-slate-300 bg-white px-2 py-1 text-sm dark:border-slate-600 dark:bg-slate-700 dark:text-slate-100" | |||||
| /> | |||||
| </div> | |||||
| )} | )} | ||||
| {settingsTab === "rules" ? ( | {settingsTab === "rules" ? ( | ||||
| <div className="min-h-0 flex-1 overflow-auto"> | <div className="min-h-0 flex-1 overflow-auto"> | ||||
| @@ -1240,7 +1260,7 @@ export default function ProductionSchedulePage() { | |||||
| </tr> | </tr> | ||||
| </thead> | </thead> | ||||
| <tbody> | <tbody> | ||||
| {itemDailyOutList.map((row, idx) => ( | |||||
| {filteredItemDailyOutList.map((row, idx) => ( | |||||
| <DailyOutRow | <DailyOutRow | ||||
| key={`${row.itemCode}-${idx}`} | key={`${row.itemCode}-${idx}`} | ||||
| row={row} | row={row} | ||||