@@ -1,4 +1,4 @@ | |||
import ImportTesting from "@/components/ImportTesting"; | |||
import M18ImportTesting from "@/components/M18ImportTesting"; | |||
import { getServerI18n } from "@/i18n"; | |||
import { Stack } from "@mui/material"; | |||
import { Metadata } from "next"; | |||
@@ -8,8 +8,8 @@ export const metadata: Metadata = { | |||
title: "Import Testing" | |||
} | |||
const ImportTestingPage: React.FC = async () => { | |||
const { t } = await getServerI18n("importTesting"); | |||
const M18ImportTestingPage: React.FC = async () => { | |||
const { t } = await getServerI18n("m18ImportTesting"); | |||
return ( | |||
<> | |||
@@ -20,11 +20,11 @@ const ImportTestingPage: React.FC = async () => { | |||
rowGap={2} | |||
> | |||
</Stack> | |||
<Suspense fallback={<ImportTesting.Loading />}> | |||
<ImportTesting /> | |||
<Suspense fallback={<M18ImportTesting.Loading />}> | |||
<M18ImportTesting /> | |||
</Suspense> | |||
</> | |||
) | |||
} | |||
export default ImportTestingPage; | |||
export default M18ImportTestingPage; |
@@ -1,21 +0,0 @@ | |||
"use server"; | |||
import { serverFetchWithNoContent } from '@/app/utils/fetchUtil'; | |||
import { BASE_API_URL } from "@/config/api"; | |||
export interface ImportPoForm { | |||
dateFrom: string, | |||
dateTo: string, | |||
} | |||
export interface ImportTestingForm { | |||
po: ImportPoForm | |||
} | |||
export const testImportPo = async (data: ImportPoForm) => { | |||
return serverFetchWithNoContent(`${BASE_API_URL}/m18/po`, { | |||
method: "POST", | |||
body: JSON.stringify(data), | |||
headers: { "Content-Type": "application/json" }, | |||
}) | |||
} |
@@ -0,0 +1,49 @@ | |||
"use server"; | |||
import { serverFetchWithNoContent } from '@/app/utils/fetchUtil'; | |||
import { BASE_API_URL } from "@/config/api"; | |||
export interface M18ImportPoForm { | |||
modifiedDateFrom: string, | |||
modifiedDateTo: string, | |||
} | |||
export interface M18ImportPqForm { | |||
modifiedDateFrom: string, | |||
modifiedDateTo: string, | |||
} | |||
export interface M18ImportMasterDataForm { | |||
modifiedDateFrom: string, | |||
modifiedDateTo: string, | |||
} | |||
export interface M18ImportTestingForm { | |||
po: M18ImportPoForm, | |||
pq: M18ImportPqForm, | |||
masterData: M18ImportMasterDataForm, | |||
} | |||
export const testM18ImportPo = async (data: M18ImportPoForm) => { | |||
return serverFetchWithNoContent(`${BASE_API_URL}/m18/po`, { | |||
method: "POST", | |||
body: JSON.stringify(data), | |||
headers: { "Content-Type": "application/json" }, | |||
}) | |||
} | |||
export const testM18ImportPq = async (data: M18ImportPqForm) => { | |||
return serverFetchWithNoContent(`${BASE_API_URL}/m18/pq`, { | |||
method: "POST", | |||
body: JSON.stringify(data), | |||
headers: { "Content-Type": "application/json" }, | |||
}) | |||
} | |||
export const testM18ImportMasterData = async (data: M18ImportMasterDataForm) => { | |||
return serverFetchWithNoContent(`${BASE_API_URL}/m18/master-data`, { | |||
method: "POST", | |||
body: JSON.stringify(data), | |||
headers: { "Content-Type": "application/json" }, | |||
}) | |||
} |
@@ -1,67 +0,0 @@ | |||
"use client" | |||
import { ImportTestingForm, testImportPo } from "@/app/api/settings/importTesting/actions"; | |||
import { Card, CardContent, Grid, Stack, Typography } from "@mui/material"; | |||
import React, { BaseSyntheticEvent, FormEvent, useCallback, useState } from "react"; | |||
import { FormProvider, SubmitErrorHandler, useForm } from "react-hook-form"; | |||
import { useTranslation } from "react-i18next"; | |||
import ImportPo from "./ImportPo"; | |||
import { ImportPoForm } from "@/app/api/settings/importTesting/actions"; | |||
interface Props { | |||
} | |||
const ImportTesting: React.FC<Props> = ({ | |||
}) => { | |||
const { t } = useTranslation() | |||
const [isLoading, setIsLoading] = useState(false) | |||
const formProps = useForm<ImportTestingForm>() | |||
const onSubmit = useCallback(async (data: ImportTestingForm, event?: BaseSyntheticEvent) => { | |||
const buttonId = (event?.nativeEvent as SubmitEvent).submitter?.id | |||
console.log(data.po) | |||
switch (buttonId) { | |||
case "importPo": | |||
setIsLoading(() => true) | |||
const response = await testImportPo(data.po) | |||
console.log(response) | |||
if (response) { | |||
setIsLoading(() => false) | |||
} | |||
break; | |||
default: | |||
break; | |||
} | |||
}, []) | |||
const onSubmitError = useCallback<SubmitErrorHandler<ImportTestingForm>>( | |||
(errors) => { | |||
console.log(errors) | |||
}, | |||
[], | |||
); | |||
return ( | |||
<Card> | |||
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}> | |||
<Typography variant="overline">{t("Status: ")}{isLoading ? t("Importing...") : t("Ready to import")}</Typography> | |||
<FormProvider {...formProps}> | |||
<Stack | |||
spacing={2} | |||
component={"form"} | |||
onSubmit={formProps.handleSubmit(onSubmit, onSubmitError)} | |||
> | |||
<Grid container> | |||
<ImportPo /> | |||
</Grid> | |||
</Stack> | |||
</FormProvider> | |||
</CardContent> | |||
</Card> | |||
) | |||
} | |||
export default ImportTesting; |
@@ -1,17 +0,0 @@ | |||
import React from "react"; | |||
import GeneralLoading from "../General/GeneralLoading" | |||
import ImportTesting from "./ImportTesting"; | |||
interface SubComponents { | |||
Loading: typeof GeneralLoading; | |||
} | |||
const ImportTestingWrapper: React.FC & SubComponents = async () => { | |||
return <ImportTesting/> | |||
} | |||
ImportTestingWrapper.Loading = GeneralLoading; | |||
export default ImportTestingWrapper |
@@ -1 +0,0 @@ | |||
export { default } from './ImportTestingWrapper' |
@@ -0,0 +1,126 @@ | |||
"use client" | |||
import { M18ImportTestingForm, M18ImportMasterDataForm } from "@/app/api/settings/m18ImportTesting/actions"; | |||
import { INPUT_DATE_FORMAT, OUTPUT_DATE_FORMAT, OUTPUT_TIME_FORMAT, dateTimeStringToDayjs } from "@/app/utils/formatUtil"; | |||
import { Check } from "@mui/icons-material"; | |||
import { Box, Button, Card, CardContent, FormControl, Grid, Stack, Typography } from "@mui/material"; | |||
import { DatePicker, DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers"; | |||
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; | |||
import dayjs, { Dayjs } from "dayjs"; | |||
import React, { useCallback, useState } from "react"; | |||
import { Controller, useFormContext } from "react-hook-form"; | |||
import { useTranslation } from "react-i18next"; | |||
interface Props { | |||
} | |||
const M18ImportMasterData: React.FC<Props> = ({ | |||
}) => { | |||
const { t } = useTranslation() | |||
const [isLoading, setIsLoading] = useState(false) | |||
const { | |||
control, | |||
formState: { errors }, | |||
watch | |||
} = useFormContext<M18ImportTestingForm>() | |||
const handleDateTimePickerOnChange = useCallback((value: Dayjs | null, onChange: (value: any) => void) => { | |||
const formattedValue = value ? value.format(`${INPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`) : null | |||
onChange(formattedValue) | |||
}, []) | |||
return ( | |||
<Card sx={{ width: '100%' }}> | |||
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}> | |||
<Grid container> | |||
<Grid container> | |||
<Typography variant="overline">{t("Import Master Data")}</Typography> | |||
</Grid> | |||
<Grid item xs={8}> | |||
<LocalizationProvider | |||
dateAdapter={AdapterDayjs} | |||
// TODO: Should maybe use a custom adapterLocale here to support YYYY-MM-DD | |||
adapterLocale="zh-hk" | |||
> | |||
<Box display="flex"> | |||
<Controller | |||
control={control} | |||
name="masterData.modifiedDateFrom" | |||
// rules={{ | |||
// // required: "Please input the date From!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time" | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Modified Date From")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
textField: { | |||
error: !!error, | |||
helperText: error ? error.message : null | |||
} | |||
}} | |||
/> | |||
)} | |||
/> | |||
<Box | |||
display="flex" | |||
alignItems="center" | |||
justifyContent="center" | |||
marginInline={2} | |||
> | |||
{"-"} | |||
</Box> | |||
<Controller | |||
control={control} | |||
name="masterData.modifiedDateTo" | |||
// rules={{ | |||
// // required: "Please input the date to!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time", | |||
// isFuture: (value) => | |||
// dateTimeStringToDayjs(value).isAfter(watch("po.dateFrom")) || "Date must be in the future", | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Modified Date To")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
textField: { | |||
error: !!error, | |||
helperText: error ? error.message : null | |||
} | |||
}} | |||
/> | |||
)} | |||
/> | |||
</Box> | |||
</LocalizationProvider> | |||
</Grid> | |||
</Grid> | |||
<Stack direction="row" justifyContent="flex-end" gap={1}> | |||
<Button | |||
name="m18ImportMasterData" | |||
id="m18ImportMasterData" | |||
variant="contained" | |||
startIcon={<Check />} | |||
type="submit" | |||
> | |||
{t("Import Master Data")} | |||
</Button> | |||
</Stack> | |||
</CardContent> | |||
</Card> | |||
) | |||
} | |||
export default M18ImportMasterData; |
@@ -1,6 +1,5 @@ | |||
"use client" | |||
import { ImportTestingForm } from "@/app/api/settings/importTesting/actions"; | |||
import { ImportPoForm } from "@/app/api/settings/importTesting/actions"; | |||
import { M18ImportTestingForm, M18ImportPoForm } from "@/app/api/settings/m18ImportTesting/actions"; | |||
import { INPUT_DATE_FORMAT, OUTPUT_DATE_FORMAT, OUTPUT_TIME_FORMAT, dateTimeStringToDayjs } from "@/app/utils/formatUtil"; | |||
import { Check } from "@mui/icons-material"; | |||
import { Box, Button, Card, CardContent, FormControl, Grid, Stack, Typography } from "@mui/material"; | |||
@@ -14,7 +13,7 @@ import { useTranslation } from "react-i18next"; | |||
interface Props { | |||
} | |||
const ImportPo: React.FC<Props> = ({ | |||
const M18ImportPo: React.FC<Props> = ({ | |||
}) => { | |||
const { t } = useTranslation() | |||
@@ -23,7 +22,7 @@ const ImportPo: React.FC<Props> = ({ | |||
control, | |||
formState: { errors }, | |||
watch | |||
} = useFormContext<ImportTestingForm>() | |||
} = useFormContext<M18ImportTestingForm>() | |||
const handleDateTimePickerOnChange = useCallback((value: Dayjs | null, onChange: (value: any) => void) => { | |||
const formattedValue = value ? value.format(`${INPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`) : null | |||
@@ -37,7 +36,7 @@ const ImportPo: React.FC<Props> = ({ | |||
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}> | |||
<Grid container> | |||
<Grid container> | |||
<Typography variant="overline">{t("Import PO")}</Typography> | |||
<Typography variant="overline">{t("Import Purchase Order")}</Typography> | |||
</Grid> | |||
<Grid item xs={8}> | |||
<LocalizationProvider | |||
@@ -48,17 +47,17 @@ const ImportPo: React.FC<Props> = ({ | |||
<Box display="flex"> | |||
<Controller | |||
control={control} | |||
name="po.dateFrom" | |||
rules={{ | |||
required: "Please input the date From!", | |||
validate: { | |||
isValid: (value) => | |||
value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time" | |||
}, | |||
}} | |||
name="po.modifiedDateFrom" | |||
// rules={{ | |||
// required: "Please input the date From!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time" | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Import Po From")} | |||
label={t("Modified Date From *")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
@@ -80,19 +79,19 @@ const ImportPo: React.FC<Props> = ({ | |||
</Box> | |||
<Controller | |||
control={control} | |||
name="po.dateTo" | |||
rules={{ | |||
required: "Please input the date to!", | |||
validate: { | |||
isValid: (value) => | |||
value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time", | |||
isFuture: (value) => | |||
dateTimeStringToDayjs(value).isAfter(watch("po.dateFrom")) || "Date must be in the future", | |||
}, | |||
}} | |||
name="po.modifiedDateTo" | |||
// rules={{ | |||
// required: "Please input the date to!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time", | |||
// isFuture: (value) => | |||
// dateTimeStringToDayjs(value).isAfter(watch("po.dateFrom")) || "Date must be in the future", | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Import Po To")} | |||
label={t("Modified Date To *")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
@@ -110,8 +109,8 @@ const ImportPo: React.FC<Props> = ({ | |||
</Grid> | |||
<Stack direction="row" justifyContent="flex-end" gap={1}> | |||
<Button | |||
name="importPo" | |||
id="importPo" | |||
name="m18ImportPo" | |||
id="m18ImportPo" | |||
variant="contained" | |||
startIcon={<Check />} | |||
type="submit" | |||
@@ -124,4 +123,4 @@ const ImportPo: React.FC<Props> = ({ | |||
) | |||
} | |||
export default ImportPo; | |||
export default M18ImportPo; |
@@ -0,0 +1,126 @@ | |||
"use client" | |||
import { M18ImportTestingForm, M18ImportPqForm } from "@/app/api/settings/m18ImportTesting/actions"; | |||
import { INPUT_DATE_FORMAT, OUTPUT_DATE_FORMAT, OUTPUT_TIME_FORMAT, dateTimeStringToDayjs } from "@/app/utils/formatUtil"; | |||
import { Check } from "@mui/icons-material"; | |||
import { Box, Button, Card, CardContent, FormControl, Grid, Stack, Typography } from "@mui/material"; | |||
import { DatePicker, DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers"; | |||
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; | |||
import dayjs, { Dayjs } from "dayjs"; | |||
import React, { useCallback, useState } from "react"; | |||
import { Controller, useFormContext } from "react-hook-form"; | |||
import { useTranslation } from "react-i18next"; | |||
interface Props { | |||
} | |||
const M18ImportPq: React.FC<Props> = ({ | |||
}) => { | |||
const { t } = useTranslation() | |||
const [isLoading, setIsLoading] = useState(false) | |||
const { | |||
control, | |||
formState: { errors }, | |||
watch | |||
} = useFormContext<M18ImportTestingForm>() | |||
const handleDateTimePickerOnChange = useCallback((value: Dayjs | null, onChange: (value: any) => void) => { | |||
const formattedValue = value ? value.format(`${INPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`) : null | |||
onChange(formattedValue) | |||
}, []) | |||
return ( | |||
<Card sx={{ width: '100%' }}> | |||
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}> | |||
<Grid container> | |||
<Grid container> | |||
<Typography variant="overline">{t("Import Purchase Quotation")}</Typography> | |||
</Grid> | |||
<Grid item xs={8}> | |||
<LocalizationProvider | |||
dateAdapter={AdapterDayjs} | |||
// TODO: Should maybe use a custom adapterLocale here to support YYYY-MM-DD | |||
adapterLocale="zh-hk" | |||
> | |||
<Box display="flex"> | |||
<Controller | |||
control={control} | |||
name="pq.modifiedDateFrom" | |||
// rules={{ | |||
// // required: "Please input the date From!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time" | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Modified Date From")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
textField: { | |||
error: !!error, | |||
helperText: error ? error.message : null | |||
} | |||
}} | |||
/> | |||
)} | |||
/> | |||
<Box | |||
display="flex" | |||
alignItems="center" | |||
justifyContent="center" | |||
marginInline={2} | |||
> | |||
{"-"} | |||
</Box> | |||
<Controller | |||
control={control} | |||
name="pq.modifiedDateTo" | |||
// rules={{ | |||
// // required: "Please input the date to!", | |||
// validate: { | |||
// isValid: (value) => | |||
// value && dateTimeStringToDayjs(value).isValid() ? true : "Invalid date-time", | |||
// isFuture: (value) => | |||
// dateTimeStringToDayjs(value).isAfter(watch("po.dateFrom")) || "Date must be in the future", | |||
// }, | |||
// }} | |||
render={({ field, fieldState: { error } }) => ( | |||
<DateTimePicker | |||
label={t("Modified Date To")} | |||
format={`${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`} | |||
onChange={(newValue: Dayjs | null) => (handleDateTimePickerOnChange(newValue, field.onChange))} | |||
slotProps={{ | |||
textField: { | |||
error: !!error, | |||
helperText: error ? error.message : null | |||
} | |||
}} | |||
/> | |||
)} | |||
/> | |||
</Box> | |||
</LocalizationProvider> | |||
</Grid> | |||
</Grid> | |||
<Stack direction="row" justifyContent="flex-end" gap={1}> | |||
<Button | |||
name="m18ImportPq" | |||
id="m18ImportPq" | |||
variant="contained" | |||
startIcon={<Check />} | |||
type="submit" | |||
> | |||
{t("Import Pq")} | |||
</Button> | |||
</Stack> | |||
</CardContent> | |||
</Card> | |||
) | |||
} | |||
export default M18ImportPq; |
@@ -0,0 +1,143 @@ | |||
"use client" | |||
import { M18ImportTestingForm, testM18ImportPo, M18ImportPoForm, testM18ImportPq, testM18ImportMasterData } from "@/app/api/settings/m18ImportTesting/actions"; | |||
import { Card, CardContent, Grid, Stack, Typography } from "@mui/material"; | |||
import React, { BaseSyntheticEvent, FormEvent, useCallback, useState } from "react"; | |||
import { FormProvider, SubmitErrorHandler, useForm } from "react-hook-form"; | |||
import { useTranslation } from "react-i18next"; | |||
import M18ImportPo from "./M18ImportPo"; | |||
import M18ImportPq from "./M18ImportPq"; | |||
import { dateTimeStringToDayjs } from "@/app/utils/formatUtil"; | |||
import M18ImportMasterData from "./M18ImportMasterData"; | |||
interface Props { | |||
} | |||
const M18ImportTesting: React.FC<Props> = ({ | |||
}) => { | |||
const { t } = useTranslation() | |||
const [isLoading, setIsLoading] = useState(false) | |||
const formProps = useForm<M18ImportTestingForm>() | |||
const onSubmit = useCallback(async (data: M18ImportTestingForm, event?: BaseSyntheticEvent) => { | |||
console.log(isLoading) | |||
if (isLoading) { | |||
return; | |||
} | |||
const buttonId = (event?.nativeEvent as SubmitEvent).submitter?.id | |||
console.log(data) | |||
console.log(buttonId) | |||
switch (buttonId) { | |||
case "m18ImportMasterData": | |||
const mdDateFrom = data.masterData.modifiedDateFrom | |||
const mdDateTo = data.masterData.modifiedDateTo | |||
if (!(!!mdDateFrom && dateTimeStringToDayjs(mdDateFrom).isValid())) { | |||
formProps.setError("masterData.modifiedDateFrom", { message: "Invalid DateTime Format" }) | |||
} | |||
if (!(!!mdDateTo && dateTimeStringToDayjs(mdDateTo).isValid())) { | |||
formProps.setError("masterData.modifiedDateTo", { message: "Invalid DateTime Format" }) | |||
} | |||
if (formProps.formState.errors.masterData) { | |||
return; | |||
} | |||
setIsLoading(() => true) | |||
const mdResponse = await testM18ImportMasterData(data.masterData) | |||
console.log(mdResponse) | |||
if (mdResponse) { | |||
setIsLoading(() => false) | |||
} | |||
break; | |||
case "m18ImportPo": | |||
const poDateFrom = data.po.modifiedDateFrom | |||
const poDateTo = data.po.modifiedDateTo | |||
if (!(poDateFrom && dateTimeStringToDayjs(poDateFrom).isValid())) { | |||
formProps.setError("po.modifiedDateFrom", { message: "Invalid DateTime Format" }) | |||
} | |||
if (!(poDateTo && dateTimeStringToDayjs(poDateTo).isValid())) { | |||
formProps.setError("po.modifiedDateTo", { message: "Invalid DateTime Format" }) | |||
} | |||
if (formProps.formState.errors.po) { | |||
return; | |||
} | |||
setIsLoading(() => true) | |||
const poResponse = await testM18ImportMasterData(data.po) | |||
console.log(poResponse) | |||
if (poResponse) { | |||
setIsLoading(() => false) | |||
} | |||
break; | |||
case "m18ImportPq": | |||
const pqDateFrom = data.pq.modifiedDateFrom | |||
const pqDateTo = data.pq.modifiedDateTo | |||
if (!(!!pqDateFrom && dateTimeStringToDayjs(pqDateFrom).isValid())) { | |||
formProps.setError("pq.modifiedDateFrom", { message: "Invalid DateTime Format" }) | |||
} | |||
if (!(!!pqDateTo && dateTimeStringToDayjs(pqDateTo).isValid())) { | |||
formProps.setError("pq.modifiedDateTo", { message: "Invalid DateTime Format" }) | |||
} | |||
if (formProps.formState.errors.pq) { | |||
return; | |||
} | |||
setIsLoading(() => true) | |||
const pqResponse = await testM18ImportPq(data.pq) | |||
console.log(pqResponse) | |||
if (pqResponse) { | |||
setIsLoading(() => false) | |||
} | |||
break; | |||
default: | |||
break; | |||
} | |||
}, []) | |||
// const onSubmitError = useCallback<SubmitErrorHandler<M18ImportTestingForm>>( | |||
// (errors) => { | |||
// console.log(errors) | |||
// }, | |||
// [], | |||
// ); | |||
return ( | |||
<Card> | |||
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}> | |||
<Typography variant="overline">{t("Status: ")}{isLoading ? t("Importing...") : t("Ready to import")}</Typography> | |||
<FormProvider {...formProps}> | |||
<Stack | |||
spacing={2} | |||
component={"form"} | |||
onSubmit={formProps.handleSubmit(onSubmit)} | |||
> | |||
<Grid container columnGap={2} rowGap={2}> | |||
<Grid item xs={12}> | |||
<M18ImportMasterData /> | |||
</Grid> | |||
<Grid item xs={12}> | |||
<M18ImportPo /> | |||
</Grid> | |||
<Grid item xs={12}> | |||
<M18ImportPq /> | |||
</Grid> | |||
</Grid> | |||
</Stack> | |||
</FormProvider> | |||
</CardContent> | |||
</Card> | |||
) | |||
} | |||
export default M18ImportTesting; |
@@ -0,0 +1,17 @@ | |||
import React from "react"; | |||
import GeneralLoading from "../General/GeneralLoading" | |||
import M18ImportTesting from "./M18ImportTesting"; | |||
interface SubComponents { | |||
Loading: typeof GeneralLoading; | |||
} | |||
const M18ImportTestingWrapper: React.FC & SubComponents = async () => { | |||
return <M18ImportTesting/> | |||
} | |||
M18ImportTestingWrapper.Loading = GeneralLoading; | |||
export default M18ImportTestingWrapper |
@@ -0,0 +1 @@ | |||
export { default } from './M18ImportTestingWrapper' |
@@ -266,7 +266,7 @@ const NavigationContent: React.FC = () => { | |||
{ | |||
icon: <RequestQuote />, | |||
label: "Import Testing", | |||
path: "/settings/importTesting", | |||
path: "/settings/m18ImportTesting", | |||
}, | |||
], | |||
}, | |||