|
@@ -28,7 +28,6 @@ import { |
|
|
GridEditInputCell, |
|
|
GridEditInputCell, |
|
|
GridRowParams, |
|
|
GridRowParams, |
|
|
} from "@mui/x-data-grid"; |
|
|
} from "@mui/x-data-grid"; |
|
|
import { PlayArrow } from "@mui/icons-material"; |
|
|
|
|
|
import DoneIcon from "@mui/icons-material/Done"; |
|
|
import DoneIcon from "@mui/icons-material/Done"; |
|
|
import { GridRowSelectionModel } from "@mui/x-data-grid"; |
|
|
import { GridRowSelectionModel } from "@mui/x-data-grid"; |
|
|
import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; |
|
|
import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; |
|
@@ -36,6 +35,7 @@ import { |
|
|
completeConsoPickOrder, |
|
|
completeConsoPickOrder, |
|
|
CreateStockOutLine, |
|
|
CreateStockOutLine, |
|
|
createStockOutLine, |
|
|
createStockOutLine, |
|
|
|
|
|
fetchConsoStatus, |
|
|
fetchPickOrderLineClient, |
|
|
fetchPickOrderLineClient, |
|
|
fetchStockOutLineClient, |
|
|
fetchStockOutLineClient, |
|
|
PickOrderApprovalInput, |
|
|
PickOrderApprovalInput, |
|
@@ -63,6 +63,7 @@ import AutoFixNormalIcon from "@mui/icons-material/AutoFixNormal"; |
|
|
import ApprovalForm from "./ApprovalForm"; |
|
|
import ApprovalForm from "./ApprovalForm"; |
|
|
import InfoIcon from "@mui/icons-material/Info"; |
|
|
import InfoIcon from "@mui/icons-material/Info"; |
|
|
import VerifiedIcon from "@mui/icons-material/Verified"; |
|
|
import VerifiedIcon from "@mui/icons-material/Verified"; |
|
|
|
|
|
import { isNullOrUndefined } from "html5-qrcode/esm/core"; |
|
|
|
|
|
|
|
|
interface Props { |
|
|
interface Props { |
|
|
qc: QcItemWithChecks[]; |
|
|
qc: QcItemWithChecks[]; |
|
@@ -171,9 +172,16 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
headerName: "location", |
|
|
headerName: "location", |
|
|
flex: 1, |
|
|
flex: 1, |
|
|
renderCell: (params) => { |
|
|
renderCell: (params) => { |
|
|
if (!params.row.warehouse) return <></>; |
|
|
|
|
|
const warehouseList = JSON.parse(params.row.warehouse) as string[]; |
|
|
|
|
|
return FitAllCell(warehouseList); |
|
|
|
|
|
|
|
|
// console.log(params.row.warehouse) |
|
|
|
|
|
return params.row.warehouse; |
|
|
|
|
|
if (isNullOrUndefined(params.row.warehouse)) { |
|
|
|
|
|
return <></>; |
|
|
|
|
|
} else { |
|
|
|
|
|
const warehouseList = JSON.parse( |
|
|
|
|
|
`{${params.row.warehouse}}`, |
|
|
|
|
|
) as string[]; |
|
|
|
|
|
return FitAllCell(warehouseList); |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
@@ -181,7 +189,8 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
headerName: "suggestedLotNo", |
|
|
headerName: "suggestedLotNo", |
|
|
flex: 1.2, |
|
|
flex: 1.2, |
|
|
renderCell: (params) => { |
|
|
renderCell: (params) => { |
|
|
if (!params.row.suggestedLotNo) return <></>; |
|
|
|
|
|
|
|
|
return params.row.suggestedLotNo; |
|
|
|
|
|
if (isNullOrUndefined(params.row.suggestedLotNo)) return <></>; |
|
|
const suggestedLotNoList = JSON.parse( |
|
|
const suggestedLotNoList = JSON.parse( |
|
|
params.row.suggestedLotNo, |
|
|
params.row.suggestedLotNo, |
|
|
) as string[]; |
|
|
) as string[]; |
|
@@ -200,7 +209,14 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
[], |
|
|
[], |
|
|
); |
|
|
); |
|
|
|
|
|
|
|
|
const [isCompletedOrder, setIsCompletedOrder] = useState(false); |
|
|
|
|
|
|
|
|
const [isDisableComplete, setIsDisableComplete] = useState(true); |
|
|
|
|
|
const [status, setStatus] = useState(""); |
|
|
|
|
|
|
|
|
|
|
|
const getConsoStatus = useCallback(async () => { |
|
|
|
|
|
const status = await fetchConsoStatus(consoCode); |
|
|
|
|
|
console.log(status); |
|
|
|
|
|
setStatus(status.status); |
|
|
|
|
|
}, [fetchConsoStatus]); |
|
|
|
|
|
|
|
|
const fetchPickOrderLine = useCallback( |
|
|
const fetchPickOrderLine = useCallback( |
|
|
async (params: Record<string, any>) => { |
|
|
async (params: Record<string, any>) => { |
|
@@ -215,9 +231,10 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
if (res) { |
|
|
if (res) { |
|
|
console.log(res); |
|
|
console.log(res); |
|
|
console.log(res.records.every((line) => line.status == "completed")); |
|
|
console.log(res.records.every((line) => line.status == "completed")); |
|
|
setIsCompletedOrder(() => |
|
|
|
|
|
res.records.every((line) => line.status == "completed"), |
|
|
|
|
|
); |
|
|
|
|
|
|
|
|
setIsDisableComplete(res.records[0].poStatus === "completed"); |
|
|
|
|
|
// setIsDisableComplete(() => |
|
|
|
|
|
// res.records.every((line) => line.status !== "completed"), |
|
|
|
|
|
// ); |
|
|
setPickOrderLine(res.records); |
|
|
setPickOrderLine(res.records); |
|
|
|
|
|
|
|
|
setPolTotalCount(res.total); |
|
|
setPolTotalCount(res.total); |
|
@@ -233,21 +250,6 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
[fetchPickOrderLineClient, consoCode], |
|
|
[fetchPickOrderLineClient, consoCode], |
|
|
); |
|
|
); |
|
|
|
|
|
|
|
|
const buttonData = useMemo( |
|
|
|
|
|
() => ({ |
|
|
|
|
|
buttonName: "complete", |
|
|
|
|
|
title: t("Do you want to complete?"), |
|
|
|
|
|
confirmButtonText: t("Complete"), |
|
|
|
|
|
successTitle: t("Complete Success"), |
|
|
|
|
|
errorTitle: t("Complete Fail"), |
|
|
|
|
|
buttonText: t("Complete Pick Order"), |
|
|
|
|
|
buttonIcon: <DoneIcon />, |
|
|
|
|
|
buttonColor: "info", |
|
|
|
|
|
disabled: true, |
|
|
|
|
|
}), |
|
|
|
|
|
[], |
|
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
const [stockOutLine, setStockOutLine] = useState<StockOutLine[]>([]); |
|
|
const [stockOutLine, setStockOutLine] = useState<StockOutLine[]>([]); |
|
|
|
|
|
|
|
|
const getRowId = useCallback<GridRowIdGetter<StockOutLineRow>>( |
|
|
const getRowId = useCallback<GridRowIdGetter<StockOutLineRow>>( |
|
@@ -505,6 +507,7 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
key="edit" |
|
|
key="edit" |
|
|
/>, |
|
|
/>, |
|
|
<GridActionsCellItem |
|
|
<GridActionsCellItem |
|
|
|
|
|
key={1} |
|
|
icon={<DoDisturbIcon />} |
|
|
icon={<DoDisturbIcon />} |
|
|
label="Delete" |
|
|
label="Delete" |
|
|
sx={{ |
|
|
sx={{ |
|
@@ -593,7 +596,9 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
if (!qcOpen || !approvalOpen) { |
|
|
if (!qcOpen || !approvalOpen) { |
|
|
triggerRefetch(); |
|
|
triggerRefetch(); |
|
|
|
|
|
getConsoStatus(); |
|
|
fetchPickOrderLine(polCriteriaArgs); |
|
|
fetchPickOrderLine(polCriteriaArgs); |
|
|
|
|
|
// getConsoStatus() |
|
|
} |
|
|
} |
|
|
if (selectedRow.length > 0) fetchStockOutLine(solCriteriaArgs, selectedRow); |
|
|
if (selectedRow.length > 0) fetchStockOutLine(solCriteriaArgs, selectedRow); |
|
|
}, [ |
|
|
}, [ |
|
@@ -603,6 +608,7 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
selectedRow, |
|
|
selectedRow, |
|
|
triggerRefetch, |
|
|
triggerRefetch, |
|
|
polCriteriaArgs, |
|
|
polCriteriaArgs, |
|
|
|
|
|
getConsoStatus, |
|
|
]); |
|
|
]); |
|
|
|
|
|
|
|
|
const getLotDetail = useCallback( |
|
|
const getLotDetail = useCallback( |
|
@@ -739,32 +745,35 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
|
|
|
|
|
|
const handleCompleteOrder = useCallback(async () => { |
|
|
const handleCompleteOrder = useCallback(async () => { |
|
|
const res = await completeConsoPickOrder(consoCode); |
|
|
const res = await completeConsoPickOrder(consoCode); |
|
|
if (res) { |
|
|
|
|
|
|
|
|
if (res.message === "completed") { |
|
|
|
|
|
console.log(res); |
|
|
// completed |
|
|
// completed |
|
|
triggerRefetch(); |
|
|
triggerRefetch(); |
|
|
|
|
|
// setIsCompletedOrder(false) |
|
|
} else { |
|
|
} else { |
|
|
// not completed |
|
|
// not completed |
|
|
triggerRefetch(); |
|
|
triggerRefetch(); |
|
|
} |
|
|
} |
|
|
}, [consoCode, triggerRefetch]); |
|
|
|
|
|
|
|
|
}, [consoCode, triggerRefetch, completeConsoPickOrder]); |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<> |
|
|
<> |
|
|
<Stack spacing={2}> |
|
|
<Stack spacing={2}> |
|
|
<Grid container xs={12} justifyContent="start"> |
|
|
<Grid container xs={12} justifyContent="start"> |
|
|
<Grid item xs={12}> |
|
|
<Grid item xs={12}> |
|
|
<Typography variant="h4" marginInlineEnd={2}> |
|
|
<Typography variant="h4" marginInlineEnd={2}> |
|
|
{consoCode} |
|
|
|
|
|
|
|
|
{consoCode} - {status} |
|
|
</Typography> |
|
|
</Typography> |
|
|
</Grid> |
|
|
</Grid> |
|
|
<Grid item xs={8}> |
|
|
<Grid item xs={8}> |
|
|
<Button |
|
|
<Button |
|
|
// onClick={buttonData.onClick} |
|
|
// onClick={buttonData.onClick} |
|
|
disabled={!isCompletedOrder} |
|
|
|
|
|
color={buttonData.buttonColor as ButtonProps["color"]} |
|
|
|
|
|
startIcon={buttonData.buttonIcon} |
|
|
|
|
|
|
|
|
disabled={isDisableComplete} |
|
|
|
|
|
color={"info"} |
|
|
|
|
|
startIcon={<DoneIcon />} |
|
|
onClick={handleCompleteOrder} |
|
|
onClick={handleCompleteOrder} |
|
|
> |
|
|
> |
|
|
{buttonData.buttonText} |
|
|
|
|
|
|
|
|
{t("Complete Pick Order")} |
|
|
</Button> |
|
|
</Button> |
|
|
</Grid> |
|
|
</Grid> |
|
|
<Grid |
|
|
<Grid |
|
@@ -774,13 +783,16 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { |
|
|
justifyContent="end" |
|
|
justifyContent="end" |
|
|
alignItems="end" |
|
|
alignItems="end" |
|
|
> |
|
|
> |
|
|
<Button |
|
|
|
|
|
|
|
|
{/* <Button |
|
|
onClick={mannuallyAddRow} |
|
|
onClick={mannuallyAddRow} |
|
|
disabled={selectedRow.length === 0} |
|
|
disabled={selectedRow.length === 0} |
|
|
> |
|
|
> |
|
|
{isOpenScanner ? t("manual scanning") : t("manual scan")} |
|
|
{isOpenScanner ? t("manual scanning") : t("manual scan")} |
|
|
</Button> |
|
|
|
|
|
<Button onClick={onOpenScanner} disabled={selectedRow.length === 0}> |
|
|
|
|
|
|
|
|
</Button> */} |
|
|
|
|
|
<Button |
|
|
|
|
|
onClick={onOpenScanner} |
|
|
|
|
|
disabled={isDisableComplete ?? selectedRow.length === 0} |
|
|
|
|
|
> |
|
|
{isOpenScanner ? t("binding") : t("bind")} |
|
|
{isOpenScanner ? t("binding") : t("bind")} |
|
|
</Button> |
|
|
</Button> |
|
|
</Grid> |
|
|
</Grid> |
|
|