165 lines
7.5 KiB
JavaScript
165 lines
7.5 KiB
JavaScript
import LtrTextField from "@/core/components/LtrTextField";
|
|
import MuiDatePicker from "@/core/components/MuiDatePicker";
|
|
import MuiTimePicker from "@/core/components/MuiTimePicker";
|
|
import { START_MISSION } from "@/core/utils/routes";
|
|
import useRequest from "@/lib/hooks/useRequest";
|
|
import { yupResolver } from "@hookform/resolvers/yup";
|
|
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
|
|
import { format } from "date-fns-jalali";
|
|
import { Controller, useForm } from "react-hook-form";
|
|
import { mixed, object, string } from "yup";
|
|
|
|
const StartMissionContent = ({ rowId, mutate, setOpenStartMissionDialog }) => {
|
|
const requestServer = useRequest({ notificationSuccess: true });
|
|
const now = new Date();
|
|
|
|
const validationSchema = object().shape({
|
|
code: string().length(6, "کد خروج باید 6 رقم باشد").required("لطفاً کد خروج را وارد کنید."),
|
|
km: string().required("لطفاً کیلومتر را وارد کنید."),
|
|
start_date: mixed().required("تاریخ خروج خودرو را مشخص کنید."),
|
|
start_time: mixed().required("ساعت خروج خودرو را مشخص کنید."),
|
|
});
|
|
|
|
const {
|
|
control,
|
|
handleSubmit,
|
|
formState: { isSubmitting },
|
|
} = useForm({
|
|
defaultValues: {
|
|
code: "",
|
|
km: "",
|
|
start_date: null,
|
|
start_time: null,
|
|
},
|
|
resolver: yupResolver(validationSchema),
|
|
mode: "all",
|
|
});
|
|
|
|
const onSubmit = (values) => {
|
|
const formattedDate = values.start_date;
|
|
const formattedTime = format(values.start_time, "HH:mm");
|
|
|
|
requestServer(`${START_MISSION}/${rowId}`, "post", {
|
|
data: {
|
|
code: values.code,
|
|
km: values.km,
|
|
time: `${formattedDate} ${formattedTime}`,
|
|
},
|
|
hasSidebarUpdate: true,
|
|
})
|
|
.then(() => {
|
|
mutate();
|
|
setOpenStartMissionDialog(false);
|
|
})
|
|
.catch(() => {});
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<DialogContent dividers>
|
|
<Stack alignItems="center" spacing={2}>
|
|
<Typography mt={2}>آیا از خروج خودرو و شروع ماموریت اطمینان دارید؟</Typography>
|
|
<Stack sx={{ width: "84%" }}>
|
|
<Controller
|
|
control={control}
|
|
name={"code"}
|
|
render={({ field, fieldState: { error } }) => (
|
|
<LtrTextField
|
|
{...field}
|
|
label={"کد خروج"}
|
|
placeholder="xxxxxx"
|
|
error={!!error}
|
|
helperText={error?.message}
|
|
size="small"
|
|
onChange={(e) => {
|
|
if (isNaN(Number(e.target.value))) return;
|
|
e.target.value.length <= 6 ? field.onChange(e.target.value) : null;
|
|
}}
|
|
type="tel"
|
|
autoComplete="off"
|
|
fullWidth
|
|
variant="outlined"
|
|
InputLabelProps={{ shrink: true }}
|
|
/>
|
|
)}
|
|
/>
|
|
</Stack>
|
|
<Stack sx={{ width: "84%" }}>
|
|
<Controller
|
|
control={control}
|
|
name={"km"}
|
|
render={({ field, fieldState: { error } }) => (
|
|
<LtrTextField
|
|
autoComplete="off"
|
|
type="tel"
|
|
value={field.value}
|
|
onChange={(e) => {
|
|
if (isNaN(Number(e.target.value))) return;
|
|
field.onChange(e.target.value);
|
|
}}
|
|
size="small"
|
|
fullWidth
|
|
label="کیلومتر خودرو / ساعت کار"
|
|
InputLabelProps={{ shrink: true }}
|
|
/>
|
|
)}
|
|
/>
|
|
</Stack>
|
|
<Stack>
|
|
<Controller
|
|
control={control}
|
|
name={"start_date"}
|
|
render={({ field, fieldState: { error } }) => (
|
|
<MuiDatePicker
|
|
name="start_date"
|
|
error={error}
|
|
value={field.value || null}
|
|
disableFuture={false}
|
|
minDate={now}
|
|
placeholder={"تاریخ شروع ماموریت را وارد کنید"}
|
|
label={"تاریخ شروع ماموریت"}
|
|
setFieldValue={(name, value) => field.onChange(value || null)}
|
|
helperText={error ? error.message : null}
|
|
/>
|
|
)}
|
|
/>
|
|
</Stack>
|
|
<Stack>
|
|
<Controller
|
|
control={control}
|
|
name={"start_time"}
|
|
render={({ field, fieldState: { error } }) => (
|
|
<MuiTimePicker
|
|
name="start_time"
|
|
error={error}
|
|
value={field.value || null}
|
|
views={["hours", "minutes"]}
|
|
placeholder={"زمان شروع ماموریت را وارد کنید"}
|
|
label={"زمان شروع ماموریت"}
|
|
setFieldValue={(name, value) => field.onChange(value || null)}
|
|
helperText={error ? error.message : null}
|
|
/>
|
|
)}
|
|
/>
|
|
</Stack>
|
|
</Stack>
|
|
</DialogContent>
|
|
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
|
|
<Button
|
|
onClick={() => setOpenStartMissionDialog(false)}
|
|
variant="outlined"
|
|
color="secondary"
|
|
disabled={isSubmitting}
|
|
>
|
|
خیر !
|
|
</Button>
|
|
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
|
|
{isSubmitting ? "درحال ثبت..." : "بله اطمینان دارم"}
|
|
</Button>
|
|
</DialogActions>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default StartMissionContent;
|