From 8421e66ec4f2193bd649345998c7e2cb7349e44f Mon Sep 17 00:00:00 2001 From: "CANCERYS\\kw093" Date: Thu, 19 Mar 2026 10:02:19 +0800 Subject: [PATCH] update --- .../Jodetail/MaterialPickStatusTable.tsx | 28 +++--- .../Jodetail/completeJobOrderRecord.tsx | 91 ++++++++++++------- .../FinishedQcJobOrderList.tsx | 56 +++--------- src/i18n/zh/common.json | 2 +- 4 files changed, 91 insertions(+), 86 deletions(-) diff --git a/src/components/Jodetail/MaterialPickStatusTable.tsx b/src/components/Jodetail/MaterialPickStatusTable.tsx index 783f44c..1db9537 100644 --- a/src/components/Jodetail/MaterialPickStatusTable.tsx +++ b/src/components/Jodetail/MaterialPickStatusTable.tsx @@ -15,15 +15,14 @@ import { Paper, CircularProgress, TablePagination, - FormControl, - Select, - MenuItem, Stack } from '@mui/material'; import { useTranslation } from 'react-i18next'; import dayjs from 'dayjs'; import { arrayToDayjs } from '@/app/utils/formatUtil'; import { fetchMaterialPickStatus, MaterialPickStatusItem } from '@/app/api/jo/actions'; +import { DatePicker, LocalizationProvider } from "@mui/x-date-pickers"; +import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; const REFRESH_INTERVAL = 10 * 60 * 1000; // 10 minutes in milliseconds @@ -242,16 +241,19 @@ const MaterialPickStatusTable: React.FC = () => { {/* Filters */} - - - + + { + setSelectedDate(newValue ? newValue.format("YYYY-MM-DD") : selectedDate); + }} + format="YYYY-MM-DD" + slotProps={{ + textField: { size: "small", sx: { minWidth: 160 } }, + }} + /> + diff --git a/src/components/Jodetail/completeJobOrderRecord.tsx b/src/components/Jodetail/completeJobOrderRecord.tsx index 76b07f0..9ecee59 100644 --- a/src/components/Jodetail/completeJobOrderRecord.tsx +++ b/src/components/Jodetail/completeJobOrderRecord.tsx @@ -46,6 +46,7 @@ import { useSession } from "next-auth/react"; import { SessionWithTokens } from "@/config/authConfig"; import Swal from "sweetalert2"; import { PrinterCombo } from "@/app/api/settings/printer"; +import dayjs from "dayjs"; interface Props { filterArgs: Record; printerCombo: PrinterCombo[]; @@ -61,14 +62,15 @@ interface CompletedJobOrderPickOrder { pickOrderConsoCode: string; pickOrderTargetDate: string; pickOrderStatus: string; - completedDate: string; + // Backend可能返回 [yyyy, MM, dd, HH, mm, ss] 或字符串，前端统一在 helper 里转成 YYYY-MM-DD + completedDate: any; jobOrderId: number; jobOrderCode: string; jobOrderName: string; reqQty: number; uom: string; - planStart: string; - planEnd: string; + planStart: any; + planEnd: any; secondScanCompleted: boolean; totalItems: number; completedItems: number; @@ -193,33 +195,10 @@ const CompleteJobOrderRecord: React.FC = ({ } }, [currentUserId, fetchCompletedJobOrderPickOrdersData]); - // 修改：搜索功能 + // 修改：搜索功能（只更新 query；实际过滤交给 useEffect + date filter 统一处理） const handleSearch = useCallback((query: Record) => { setSearchQuery({ ...query }); - console.log("Search query:", query); - - // Fix: Ensure completedJobOrderPickOrders is an array before filtering - if (!Array.isArray(completedJobOrderPickOrders)) { - setFilteredJobOrderPickOrders([]); - return; - } - - const filtered = completedJobOrderPickOrders.filter((pickOrder) => { - const pickOrderCodeMatch = !query.pickOrderCode || - pickOrder.pickOrderCode?.toLowerCase().includes((query.pickOrderCode || "").toLowerCase()); - - const jobOrderCodeMatch = !query.jobOrderCode || - pickOrder.jobOrderCode?.toLowerCase().includes((query.jobOrderCode || "").toLowerCase()); - - const jobOrderNameMatch = !query.jobOrderName || - pickOrder.jobOrderName?.toLowerCase().includes((query.jobOrderName || "").toLowerCase()); - - return pickOrderCodeMatch && jobOrderCodeMatch && jobOrderNameMatch; - }); - - setFilteredJobOrderPickOrders(filtered); - console.log("Filtered Job Order pick orders count:", filtered.length); - }, [completedJobOrderPickOrders]); + }, []); const formatDateTime = (value: any) => { if (!value) return "-"; @@ -233,12 +212,57 @@ const CompleteJobOrderRecord: React.FC = ({ const d = new Date(value); return isNaN(d.getTime()) ? "-" : d.toLocaleString(); }; + const toDateYMD = (value: any): string | null => { + if (!value) return null; + + // Backend 常见格式：[yyyy, MM, dd, HH, mm, ss] + if (Array.isArray(value)) { + const [year, month, day] = value; + if (!year || !month || !day) return null; + return dayjs(new Date(Number(year), Number(month) - 1, Number(day))).format("YYYY-MM-DD"); + } + + // 兼容 ISO 字符串 / Date + if (typeof value === "string") { + const d = dayjs(value); + return d.isValid() ? d.format("YYYY-MM-DD") : null; + } + + if (value instanceof Date) { + return dayjs(value).format("YYYY-MM-DD"); + } + + return null; + }; + + useEffect(() => { + const query = searchQuery || {}; + const dateFilter = query.completedDate ? String(query.completedDate) : ""; + + const filtered = (Array.isArray(completedJobOrderPickOrders) ? completedJobOrderPickOrders : []).filter((pickOrder) => { + const pickOrderDateYMD = toDateYMD((pickOrder as any).completedDate ?? (pickOrder as any).planEnd); + const dateMatch = !dateFilter || pickOrderDateYMD === dateFilter; + + const pickOrderCodeMatch = + !query.pickOrderCode || + pickOrder.pickOrderCode?.toLowerCase().includes(String(query.pickOrderCode).toLowerCase()); + const jobOrderCodeMatch = + !query.jobOrderCode || + pickOrder.jobOrderCode?.toLowerCase().includes(String(query.jobOrderCode).toLowerCase()); + const jobOrderNameMatch = + !query.jobOrderName || + pickOrder.jobOrderName?.toLowerCase().includes(String(query.jobOrderName).toLowerCase()); + + return dateMatch && pickOrderCodeMatch && jobOrderCodeMatch && jobOrderNameMatch; + }); + + setFilteredJobOrderPickOrders(filtered); + }, [completedJobOrderPickOrders, searchQuery]); + // 修改：重置搜索 const handleSearchReset = useCallback(() => { setSearchQuery({}); - // Fix: Ensure completedJobOrderPickOrders is an array before setting - setFilteredJobOrderPickOrders(Array.isArray(completedJobOrderPickOrders) ? completedJobOrderPickOrders : []); - }, [completedJobOrderPickOrders]); + }, []); // 修改：分页功能 const handlePageChange = useCallback((event: unknown, newPage: number) => { @@ -270,6 +294,11 @@ const CompleteJobOrderRecord: React.FC = ({ // 修改：搜索条件 const searchCriteria: Criterion[] = [ + { + label: t("Target Date"), + paramName: "completedDate", + type: "date", + }, { label: t("Pick Order Code"), paramName: "pickOrderCode", diff --git a/src/components/ProductionProcess/FinishedQcJobOrderList.tsx b/src/components/ProductionProcess/FinishedQcJobOrderList.tsx index 1d05b5c..dd4a381 100644 --- a/src/components/ProductionProcess/FinishedQcJobOrderList.tsx +++ b/src/components/ProductionProcess/FinishedQcJobOrderList.tsx @@ -17,16 +17,14 @@ import { Paper, IconButton, Tooltip, - FormControl, - InputLabel, - Select, - MenuItem, } from "@mui/material"; import QrCodeIcon from '@mui/icons-material/QrCode'; import { useTranslation } from "react-i18next"; import { useSession } from "next-auth/react"; import { SessionWithTokens } from "@/config/authConfig"; import dayjs from "dayjs"; +import { DatePicker, LocalizationProvider } from "@mui/x-date-pickers"; +import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; import { OUTPUT_DATE_FORMAT } from "@/app/utils/formatUtil"; import { fetchJoForPrintQrCode, @@ -54,27 +52,12 @@ const FinishedQcJobOrderList: React.FC = ({ const [page, setPage] = useState(0); const [isPrinting, setIsPrinting] = useState(false); const [printingId, setPrintingId] = useState(null); - const [selectedDate, setSelectedDate] = useState("today"); - const getDateLabel = (offset: number) => { - return dayjs().subtract(offset, 'day').format('YYYY-MM-DD'); - }; - - // 根据选择的日期获取实际日期字符串 - const getDateParam = (dateOption: string): string => { - if (dateOption === "today") { - return dayjs().format('YYYY-MM-DD'); - } else if (dateOption === "yesterday") { - return dayjs().subtract(1, 'day').format('YYYY-MM-DD'); - } else if (dateOption === "dayBeforeYesterday") { - return dayjs().subtract(2, 'day').format('YYYY-MM-DD'); - } - return dayjs().format('YYYY-MM-DD'); - }; + const [selectedDate, setSelectedDate] = useState(dayjs()); const fetchJobOrders = useCallback(async () => { setLoading(true); try { - const dateParam = getDateParam(selectedDate); + const dateParam = selectedDate.format("YYYY-MM-DD"); const data = await fetchJoForPrintQrCode(dateParam); setJobOrders(data || []); setPage(0); @@ -140,28 +123,19 @@ const FinishedQcJobOrderList: React.FC = ({ {/* Date Selector */} - - {t("Select Date")} - - + /> + diff --git a/src/i18n/zh/common.json b/src/i18n/zh/common.json index a254ecb..00aa0bb 100644 --- a/src/i18n/zh/common.json +++ b/src/i18n/zh/common.json @@ -22,7 +22,7 @@ "Duration (Minutes)": "時間(分)", "Prep Time (Minutes)": "準備時間", "Post Prod Time (Minutes)": "收尾時間", - + "Correct BOM List (Can Import)": "正確 BOM 列表（可匯入）", "Select Another Bag Lot": "選擇另一個包裝袋", "Finished QC Job Orders": "完成QC工單",