RMS/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature/change style road patrol new

Browse Source
This commit is contained in:
AmirHossein Mahmoodi
2025-01-26 14:00:57 +00:00
parent 2d9d116877
commit caa816c8aa
27 changed files with 363 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/dashboard/roadItems/operator/Actions/Create/Forms/index.jsx
View File

@@ -18,13 +18,11 @@ const OperatorCreateForm = ({ open, setOpen, mutate, rowId }) => {
mutate();
setOpen(false);
})
.catch((error) => { });
.catch((error) => {});
};
return (
<Dialog open={open} fullWidth maxWidth="sm">
{open && (
<CreateFormContent setOpen={setOpen} mutate={mutate} onSubmit={HandleSubmit} />
)}
{open && <CreateFormContent setOpen={setOpen} mutate={mutate} onSubmit={HandleSubmit} />}
</Dialog>
);
};

4
src/components/dashboard/roadItems/operator/OperatorList.jsx
View File

@@ -120,8 +120,8 @@ const OperatorList = () => {
props.dependencyFieldValue.value === ""
? "empty"
: loadingSubItemsList
? "loading"
: props.filterParameters.value
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>

8
src/components/dashboard/roadItems/supervisor/SupervisorList.jsx
View File

@@ -127,8 +127,8 @@ const SupervisorList = () => {
props.dependencyFieldValue?.value === ""
? "empty"
: loadingEdaratList
? "loading"
: props.filterParameters.value
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>
@@ -221,8 +221,8 @@ const SupervisorList = () => {
props.dependencyFieldValue.value === ""
? "empty"
: loadingSubItemsList
? "loading"
: props.filterParameters.value
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>

25
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionInfo.jsx
View File

@@ -1,27 +1,20 @@
"use client";
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,
CardActions,
CardContent,
CardHeader,
Chip,
Divider,
IconButton,
Stack,
Typography,
} from "@mui/material";
import { Box, Card, CardActions, CardHeader, IconButton, Typography } from "@mui/material";
import EditActionDuringPatrol from "./EditActionDuringPatrol";
const ActionInfo = ({ action, setActionsList, index, deleteAction }) => {
return (
<Card sx={{ maxWidth: 300 }}>
<Card
elevation={0}
sx={{
maxWidth: 300,
border: 1,
borderColor: "divider",
}}
>
<CardHeader
avatar={<HandymanIcon color="primary" sx={{ width: "30px", height: "30px" }} />}
title={<Typography sx={{ fontSize: "14px", fontWeight: 500 }}>{action.data.item_name}</Typography>}

21
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/ActionsDurigPatrol.jsx
View File

@@ -20,7 +20,7 @@ const ActionsDuringPatrol = ({ allData, setAllData, handlePrev, setTabState }) =
const handleNext = (data) => {
setAllData({ observed_items: data });
setTabState(s => s + 1);
setTabState((s) => s + 1);
};
return (
@@ -28,19 +28,14 @@ const ActionsDuringPatrol = ({ allData, setAllData, handlePrev, setTabState }) =
<DialogContent dividers sx={{ display: "flex" }}>
<Box sx={{ flex: 1 }}>
<Stack
direction={'row'}
justifyContent={'center'}
direction={"row"}
justifyContent={"center"}
sx={{
mt: 1,
mb: 2,
}}
>
<Button
onClick={handleOpen}
startIcon={<AddCircleIcon />}
variant="outlined"
sx={{ mb: 1 }}
>
<Button onClick={handleOpen} startIcon={<AddCircleIcon />} variant="outlined" sx={{ mb: 1 }}>
ثبت اقدام انجام شده
</Button>
<ModalActionsDuringPatrol open={open} setOpen={setOpen} setActionsList={setActionsList} />
@@ -78,7 +73,7 @@ const ActionsDuringPatrol = ({ allData, setAllData, handlePrev, setTabState }) =
</Box>
)}
</Box>
</DialogContent >
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
@@ -89,11 +84,7 @@ const ActionsDuringPatrol = ({ allData, setAllData, handlePrev, setTabState }) =
>
{"صفحه قبل"}
</Button>
<Button
variant="contained"
size="large"
onClick={() => handleNext(actionsList)}
>
<Button variant="contained" size="large" onClick={() => handleNext(actionsList)}>
{"تایید اقدامات و ادامه"}
</Button>
</DialogActions>

232
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/CompeleteRequest.jsx
View File

@@ -1,7 +1,9 @@
"use client";
import ShowPlak from "@/core/components/ShowPlak";
import StyledForm from "@/core/components/StyledForm";
import { formatCounter } from "@/core/utils/formatCounter";
import { formatSecondsToHHMMSS } from "@/core/utils/formatSecondsToHHMMSS";
import { CREATE_PATROL, GET_OTP_TOKEN } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
@@ -39,10 +41,7 @@ const schemaSend = yup.object().shape({
.string()
.matches(/^09\d{9}$/, "شماره تماس باید با 09 شروع شود و 11 رقم باشد.")
.required("شماره تماس الزامی است."),
code: yup
.string()
.length(6)
.required("شماره تماس الزامی است."),
code: yup.string().length(6).required("شماره تماس الزامی است."),
});
const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
@@ -52,17 +51,26 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
const [otpSended, setOtpSended] = useState(false);
const defaultValuesOtp = {
phoneNumber: ''
}
phoneNumber: "",
};
const defaultValuesSend = {
phoneNumber: '',
code: ''
}
phoneNumber: "",
code: "",
};
const { handleSubmit: handleSubmitOtp, register: registerOtp, formState: { isSubmitting: isSubmittingOtp, isValid: isValidOtp } } = useForm({ defaultValues: defaultValuesOtp, resolver: yupResolver(schemaOtp), mode: 'onBlur' })
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' })
const {
handleSubmit: handleSubmitSend,
setValue: setValueSend,
register: registerSend,
formState: { isSubmitting: isSubmittingSend, isValid: isValidSend },
} = useForm({ defaultValues: defaultValuesSend, resolver: yupResolver(schemaSend), mode: "onBlur" });
useEffect(() => {
if (counter === 0) {
@@ -80,82 +88,102 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
const sendOtp = async (data) => {
try {
const response = await requestServer(`${GET_OTP_TOKEN}?phone_number=${data.phoneNumber}`, "get")
setOtpSended(true)
const response = await requestServer(`${GET_OTP_TOKEN}?phone_number=${data.phoneNumber}`, "get");
setOtpSended(true);
setDelayPerRequest(true);
setValueSend("phoneNumber", data.phoneNumber)
} catch (error) {
}
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,
const sendData = useCallback(
async (data) => {
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}][duration]`, stop_point.duration);
formData.append(`stop_points[${index}][latitude]`, stop_point.latitude);
formData.append(`stop_points[${index}][longitude]`, stop_point.longitude);
formData.append(`stop_points[${index}][startDT]`, stop_point.startDT);
});
mutate();
setOpen(false);
} catch (error) {
console.log(error);
}
}, [allData])
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 (
<>
<DialogContent dividers sx={{ display: "flex" }}>
<Box sx={{ flex: 1 }}>
<Stack>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Box>
<Typography sx={{ color: "#777777", fontWeight: 500 }} variant="body1">
{allData.start_time !== '' && moment(allData.start_time).locale("fa").format("YYYY/MM/DD | HH:mm")}
<Divider>
<Chip label="اطلاعات گشت" variant="outlined" />
</Divider>
<Grid container spacing={2} sx={{ alignItems: "start", my: 1 }}>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="تاریخ و زمان شروع" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>
{allData.start_time !== "" &&
moment(allData.start_time).locale("fa").format("YYYY/MM/DD | HH:mm")}
</Typography>
</Box>
<Box>
<Typography sx={{ color: "#777777", fontWeight: 500 }} variant="body1">
{allData.end_time !== '' && moment(allData.end_time).locale("fa").format("YYYY/MM/DD | HH:mm")}
</Grid>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="تاریخ و زمان پایان" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>
{allData.start_time !== "" &&
moment(allData.start_time).locale("fa").format("YYYY/MM/DD | HH:mm")}
</Typography>
</Box>
</Box>
</Grid>
</Grid>
<Grid container spacing={2} sx={{ alignItems: "start", my: 1 }}>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="مدت زمان روشن بودن خودرو" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.accOnDuration && allData.accOnDuration}</Typography>
<Typography>
{allData.accOnDuration && formatSecondsToHHMMSS(allData.accOnDuration)}
</Typography>
</Grid>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="میزان سوخت مصرفی" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.fuelConsumption && allData.fuelConsumption}</Typography>
<Typography>
{allData.fuelConsumption && Math.round(allData.fuelConsumption * 10) / 10} لیتر
</Typography>
</Grid>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="تعداد نقاط توقف" />
@@ -165,7 +193,9 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="مسافت پیموده شده" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.mileage && allData.mileage}</Typography>
<Typography>
{allData.mileage && (allData.mileage / 1000).toFixed(1)} کیلومتر
</Typography>
</Grid>
<Grid item xs={12} lg={6} sx={{ display: "flex", alignItems: "center" }}>
<Chip label="تعداد فعالیت های حین گشت" />
@@ -178,38 +208,58 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
<Divider>
<Chip label="خودرو گشت" />
</Divider>
<Box sx={{ display: "flex", alignItems: "center", my: 1 }}>
<Typography>کد</Typography>
<Stack direction={"row"} sx={{ alignItems: "center", my: 1 }}>
<Chip label="کد خودرو" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.machine_code}</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", my: 1 }}>
<Typography>نام</Typography>
<Typography>
{allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.machine_code}
</Typography>
</Stack>
<Stack direction={"row"} sx={{ alignItems: "center", my: 1 }}>
<Chip label="نام خودرو" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.car_name}</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", my: 1 }}>
<Typography>پلاک</Typography>
<Typography>
{allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.car_name}
</Typography>
</Stack>
<Stack direction={"row"} sx={{ alignItems: "center", my: 1 }}>
<Chip label="پلاک خودرو" />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>{allData.roadPatrolMachinesId && allData.roadPatrolMachinesId.plak_number}</Typography>
</Box>
<Box sx={{ fontSize: 11 }}>
{allData.roadPatrolMachinesId.plak_number &&
ShowPlak({ plak_number: allData.roadPatrolMachinesId.plak_number })}
</Box>
</Stack>
</Grid>
<Grid item xs={12} lg={6}>
<Divider>
<Chip label="راهدار / راهداران حاضر در گشت" />
</Divider>
{allData.road_patrol_rahdaran_id.map((rahdar, index) => (
<Box key={index} sx={{ display: "flex", alignItems: "center", my: 1 }}>
<Typography>نام و کد راهدار</Typography>
<Stack key={rahdar.code} direction={"row"} sx={{ alignItems: "center", my: 1 }}>
<Chip label={`نام و کد راهدار ${index + 1}`} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography>
{rahdar.name} | {rahdar.code}
</Typography>
</Box>
<Box sx={{ fontSize: 11 }}>
<Typography>
{rahdar.name} | {rahdar.code}
</Typography>
</Box>
</Stack>
))}
</Grid>
</Grid>
<Box sx={{ display: "flex", gap: 2, my: 2, justifyContent: "space-around", flexDirection: { xs: 'column', md: 'row' } }}>
<Divider>
<Chip label="احراز هویت" variant="outlined" />
</Divider>
<Box
sx={{
display: "flex",
gap: 2,
my: 2,
justifyContent: "space-around",
flexDirection: { xs: "column", md: "row" },
}}
>
<StyledForm onSubmit={handleSubmitOtp(sendOtp)}>
<Box sx={{ display: "flex", alignItems: "center", gap: 2 }}>
<FormControl size="small" fullWidth variant="outlined">
@@ -235,7 +285,11 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
sx={{ textWrap: "nowrap", width: 200 }}
endIcon={<ForwardToInboxIcon />}
>
{delayPerRequest ? formatCounter(counter) : isSubmittingOtp ? 'درحال دریافت کد ...' : "دریافت کد"}
{delayPerRequest
? formatCounter(counter)
: isSubmittingOtp
? "درحال دریافت کد ..."
: "دریافت کد"}
</Button>
</Box>
</StyledForm>
@@ -269,7 +323,7 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
</Box>
</Stack>
</Box>
</DialogContent >
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}

8
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForEndTime.jsx
View File

@@ -4,7 +4,7 @@ import moment from "jalali-moment";
import { useWatch } from "react-hook-form";
const DatePickerForEndTime = ({ field, fieldState: { error }, control }) => {
const startTime = useWatch({ control, name: "start_time" })
const startTime = useWatch({ control, name: "start_time" });
return (
<MobileDateTimePicker
value={field.value ? new Date(field.value) : null}
@@ -22,7 +22,7 @@ const DatePickerForEndTime = ({ field, fieldState: { error }, control }) => {
size: "small",
placeholder: "تاریخ و ساعت وارد کنید",
InputLabelProps: { shrink: true },
sx: { width: { xs: '100%', md: 200 } },
sx: { width: { xs: "100%", md: 200 } },
InputProps: {
endAdornment: (
<InputAdornment position="end">
@@ -50,5 +50,5 @@ const DatePickerForEndTime = ({ field, fieldState: { error }, control }) => {
label="تاریخ و ساعت پایان گشت"
/>
);
}
export default DatePickerForEndTime
};
export default DatePickerForEndTime;

8
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/DatePickerForStartTime.jsx
View File

@@ -4,7 +4,7 @@ import moment from "jalali-moment";
import { useWatch } from "react-hook-form";
const DatePickerForStartTime = ({ field, fieldState: { error }, control }) => {
const endTime = useWatch({ control, name: "end_time" })
const endTime = useWatch({ control, name: "end_time" });
return (
<MobileDateTimePicker
value={field.value ? new Date(field.value) : null}
@@ -22,7 +22,7 @@ const DatePickerForStartTime = ({ field, fieldState: { error }, control }) => {
size: "small",
placeholder: "تاریخ و ساعت وارد کنید",
InputLabelProps: { shrink: true },
sx: { width: { xs: '100%', md: 200 } },
sx: { width: { xs: "100%", md: 200 } },
InputProps: {
endAdornment: (
<InputAdornment position="end">
@@ -50,5 +50,5 @@ const DatePickerForStartTime = ({ field, fieldState: { error }, control }) => {
label="تاریخ و ساعت شروع گشت"
/>
);
}
export default DatePickerForStartTime
};
export default DatePickerForStartTime;

7
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/EditActionDuringPatrol.jsx
View File

@@ -48,7 +48,12 @@ const EditActionDuringPatrol = ({ action, index, setActionsList }) => {
}}
>
<DialogTitle>ویرایش اطلاعات</DialogTitle>
<EditFormContent setOpenEditDialog={setOpen} onSubmit={HandleSubmit} defaultData={action.data} is_gasht={true} />
<EditFormContent
setOpenEditDialog={setOpen}
onSubmit={HandleSubmit}
defaultData={action.data}
is_gasht={true}
/>
</Dialog>
</>
);

69
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetail.jsx
View File

@@ -21,15 +21,9 @@ import PatrolDetailInfo from "./PatrolDetailInfo";
import PatrolResultCodeErrors from "./PatrolResultCodeErrors";
const schema = yup.object().shape({
roadPatrolMachinesId: yup
.object()
.required("خودرو الزامی است."),
start_time: yup
.string()
.required("زمان شروع الزامی است."),
end_time: yup
.string()
.required("زمان پایان الزامی است.")
roadPatrolMachinesId: yup.object().required("خودرو الزامی است."),
start_time: yup.string().required("زمان شروع الزامی است."),
end_time: yup.string().required("زمان پایان الزامی است."),
});
const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
@@ -47,12 +41,16 @@ const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
const [patrolResultStatus, setPatrolResultStatus] = useState(allData.resultCode);
const [patrolData, setPatrolData] = useState(defaultValues);
const { control, handleSubmit, setValue, formState: { isSubmitting, isValid } } = useForm({ defaultValues, resolver: yupResolver(schema), mode: 'onBlur' })
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 }))
setPatrolResultStatus(1);
setPatrolData((pd) => ({ ...pd, has_vehicle_operation: false }));
const formData = new FormData();
formData.append("machineCode", data.roadPatrolMachinesId.machine_code);
formData.append("startDT", moment(data.start_time).format("YYYY-MM-DDTHH:mm"));
@@ -60,46 +58,51 @@ const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
try {
const response = await requestServer(GET_VAHICLE_OPRATION, "post", {
data: formData,
})
});
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
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)
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) {
}
} catch (error) {}
};
const handleNext = (data) => {
setAllData(data);
setTabState(s => s + 1)
}
setTabState((s) => s + 1);
};
return (
<>
<DialogContent dividers sx={{ display: "flex" }}>
<DialogContent dividers sx={{ display: "flex", maxHeight: { xs: "500px", md: "100%" }, overflowY: "auto" }}>
<Box sx={{ flex: 1 }}>
<Box
sx={{
display: "flex",
flexDirection: "column",
mt: 1,
mb: 2
mb: 2,
}}
>
<StyledForm onSubmit={handleSubmit(requestPatrolInfo)}>
<Box sx={{ display: "flex", flexDirection: { xs: "column", md: "row" }, rowGap: 2, columnGap: 1 }}>
<Box
sx={{
display: "flex",
flexDirection: { xs: "column", md: "row" },
rowGap: 2,
columnGap: 1,
}}
>
<Stack sx={{ minWidth: "200px" }}>
<Controller
control={control}
@@ -139,19 +142,15 @@ const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
disabled={isSubmitting || !isValid}
endIcon={<SearchIcon />}
>
{isSubmitting ? "درحال دریافت عملکرد خودرو ..." : 'دریافت عملکرد خوردو'}
{isSubmitting ? "درحال دریافت عملکرد خودرو ..." : "دریافت عملکرد خوردو"}
</Button>
</Box>
</StyledForm>
<Divider sx={{ my: 2, width: "100%" }}>
<Chip label="مشخصات گشت" variant="outlined" />
</Divider>
{patrolResultStatus !== 0 && (
<PatrolResultCodeErrors ResultCode={patrolResultStatus} />
)}
<PatrolDetailInfo
patrolData={patrolData}
/>
{patrolResultStatus !== 0 && <PatrolResultCodeErrors ResultCode={patrolResultStatus} />}
<PatrolDetailInfo patrolData={patrolData} />
</Box>
</Box>
</DialogContent>

55
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolDetailInfo.jsx
View File

@@ -1,6 +1,18 @@
"use client";
import { Box, Button, Card, CardActions, CardContent, Chip, Divider, Fade, 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";
@@ -16,6 +28,8 @@ import QrCode2Icon from "@mui/icons-material/QrCode2";
import moment from "jalali-moment";
import PatrolMapFeatures from "./PatrolMapFeatures";
import { useMap } from "react-leaflet";
import { formatSecondsToHHMMSS } from "@/core/utils/formatSecondsToHHMMSS";
import ShowPlak from "@/core/components/ShowPlak";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
@@ -33,17 +47,20 @@ const MapItemViewBound = ({ patrolData, bound }) => {
return (
<>
{patrolData?.stopPoints && patrolData.stopPoints.map((stopPoint, index) => (
<React.Fragment key={index}>
<PatrolMapFeatures stopPoint={stopPoint} />
</React.Fragment>
))}
{patrolData?.stopPoints &&
patrolData.stopPoints.map((stopPoint, index) => (
<React.Fragment key={index}>
<PatrolMapFeatures stopPoint={stopPoint} />
</React.Fragment>
))}
</>
);
};
const PatrolDetailInfo = ({ patrolData }) => {
const bound = patrolData?.stopPoints ? patrolData?.stopPoints.map((point) => [point.latitude, point.longitude]) : []
const bound = patrolData?.stopPoints
? patrolData?.stopPoints.map((point) => [point.latitude, point.longitude])
: [];
return (
<Fade in={patrolData?.has_vehicle_operation} sx={{ width: "100%" }}>
@@ -57,12 +74,12 @@ const PatrolDetailInfo = ({ patrolData }) => {
gap: { xs: 2, lg: 0 },
}}
>
<Stack sx={{ minWidth: { xs: "100%", md: "300px" }, gap: 2 }}>
<Stack sx={{ minWidth: { xs: "100%", md: "350px" }, gap: 2 }}>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Chip size="small" label="مدت زمان روشن بودن خودرو" icon={<ElectricCarIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{Math.floor(patrolData?.accOnDuration / 60)} دقیقه
{formatSecondsToHHMMSS(patrolData?.accOnDuration)}
</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
@@ -79,36 +96,39 @@ const PatrolDetailInfo = ({ patrolData }) => {
{patrolData?.roadPatrolMachinesId?.machine_code}
</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip size="small" label="پلاک خودرو" icon={<DirectionsCarFilledIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{patrolData?.roadPatrolMachinesId?.plak_number}
</Typography>
<Box sx={{ fontSize: 11 }}>
{patrolData?.roadPatrolMachinesId?.plak_number &&
ShowPlak({ plak_number: patrolData?.roadPatrolMachinesId?.plak_number })}
</Box>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Chip size="small" label="زمان شروع گشت" icon={<QueryBuilderIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{patrolData?.start_time !== '' && 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")}
</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Chip size="small" label="زمان پایان گشت" icon={<WatchLaterIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{patrolData?.end_time !== '' && 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")}
</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Chip size="small" label="مسافت" icon={<AddRoadIcon />} />
<Chip size="small" label="مسافت پیموده شده" icon={<AddRoadIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{(patrolData?.mileage / 1000).toFixed(1)} کیلومتر
</Typography>
</Box>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<Chip size="small" label="میزان مصرف سوخت" icon={<LocalGasStationIcon />} />
<Chip size="small" label="میزان سوخت مصرفی" icon={<LocalGasStationIcon />} />
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
{Math.round(patrolData?.fuelConsumption * 10) / 10} لیتر
@@ -150,7 +170,6 @@ const PatrolDetailInfo = ({ patrolData }) => {
</Box>
</Stack>
</CardContent>
</Card>
</Fade>
);

77
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolForms.jsx
View File

@@ -1,17 +1,17 @@
"use client";
import useRequest from "@/lib/hooks/useRequest";
import { useTheme } from "@emotion/react";
import TaxiAlertIcon from "@mui/icons-material/TaxiAlert";
import EngineeringIcon from "@mui/icons-material/Engineering";
import HandymanIcon from "@mui/icons-material/Handyman";
import TaxiAlertIcon from "@mui/icons-material/TaxiAlert";
import VerifiedIcon from "@mui/icons-material/Verified";
import { Box, Tab, Tabs, useMediaQuery } from "@mui/material";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
import { useCallback, useEffect, useReducer, useState } from "react";
import PatrolDetail from "./PatrolDetail";
import SuperVisorsDetail from "./SuperVisorsDetail";
import ActionsDuringPatrol from "./ActionsDurigPatrol";
import CompeleteRequest from "./CompeleteRequest";
import PatrolDetail from "./PatrolDetail";
import SuperVisorsDetail from "./SuperVisorsDetail";
function TabPanel(props) {
const { children, value, index } = props;
@@ -41,17 +41,14 @@ const defaultValues = {
const reducer = (state, action) => {
switch (action.type) {
case 'changeData':
return { ...state, ...action.data }
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"));
@@ -72,33 +69,36 @@ const PatrolForms = ({ mutate, setOpen }) => {
if (tabState == 0) {
setOpen(false);
}
setTabState(s => s - 1)
}, [tabState])
setTabState((s) => s - 1);
}, [tabState]);
return (
<>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant={`${isMobile ? "scrollable" : "fullWidth"}`}
sx={{
display: "flex",
justifyContent: "space-around",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab disabled={!(activeUpTo >= 0)} icon={<TaxiAlertIcon />} label="مشخصات گشت"></Tab>
<Tab disabled={!(activeUpTo >= 1)} icon={<EngineeringIcon />} label="مشخصات راهداران"></Tab>
<Tab disabled={!(activeUpTo >= 2)} icon={<HandymanIcon />} label="اقدامات حین گشت"></Tab>
<Tab disabled={!(activeUpTo >= 3)} icon={<VerifiedIcon />} label="بررسی نهایی و ثبت"></Tab>
</Tabs>
<DialogHeader>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant={`${isMobile ? "scrollable" : "fullWidth"}`}
sx={{
display: "flex",
justifyContent: "space-around",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab disabled={!(activeUpTo >= 0)} icon={<TaxiAlertIcon />} label="مشخصات گشت"></Tab>
<Tab disabled={!(activeUpTo >= 1)} icon={<EngineeringIcon />} label="مشخصات راهداران"></Tab>
<Tab disabled={!(activeUpTo >= 2)} icon={<HandymanIcon />} label="اقدامات حین گشت"></Tab>
<Tab disabled={!(activeUpTo >= 3)} icon={<VerifiedIcon />} label="بررسی نهایی و ثبت"></Tab>
</Tabs>
</DialogHeader>
<TabPanel value={tabState} index={0}>
<PatrolDetail
allData={allData}
setAllData={(data) => { dispatch({ type: 'changeData', data }) }}
setAllData={(data) => {
dispatch({ type: "changeData", data });
}}
handlePrev={handlePrev}
setTabState={setTabState}
/>
@@ -106,7 +106,9 @@ const PatrolForms = ({ mutate, setOpen }) => {
<TabPanel value={tabState} index={1}>
<SuperVisorsDetail
allData={allData}
setAllData={(data) => { dispatch({ type: 'changeData', data }) }}
setAllData={(data) => {
dispatch({ type: "changeData", data });
}}
handlePrev={handlePrev}
setTabState={setTabState}
/>
@@ -114,18 +116,15 @@ const PatrolForms = ({ mutate, setOpen }) => {
<TabPanel value={tabState} index={2}>
<ActionsDuringPatrol
allData={allData}
setAllData={(data) => { dispatch({ type: 'changeData', data }) }}
setAllData={(data) => {
dispatch({ type: "changeData", data });
}}
handlePrev={handlePrev}
setTabState={setTabState}
/>
</TabPanel>
<TabPanel value={tabState} index={3}>
<CompeleteRequest
allData={allData}
handlePrev={handlePrev}
mutate={mutate}
setOpen={setOpen}
/>
<CompeleteRequest allData={allData} handlePrev={handlePrev} mutate={mutate} setOpen={setOpen} />
</TabPanel>
</>
);

7
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/PatrolResultCodeErrors.jsx
View File

@@ -15,8 +15,11 @@ const PatrolResultCodeErrors = ({ ResultCode }) => {
const message = errorMessages[ResultCode] || "ابتدا اطلاعات بالا را تکمیل نمایید";
return (
<Box sx={{ my: 5, textAlign: 'center' }}>
<Typography variant="h6" sx={{ letterSpacing: "2px", color: ResultCode && ResultCode != 1 ? "error.main" : "#606060" }}>
<Box sx={{ my: 5, textAlign: "center" }}>
<Typography
variant="h6"
sx={{ letterSpacing: "2px", color: ResultCode && ResultCode != 1 ? "error.main" : "#606060" }}
>
{message}
</Typography>
</Box>

2
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorInfo.jsx
View File

@@ -14,7 +14,7 @@ const SuperVisorInfo = ({ superVisor, deleteSuperVisor }) => {
alignItems: "center",
justifyContent: "space-between",
border: 1,
borderColor: 'divider',
borderColor: "divider",
px: 1,
py: 1,
}}

38
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/SuperVisorsDetail.jsx
View File

@@ -11,9 +11,7 @@ import { Controller, useForm } from "react-hook-form";
import * as yup from "yup";
const schema = yup.object().shape({
road_patrol_rahdaran_id: yup
.object()
.required("راهدار الزامی است."),
road_patrol_rahdaran_id: yup.object().required("راهدار الزامی است."),
});
const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
@@ -23,11 +21,17 @@ const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) =>
road_patrol_rahdaran_id: null,
};
const { control, handleSubmit, reset, setValue, formState: { isSubmitting, isValid } } = useForm({ defaultValues, resolver: yupResolver(schema), mode: 'onBlur' })
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()
reset();
};
const deleteSuperVisor = (id) => {
@@ -36,8 +40,8 @@ const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) =>
const handleNext = (data) => {
setAllData({ road_patrol_rahdaran_id: data });
setTabState(s => s + 1)
}
setTabState((s) => s + 1);
};
return (
<>
@@ -48,11 +52,11 @@ const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) =>
display: "flex",
flexDirection: "column",
mt: 1,
mb: 2
mb: 2,
}}
>
<StyledForm onSubmit={handleSubmit(requestPatrolInfo)}>
<Stack direction={{ xs: "column", sm: 'row' }} justifyContent={'center'} spacing={2}>
<Stack direction={{ xs: "column", sm: "row" }} justifyContent={"center"} spacing={2}>
<Stack sx={{ minWidth: "250px" }}>
<Controller
control={control}
@@ -101,16 +105,20 @@ const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) =>
overflowY: "auto",
}}
>
{SuperVisorList.length !== 0 && SuperVisorList.map((superVisor) => (
<Grid key={superVisor.id} item xs={12} sm={6} lg={4}>
<SuperVisorInfo superVisor={superVisor} deleteSuperVisor={deleteSuperVisor} />
</Grid>
))}
{SuperVisorList.length !== 0 &&
SuperVisorList.map((superVisor) => (
<Grid key={superVisor.id} item xs={12} sm={6} lg={4}>
<SuperVisorInfo
superVisor={superVisor}
deleteSuperVisor={deleteSuperVisor}
/>
</Grid>
))}
</Grid>
</Fade>
</Box>
</Box>
</DialogContent >
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}

4
src/components/dashboard/roadPatrols/operator/Forms/CreatePatrol/index.jsx
View File

@@ -6,9 +6,7 @@ import PatrolForms from "./PatrolForms";
const CreatePatrol = ({ open, setOpen, mutate }) => {
return (
<Dialog open={open} fullWidth maxWidth="md">
{open && (
<PatrolForms setOpen={setOpen} mutate={mutate} />
)}
{open && <PatrolForms setOpen={setOpen} mutate={mutate} />}
</Dialog>
);
};

13
src/components/dashboard/roadPatrols/operator/RowActions/MachinePerformanceForm/StopsInfo.jsx
View File

@@ -3,6 +3,7 @@ import AccessAlarmsIcon from "@mui/icons-material/AccessAlarms";
import PinDropIcon from "@mui/icons-material/PinDrop";
import LocalGasStationIcon from "@mui/icons-material/LocalGasStation";
import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
import { formatSecondsToHHMMSS } from "@/core/utils/formatSecondsToHHMMSS";
const StopsInfo = ({ selectedPoint, staticData }) => {
return (
@@ -13,7 +14,7 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<DirectionsCarIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
کد ماشین
کد خودرو
</Typography>
}
/>
@@ -29,14 +30,14 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<LocalGasStationIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مصرف سوخت
میزان سوخت مصرفی
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{staticData.fuelConsumption || ""} لیتر
{Math.round(patrolData?.fuelConsumption * 10) / 10} لیتر
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
@@ -45,14 +46,14 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<DirectionsCarIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مسافت طی‌شده
مسافت پیموده شده
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{staticData.mileage.toLocaleString() || ""} متر
{(patrolData?.mileage / 1000).toFixed(1)} کیلومتر
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
@@ -68,7 +69,7 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(staticData.accOnDuration / 60)?.toFixed(2) || ""} دقیقه
{formatSecondsToHHMMSS(patrolData?.accOnDuration)}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>

2
src/components/dashboard/roadPatrols/operator/RowActions/MachinePerformanceForm/index.jsx
View File

@@ -3,7 +3,7 @@ import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
import MachinePerformanceContent from "./MachinePerformanceContent";
import { useState } from "react";
const MachinePerformanceForm = ({row}) => {
const MachinePerformanceForm = ({ row }) => {
const [openMachinesCodeDialog, setOpenMachinesCodeDialog] = useState(false);
const machineData = {
cmms_machine_code: row.original?.cmms_machines[0]?.machine_code,

18
src/components/dashboard/roadPatrols/supervisor/RowActions/MachinePerformanceForm/StopsInfo.jsx
View File

@@ -3,6 +3,8 @@ import AccessAlarmsIcon from "@mui/icons-material/AccessAlarms";
import PinDropIcon from "@mui/icons-material/PinDrop";
import LocalGasStationIcon from "@mui/icons-material/LocalGasStation";
import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
import { formatSecondsToHHMMSS } from "@/core/utils/formatSecondsToHHMMSS";
const StopsInfo = ({ selectedPoint, staticData }) => {
return (
<Grid container spacing={3} direction="row" sx={{ justifyContent: "space-between", alignItems: "center" }}>
@@ -12,7 +14,7 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<DirectionsCarIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
کد ماشین
کد خودرو
</Typography>
}
/>
@@ -28,14 +30,14 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<LocalGasStationIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مصرف سوخت
میزان سوخت مصرفی
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{staticData.fuelConsumption || ""} لیتر
{Math.round(staticData?.fuelConsumption * 10) / 10} لیتر
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
@@ -44,14 +46,14 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
icon={<DirectionsCarIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مسافت طی‌شده
مسافت پیموده شده
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{staticData.mileage.toLocaleString() || ""} متر
{(staticData?.mileage / 1000).toFixed(1)} کیلومتر
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
@@ -67,7 +69,7 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(staticData.accOnDuration / 60)?.toFixed(2) || ""} دقیقه
{formatSecondsToHHMMSS(staticData?.accOnDuration)}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
@@ -115,7 +117,9 @@ const StopsInfo = ({ selectedPoint, staticData }) => {
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{selectedPoint ? `${selectedPoint.duration} ثانیه` : "نقطه مورد نظر را انتخاب کنید"}
{selectedPoint
? `${formatSecondsToHHMMSS(selectedPoint.duration)} ثانیه`
: "نقطه مورد نظر را انتخاب کنید"}
</Typography>
</Grid>
</Grid>

2
src/components/dashboard/roadPatrols/supervisor/RowActions/MachinePerformanceForm/index.jsx
View File

@@ -3,7 +3,7 @@ import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
import MachinePerformanceContent from "./MachinePerformanceContent";
import { useState } from "react";
const MachinePerformanceForm = ({row}) => {
const MachinePerformanceForm = ({ row }) => {
const [openMachinesCodeDialog, setOpenMachinesCodeDialog] = useState(false);
const machineData = {
cmms_machine_code: row.original?.cmms_machines[0]?.machine_code,

2
src/components/dashboard/roadPatrols/supervisor/SupervisorList.jsx
View File

@@ -147,7 +147,7 @@ const SupervisorList = () => {
},
},
},
Cell: ({row}) => (
Cell: ({ row }) => (
<Stack alignItems={"center"} justifyContent={"center"}>
<MachinePerformanceForm row={row} />
</Stack>

2
src/core/components/DataTable/filter/fieldsType/CustomDate/MuiDatePicker.jsx
View File

@@ -30,7 +30,7 @@ function MuiDatePicker({ label, value, setFieldValue, name, minDate, maxDate, he
maxDate={maxDate ? new Date(maxDate) : null}
slotProps={{
textField: {
size: 'small',
size: "small",
error: error,
placeholder: placeholder,
InputProps: {

9
src/core/components/DataTable/filter/fieldsType/CustomSelect.jsx
View File

@@ -2,10 +2,11 @@
import { FormControl, InputLabel, MenuItem, OutlinedInput, Select } from "@mui/material";
function CustomSelect({ column, filterParameters, handleChange }) {
return (
<FormControl fullWidth sx={{ marginY: 1 }} size="small">
<InputLabel id={`label${column.id}`} shrink>{column.header}</InputLabel>
<InputLabel id={`label${column.id}`} shrink>
{column.header}
</InputLabel>
<Select
labelId={`label${column.id}`}
id={column.id}
@@ -17,7 +18,9 @@ function CustomSelect({ column, filterParameters, handleChange }) {
displayEmpty
>
{column.columnSelectOption().map((option) => (
<MenuItem key={option.value} value={option.value}>{option.label}</MenuItem>
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</Select>
</FormControl>

4
src/core/components/DataTable/filter/fieldsType/CustomSelectByDependency.jsx
View File

@@ -13,7 +13,9 @@ function CustomSelectByDependency({
}) {
return (
<FormControl fullWidth sx={{ my: 1 }} size="small">
<InputLabel id={`label${column.id}`} shrink>{column.header}</InputLabel>
<InputLabel id={`label${column.id}`} shrink>
{column.header}
</InputLabel>
<Select
labelId={`label${column.id}`}
id={column.id}

2
src/core/components/DataTable/filter/fieldsType/CustomTextFieldRange.jsx
View File

@@ -24,7 +24,7 @@ function CustomTextFieldRange({
fullWidth
error={touched?.[`${column.id}`]?.value && Boolean(errors?.[`${column.id}`]?.value)}
helperText={
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
<Typography variant="caption" sx={{ color: "#155175", fontWeight: "bold" }}>
نوع فیلتر: {defaultFilterTranslation}
</Typography>
}

3
src/core/components/ShowPlak.jsx
View File

@@ -16,13 +16,14 @@ const ShowPlak = ({ plak_number }) => {
const plakParts = processPlak(plak_number);
return (
<Stack sx={{ border: 1, borderColor: "divider", borderRadius: 1, maxWidth: "150px" }} direction={"row"}>
<Stack sx={{ border: 1, borderColor: "divider", borderRadius: 1 }} direction={"row"}>
<Stack
sx={{
borderRight: 1,
borderColor: "divider",
textAlign: "center",
width: "100%",
px: 1,
}}
>
{plakParts.region} {plakParts.mainNumber}

10
src/core/utils/formatSecondsToHHMMSS.js Normal file
View File

@@ -0,0 +1,10 @@
import moment from "jalali-moment";
export const formatSecondsToHHMMSS = (seconds) => {
const duration = moment.duration(seconds, "seconds");
const hours = Math.floor(duration.asHours());
const minutes = duration.minutes();
const secs = duration.seconds();
return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}:${String(secs).padStart(2, "0")}`;
};