diff --git a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/CreateFormContent.jsx b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/CreateFormContent.jsx index 1781457..cfe6c09 100644 --- a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/CreateFormContent.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/CreateFormContent.jsx @@ -29,8 +29,24 @@ const validationSchema = object({ item_id: number().required("نوع آیتم را مشخص کنید!"), sub_item_id: number().required("اقدام انجام شده را مشخص کنید!"), amount: string().required("وارد کردن مقدار الزامیست!"), - cmms_machines: array().required("وارد کردن کد خودرو الزامیست!").min(1, "حداقل یک کد خودرو باید وارد شود!"), - rahdaran_id: array().required("وارد کردن کد راهداران الزامیست!").min(1, "حداقل یک کد راهدار باید وارد شود!"), // بررسی حداقل یک آیتم, + cmms_machines: array() + .test("cmms-machines-conditional", "وارد کردن کد خودرو الزامیست!", function (value) { + const { is_gasht } = this.options.context; + if (is_gasht) { + return true; // اگر is_gasht true باشد، این فیلد نیاز به اعتبارسنجی ندارد + } + return Array.isArray(value) && value.length > 0; // حداقل یک کد باید وجود داشته باشد + }) + .min(1, "حداقل یک کد خودرو باید وارد شود!"), // پیام خطا برای زمانی که شرط تست برقرار باشد + rahdaran_id: array() + .test("rahdaran-id-conditional", "وارد کردن کد راهداران الزامیست!", function (value) { + const { is_gasht } = this.options.context; + if (is_gasht) { + return true; // اگر is_gasht true باشد، این فیلد نیاز به اعتبارسنجی ندارد + } + return Array.isArray(value) && value.length > 0; // حداقل یک کد باید وجود داشته باشد + }) + .min(1, "حداقل یک کد راهدار باید وارد شود!"), // پیام خطا برای زمانی که شرط تست برقرار باشد activity_time: string().test("activity-time-conditional", "لطفا زمان فعالیت را انتخاب کنید!", function (value) { const { is_gasht } = this.options.context; // دسترسی به context if (is_gasht) { @@ -91,11 +107,14 @@ const CreateFormContent = ({ setOpen, onSubmit, is_gasht = false }) => { amount: "", before_image: null, after_image: null, - cmms_machines: null, - rahdaran_id: null, start_point: "", end_point: "", - ...(!is_gasht && { activity_time: "", activity_date: "" }), + ...(!is_gasht && { + activity_time: "", + activity_date: "", + cmms_machines: [], + rahdaran_id: [], + }), }; const [tabState, setTabState] = useState(0); @@ -175,17 +194,24 @@ const CreateFormContent = ({ setOpen, onSubmit, is_gasht = false }) => { result.start_point = `${result.start_point.lat},${result.start_point.lng}`; } - result.rahdaran_id.forEach((rahdar, index) => { - result[`rahdaran_id[${index}]`] = rahdar.id; - }); - delete result.rahdaran_id; + if (!is_gasht) { + result.rahdaran_id.forEach((rahdar, index) => { + result[`rahdaran_id[${index}]`] = rahdar.id; + }); + delete result.rahdaran_id; - result.cmms_machines.forEach((cmms_machine, index) => { - result[`machines_id[${index}]`] = cmms_machine.id; - }); - delete result.cmms_machines; + result.cmms_machines.forEach((cmms_machine, index) => { + result[`machines_id[${index}]`] = cmms_machine.id; + }); + delete result.cmms_machines; - result[`activity_time`] = format(new Date(result.activity_time), "HH:mm"); + result[`activity_time`] = format(new Date(result.activity_time), "HH:mm"); + } else { + delete result.rahdaran_id; + delete result.cmms_machines; + delete result.activity_date; + delete result.activity_time; + } await onSubmit({ result, diff --git a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/GetItemInfo.jsx b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/GetItemInfo.jsx index a80f4af..bb9cbe0 100644 --- a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/GetItemInfo.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/GetItemInfo.jsx @@ -43,37 +43,41 @@ const GetItemInfo = ({ register, itemsList, subItemsList, control, setValue, err fullWidth /> - - { - return ( - field.onChange(value || [])} - error={error} - multiple={true} - /> - ); - }} - name={"cmms_machines"} - /> - - - { - return ( - field.onChange(value || [])} - error={error} - /> - ); - }} - name={"rahdaran_id"} - /> - + {!is_gasht && ( + + { + return ( + field.onChange(value || [])} + error={error} + multiple={true} + /> + ); + }} + name={"cmms_machines"} + /> + + )} + {!is_gasht && ( + + { + return ( + field.onChange(value || [])} + error={error} + /> + ); + }} + name={"rahdaran_id"} + /> + + )} {subItemsList.needs_image ? ( diff --git a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/index.jsx b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/index.jsx index 3e78906..b2d73b5 100644 --- a/src/components/dashboard/roadItems/operator/Actions/Create/Forms/index.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/Create/Forms/index.jsx @@ -18,11 +18,13 @@ const OperatorCreateForm = ({ open, setOpen, mutate, rowId }) => { mutate(); setOpen(false); }) - .catch((error) => {}); + .catch((error) => { }); }; return ( - + {open && ( + + )} ); }; diff --git a/src/components/dashboard/roadItems/operator/Actions/Create/index.jsx b/src/components/dashboard/roadItems/operator/Actions/Create/index.jsx index ce764e7..a503283 100644 --- a/src/components/dashboard/roadItems/operator/Actions/Create/index.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/Create/index.jsx @@ -31,7 +31,7 @@ const OperatorCreate = ({ mutate }) => { ثبت فعالیت )} - {open && } + ); }; diff --git a/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/GashtCreate.jsx b/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/GashtCreate.jsx index ca4cd51..968d907 100644 --- a/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/GashtCreate.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/GashtCreate.jsx @@ -6,7 +6,9 @@ const GashtCreate = ({ open, setOpen, mutate, rowId }) => { const [tabState, setTabState] = useState(0); return ( - + {open && ( + + )} ); }; diff --git a/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/index.jsx b/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/index.jsx index 4379040..b6eb6b8 100644 --- a/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/index.jsx +++ b/src/components/dashboard/roadItems/operator/Actions/ObservedGashtCreate/index.jsx @@ -35,7 +35,7 @@ const ObservedGashtCreate = ({ mutate }) => { ثبت فعالیت برای موارد مشاهده شده در گشت راهداری )} - {open && } + ); }; diff --git a/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormContent.jsx b/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormContent.jsx index 530583b..d8b8dc3 100644 --- a/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormContent.jsx +++ b/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormContent.jsx @@ -3,7 +3,7 @@ import React from "react"; import useRoadItemGetISubtems from "@/lib/hooks/useRoadItemGetISubtems"; import EditFormCreate from "@/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormCreate"; -const EditFormContent = ({ setOpenEditDialog, onSubmit, defaultData }) => { +const EditFormContent = ({ setOpenEditDialog, onSubmit, defaultData, is_gasht }) => { const { subItemsList, loadingSubItemsList, errorSubItemsList } = useRoadItemGetISubtems(defaultData?.item_id); const subItem = subItemsList.find((SubItem) => SubItem.sub_item === defaultData?.sub_item_id); @@ -13,8 +13,10 @@ const EditFormContent = ({ setOpenEditDialog, onSubmit, defaultData }) => { amount: defaultData?.amount || null, start_point: defaultData?.start_point || { lat: "", lng: "" }, end_point: defaultData?.end_point || { lat: "", lng: "" }, - cmms_machines: defaultData?.cmms_machines || null, - rahdaran_id: defaultData?.rahdaran_id || null, + ...(!is_gasht && { + cmms_machines: defaultData?.cmms_machines || null, + rahdaran_id: defaultData?.rahdaran_id || null, + }), }; const onSubmitBase = async (data) => { @@ -43,15 +45,20 @@ const EditFormContent = ({ setOpenEditDialog, onSubmit, defaultData }) => { result.start_point = `${result.start_point.lat},${result.start_point.lng}`; } - result.rahdaran_id.forEach((rahdar, index) => { - result[`rahdaran_id[${index}]`] = rahdar.id; - }); - delete result.rahdaran_id; + if (!is_gasht) { + result.rahdaran_id.forEach((rahdar, index) => { + result[`rahdaran_id[${index}]`] = rahdar.id; + }); + delete result.rahdaran_id; - result.cmms_machines.forEach((cmms_machine, index) => { - result[`machines_id[${index}]`] = cmms_machine.id; - }); - delete result.cmms_machines; + result.cmms_machines.forEach((cmms_machine, index) => { + result[`machines_id[${index}]`] = cmms_machine.id; + }); + delete result.cmms_machines; + } else { + delete result.rahdaran_id; + delete result.cmms_machines; + } await onSubmit({ result, @@ -81,6 +88,7 @@ const EditFormContent = ({ setOpenEditDialog, onSubmit, defaultData }) => { defaultData={defaultData} defaultValues={defaultValues} setOpenEditDialog={setOpenEditDialog} + is_gasht={is_gasht} /> )} diff --git a/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormCreate.jsx b/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormCreate.jsx index c0266ad..7813d41 100644 --- a/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormCreate.jsx +++ b/src/components/dashboard/roadItems/operator/RowActions/EditForm/EditFormCreate.jsx @@ -13,8 +13,24 @@ import { array, mixed, object, string } from "yup"; const validationSchema = object({ amount: string().required("وارد کردن مقدار الزامیست!"), - cmms_machines: array().required("وارد کردن کد خودرو الزامیست!").min(1, "حداقل یک کد خودرو باید وارد شود!"), - rahdaran_id: array().required("وارد کردن کد راهداران الزامیست!").min(1, "حداقل یک کد راهدار باید وارد شود!"), + cmms_machines: array() + .test("cmms-machines-conditional", "وارد کردن کد خودرو الزامیست!", function (value) { + const { is_gasht } = this.options.context; + if (is_gasht) { + return true; // اگر is_gasht true باشد، این فیلد نیاز به اعتبارسنجی ندارد + } + return Array.isArray(value) && value.length > 0; // حداقل یک کد باید وجود داشته باشد + }) + .min(1, "حداقل یک کد خودرو باید وارد شود!"), // پیام خطا برای زمانی که شرط تست برقرار باشد + rahdaran_id: array() + .test("rahdaran-id-conditional", "وارد کردن کد راهداران الزامیست!", function (value) { + const { is_gasht } = this.options.context; + if (is_gasht) { + return true; // اگر is_gasht true باشد، این فیلد نیاز به اعتبارسنجی ندارد + } + return Array.isArray(value) && value.length > 0; // حداقل یک کد باید وجود داشته باشد + }) + .min(1, "حداقل یک کد راهدار باید وارد شود!"), before_image: mixed() .nullable() .test("before-image-required", "لطفا عکس قبل از اقدام را بارگذاری کنید!", function (value) { @@ -50,7 +66,7 @@ const validationSchema = object({ }), }); -const EditFormCreate = ({ defaultData, subItem, onSubmitBase, defaultValues, setOpenEditDialog }) => { +const EditFormCreate = ({ defaultData, subItem, onSubmitBase, defaultValues, setOpenEditDialog, is_gasht }) => { const { control, getValues, @@ -63,7 +79,7 @@ const EditFormCreate = ({ defaultData, subItem, onSubmitBase, defaultValues, set defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur", - context: { subItem }, + context: { subItem, is_gasht }, }); return ( @@ -108,38 +124,42 @@ const EditFormCreate = ({ defaultData, subItem, onSubmitBase, defaultValues, set fullWidth /> - - { - return ( - field.onChange(value || [])} - inputValueDefault={defaultData?.cmms_machines} - multiple={true} - error={error} // اگر خطا وجود داشته باشد - /> - ); - }} - name={"cmms_machines"} - /> - - - { - return ( - field.onChange(value || [])} - error={error} - /> - ); - }} - name={"rahdaran_id"} - /> - + {!is_gasht && ( + + { + return ( + field.onChange(value || [])} + inputValueDefault={defaultData?.cmms_machines} + multiple={true} + error={error} // اگر خطا وجود داشته باشد + /> + ); + }} + name={"cmms_machines"} + /> + + )} + {!is_gasht && ( + + { + return ( + field.onChange(value || [])} + error={error} + /> + ); + }} + name={"rahdaran_id"} + /> + + )} {subItem.needs_end_point === 1 ? ( { ثبت اقدام )} - {open && } + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionInfo.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionInfo.jsx index 025aee2..3dee248 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionInfo.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionInfo.jsx @@ -1,8 +1,10 @@ "use client"; -import React from "react"; -import dynamic from "next/dynamic"; -import MapLoading from "@/core/components/MapLayer/Loading"; +import DeleteIcon from "@mui/icons-material/Delete"; +import DesignServicesIcon from "@mui/icons-material/DesignServices"; +import DirectionsCarIcon from "@mui/icons-material/DirectionsCar"; +import HandymanIcon from "@mui/icons-material/Handyman"; +import PersonIcon from "@mui/icons-material/Person"; import { Box, Card, @@ -15,18 +17,8 @@ import { Stack, Typography, } from "@mui/material"; -import HandymanIcon from "@mui/icons-material/Handyman"; -import DeleteIcon from "@mui/icons-material/Delete"; -import DirectionsCarIcon from "@mui/icons-material/DirectionsCar"; -import PersonIcon from "@mui/icons-material/Person"; -import DesignServicesIcon from "@mui/icons-material/DesignServices"; import EditActionDuringPatrol from "./EditActionDuringPatrol"; -const MapLayer = dynamic(() => import("@/core/components/MapLayer"), { - loading: () => , - ssr: false, -}); - const ActionInfo = ({ action, setActionsList, index, deleteAction }) => { return ( @@ -35,41 +27,6 @@ const ActionInfo = ({ action, setActionsList, index, deleteAction }) => { title={{action.data.item_name}} subheader={action.data.sub_item_name} /> - - - - - میزان فعالیت انجام شده: - - {action.data.amount}({action.data.unit_fa}) - - - - - } /> - - - {action.data.cmms_machines.map((cmms_machine, index) => ( - - {index + 1}: {cmms_machine.car_name} - - ))} - - - - - } /> - - - {action.data.rahdaran_id.map((rahdar, index) => ( - - {index + 1}: {rahdar.name} - - ))} - - - - diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionsDurigPatrol.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionsDurigPatrol.jsx index cffacb4..4efd9a1 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionsDurigPatrol.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionsDurigPatrol.jsx @@ -1,14 +1,14 @@ "use client"; -import { Box, Button, Divider, Grid, Typography } from "@mui/material"; import AddCircleIcon from "@mui/icons-material/AddCircle"; -import React, { useState } from "react"; -import ModalActionsDuringPatrol from "./ModalActionsDuringPatrol"; +import ExitToAppIcon from "@mui/icons-material/ExitToApp"; +import { Box, Button, Chip, DialogActions, DialogContent, Divider, Grid, Stack, Typography } from "@mui/material"; +import { useState } from "react"; import ActionInfo from "./ActionInfo"; -import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft"; +import ModalActionsDuringPatrol from "./ModalActionsDuringPatrol"; -const ActionsDuringPatrol = ({ setValue, tabState, setTabState }) => { - const [ActionsList, setActionsList] = useState([]); +const ActionsDuringPatrol = ({ allData, setAllData, handlePrev, setTabState }) => { + const [actionsList, setActionsList] = useState(allData.observed_items); const [open, setOpen] = useState(false); const handleOpen = () => { setOpen(true); @@ -18,71 +18,86 @@ const ActionsDuringPatrol = ({ setValue, tabState, setTabState }) => { setActionsList((prev) => prev.filter((_, index) => index !== indexToRemove)); }; - const SubmitActionDuringPatrol = () => { - setTabState(tabState + 1); - const resultItems = ActionsList.map((item) => item.result); - setValue("observed_items", resultItems); + const handleNext = (data) => { + setAllData({ observed_items: data }); + setTabState(s => s + 1); }; return ( - - - لیست اقدامات حین گشت - - - - - {ActionsList.length !== 0 ? ( - - {ActionsList.map((action, index) => ( - - deleteAction(index)} - /> - - ))} - - ) : ( - - - فعالیتی ثبت نکرده اید - - - )} - - - + + + + + + + {actionsList.length !== 0 ? ( + + {actionsList.map((action, index) => ( + + deleteAction(index)} + /> + + ))} + + ) : ( + + + فعالیتی ثبت نکرده اید + + + )} - - + + + + + + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/CompeleteRequest.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/CompeleteRequest.jsx index 51816c8..77d2862 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/CompeleteRequest.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/CompeleteRequest.jsx @@ -1,10 +1,18 @@ "use client"; -import React, { useEffect, useState } from "react"; +import StyledForm from "@/core/components/StyledForm"; +import { formatCounter } from "@/core/utils/formatCounter"; +import { CREATE_PATROL, GET_OTP_TOKEN } from "@/core/utils/routes"; +import useRequest from "@/lib/hooks/useRequest"; +import { yupResolver } from "@hookform/resolvers/yup"; +import ExitToAppIcon from "@mui/icons-material/ExitToApp"; +import ForwardToInboxIcon from "@mui/icons-material/ForwardToInbox"; import { Box, Button, Chip, + DialogActions, + DialogContent, Divider, FormControl, Grid, @@ -14,39 +22,47 @@ import { Stack, Typography, } from "@mui/material"; -import BeenhereIcon from "@mui/icons-material/Beenhere"; -import ForwardToInboxIcon from "@mui/icons-material/ForwardToInbox"; -import { formatCounter } from "@/core/utils/formatCounter"; -import useRequest from "@/lib/hooks/useRequest"; -import { GET_OTP_TOKEN } from "@/core/utils/routes"; import moment from "jalali-moment"; +import { useCallback, useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import * as yup from "yup"; -const CompeleteRequest = ({ watch, isSubmitting, setValue, register }) => { - const requestServer = useRequest({ auth: true }); +const schemaOtp = yup.object().shape({ + phoneNumber: yup + .string() + .matches(/^09\d{9}$/, "شماره تماس باید با 09 شروع شود و 11 رقم باشد.") + .required("شماره تماس الزامی است."), +}); + +const schemaSend = yup.object().shape({ + phoneNumber: yup + .string() + .matches(/^09\d{9}$/, "شماره تماس باید با 09 شروع شود و 11 رقم باشد.") + .required("شماره تماس الزامی است."), + code: yup + .string() + .length(6) + .required("شماره تماس الزامی است."), +}); + +const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => { + const requestServer = useRequest(); const [delayPerRequest, setDelayPerRequest] = useState(false); - const [phoneNumber, setPhoneNumber] = useState(""); - const [validPhone, setValidPhone] = useState(false); - const [verificationCode, setVerificationCode] = useState(""); const [counter, setCounter] = useState(120); const [otpSended, setOtpSended] = useState(false); - const [readyToVerify, setReadyToVerify] = useState(false); - const handleNumericInput = (e) => { - e.target.value = e.target.value.replace(/[^0-9]/g, ""); - }; + const defaultValuesOtp = { + phoneNumber: '' + } - useEffect(() => { - if (phoneNumber.length === 11) { - setValidPhone(true); - } else { - setValidPhone(false); - } - if (verificationCode.length === 6 && phoneNumber.length === 11) { - setReadyToVerify(true); - } else { - setReadyToVerify(false); - } - }, [phoneNumber, verificationCode]); + const defaultValuesSend = { + phoneNumber: '', + code: '' + } + + const { handleSubmit: handleSubmitOtp, register: registerOtp, formState: { isSubmitting: isSubmittingOtp, isValid: isValidOtp } } = useForm({ defaultValues: defaultValuesOtp, resolver: yupResolver(schemaOtp), mode: 'onBlur' }) + + const { handleSubmit: handleSubmitSend, setValue: setValueSend, register: registerSend, formState: { isSubmitting: isSubmittingSend, isValid: isValidSend } } = useForm({ defaultValues: defaultValuesSend, resolver: yupResolver(schemaSend), mode: 'onBlur' }) useEffect(() => { if (counter === 0) { @@ -62,167 +78,219 @@ const CompeleteRequest = ({ watch, isSubmitting, setValue, register }) => { } }, [counter, delayPerRequest]); - const sendOtp = () => { - if (!validPhone) return false; - requestServer(`${GET_OTP_TOKEN}?phone_number=${phoneNumber}`, "get") - .then((response) => { - setOtpSended(true); - setDelayPerRequest(true); - }) - .catch(() => {}); + const sendOtp = async (data) => { + try { + const response = await requestServer(`${GET_OTP_TOKEN}?phone_number=${data.phoneNumber}`, "get") + setOtpSended(true) + setDelayPerRequest(true); + setValueSend("phoneNumber", data.phoneNumber) + } catch (error) { + + } }; + const sendData = useCallback(async (data) => { + console.log(allData); + + const formData = new FormData(); + allData.road_patrol_rahdaran_id.forEach((rahdar, index) => formData.append(`road_patrol_rahdaran_id[${index}]`, rahdar.id)); + formData.append(`road_patrol_machines_id[0]`, allData.roadPatrolMachinesId.id) + allData.stopPoints.forEach((stop_point, index) => formData.append(`stop_points[${index}]`, stop_point)) + allData.observed_items.forEach((observed_item, index) => { + formData.append(`observed_items[${index}][instant_action]`, 1); + formData.append(`observed_items[${index}][local_name]`, ""); + formData.append(`observed_items[${index}][start_point]`, observed_item.result.start_point); + formData.append(`observed_items[${index}][end_point]`, observed_item.result.end_point); + formData.append(`observed_items[${index}][amount]`, observed_item.result.amount); + formData.append(`observed_items[${index}][before_image]`, observed_item.result.before_image); + formData.append(`observed_items[${index}][after_image]`, observed_item.result.after_image); + formData.append(`observed_items[${index}][item_id]`, observed_item.result.item_id); + formData.append(`observed_items[${index}][sub_item_id]`, observed_item.result.sub_item_id); + formData.append(`observed_items[${index}][road_item_machines_id][]`, allData.roadPatrolMachinesId.id) + allData.road_patrol_rahdaran_id.forEach((rahdar, index) => formData.append(`observed_items[${index}][road_item_rahdaran_id][]`, rahdar.id)); + }) + formData.append("start_time", allData.start_time); + formData.append("end_time", allData.end_time); + formData.append("vehicle_runtime", allData.accOnDuration); + formData.append("fuel_consumption", +allData.fuelConsumption); + formData.append("distance", allData.mileage); + // formData.append("description", ""); + formData.append("phone_number", data.phoneNumber); + formData.append("verification_code", data.code); + try { + await requestServer(CREATE_PATROL, "post", { + data: formData, + }); + mutate(); + setOpen(false); + } catch (error) { + console.log(error); + + } + }, [allData]) + return ( - - - - - - {moment(watch("start_time")).locale("fa").format("YYYY/MM/DD | HH:mm")} - - - - - {moment(watch("end_time")).locale("fa").format("YYYY/MM/DD | HH:mm")} - - - - - - - - {watch("vehicle_runtime")} - - - - - {watch("fuel_consumption")} - - - - - {watch("stop_points").length} - - - - - {watch("distance")} - - - - - {watch("observed_items").length} - - - - - - - - - کد - - {watch("road_patrol_machines_id.machine_code")} - - - نام - - {watch("road_patrol_machines_id.car_name")} - - - پلاک - - {watch("road_patrol_machines_id.plak_number")} - - - - - - - {watch("road_patrol_rahdaran_id")?.map((rahdar, index) => ( - - نام و کد راهدار - - - {rahdar.name} | {rahdar.code} + <> + + + + + + + {allData.start_time !== '' && moment(allData.start_time).locale("fa").format("YYYY/MM/DD | HH:mm")} + + + + + {allData.end_time !== '' && moment(allData.end_time).locale("fa").format("YYYY/MM/DD | HH:mm")} - ))} - - - - - - شماره تلفن مامور گشت - setPhoneNumber(e.target.value)} - onInput={handleNumericInput} - type="text" - inputProps={{ - maxLength: 11, - }} - /> - - - - - - - کد پیامک شده - setVerificationCode(e.target.value)} - onInput={handleNumericInput} - type="text" - inputProps={{ - maxLength: 6, - inputMode: "numeric", - style: { - textAlign: "center", - letterSpacing: "10px", - }, - }} - /> - - + + + + + {allData.accOnDuration && allData.accOnDuration} + + + + + {allData.fuelConsumption && allData.fuelConsumption} + + + + + {allData.stopPoints && allData.stopPoints.length} + + + + + {allData.mileage && allData.mileage} + + + + + {allData.observed_items && allData.observed_items.length} + + + + + + + + + کد + + {allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.machine_code} + + + نام + + {allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.car_name} + + + پلاک + + {allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.plak_number} + + + + + + + {allData.road_patrol_rahdaran_id.map((rahdar, index) => ( + + نام و کد راهدار + + + {rahdar.name} | {rahdar.code} + + + ))} + + + + + + + شماره تلفن مامور گشت + + + + + + + + + + کد تایید پیامک شده + + + + + + + - - - + + + + + + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForEndTime.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForEndTime.jsx new file mode 100644 index 0000000..0e14a43 --- /dev/null +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForEndTime.jsx @@ -0,0 +1,54 @@ +import { IconButton, InputAdornment } from "@mui/material"; +import { ClearIcon, MobileDateTimePicker } from "@mui/x-date-pickers"; +import moment from "jalali-moment"; +import { useWatch } from "react-hook-form"; + +const DatePickerForEndTime = ({ field, fieldState: { error }, control }) => { + const startTime = useWatch({ control, name: "start_time" }) + return ( + { + const date = new Date(end_time); + const formattedDate = moment(date).locale("en").format("YYYY-MM-DD HH:mm"); + field.onChange(formattedDate); + }} + slotProps={{ + textField: { + size: "small", + placeholder: "تاریخ و ساعت وارد کنید", + InputLabelProps: { shrink: true }, + sx: { width: { xs: '100%', md: 200 } }, + InputProps: { + endAdornment: ( + + { + event.stopPropagation(); + field.onChange(""); + }} + sx={{ + color: "#bfbfbf", + "&:hover": { + backgroundColor: "rgba(189, 189, 189, 0.1)", + color: "#363434", + }, + }} + > + + + + ), + }, + }, + }} + label="تاریخ و ساعت پایان گشت" + /> + ); +} +export default DatePickerForEndTime \ No newline at end of file diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForStartTime.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForStartTime.jsx new file mode 100644 index 0000000..a777733 --- /dev/null +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForStartTime.jsx @@ -0,0 +1,54 @@ +import { IconButton, InputAdornment } from "@mui/material"; +import { ClearIcon, MobileDateTimePicker } from "@mui/x-date-pickers"; +import moment from "jalali-moment"; +import { useWatch } from "react-hook-form"; + +const DatePickerForStartTime = ({ field, fieldState: { error }, control }) => { + const endTime = useWatch({ control, name: "end_time" }) + return ( + { + const date = new Date(start_time); + const formattedDate = moment(date).locale("en").format("YYYY-MM-DD HH:mm"); + field.onChange(formattedDate); + }} + slotProps={{ + textField: { + size: "small", + placeholder: "تاریخ و ساعت وارد کنید", + InputLabelProps: { shrink: true }, + sx: { width: { xs: '100%', md: 200 } }, + InputProps: { + endAdornment: ( + + { + event.stopPropagation(); + field.onChange(""); + }} + sx={{ + color: "#bfbfbf", + "&:hover": { + backgroundColor: "rgba(189, 189, 189, 0.1)", + color: "#363434", + }, + }} + > + + + + ), + }, + }, + }} + label="تاریخ و ساعت شروع گشت" + /> + ); +} +export default DatePickerForStartTime \ No newline at end of file diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/EditActionDuringPatrol.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/EditActionDuringPatrol.jsx index 1693c39..01bb3bc 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/EditActionDuringPatrol.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/EditActionDuringPatrol.jsx @@ -48,7 +48,7 @@ const EditActionDuringPatrol = ({ action, index, setActionsList }) => { }} > ویرایش اطلاعات - + ); diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetail.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetail.jsx index 487f38e..36cc8bd 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetail.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetail.jsx @@ -1,202 +1,180 @@ "use client"; -import { Box, Button, Chip, Divider, IconButton, InputAdornment, Stack } from "@mui/material"; -import React, { useEffect, useState } from "react"; import CarCode from "@/core/components/CarCode"; +import StyledForm from "@/core/components/StyledForm"; +import { GET_FMS_DATA as GET_VAHICLE_OPRATION } from "@/core/utils/routes"; +import useRequest from "@/lib/hooks/useRequest"; +import { yupResolver } from "@hookform/resolvers/yup"; +import ExitToAppIcon from "@mui/icons-material/ExitToApp"; import SearchIcon from "@mui/icons-material/Search"; +import { Box, Button, Chip, DialogActions, DialogContent, Divider, Stack } from "@mui/material"; +import { LocalizationProvider } from "@mui/x-date-pickers"; import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali"; import { faIR } from "@mui/x-date-pickers/locales"; -import { LocalizationProvider, MobileDateTimePicker } from "@mui/x-date-pickers"; -import ClearIcon from "@mui/icons-material/Clear"; import moment from "jalali-moment"; -import dynamic from "next/dynamic"; -import MapLoading from "@/core/components/MapLayer/Loading"; -import { Controller } from "react-hook-form"; -import { GET_FMS_DATA } from "@/core/utils/routes"; -import useRequest from "@/lib/hooks/useRequest"; +import { useState } from "react"; +import { Controller, useForm } from "react-hook-form"; +import * as yup from "yup"; +import DatePickerForEndTime from "./DatePickerForEndTime"; +import DatePickerForStartTime from "./DatePickerForStartTime"; import PatrolDetailInfo from "./PatrolDetailInfo"; import PatrolResultCodeErrors from "./PatrolResultCodeErrors"; -const MapLayer = dynamic(() => import("@/core/components/MapLayer"), { - loading: () => , - ssr: false, +const schema = yup.object().shape({ + roadPatrolMachinesId: yup + .object() + .required("خودرو الزامی است."), + start_time: yup + .string() + .required("زمان شروع الزامی است."), + end_time: yup + .string() + .required("زمان پایان الزامی است.") }); -const PatrolDetail = ({ control, watch, setValue, tabState, setTabState }) => { - const requestServer = useRequest({ notificationSuccess: true }); - const [patrolResultStatus, setPatrolResultStatus] = useState(null); - const [readyToRequest, setReadyToRequest] = useState(false); - const [patrolData, setPatrolData] = useState(null); +const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => { + const defaultValues = { + has_vehicle_operation: allData.has_vehicle_operation, + roadPatrolMachinesId: allData.roadPatrolMachinesId, + start_time: allData.start_time, + end_time: allData.end_time, + stopPoints: allData.stopPoints, + accOnDuration: allData.accOnDuration, + fuelConsumption: allData.fuelConsumption, + mileage: allData.mileage, + }; + const requestServer = useRequest(); + const [patrolResultStatus, setPatrolResultStatus] = useState(allData.resultCode); + const [patrolData, setPatrolData] = useState(defaultValues); - const requestPatrolInfo = async () => { + + const { control, handleSubmit, setValue, formState: { isSubmitting, isValid } } = useForm({ defaultValues, resolver: yupResolver(schema), mode: 'onBlur' }) + + const requestPatrolInfo = async (data) => { + setPatrolResultStatus(1) + setPatrolData(pd => ({ ...pd, has_vehicle_operation: false })) const formData = new FormData(); - formData.append("machineCode", watch("road_patrol_machines_id").machine_code); - formData.append("startDT", moment(watch("start_time")).format("YYYY-MM-DDTHH:mm")); - formData.append("endDT", moment(watch("end_time")).format("YYYY-MM-DDTHH:mm")); - await requestServer(GET_FMS_DATA, "post", { - data: formData, - }) - .then((response) => { - const data = response.data.data; - setPatrolData({ - ...data, - roadPatrolMachinesId: watch("road_patrol_machines_id"), - start_time: watch("start_time"), - end_time: watch("end_time"), - }); - setPatrolResultStatus(data.resultCode); + formData.append("machineCode", data.roadPatrolMachinesId.machine_code); + formData.append("startDT", moment(data.start_time).format("YYYY-MM-DDTHH:mm")); + formData.append("endDT", moment(data.end_time).format("YYYY-MM-DDTHH:mm")); + try { + const response = await requestServer(GET_VAHICLE_OPRATION, "post", { + data: formData, }) - .catch((error) => {}); + const result = response.data.data; + setPatrolData({ + ...result, + roadPatrolMachinesId: data.roadPatrolMachinesId, + start_time: data.start_time, + end_time: data.end_time, + has_vehicle_operation: result.resultCode == 0 + }); + + setValue('stopPoints', result.stopPoints) + setValue('accOnDuration', result.accOnDuration) + setValue('fuelConsumption', result.fuelConsumption) + setValue('mileage', result.mileage) + setValue('has_vehicle_operation', true) + setPatrolResultStatus(result.resultCode); + } catch (error) { + + } }; - useEffect(() => { - const roadPatrolMachinesId = watch("road_patrol_machines_id"); - const startTime = watch("start_time"); - const endTime = watch("end_time"); - - const isReady = roadPatrolMachinesId !== null && startTime !== "" && endTime !== ""; - setReadyToRequest(isReady); - }, [watch("road_patrol_machines_id"), watch("start_time"), watch("end_time")]); + const handleNext = (data) => { + setAllData(data); + setTabState(s => s + 1) + } return ( - - - - { - return ( - field.onChange(value)} - error={error} - /> - ); + <> + + + - - - - { - const date = new Date(start_time); - const formattedDate = moment(date).locale("en").format("YYYY-MM-DD HH:mm"); - setValue("start_time", formattedDate); - }} - slotProps={{ - textField: { - size: "small", - placeholder: "تاریخ و ساعت شروع گشت", - InputProps: { - endAdornment: ( - - { - event.stopPropagation(); - setValue("start_time", ""); - }} - sx={{ - color: "#bfbfbf", - "&:hover": { - backgroundColor: "rgba(189, 189, 189, 0.1)", - color: "#363434", - }, - }} - > - - - - ), - }, - }, - }} - label="تاریخ و ساعت شروع گشت" + + + + { + return ( + field.onChange(value)} + error={error} + /> + ); + }} + name={"roadPatrolMachinesId"} + /> + + + + } + name={"start_time"} + /> + } + name={"end_time"} + /> + + + + + + + + + {patrolResultStatus !== 0 && ( + + )} + - { - const date = new Date(end_time); - const formattedDate = moment(date).locale("en").format("YYYY-MM-DD HH:mm"); - setValue("end_time", formattedDate); - }} - slotProps={{ - textField: { - size: "small", - placeholder: "تاریخ و ساعت پایان گشت", - InputProps: { - endAdornment: ( - - { - event.stopPropagation(); - setValue("end_time", ""); - }} - sx={{ - color: "#bfbfbf", - "&:hover": { - backgroundColor: "rgba(189, 189, 189, 0.1)", - color: "#363434", - }, - }} - > - - - - ), - }, - }, - }} - label="تاریخ و ساعت پایان گشت" - /> - + + + + - - - - - {patrolResultStatus === 0 ? ( - - ) : ( - - )} - + + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetailInfo.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetailInfo.jsx index 81fb7f0..3fb6a6e 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetailInfo.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetailInfo.jsx @@ -1,6 +1,6 @@ "use client"; -import { Box, Button, Card, CardActions, CardContent, Chip, Divider, Slide, Stack, Typography } from "@mui/material"; +import { Box, Button, Card, CardActions, CardContent, Chip, Divider, Fade, Slide, Stack, Typography } from "@mui/material"; import React, { useEffect } from "react"; import dynamic from "next/dynamic"; import MapLoading from "@/core/components/MapLayer/Loading"; @@ -27,13 +27,13 @@ const MapItemViewBound = ({ patrolData, bound }) => { useEffect(() => { if (bound.length !== 0) { - map.fitBounds(bound, { paddingTopLeft: [16, 16], paddingBottomRight: [16, 130] }); + map.fitBounds(bound, { paddingTopLeft: [64, 64], paddingBottomRight: [64, 64] }); } }, [bound]); return ( <> - {patrolData.stopPoints.map((stopPoint, index) => ( + {patrolData?.stopPoints && patrolData.stopPoints.map((stopPoint, index) => ( @@ -42,96 +42,88 @@ const MapItemViewBound = ({ patrolData, bound }) => { ); }; -const PatrolDetailInfo = ({ patrolData, tabState, setTabState, setValue }) => { - const bound = patrolData.stopPoints.map((point) => [point.latitude, point.longitude]); - - const SendPatrolInfo = () => { - setValue("vehicle_runtime", patrolData.accOnDuration); - setValue("fuel_consumption", patrolData.fuelConsumption); - setValue("distance", patrolData.mileage); - setValue("stop_points", patrolData.stopPoints); - setTabState(tabState + 1); - }; +const PatrolDetailInfo = ({ patrolData }) => { + const bound = patrolData?.stopPoints ? patrolData?.stopPoints.map((point) => [point.latitude, point.longitude]) : [] return ( - - + + - + } /> - {Math.floor(patrolData.accOnDuration / 60)} دقیقه + {Math.floor(patrolData?.accOnDuration / 60)} دقیقه } /> - {patrolData.roadPatrolMachinesId.car_name} + {patrolData?.roadPatrolMachinesId?.car_name} } /> - {patrolData.roadPatrolMachinesId.machine_code} + {patrolData?.roadPatrolMachinesId?.machine_code} } /> - {patrolData.roadPatrolMachinesId.plak_number} + {patrolData?.roadPatrolMachinesId?.plak_number} } /> - {moment(patrolData.start_time).locale("fa").format("HH:mm | YYYY/MM/DD")} + {patrolData?.start_time !== '' && moment(patrolData?.start_time).locale("fa").format("HH:mm | YYYY/MM/DD")} } /> - {moment(patrolData.end_time).locale("fa").format("HH:mm | YYYY/MM/DD")} + {patrolData?.end_time !== '' && moment(patrolData?.end_time).locale("fa").format("HH:mm | YYYY/MM/DD")} } /> - {(patrolData.mileage / 1000).toFixed(1)} کیلومتر + {(patrolData?.mileage / 1000).toFixed(1)} کیلومتر } /> - {Math.round(patrolData.fuelConsumption * 10) / 10} لیتر + {Math.round(patrolData?.fuelConsumption * 10) / 10} لیتر } /> - {patrolData.stopPoints.length} مورد + {patrolData?.stopPoints?.length} مورد - + { justifyContent: "center", }} > - - - + {bound.length > 0 && ( + + + + )} - - - - - + - + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolForms.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolForms.jsx index bc67467..ad0c721 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolForms.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolForms.jsx @@ -1,19 +1,16 @@ "use client"; -import { Box, DialogContent, Tab, Tabs, useMediaQuery } from "@mui/material"; +import useRequest from "@/lib/hooks/useRequest"; import { useTheme } from "@emotion/react"; -import React, { useEffect, useState } from "react"; import TaxiAlertIcon from "@mui/icons-material/TaxiAlert"; import EngineeringIcon from "@mui/icons-material/Engineering"; import HandymanIcon from "@mui/icons-material/Handyman"; import VerifiedIcon from "@mui/icons-material/Verified"; -import PatrolTimeLine from "./PatrolTimeLine"; +import { Box, Tab, Tabs, useMediaQuery } from "@mui/material"; +import { useCallback, useEffect, useReducer, useState } from "react"; import PatrolDetail from "./PatrolDetail"; import SuperVisorsDetail from "./SuperVisorsDetail"; import ActionsDuringPatrol from "./ActionsDurigPatrol"; -import { useForm } from "react-hook-form"; -import StyledForm from "@/core/components/StyledForm"; -import useRequest from "@/lib/hooks/useRequest"; import CompeleteRequest from "./CompeleteRequest"; function TabPanel(props) { @@ -27,21 +24,35 @@ function TabPanel(props) { } const defaultValues = { - road_patrol_rahdaran_id: null, - road_patrol_machines_id: null, + has_vehicle_operation: false, + road_patrol_rahdaran_id: [], + roadPatrolMachinesId: null, start_time: "", end_time: "", - stop_points: null, - vehicle_runtime: "", - fuel_consumption: "", - distance: "", - observed_items: null, + stopPoints: null, + accOnDuration: "", + fuelConsumption: "", + mileage: "", + observed_items: [], phone_number: "", otp_token: "", + resultCode: null, }; +const reducer = (state, action) => { + switch (action.type) { + case 'changeData': + return { ...state, ...action.data } + default: + return state; + } + + +} + const PatrolForms = ({ mutate, setOpen }) => { const requestServer = useRequest({ notificationSuccess: true }); + const [allData, dispatch] = useReducer(reducer, defaultValues); const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down("md")); const [tabState, setTabState] = useState(0); @@ -57,62 +68,15 @@ const PatrolForms = ({ mutate, setOpen }) => { } }, [tabState]); - const { - control, - watch, - getValues, - register, - handleSubmit, - setValue, - resetField, - formState: { isSubmitting }, - } = useForm({ - defaultValues, - mode: "onBlur", - }); - - const onSubmit = async (data) => { - console.log("data", data); - // const formData = new FormData(); - // data.road_patrol_rahdaran_id.forEach((rahdar, index) => formData.append(`road_patrol_rahdaran_id[${index}]`, rahdar.id)); - // formData.append(`road_patrol_machines_id[0]`, data.road_patrol_machines_id.id) - // data.stop_points.forEach((stop_point, index) => formData.append(`stop_points[${index}]`, stop_point)) - // data.observed_items.forEach((observed_item, index) => { - // formData.append(`observed_items[${index}][instant_action]`, 1); - // formData.append(`observed_items[${index}][local_name]`, ""); - // formData.append(`observed_items[${index}][start_point]`, observed_item.start_point); - // formData.append(`observed_items[${index}][start_point]`, observed_item.end_point); - // formData.append(`observed_items[${index}][amount]`, observed_item.amount); - // formData.append(`observed_items[${index}][before_image]`, observed_item.before_image); - // formData.append(`observed_items[${index}][after_image]`, observed_item.after_image); - // observed_item.cmms_machines.forEach((machine) => formData.append(`observed_items[${index}][cmms_machines][]`, machine.id)) - // observed_item.rahdaran_id.forEach((rahdar) => formData.append(`observed_items[${index}][rahdaran_id][]`, rahdar.id)) - // formData.append(`observed_items[${index}][sub_item_id]`, observed_item.sub_item_id); - // }) - // formData.append("start_time", data.start_time); - // formData.append("end_time", data.end_time); - // formData.append("vehicle_runtime", data.vehicle_runtime); - // formData.append("fuel_consumption", +data.fuel_consumption); - // formData.append("distance", data.distance); - // formData.append("description", ""); - // formData.append("phone_number", data.phone_number); - // formData.append("verification_code", data.verification_code); - // if (data.phone_number !== "" && data.verification_code !== "") { - // try { - // await requestServer(CREATE_PATROL, "post", { - // data: formData, - // }); - // mutate(); - // setOpen(false); - // } catch (error) { - // } - // } else { - // console.log("error phone number") - // } - }; + const handlePrev = useCallback(() => { + if (tabState == 0) { + setOpen(false); + } + setTabState(s => s - 1) + }, [tabState]) return ( - + <> { = 0)} icon={} label="مشخصات گشت"> = 1)} icon={} label="مشخصات راهداران"> = 2)} icon={} label="اقدامات حین گشت"> - = 3)} icon={} label="تکمیل درخواست"> + = 3)} icon={} label="بررسی نهایی و ثبت"> - - - - - - - - - - - - - - - - {!isMobile && ( - - - - )} - - + + + { dispatch({ type: 'changeData', data }) }} + handlePrev={handlePrev} + setTabState={setTabState} + /> + + + { dispatch({ type: 'changeData', data }) }} + handlePrev={handlePrev} + setTabState={setTabState} + /> + + + { dispatch({ type: 'changeData', data }) }} + handlePrev={handlePrev} + setTabState={setTabState} + /> + + + + + ); }; export default PatrolForms; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolResultCodeErrors.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolResultCodeErrors.jsx index da28921..b3abdbf 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolResultCodeErrors.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolResultCodeErrors.jsx @@ -5,6 +5,7 @@ import React from "react"; const PatrolResultCodeErrors = ({ ResultCode }) => { const errorMessages = { + [1]: "درحال دریافت عملکرد خودرو ...", [-1]: "نام کاربری یا کلمه عبور صحیح نمیباشد", [-2]: "ردیاب به خودرو انتخابی متصل نیست", [-3]: "کاربر دسترسی لازم به اطلاعات خودرو انتخابی را ندارد", @@ -14,8 +15,8 @@ const PatrolResultCodeErrors = ({ ResultCode }) => { const message = errorMessages[ResultCode] || "ابتدا اطلاعات بالا را تکمیل نمایید"; return ( - - + + {message} diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorInfo.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorInfo.jsx index c70c5f4..703807e 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorInfo.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorInfo.jsx @@ -8,11 +8,13 @@ import React from "react"; const SuperVisorInfo = ({ superVisor, deleteSuperVisor }) => { return ( { - const [SuperVisorList, setSuperVisorList] = useState([]); - const [readyToRequest, setReadyToRequest] = useState(false); +const schema = yup.object().shape({ + road_patrol_rahdaran_id: yup + .object() + .required("راهدار الزامی است."), +}); - const requestPatrolInfo = () => { - setSuperVisorList((prev) => [...prev, watch("road_patrol_rahdaran_id")]); - setReadyToRequest(false); - setValue("road_patrol_rahdaran_id", null); +const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) => { + const [SuperVisorList, setSuperVisorList] = useState(allData.road_patrol_rahdaran_id); + + const defaultValues = { + road_patrol_rahdaran_id: null, + }; + + const { control, handleSubmit, reset, setValue, formState: { isSubmitting, isValid } } = useForm({ defaultValues, resolver: yupResolver(schema), mode: 'onBlur' }) + + const requestPatrolInfo = (data) => { + setSuperVisorList((prev) => [...prev, data.road_patrol_rahdaran_id]); + reset() }; const deleteSuperVisor = (id) => { setSuperVisorList((prev) => prev.filter((superVisor) => superVisor.id !== id)); }; - useEffect(() => { - setReadyToRequest(watch("road_patrol_rahdaran_id") != null); - }, [watch("road_patrol_rahdaran_id")]); - - const SendSuperVisor = () => { - setValue("road_patrol_rahdaran_id", SuperVisorList); - setTabState(tabState + 1); - }; + const handleNext = (data) => { + setAllData({ road_patrol_rahdaran_id: data }); + setTabState(s => s + 1) + } return ( - - - - - { - return ( - field.onChange(value)} - error={error} - multiple={false} - /> - ); - }} - name={"road_patrol_rahdaran_id"} - /> - - - - - - - - {SuperVisorList.length !== 0 ? ( - <> - - {SuperVisorList.map((superVisor) => ( - - - - ))} - + <> + + - - + + + + { + return ( + field.onChange(value)} + error={error} + multiple={false} + /> + ); + }} + name={"road_patrol_rahdaran_id"} + /> + + + + + + + + {SuperVisorList.length === 0 && ( + + + ابتدا اطلاعات بالا را تکمیل نمایید + + + )} + + + {SuperVisorList.length !== 0 && SuperVisorList.map((superVisor) => ( + + + + ))} + + - - ) : ( - - - ابتدا اطلاعات بالا را تکمیل نمایید - - )} - + + + + + + ); }; diff --git a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/index.jsx b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/index.jsx index 3c1c72c..f547504 100644 --- a/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/index.jsx +++ b/src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/index.jsx @@ -5,8 +5,10 @@ import PatrolForms from "./PatrolForms"; const CreatePatrol = ({ open, setOpen, mutate }) => { return ( - - + + {open && ( + + )} ); };