From fa93870c23a1dd46aa0e2db6a7915d06fa2645ef Mon Sep 17 00:00:00 2001 From: "MSI\\derek" Date: Fri, 8 Aug 2025 18:03:15 +0800 Subject: [PATCH] update --- src/app/api/po/actions.ts | 10 +- src/app/api/po/index.ts | 2 +- .../InputDataGrid/InputDataGrid.tsx | 10 +- .../PoDetail/EscalationComponent.tsx | 82 ++-- src/components/PoDetail/PoInputGrid.tsx | 1 + src/components/PoDetail/PutawayForm.tsx | 82 +++- src/components/PoDetail/QCDatagrid.tsx | 461 +++--------------- src/components/PoDetail/QcFormVer2.tsx | 233 ++++++--- .../PoDetail/QcStockInModalVer2.tsx | 169 +++++-- src/components/PoDetail/dummyQcTemplate.tsx | 41 +- src/components/PoSearch/PoSearch.tsx | 12 +- src/i18n/zh/purchaseOrder.json | 15 +- 12 files changed, 539 insertions(+), 579 deletions(-) diff --git a/src/app/api/po/actions.ts b/src/app/api/po/actions.ts index 47862fe..f53672c 100644 --- a/src/app/api/po/actions.ts +++ b/src/app/api/po/actions.ts @@ -65,12 +65,18 @@ export interface EscalationInput { acceptedQty: number; // this is the qty to be escalated // escalationQty: number } +export interface PutawayLine { + id?: number + qty: number + warehouseId: number; + warehouse: string; + printQty: number +} export interface PutawayInput { status: string; acceptedQty: number; warehouseId: number; - // handler: string - // stockInLine: StockInLineEntry[] + putawayLine: PutawayLine[] } export type ModalFormInput = Partial< diff --git a/src/app/api/po/index.ts b/src/app/api/po/index.ts index ead1364..c4b6385 100644 --- a/src/app/api/po/index.ts +++ b/src/app/api/po/index.ts @@ -14,7 +14,7 @@ export interface PoResult { supplier: string; estimatedArrivalDate: string; completedDate: string; - itemDetail?: String; + itemDetail?: string; escalated: boolean; status: string; pol?: PurchaseOrderLine[]; diff --git a/src/components/InputDataGrid/InputDataGrid.tsx b/src/components/InputDataGrid/InputDataGrid.tsx index b961c62..c75e9be 100644 --- a/src/components/InputDataGrid/InputDataGrid.tsx +++ b/src/components/InputDataGrid/InputDataGrid.tsx @@ -123,11 +123,13 @@ function InputDataGrid({ [], ); const list: TableRow[] = getValues(formKey); - // console.log(list) + console.log(list) const [rows, setRows] = useState[]>(() => { const list: TableRow[] = getValues(formKey); + console.log(list) return list && list.length > 0 ? list : []; }); + console.log(rows) // const originalRows = list && list.length > 0 ? list : []; const originalRows = useMemo(() => ( list && list.length > 0 ? list : [] @@ -298,7 +300,8 @@ function InputDataGrid({ onClick={addRow} size="small" > - {t("Add Record")} + 新增 + {/* {t("Add Record")} */} ); diff --git a/src/components/PoDetail/EscalationComponent.tsx b/src/components/PoDetail/EscalationComponent.tsx index b3ff062..c86f166 100644 --- a/src/components/PoDetail/EscalationComponent.tsx +++ b/src/components/PoDetail/EscalationComponent.tsx @@ -14,10 +14,13 @@ import { Typography, RadioGroup, Radio, + Stack, + Autocomplete, } from '@mui/material'; import { SelectChangeEvent } from '@mui/material/Select'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandLessIcon from '@mui/icons-material/ExpandLess'; +import { useTranslation } from 'react-i18next'; interface NameOption { value: string; @@ -30,7 +33,15 @@ interface FormData { message: string; } -function EscalationComponent(): JSX.Element { +interface Props { + forSupervisor: boolean +} + +const EscalationComponent: React.FC = ({ + forSupervisor + }) => { + const { t } = useTranslation("purchaseOrder"); + const [isCollapsed, setIsCollapsed] = useState(false); const [formData, setFormData] = useState({ name: '', @@ -48,9 +59,9 @@ function EscalationComponent(): JSX.Element { ]; const handleInputChange = ( - e: ChangeEvent | SelectChangeEvent + event: ChangeEvent | SelectChangeEvent ): void => { - const { name, value } = e.target; + const { name, value } = event.target; setFormData((prev) => ({ ...prev, [name]: value, @@ -69,8 +80,10 @@ function EscalationComponent(): JSX.Element { return ( // - - + <> + + {/* */} + - - + - - - } label="合格" /> - } label="不合格" /> - - + {forSupervisor ? ( + + + } label="合格" /> + } label="不合格" /> + + + ): undefined} - 姓名 - + - - + + + + ); } diff --git a/src/components/PoDetail/PoInputGrid.tsx b/src/components/PoDetail/PoInputGrid.tsx index 980598c..64fb98e 100644 --- a/src/components/PoDetail/PoInputGrid.tsx +++ b/src/components/PoDetail/PoInputGrid.tsx @@ -812,6 +812,7 @@ function PoInputGrid({ setStockInLine={setStockInLine} setItemDetail={setModalInfo} qc={qc} + warehouse={warehouse} open={newOpen} onClose={closeNewModal} itemDetail={modalInfo} diff --git a/src/components/PoDetail/PutawayForm.tsx b/src/components/PoDetail/PutawayForm.tsx index 1ef17c9..7c4fefe 100644 --- a/src/components/PoDetail/PutawayForm.tsx +++ b/src/components/PoDetail/PutawayForm.tsx @@ -1,6 +1,6 @@ "use client"; -import { PurchaseQcResult, PutawayInput } from "@/app/api/po/actions"; +import { PurchaseQcResult, PutawayInput, PutawayLine } from "@/app/api/po/actions"; import { Autocomplete, Box, @@ -50,6 +50,7 @@ import { QrCodeInfo } from "@/app/api/qrcode"; import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; import dayjs from "dayjs"; import arraySupport from "dayjs/plugin/arraySupport"; +import { dummyPutawayLine } from "./dummyQcTemplate"; dayjs.extend(arraySupport); interface Props { @@ -60,11 +61,11 @@ interface Props { } type EntryError = | { - [field in keyof PurchaseQcResult]?: string; + [field in keyof PutawayLine]?: string; } | undefined; -// type PoQcRow = TableRow, EntryError>; +type PutawayRow = TableRow, EntryError>; const style = { position: "absolute", @@ -100,6 +101,7 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { // do filtering here if any return warehouse; }, []); + const defaultOption = { value: 0, // think think sin label: t("Select warehouse"), @@ -141,7 +143,7 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { }, [], ); - + console.log(watch("putawayLine")) // const accQty = watch("acceptedQty"); // const validateForm = useCallback(() => { // console.log(accQty); @@ -265,6 +267,44 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { return undefined; }, [options]); + const columns = useMemo( + () => [ + { + field: "qty", + headerName: t("qty"), + flex: 1, + // renderCell(params) { + // return <>100 + // }, + }, + { + field: "warehouse", + headerName: t("warehouse"), + flex: 1, + // renderCell(params) { + // return <>{filteredWarehouse[0].name} + // }, + }, + { + field: "printQty", + headerName: t("printQty"), + flex: 1, + // renderCell(params) { + // return <>100 + // }, + }, + ], []) + + const validation = useCallback( + (newRow: GridRowModel): EntryError => { + const error: EntryError = {}; + const { qty, warehouseId, printQty } = newRow; + + return Object.keys(error).length > 0 ? error : undefined; + }, + [], + ); + return ( @@ -331,8 +371,10 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { @@ -341,8 +383,10 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { @@ -364,7 +408,7 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { /> - + {/* = ({ itemDetail, warehouse, disabled }) => { - - - {/* */} + {/* + { @@ -412,7 +456,7 @@ const PutawayForm: React.FC = ({ itemDetail, warehouse, disabled }) => { /> ); }} - /> */} + /> = ({ itemDetail, warehouse, disabled }) => { )} /> - + */} - + {/* */} + + apiRef={apiRef} + checkboxSelection={false} + _formKey={"putawayLine"} + columns={columns} + validateRow={validation} + needAdd={true} + /> {/* { - _isNew: boolean; - _error: E; -} - -interface SelectionResult { - active: boolean; - _isNew: boolean; - _error: E; -} -type Result = DefaultResult | SelectionResult; - -export type TableRow = Partial< - V & { - isActive: boolean | undefined; - _isNew: boolean; - _error: E; - } & ResultWithId ->; - -export interface InputDataGridProps { - apiRef: MutableRefObject; - checkboxSelection: false | undefined; - _formKey: keyof T; - columns: GridColDef[]; - validateRow: (newRow: GridRowModel>) => E; - needAdd?: boolean; -} - -export interface SelectionInputDataGridProps { - // thinking how do - apiRef: MutableRefObject; - checkboxSelection: true; - _formKey: keyof T; - columns: GridColDef[]; - validateRow: (newRow: GridRowModel>) => E; - needAdd?: boolean; -} - -export type Props = - | InputDataGridProps - | SelectionInputDataGridProps; -export class ProcessRowUpdateError extends Error { - public readonly row: T; - public readonly errors: E | undefined; - constructor(row: T, message?: string, errors?: E) { - super(message); - this.row = row; - this.errors = errors; +"use client" - Object.setPrototypeOf(this, ProcessRowUpdateError.prototype); - } -} -// T == CreatexxxInputs map of the form's fields -// V == target field input inside CreatexxxInputs, e.g. qcChecks: ItemQc[], V = ItemQc -// E == error -function QcDatagrid({ - apiRef, - checkboxSelection = false, - _formKey, - columns, - validateRow, - needAdd, -}: Props) { - const { - t, - // i18n: { language }, - } = useTranslation("common"); - const formKey = _formKey.toString(); - const { setValue, getValues } = useFormContext(); - const [rowModesModel, setRowModesModel] = useState({}); - // const apiRef = useGridApiRef(); - const getRowId = useCallback>>( - (row) => row.id! as number, - [], - ); - const list: TableRow[] = getValues(formKey); - // console.log(list) - const [rows, setRows] = useState[]>(() => { - const list: TableRow[] = getValues(formKey); - return list && list.length > 0 ? list : []; - }); - // const originalRows = list && list.length > 0 ? list : []; - const originalRows = useMemo(() => ( - list && list.length > 0 ? list : [] - ), [list]) - - // const originalRowModel = originalRows.filter((li) => li.isActive).map(i => i.id) as GridRowSelectionModel - const [rowSelectionModel, setRowSelectionModel] = - useState(() => { - // const rowModel = list.filter((li) => li.isActive).map(i => i.id) as GridRowSelectionModel - const rowModel: GridRowSelectionModel = getValues( - `${formKey}_active`, - ) as GridRowSelectionModel; - console.log(rowModel); - return rowModel; - }); - - const handleSave = useCallback( - (id: GridRowId) => () => { - setRowModesModel((prevRowModesModel) => ({ - ...prevRowModesModel, - [id]: { mode: GridRowModes.View }, - })); - }, - [], - ); - const onProcessRowUpdateError = useCallback( - (updateError: ProcessRowUpdateError) => { - const errors = updateError.errors; - const row = updateError.row; - console.log(errors); - apiRef.current.updateRows([{ ...row, _error: errors }]); - }, - [apiRef], - ); - - const processRowUpdate = useCallback( - ( - newRow: GridRowModel>, - originalRow: GridRowModel>, - ) => { - ///////////////// - // validation here - const errors = validateRow(newRow); - console.log(newRow); - if (errors) { - throw new ProcessRowUpdateError( - originalRow, - "validation error", - errors, - ); - } - ///////////////// - const { _isNew, _error, ...updatedRow } = newRow; - const rowToSave = { - ...updatedRow, - } as TableRow; /// test - console.log(rowToSave); - setRows((rw) => - rw.map((r) => (getRowId(r) === getRowId(originalRow) ? rowToSave : r)), - ); - return rowToSave; - }, - [validateRow, getRowId], - ); - - const addRow = useCallback(() => { - const newEntry = { id: Date.now(), _isNew: true } as TableRow; - setRows((prev) => [...prev, newEntry]); - setRowModesModel((model) => ({ - ...model, - [getRowId(newEntry)]: { - mode: GridRowModes.Edit, - // fieldToFocus: "team", /// test - }, - })); - }, [getRowId]); - - const reset = useCallback(() => { - setRowModesModel({}); - setRows(originalRows); - }, [originalRows]); - - const handleCancel = useCallback( - (id: GridRowId) => () => { - setRowModesModel((model) => ({ - ...model, - [id]: { mode: GridRowModes.View, ignoreModifications: true }, - })); - const editedRow = rows.find((row) => getRowId(row) === id); - if (editedRow?._isNew) { - setRows((rw) => rw.filter((r) => getRowId(r) !== id)); - } else { - setRows((rw) => - rw.map((r) => (getRowId(r) === id ? { ...r, _error: undefined } : r)), - ); - } - }, - [rows, getRowId], - ); - - const handleDelete = useCallback( - (id: GridRowId) => () => { - setRows((prevRows) => prevRows.filter((row) => getRowId(row) !== id)); - }, - [getRowId], - ); +import { MutableRefObject } from "react"; +import StyledDataGrid from "../StyledDataGrid" +import { GridApiCommunity } from "@mui/x-data-grid/internals"; +import { GridColDef } from "@mui/x-data-grid"; +import { useTranslation } from "react-i18next"; +import { dummyQCData, QcData } from "./dummyQcTemplate"; +import { Checkbox } from "@mui/material"; - const _columns = useMemo( - () => [ - ...columns, - { - field: "actions", - type: "actions", - headerName: "", - flex: 0.5, - cellClassName: "actions", - getActions: ({ id }: { id: GridRowId }) => { - const isInEditMode = rowModesModel[id]?.mode === GridRowModes.Edit; - if (isInEditMode) { - return [ - } - label="Save" - key="edit" - sx={{ - color: "primary.main", - }} - onClick={handleSave(id)} - />, - } - label="Cancel" - key="edit" - onClick={handleCancel(id)} - />, - ]; - } - return [ - } - label="Delete" - sx={{ - color: "error.main", - }} - onClick={handleDelete(id)} - color="inherit" - key="edit" - />, - ]; - }, - }, - ], - [columns, rowModesModel, handleSave, handleCancel, handleDelete], - ); - // sync useForm - useEffect(() => { - // console.log(formKey) - // console.log(rows) - setValue(formKey, rows); - }, [formKey, rows, setValue]); +interface Props { + // apiRef: MutableRefObject; +}; - const footer = ( - - - - - ); - // const handleRowEditStop: GridEventListener<'rowEditStop'> = (params, event) => { - // if (params.reason === GridRowEditStopReasons.rowFocusOut) { - // event.defaultMuiPrevented = true; - // } - // }; +const QcDataGrid: React.FC = ({ + // apiRef + }) => { + const { t } = useTranslation("purchaseOrder"); - return ( - } - // checkbox selection - checkboxSelection={checkboxSelection} - disableRowSelectionOnClick={checkboxSelection} - onRowSelectionModelChange={(newRowSelectionModel) => { - if (checkboxSelection) { - setRowSelectionModel(newRowSelectionModel); - setValue("qcChecks_active", newRowSelectionModel); - } - }} - rowSelectionModel={rowSelectionModel} - apiRef={apiRef} - rows={rows} - columns={!checkboxSelection ? _columns : columns} - editMode="row" - autoHeight - sx={{ - "--DataGrid-overlayHeight": "100px", - ".MuiDataGrid-row .MuiDataGrid-cell.hasError": { - border: "1px solid", - borderColor: "error.main", - }, - ".MuiDataGrid-row .MuiDataGrid-cell.hasWarning": { - border: "1px solid", - borderColor: "warning.main", - }, - }} - disableColumnMenu - processRowUpdate={processRowUpdate as any} - // onRowEditStop={handleRowEditStop} - rowModesModel={rowModesModel} - onRowModesModelChange={setRowModesModel} - onProcessRowUpdateError={onProcessRowUpdateError} - getCellClassName={(params: GridCellParams>) => { - let classname = ""; - if (params.row._error) { - classname = "hasError"; - } - return classname; - }} - slots={ - !checkboxSelection - ? { - footer: FooterToolbar, - noRowsOverlay: NoRowsOverlay, - } - : undefined - } - slotProps={ - !checkboxSelection && Boolean(needAdd) - ? { - footer: { child: footer }, - } - : undefined - // slotProps={renderFooter ? { - // footer: { child: footer }, - // }: undefined - } - /> - ); + const columns: GridColDef[] = [ + { + field: "qcItem", + headerName: t("qcItem"), + flex: 1, + }, + { + field: "isPassed", + headerName: t("passed"), + flex: 1, + renderCell: (params) => ( + handleCheckboxChange(params.id)} + /> + ), + }, + { + field: "isFailed", + headerName: t("failed"), + flex: 1, + renderCell: (params) => ( + handleCheckboxChange(params.id)} + /> + ), + }, + { + field: "failedQty", + headerName: t("failedQty"), + flex: 1, + editable: true, + }, + { + field: "remarks", + headerName: t("remarks"), + flex: 1, + editable: true, + }, + ] + return ( + + ) } -const FooterToolbar: React.FC = ({ child }) => { - return {child}; -}; -const NoRowsOverlay: React.FC = () => { - const { t } = useTranslation("home"); - return ( - - {t("Add some entries!")} - - ); -}; -export default QcDatagrid; +export default QcDataGrid \ No newline at end of file diff --git a/src/components/PoDetail/QcFormVer2.tsx b/src/components/PoDetail/QcFormVer2.tsx index 670e04a..be0381c 100644 --- a/src/components/PoDetail/QcFormVer2.tsx +++ b/src/components/PoDetail/QcFormVer2.tsx @@ -26,6 +26,7 @@ import { GridRenderCellParams, GridRenderEditCellParams, useGridApiRef, + GridRowSelectionModel, } from "@mui/x-data-grid"; import InputDataGrid from "../InputDataGrid"; import { TableRow } from "../InputDataGrid/InputDataGrid"; @@ -39,6 +40,10 @@ import { QcItemWithChecks } from "@/app/api/qc"; import axios from "@/app/(main)/axios/axiosInstance"; import { NEXT_PUBLIC_API_URL } from "@/config/api"; import axiosInstance from "@/app/(main)/axios/axiosInstance"; +import EscalationComponent from "./EscalationComponent"; +import QcDataGrid from "./QCDatagrid"; +import StockInFormVer2 from "./StockInFormVer2"; +import { dummyEscalationHistory } from "./dummyQcTemplate"; interface Props { itemDetail: StockInLine; @@ -68,10 +73,24 @@ const QcFormVer2: React.FC = ({ qc, itemDetail, disabled }) => { setError, clearErrors, } = useFormContext(); - console.log(itemDetail); - console.log(defaultValues); + const [tabIndex, setTabIndex] = useState(0); + const [rowSelectionModel, setRowSelectionModel] = useState() + const column = useMemo( + () => [ + { + field: "escalation", + headerName: t("escalation"), + flex: 1, + }, + { + field: "supervisor", + headerName: t("supervisor"), + flex: 1, + }, + ], [] + ) const handleTabChange = useCallback>( (_e, newValue) => { setTabIndex(newValue); @@ -112,79 +131,89 @@ const QcFormVer2: React.FC = ({ qc, itemDetail, disabled }) => { const columns = useMemo( () => [ + // { + // field: "qcItemId", + // headerName: t("qc Check"), + // flex: 1, + // editable: !disabled, + // valueFormatter(params) { + // const row = params.id ? params.api.getRow(params.id) : null; + // if (!row) { + // return null; + // } + // const Qc = qc.find((q) => q.id === row.qcItemId); + // return Qc ? `${Qc.code} - ${Qc.name}` : t("Please select QC"); + // }, + // renderCell(params: GridRenderCellParams) { + // console.log(params.value); + // return {params.formattedValue}; + // }, + // renderEditCell(params: GridRenderEditCellParams) { + // const errorMessage = + // params.row._error?.[params.field as keyof PurchaseQcResult]; + // console.log(errorMessage); + // const content = ( + // { + // await params.api.setEditCellValue({ + // id: params.id, + // field: "qcItemId", + // value: qcItemId, + // }); + // // await params.api.setEditCellValue({ + // // id: params.id, + // // field: "type", + // // value: "determine1", + // // }); + // }} + // /> + // ); + // return errorMessage ? ( + // + // {content} + // + // ) : ( + // content + // ); + // }, + // }, + // { + // field: "failQty", + // headerName: t("failQty"), + // flex: 1, + // editable: !disabled, + // type: "number", + // renderEditCell(params: GridRenderEditCellParams) { + // // const recordQty = params.row.qty + // // if (recordQty !== undefined) { + // // setUnrecordQty((prev) => prev - recordQty) + // // } + // const errorMessage = + // params.row._error?.[params.field as keyof PurchaseQcResult]; + // const content = ; + // return errorMessage ? ( + // + // {content} + // + // ) : ( + // content + // ); + // }, + // }, { - field: "qcItemId", - headerName: t("qc Check"), + field: "escalation", + headerName: t("escalation"), flex: 1, - editable: !disabled, - valueFormatter(params) { - const row = params.id ? params.api.getRow(params.id) : null; - if (!row) { - return null; - } - const Qc = qc.find((q) => q.id === row.qcItemId); - return Qc ? `${Qc.code} - ${Qc.name}` : t("Please select QC"); - }, - renderCell(params: GridRenderCellParams) { - console.log(params.value); - return {params.formattedValue}; - }, - renderEditCell(params: GridRenderEditCellParams) { - const errorMessage = - params.row._error?.[params.field as keyof PurchaseQcResult]; - console.log(errorMessage); - const content = ( - { - await params.api.setEditCellValue({ - id: params.id, - field: "qcItemId", - value: qcItemId, - }); - // await params.api.setEditCellValue({ - // id: params.id, - // field: "type", - // value: "determine1", - // }); - }} - /> - ); - return errorMessage ? ( - - {content} - - ) : ( - content - ); - }, }, { - field: "failQty", - headerName: t("failQty"), + field: "supervisor", + headerName: t("supervisor"), flex: 1, - editable: !disabled, - type: "number", - renderEditCell(params: GridRenderEditCellParams) { - // const recordQty = params.row.qty - // if (recordQty !== undefined) { - // setUnrecordQty((prev) => prev - recordQty) - // } - const errorMessage = - params.row._error?.[params.field as keyof PurchaseQcResult]; - const content = ; - return errorMessage ? ( - - {content} - - ) : ( - content - ); - }, }, ], - [qc], + [], ); /// validate datagrid const validation = useCallback( @@ -226,14 +255,66 @@ const QcFormVer2: React.FC = ({ qc, itemDetail, disabled }) => { spacing={2} sx={{ mt: 0.5 }} > - - - - + + + + + + + {tabIndex == 0 && ( + <> + + + + + + + + + + + )} + {tabIndex == 1 && ( + <> + {/* + + */} + + + {t("Escalation Info")} + + + + { + setRowSelectionModel(newRowSelectionModel); + }} + /> + + + + {t("Escalation Result")} + + + + + + + )} diff --git a/src/components/PoDetail/QcStockInModalVer2.tsx b/src/components/PoDetail/QcStockInModalVer2.tsx index 2e5148e..8c260ed 100644 --- a/src/components/PoDetail/QcStockInModalVer2.tsx +++ b/src/components/PoDetail/QcStockInModalVer2.tsx @@ -11,19 +11,21 @@ import { useTranslation } from "react-i18next"; import StockInForm from "./StockInForm"; import StockInFormVer2 from "./StockInFormVer2"; import QcFormVer2 from "./QcFormVer2"; +import PutawayForm from "./PutawayForm"; +import { dummyPutawayLine } from "./dummyQcTemplate"; const style = { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)", - overflowY: "scroll", bgcolor: "background.paper", pt: 5, px: 5, pb: 10, display: "block", width: { xs: "60%", sm: "60%", md: "60%" }, +// height: { xs: "60%", sm: "60%", md: "60%" }, }; interface CommonProps extends Omit { @@ -60,6 +62,7 @@ const PoQcStockInModalVer2: React.FC = ({ qc, warehouse, }) => { + console.log(warehouse) const { t, i18n: { language }, @@ -67,6 +70,7 @@ const PoQcStockInModalVer2: React.FC = ({ const formProps = useForm({ defaultValues: { ...itemDetail, + putawayLine: dummyPutawayLine // receiptDate: itemDetail.receiptDate || dayjs().add(-1, "month").format(INPUT_DATE_FORMAT), // warehouseId: itemDetail.defaultWarehouseId || 0 }, @@ -79,11 +83,23 @@ const PoQcStockInModalVer2: React.FC = ({ }, [onClose], ); + const [openPutaway, setOpenPutaway] = useState(false) + const onOpenPutaway = useCallback(() => { + setOpenPutaway(true); + }, []); + + const onClosePutaway = useCallback(() => { + setOpenPutaway(false); + }, []); const [submissionType, setSubmissionType] = useState<"stockIn" | "qc" | "escalate" | undefined>(undefined) const onSubmit = useCallback>( async (data, event) => { console.log(event!.nativeEvent) + // closeHandler({}, "backdropClick"); + // for now go to putaway form + onOpenPutaway() + // divide 3 section for this submition // switch (submissionType) { // submit stock in data @@ -95,52 +111,113 @@ const PoQcStockInModalVer2: React.FC = ({ return ( <> + {/* {itemDetail !== undefined && ( + + )} */} - - - - - - {t("qc processing")} - - - - - - - - - - - - - - + + + {openPutaway ? ( + <> + + + + + + + ) : ( + <> + + + + {t("qc processing")} + + + + + + + + + + + + + + + + + + ) + + } + + diff --git a/src/components/PoDetail/dummyQcTemplate.tsx b/src/components/PoDetail/dummyQcTemplate.tsx index d148b24..6d7367d 100644 --- a/src/components/PoDetail/dummyQcTemplate.tsx +++ b/src/components/PoDetail/dummyQcTemplate.tsx @@ -1,8 +1,20 @@ -const dummyQCData = [ +import { PutawayLine } from "@/app/api/po/actions" + +export interface QcData { + id: number, + qcItem: string, + isPassed: boolean | undefined + isFailed: boolean | undefined + failedQty: number | undefined + remarks: string | undefined +} + +export const dummyQCData: QcData[] = [ { id: 1, qcItem: "目測", isPassed: undefined, + isFailed: undefined, failedQty: undefined, remarks: undefined, }, @@ -10,6 +22,7 @@ const dummyQCData = [ id: 2, qcItem: "目測2", isPassed: undefined, + isFailed: undefined, failedQty: undefined, remarks: undefined, }, @@ -17,7 +30,33 @@ const dummyQCData = [ id: 3, qcItem: "目測3", isPassed: undefined, + isFailed: undefined, failedQty: undefined, remarks: undefined, }, +] + +export interface EscalationData { + id: number, + escalation: string, + supervisor: string, +} + + +export const dummyEscalationHistory: EscalationData[] = [ + { + id: 1, + escalation: "上報1", + supervisor: "陳大文" + }, +] + +export const dummyPutawayLine: PutawayLine[] = [ + { + id: 1, + qty: 100, + warehouseId: 1, + warehouse: "W001 - 憶兆 3樓A倉", + printQty: 100 + } ] \ No newline at end of file diff --git a/src/components/PoSearch/PoSearch.tsx b/src/components/PoSearch/PoSearch.tsx index 7a6d30e..6876a74 100644 --- a/src/components/PoSearch/PoSearch.tsx +++ b/src/components/PoSearch/PoSearch.tsx @@ -65,11 +65,11 @@ const PoSearch: React.FC = ({ }, ]; return searchCriteria; - }, [t, po]); + }, [t]); const onDetailClick = useCallback( (po: PoResult) => { - router.push(`/po/edit?id=${po.id}`); + router.push(`/po/edit?id=${po.id}&start=true`); }, [router], ); @@ -111,7 +111,7 @@ const PoSearch: React.FC = ({ return "N/A" } const items = params.itemDetail.split(",") - return items.map((item) =>

{item}

) + return items.map((item) => {item}) }, }, { @@ -167,9 +167,13 @@ const PoSearch: React.FC = ({ setTotalCount(res.total); } }, - [fetchPoListClient], + [], ); + useEffect(() => { + console.log(filteredPo) + }, [filteredPo]) + useEffect(() => { newPageFetch(pagingController, filterArgs); }, [newPageFetch, pagingController, filterArgs]); diff --git a/src/i18n/zh/purchaseOrder.json b/src/i18n/zh/purchaseOrder.json index 01f99ef..54a160c 100644 --- a/src/i18n/zh/purchaseOrder.json +++ b/src/i18n/zh/purchaseOrder.json @@ -102,7 +102,20 @@ "submitStockIn": "更新來貨資料", "QC Info": "品檢資料", - "Escalation History": "品檢資料", + "Escalation History": "上報記錄", + "Escalation Info": "上報資料", + "Escalation Result": "上報結果", + + "update qc info": "更新品檢資料", + "email supplier": "電郵供應商", + "confirm putaway": "確定及上架", + + "warehouse": "倉庫", + "qcItem": "檢查項目", + "passed": "合格", + "failed": "不合格", + "failedQty": "不合格數", + "remarks": "備註", "Reject": "拒絕", "submit": "提交",