@@ -75,6 +75,7 @@ export interface InputDataGridProps<T, V, E> { | |||
needAdd?: boolean; | |||
showRemoveBtn?: boolean; | |||
addRowDefaultValue?: Partial<V>; | |||
_setRowModesModel?: Dispatch<SetStateAction<GridRowModesModel>>; | |||
} | |||
export interface SelectionInputDataGridProps<T, V, E> { | |||
@@ -87,6 +88,7 @@ export interface SelectionInputDataGridProps<T, V, E> { | |||
needAdd?: boolean; | |||
showRemoveBtn?: boolean; | |||
addRowDefaultValue?: Partial<V>; | |||
_setRowModesModel?: Dispatch<SetStateAction<GridRowModesModel>>; | |||
} | |||
export type Props<T, V, E> = | |||
@@ -115,6 +117,7 @@ function InputDataGrid<T, V, E>({ | |||
needAdd, | |||
showRemoveBtn = true, | |||
addRowDefaultValue = {}, | |||
_setRowModesModel = undefined, | |||
}: Props<T, V, E>) { | |||
const { | |||
t, | |||
@@ -123,6 +126,11 @@ function InputDataGrid<T, V, E>({ | |||
const formKey = _formKey.toString(); | |||
const { setValue, getValues } = useFormContext(); | |||
const [rowModesModel, setRowModesModel] = useState<GridRowModesModel>({}); | |||
useEffect(() => { | |||
if (_setRowModesModel) { | |||
_setRowModesModel(rowModesModel) | |||
} | |||
}, [rowModesModel]) | |||
// const apiRef = useGridApiRef(); | |||
const getRowId = useCallback<GridRowIdGetter<TableRow<V, E>>>( | |||
(row) => row.id! as number, | |||
@@ -19,7 +19,7 @@ import { | |||
import { Controller, useFormContext } from "react-hook-form"; | |||
import { useTranslation } from "react-i18next"; | |||
import StyledDataGrid from "../StyledDataGrid"; | |||
import { useCallback, useEffect, useMemo, useState } from "react"; | |||
import { Dispatch, SetStateAction, useCallback, useEffect, useMemo, useState } from "react"; | |||
import { | |||
GridColDef, | |||
GridRowIdGetter, | |||
@@ -52,6 +52,7 @@ import dayjs from "dayjs"; | |||
import arraySupport from "dayjs/plugin/arraySupport"; | |||
import { dummyPutAwayLine } from "./dummyQcTemplate"; | |||
import { PrinterCombo } from "@/app/api/settings/printer"; | |||
import { GridRowModesModel } from "@mui/x-data-grid"; | |||
dayjs.extend(arraySupport); | |||
interface Props { | |||
@@ -60,6 +61,7 @@ interface Props { | |||
disabled: boolean; | |||
// qc: QcItemWithChecks[]; | |||
printerCombo: PrinterCombo[]; | |||
setRowModesModel: Dispatch<SetStateAction<GridRowModesModel>>; | |||
} | |||
type EntryError = | |||
| { | |||
@@ -81,7 +83,7 @@ const style = { | |||
width: "auto", | |||
}; | |||
const PutAwayForm: React.FC<Props> = ({ itemDetail, warehouse, disabled, printerCombo }) => { | |||
const PutAwayForm: React.FC<Props> = ({ itemDetail, warehouse, disabled, printerCombo, setRowModesModel }) => { | |||
const { t } = useTranslation("purchaseOrder"); | |||
const apiRef = useGridApiRef(); | |||
const { | |||
@@ -541,6 +543,7 @@ const PutAwayForm: React.FC<Props> = ({ itemDetail, warehouse, disabled, printer | |||
needAdd={true} | |||
showRemoveBtn={false} | |||
addRowDefaultValue={addRowDefaultValue} | |||
_setRowModesModel={setRowModesModel} | |||
/> | |||
</Grid> | |||
</Grid> | |||
@@ -23,7 +23,7 @@ import QcComponent from "./QcComponent"; | |||
import { dummyPutAwayLine, dummyQCData } from "./dummyQcTemplate"; | |||
// import QcFormVer2 from "./QcFormVer2"; | |||
import PutAwayForm from "./PutAwayForm"; | |||
import { useGridApiRef } from "@mui/x-data-grid"; | |||
import { GridRowModes, useGridApiRef } from "@mui/x-data-grid"; | |||
import {submitDialogWithWarning} from "../Swal/CustomAlerts"; | |||
import { INPUT_DATE_FORMAT, arrayToDateString, arrayToInputDateString, dayjsToInputDateString } from "@/app/utils/formatUtil"; | |||
import dayjs from "dayjs"; | |||
@@ -32,6 +32,8 @@ import { downloadFile } from "@/app/utils/commonUtil"; | |||
import { PrinterCombo } from "@/app/api/settings/printer"; | |||
import { EscalationResult } from "@/app/api/escalation"; | |||
import { SessionWithTokens } from "@/config/authConfig"; | |||
import { GridRowModesModel } from "@mui/x-data-grid"; | |||
import { isEmpty } from "lodash"; | |||
const style = { | |||
@@ -355,6 +357,14 @@ const [qcItems, setQcItems] = useState(dummyQCData) | |||
}, | |||
[], | |||
); | |||
// Put away model | |||
const [pafRowModesModel, setPafRowModesModel] = useState<GridRowModesModel>({}) | |||
const pafSubmitDisable = useMemo(() => { | |||
// console.log("%c mode: ", "background:#90EE90; color:red", Object.entries(pafRowModesModel)) | |||
// console.log("%c mode: ", "background:pink; color:#87CEEB", Object.entries(pafRowModesModel)) | |||
return Object.entries(pafRowModesModel).length > 0 || Object.entries(pafRowModesModel).some(([key, value], index) => value.mode === GridRowModes.Edit) | |||
}, [pafRowModesModel]) | |||
// Putaway submission handler | |||
const onSubmitPutaway = useCallback<SubmitHandler<ModalFormInput>>( | |||
async (data, event) => { | |||
@@ -480,6 +490,7 @@ const [qcItems, setQcItems] = useState(dummyQCData) | |||
itemDetail={itemDetail} | |||
warehouse={warehouse!} | |||
disabled={viewOnly} | |||
setRowModesModel={setPafRowModesModel} | |||
/> | |||
<Stack direction="row" justifyContent="flex-end" gap={1}> | |||
<Autocomplete | |||
@@ -516,6 +527,7 @@ const [qcItems, setQcItems] = useState(dummyQCData) | |||
color="primary" | |||
sx={{ mt: 1 }} | |||
onClick={formProps.handleSubmit(onSubmitPutaway)} | |||
disabled={pafSubmitDisable} | |||
> | |||
{t("confirm putaway")} | |||
</Button> | |||