Merge branch 'release/v1.5.0'

.env.example

@@ -1,4 +1,4 @@
 HOST="rms.witel.ir"
-NEXT_PUBLIC_VERSION="1.4.3"
+NEXT_PUBLIC_VERSION="1.5.0"
 NEXT_PUBLIC_API_URL="https://rms.witel.ir"
 NEXT_PUBLIC_MAPTILE_ENDPOINT="https://rmsmap.rmto.ir/141map"

package.json

@@ -36,6 +36,7 @@
     "react-leaflet": "^4.2.1",
     "react-leaflet-draw": "^0.20.4",
     "react-leaflet-markercluster": "^4.2.1",
+    "react-qr-code": "^2.0.18",
     "react-toastify": "^10.0.5",
     "sass": "^1.75.0",
     "sharp": "^0.33.4",

src/app/(withAuth)/(dashboardLayout)/dashboard/rahdaran/page.js

@@ -0,0 +1,10 @@
+import RahdaranTablePage from "@/components/dashboard/rahdaran";
+import WithPermission from "@/core/middlewares/withPermission";
+
+export default function page() {
+    return (
+        <WithPermission permission_name={["show-rahdaran"]}>
+            <RahdaranTablePage />
+        </WithPermission>
+    );
+}

src/app/(withAuth)/(dashboardLayout)/dashboard/road-missions/operator/page.js

@@ -7,7 +7,13 @@ export const metadata = {
 const Page = () => {
     return (
         <>
-            <WithPermission permission_name={["manage-request-portal-country", "manage-request-portal-province", "manage-request-portal-city"]}>
+            <WithPermission
+                permission_name={[
+                    "manage-request-portal-country",
+                    "manage-request-portal-province",
+                    "manage-request-portal-city",
+                ]}
+            >
                 <OperatorPage />
                 {/* <ActivityCodeLog activity_code={1152} /> */}
             </WithPermission>

src/assets/scss/map-styles.scss

@@ -15,6 +15,7 @@
 .leaflet-draw-tooltip {
     margin-left: 0;
     margin-right: 20px;
+    font-family: IRANSansFaNum;
 }
 .leaflet-draw-tooltip::before {
     border-left: 6px solid black;

src/components/dashboard/damages/operator/Form/CreateFactor/CreateFactorContent.jsx

@@ -17,6 +17,7 @@ import {
     Typography,
 } from "@mui/material";
 import { useReducer, useState } from "react";
+import QRCode from "react-qr-code";
 
 const initialState = {
     submittingCreateFactor: false,
@@ -147,15 +148,53 @@ const CreateFactorContent = ({ row, mutate, rowId, setOpenCreateFactorDialog })
                             ریال
                         </Typography>
                     </Grid>
-                    {!factorCreated && (
+                    {factorCreated ? (
+                        <Grid item xs={12}>
+                            <Stack
+                                direction={"row"}
+                                alignItems={"center"}
+                                justifyContent={"space-between"}
+                                sx={{
+                                    bgcolor: "rgb(229, 246, 253)",
+                                    color: "rgb(1, 67, 97)",
+                                    p: 2,
+                                    borderRadius: 1,
+                                }}
+                            >
+                                <Stack spacing={1}>
+                                    {row.original.is_foreign ? (
+                                        <>
+                                            <Typography fontWeight={"bold"}>
+                                                می‌توانید برای پرداخت، بارکد را اسکن کنید
+                                            </Typography>
+                                        </>
+                                    ) : (
+                                        <>
+                                            <Typography variant="body2">
+                                                لینک پرداخت به شماره همراه مورد نظر ارسال شد
+                                            </Typography>
+                                            <Typography fontWeight={"bold"}>
+                                                همچنین می‌توانید برای پرداخت، بارکد را اسکن کنید
+                                            </Typography>
+                                        </>
+                                    )}
+                                </Stack>
+                                <Box sx={{ p: 1, bgcolor: "background.default", borderRadius: 0.5 }}>
+                                    <QRCode value={row.original?.link || ""} size={60} />
+                                </Box>
+                            </Stack>
+                        </Grid>
+                    ) : (
                         <Grid item xs={12}>
                             <Stack spacing={1}>
                                 <Alert severity="warning">
                                     پس از صدور فاکتور، امکان ویرایش مبالغ بیمه و داغی وجود نخواهد داشت
                                 </Alert>
-                                <Alert severity="info">
-                                    لینک پرداخت فاکتور به شماره {row.original?.driver_phone_number} ارسال می شود.
-                                </Alert>
+                                {!row.original.is_foreign && (
+                                    <Alert severity="info">
+                                        لینک پرداخت فاکتور به شماره {row.original?.driver_phone_number} ارسال می شود.
+                                    </Alert>
+                                )}
                             </Stack>
                         </Grid>
                     )}
@@ -172,15 +211,17 @@ const CreateFactorContent = ({ row, mutate, rowId, setOpenCreateFactorDialog })
                         >
                             بستن
                         </Button>
-                        <Button
-                            key={"submittingSms"}
-                            onClick={handleSendSMS}
-                            variant="outlined"
-                            color="warning"
-                            disabled={state.submittingSms}
-                        >
-                            {state.submittingSms ? "درحال ارسال مجدد پیام پرداخت..." : "ارسال مجدد پیام پرداخت"}
-                        </Button>
+                        {!row.original.is_foreign && (
+                            <Button
+                                key={"submittingSms"}
+                                onClick={handleSendSMS}
+                                variant="outlined"
+                                color="warning"
+                                disabled={state.submittingSms}
+                            >
+                                {state.submittingSms ? "درحال ارسال مجدد پیام پرداخت..." : "ارسال مجدد پیام پرداخت"}
+                            </Button>
+                        )}
                         <Button
                             key={"submittingCheckFactor"}
                             onClick={handleCheckPaymentStatus}

src/components/dashboard/rahdaran/Actions/Create/Form/CreateFormContent.jsx

@@ -0,0 +1,105 @@
+import PersianTextField from "@/core/components/PersianTextField";
+import StyledForm from "@/core/components/StyledForm";
+import validateNationalCode from "@/core/utils/nationalCodeValidation";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { Beenhere, ExitToApp } from "@mui/icons-material";
+import { Button, DialogActions, DialogContent, Grid, Stack } from "@mui/material";
+import { Controller, useForm } from "react-hook-form";
+import { object, string } from "yup";
+
+const validationSchema = object({
+    name: string().required("وارد کردن نام فارسی الزامیست!"),
+    code: string()
+        .required("لطفا کد ملی را وارد کنید!!!")
+        .test("max", "کد ملی باید شامل 10 رقم باشد", (value) => value.toString().length === 10)
+        .test("validation", "کد ملی صحیح نمی باشد", (value) => validateNationalCode(value)),
+});
+
+const CreateFormContent = ({ setOpen, defaultValues, onSubmitBase }) => {
+    const {
+        control,
+        handleSubmit,
+        formState: { isSubmitting },
+    } = useForm({
+        defaultValues,
+        resolver: yupResolver(validationSchema),
+        mode: "all",
+    });
+    const handleOnSubmit = async (data) => {
+        await onSubmitBase(data);
+    };
+
+    return (
+        <>
+            <StyledForm onSubmit={handleSubmit(handleOnSubmit)}>
+                <DialogContent dividers>
+                    <Stack spacing={3}>
+                        <Stack>
+                            <Grid spacing={2}>
+                                <Grid item xs={12} sm={6}>
+                                    <Controller
+                                        name="name"
+                                        control={control}
+                                        render={({ field: { onChange, value }, fieldState: { error } }) => (
+                                            <PersianTextField
+                                                fullWidth
+                                                size="small"
+                                                label="نام فارسی"
+                                                value={value}
+                                                onChange={onChange}
+                                                placeholder="نام فارسی را وارد کنید"
+                                                error={!!error}
+                                                helperText={error ? error.message : null}
+                                                variant="outlined"
+                                                InputLabelProps={{ shrink: true }}
+                                            />
+                                        )}
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Stack>
+                        <Stack>
+                            <Grid spacing={2}>
+                                <Grid item xs={12} sm={6}>
+                                    <Controller
+                                        name="code"
+                                        control={control}
+                                        render={({ field: { onChange, value }, fieldState: { error } }) => (
+                                            <PersianTextField
+                                                fullWidth
+                                                size="small"
+                                                label="کد ملی"
+                                                value={value}
+                                                onChange={onChange}
+                                                placeholder="کد ملی را وارد کنید"
+                                                error={!!error}
+                                                helperText={error ? error.message : null}
+                                                variant="outlined"
+                                                InputLabelProps={{ shrink: true }}
+                                            />
+                                        )}
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Stack>
+                    </Stack>
+                </DialogContent>
+                <DialogActions>
+                    <Button
+                        onClick={() => setOpen(false)}
+                        variant="outlined"
+                        color="secondary"
+                        startIcon={<ExitToApp />}
+                    >
+                        بستن
+                    </Button>
+                    <Button variant="contained" disabled={isSubmitting} type="submit" endIcon={<Beenhere />}>
+                        {" "}
+                        {isSubmitting ? "در حال ثبت راهدار" : "ثبت راهدار"}{" "}
+                    </Button>
+                </DialogActions>
+            </StyledForm>
+        </>
+    );
+};
+export default CreateFormContent;

src/components/dashboard/rahdaran/Actions/Create/Form/index.jsx

@@ -0,0 +1,57 @@
+import { Dialog, DialogTitle, IconButton } from "@mui/material";
+import CreateFormContent from "./CreateFormContent";
+import CloseIcon from "@mui/icons-material/Close";
+import useRequest from "@/lib/hooks/useRequest";
+import { CREATE_RAHDARAN_ITEM } from "@/core/utils/routes";
+import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
+
+const CreateForm = ({ open, setOpen, mutate }) => {
+    const requestServer = useRequest({ notificationSuccess: true });
+    const defaultValues = {
+        name: "",
+        code: "",
+    };
+    const onSubmit = async (result) => {
+        const formData = new FormData();
+        formData.append("name", result.name);
+        formData.append("code", result.code);
+
+        await requestServer(CREATE_RAHDARAN_ITEM, "post", {
+            data: formData,
+        })
+            .then(() => {
+                mutate();
+                setOpen(false);
+            })
+            .catch(() => {});
+    };
+    return (
+        <Dialog open={open} fullWidth maxWidth="xs">
+            <IconButton
+                aria-label="close"
+                onClick={() => setOpen(false)}
+                sx={(theme) => ({
+                    position: "absolute",
+                    right: 8,
+                    top: 8,
+                    zIndex: 50,
+                    color: theme.palette.grey[500],
+                })}
+            >
+                <CloseIcon />
+            </IconButton>
+            <DialogHeader>
+                <DialogTitle>ثبت راهدار جدید</DialogTitle>
+            </DialogHeader>
+            {open && (
+                <CreateFormContent
+                    defaultValues={defaultValues}
+                    onSubmitBase={onSubmit}
+                    setOpen={setOpen}
+                    mutate={mutate}
+                />
+            )}
+        </Dialog>
+    );
+};
+export default CreateForm;

src/components/dashboard/rahdaran/Actions/Create/index.jsx

@@ -0,0 +1,36 @@
+import { AddCircle } from "@mui/icons-material";
+import { Button, IconButton, useMediaQuery, useTheme } from "@mui/material";
+import CreateForm from "./Form";
+import { useState } from "react";
+
+const CreateRahdar = ({ mutate }) => {
+    const theme = useTheme();
+    const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
+    const [open, setOpen] = useState(false);
+
+    const handleOpen = () => {
+        setOpen(true);
+    };
+
+    return (
+        <>
+            {isMobile ? (
+                <IconButton aria-label="ثبت راهدار" color="primary" onClick={handleOpen}>
+                    <AddCircle sx={{ fontSize: "25px" }} />
+                </IconButton>
+            ) : (
+                <Button
+                    size={"small"}
+                    variant="contained"
+                    color="primary"
+                    startIcon={<AddCircle />}
+                    onClick={handleOpen}
+                >
+                    ثبت راهدار
+                </Button>
+            )}
+            <CreateForm open={open} setOpen={setOpen} mutate={mutate} />
+        </>
+    );
+};
+export default CreateRahdar;

src/components/dashboard/rahdaran/Actions/Edit/EditController.jsx

@@ -0,0 +1,37 @@
+import { UPDATE_RAHDARAN_ITEM } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import { DialogTitle } from "@mui/material";
+import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
+import CreateFormContent from "../Create/Form/CreateFormContent";
+
+const EditController = ({ rowId, mutate, setOpen, row }) => {
+    const requestServer = useRequest({ notificationSuccess: true });
+
+    const defaultData = {
+        name: row.original?.name || "",
+        code: row.original?.code || "",
+    };
+    const handleSubmit = async (result) => {
+        const formData = new FormData();
+        formData.append("name", result.name);
+        formData.append("code", result.code);
+
+        await requestServer(`${UPDATE_RAHDARAN_ITEM}/${rowId}`, "post", {
+            data: formData,
+        })
+            .then(() => {
+                mutate();
+                setOpen(false);
+            })
+            .catch(() => {});
+    };
+    return (
+        <>
+            <DialogHeader>
+                <DialogTitle>ویرایش راهدار</DialogTitle>
+            </DialogHeader>
+            <CreateFormContent setOpen={setOpen} defaultValues={defaultData} onSubmitBase={handleSubmit} />
+        </>
+    );
+};
+export default EditController;

src/components/dashboard/rahdaran/Actions/Edit/index.jsx

@@ -0,0 +1,51 @@
+import BorderColorIcon from "@mui/icons-material/BorderColor";
+import CloseIcon from "@mui/icons-material/Close";
+import { Dialog, IconButton, Tooltip } from "@mui/material";
+import { useState } from "react";
+import EditController from "./EditController";
+
+const EditRahdar = ({ mutate, row, rowId }) => {
+    const [open, setOpen] = useState(false);
+
+    return (
+        <>
+            <Tooltip title="ویرایش راهدار" arrow placement="right">
+                <IconButton
+                    color="primary"
+                    sx={{ textTransform: "unset", alignSelf: "center" }}
+                    onClick={() => {
+                        setOpen(true);
+                    }}
+                >
+                    <BorderColorIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                fullWidth
+                open={open}
+                maxWidth={"xs"}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+            >
+                <IconButton
+                    aria-label="close"
+                    onClick={() => setOpen(false)}
+                    sx={(theme) => ({
+                        position: "absolute",
+                        right: 8,
+                        top: 8,
+                        zIndex: 50,
+                        color: theme.palette.grey[500],
+                    })}
+                >
+                    <CloseIcon />
+                </IconButton>
+                {open && <EditController setOpen={setOpen} rowId={rowId} row={row} mutate={mutate} />}
+            </Dialog>
+        </>
+    );
+};
+export default EditRahdar;

src/components/dashboard/rahdaran/RahdaranList.jsx

@@ -0,0 +1,69 @@
+"use client";
+import DataTableWithAuth from "@/core/components/DataTableWithAuth";
+import { GET_RAHDARAN_TABLE_LIST } from "@/core/utils/routes";
+import { Box } from "@mui/material";
+import { useMemo } from "react";
+import RowActions from "./RowActions";
+import Toolbar from "./Toolbar";
+
+const RahdaranList = () => {
+    const columns = useMemo(
+        () => [
+            {
+                accessorKey: "id",
+                header: "کد یکتا",
+                id: "id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "equals",
+                sortDescFirst: false,
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "name",
+                header: "نام و نام خانوادگی",
+                id: "name",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "code",
+                header: "کد ملی",
+                id: "code",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+            },
+        ],
+        []
+    );
+
+    return (
+        <>
+            <Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
+                <DataTableWithAuth
+                    need_filter={true}
+                    columns={columns}
+                    sorting={[{ id: "id", desc: true }]}
+                    table_url={GET_RAHDARAN_TABLE_LIST}
+                    page_name={"permissionTablePage"}
+                    table_name={"permissionTableList"}
+                    TableToolbar={Toolbar}
+                    enableRowActions
+                    positionActionsColumn={"last"}
+                    RowActions={RowActions}
+                />
+            </Box>
+        </>
+    );
+};
+export default RahdaranList;

src/components/dashboard/rahdaran/RowActions/DeleteDialog/DeleteContent.jsx

@@ -0,0 +1,39 @@
+import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
+import React, { useState } from "react";
+import useRequest from "@/lib/hooks/useRequest";
+import { DELETE_RAHDARAN_ITEM } from "@/core/utils/routes";
+
+const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
+    const [submitting, setSubmitting] = useState(false);
+    const requestServer = useRequest({ notificationSuccess: true });
+    const handleClick = () => {
+        setSubmitting(true);
+        requestServer(`${DELETE_RAHDARAN_ITEM}/${rowId}`, "delete")
+            .then(() => {
+                mutate();
+                setSubmitting(false);
+                setOpenDeleteDialog(false);
+            })
+            .catch(() => {
+                setSubmitting(false);
+            });
+    };
+    return (
+        <>
+            <DialogContent>
+                <Stack alignItems="center" spacing={2}>
+                    <Typography mt={2}>آیا از حذف راهدار اطمینان دارید؟</Typography>
+                </Stack>
+            </DialogContent>
+            <DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
+                <Button onClick={() => setOpenDeleteDialog(false)} variant="outlined" color="secondary">
+                    خیر !
+                </Button>
+                <Button onClick={handleClick} variant="contained" color="error" disabled={submitting}>
+                    {submitting ? "درحال حذف..." : "بله اطمینان دارم"}
+                </Button>
+            </DialogActions>
+        </>
+    );
+};
+export default DeleteContent;

src/components/dashboard/rahdaran/RowActions/DeleteDialog/index.jsx

@@ -0,0 +1,34 @@
+import DeleteIcon from "@mui/icons-material/Delete";
+import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
+import { useState } from "react";
+import DeleteContent from "./DeleteContent";
+const DeleteDialog = ({ rowId, mutate }) => {
+    const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
+
+    return (
+        <>
+            <Tooltip title="حذف">
+                <IconButton color="error" onClick={() => setOpenDeleteDialog(true)}>
+                    <DeleteIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                open={openDeleteDialog}
+                onClose={() => setOpenDeleteDialog(false)}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+                dir="rtl"
+                maxWidth={"md"}
+            >
+                <DialogTitle>حذف راهدار</DialogTitle>
+                {openDeleteDialog && (
+                    <DeleteContent rowId={rowId} mutate={mutate} setOpenDeleteDialog={setOpenDeleteDialog} />
+                )}
+            </Dialog>
+        </>
+    );
+};
+export default DeleteDialog;

src/components/dashboard/rahdaran/RowActions/index.jsx

@@ -0,0 +1,12 @@
+import { Box } from "@mui/material";
+import EditRahdar from "../Actions/Edit";
+import DeleteDialog from "./DeleteDialog";
+const RowActions = ({ row, mutate }) => {
+    return (
+        <Box sx={{ display: "flex", gap: 1, alignItems: "center" }}>
+            <EditRahdar row={row} mutate={mutate} rowId={row.getValue("id")} />
+            <DeleteDialog mutate={mutate} rowId={row.getValue("id")} />
+        </Box>
+    );
+};
+export default RowActions;

src/components/dashboard/rahdaran/Toolbar.jsx

@@ -0,0 +1,9 @@
+import CreateRahdar from "./Actions/Create";
+const Toolbar = ({ mutate }) => {
+    return (
+        <>
+            <CreateRahdar mutate={mutate} />
+        </>
+    );
+};
+export default Toolbar;

src/components/dashboard/rahdaran/index.jsx

@@ -0,0 +1,13 @@
+import PageTitle from "@/core/components/PageTitle";
+import { Stack } from "@mui/material";
+import RahdaranList from "./RahdaranList";
+
+const RahdaranTablePage = () => {
+    return (
+        <Stack spacing={1}>
+            <PageTitle title={"راهداران"} />
+            <RahdaranList />
+        </Stack>
+    );
+};
+export default RahdaranTablePage;

src/components/dashboard/roadMissions/control/Actions/showArea/index.jsx

@@ -6,12 +6,15 @@ import ShowBound from "../showBound";
 import L from "leaflet";
 
 const ShowArea = ({ area }) => {
-    const bound = useMemo(() => L.polygon([...area]), [area]);
+    const bound = useMemo(
+        () => (area.type == "polygon" ? L.polygon([...area.coordinates]) : L.polyline([...area.coordinates])),
+        [area]
+    );
     const [openAreaDialog, setOpenAreaDialog] = useState(false);
 
     return (
         <>
-            <Tooltip title="محدوده">
+            <Tooltip title="منطقه عملیاتی">
                 <IconButton color="primary" onClick={() => setOpenAreaDialog(true)}>
                     <RemoveRedEye />
                 </IconButton>
@@ -33,7 +36,7 @@ const ShowArea = ({ area }) => {
             >
                 <DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
                     <Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
-                        محدوده
+                        منطقه عملیاتی
                     </Typography>
                     <IconButton onClick={() => setOpenAreaDialog(false)} size="small">
                         <Close />

src/components/dashboard/roadMissions/control/ControlList.jsx

@@ -4,15 +4,11 @@ import { GET_ROAD_MISSIONS_CONTROL_LIST } from "@/core/utils/routes";
 import { Box, Stack } from "@mui/material";
 import moment from "jalali-moment";
 import { useMemo } from "react";
-import ShowArea from "./Actions/showArea";
+import MachinesDialog from "./RowActions/Machines";
 import RowActions from "./RowActions";
+import RahdaranDialog from "./RowActions/Rahdaran";
 
 const ControlList = () => {
-    const typeOptions = [
-        { value: 1, label: "روزانه" },
-        { value: 2, label: "ساعتی" },
-    ];
-
     const columns = useMemo(
         () => [
             {
@@ -27,25 +23,10 @@ const ControlList = () => {
                 size: 100,
             },
             {
-                accessorKey: "type",
-                header: "نوع",
-                id: "type",
-                enableColumnFilter: true,
-                datatype: "numeric",
-                filterMode: "equals",
-                sortDescFirst: true,
-                grow: false,
-                size: 100,
-                columnSelectOption: () => {
-                    return typeOptions.map((type) => ({
-                        value: type.value,
-                        label: type.label,
-                    }));
-                },
-                Cell: ({ row }) => row.original.type_fa,
-            },
-            {
-                accessorFn: (row) => moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ شروع",
                 id: "start_date",
                 enableColumnFilter: true,
@@ -55,7 +36,10 @@ const ControlList = () => {
                 size: 100,
             },
             {
-                accessorFn: (row) => moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ پایان",
                 id: "end_date",
                 enableColumnFilter: true,
@@ -65,21 +49,13 @@ const ControlList = () => {
                 size: 100,
             },
             {
-                accessorKey: "end_point",
-                header: "مقصد",
-                id: "end_point",
-                enableColumnFilter: false,
-                datatype: "numeric",
-                filterMode: "equals",
-                grow: false,
-                size: 100,
-            },
-            {
-                header: "محدوده",
-                id: "area",
-                enableColumnFilter: false,
-                datatype: "numeric",
-                filterMode: "equals",
+                header: "خودرو",
+                id: "cmmsMachines__machine_code",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "contains",
+                enableSorting: false,
+                columnFilterModeOptions: ["equals", "contains"],
                 grow: false,
                 size: 100,
                 muiTableBodyCellProps: {
@@ -91,14 +67,40 @@ const ControlList = () => {
                         },
                     },
                 },
-                Cell: ({ row }) =>
-                    row.original.area ? (
+                Cell: ({ renderedCellValue, row }) => {
+                    return (
                         <Stack alignItems={"center"} justifyContent={"center"}>
-                            <ShowArea area={row.original.area} />
+                            <MachinesDialog rowId={row.original.id} />
                         </Stack>
-                    ) : (
-                        "-"
-                    ),
+                    );
+                },
+            },
+            {
+                header: "افراد",
+                id: "rahdaran__code",
+                enableColumnFilter: true,
+                enableSorting: false,
+                datatype: "text",
+                filterMode: "contains",
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+                muiTableBodyCellProps: {
+                    sx: {
+                        borderLeft: "1px solid #e1e1e1",
+                        py: 0,
+                        "&:first-of-type": {
+                            borderLeft: "unset",
+                        },
+                    },
+                },
+                Cell: ({ renderedCellValue, row }) => {
+                    return (
+                        <Stack alignItems={"center"} justifyContent={"center"}>
+                            <RahdaranDialog rowId={row.original.id} />
+                        </Stack>
+                    );
+                },
             },
         ],
         []

src/components/dashboard/roadMissions/control/RowActions/Machines/MachinesContent.jsx

@@ -0,0 +1,73 @@
+import DialogLoading from "@/core/components/DialogLoading";
+import ShowPlak from "@/core/components/ShowPlak";
+import { GET_MACHINES_BY_ID } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import {
+    DialogContent,
+    Table,
+    TableBody,
+    TableCell,
+    TableContainer,
+    TableHead,
+    TableRow,
+    Typography,
+} from "@mui/material";
+import { useEffect, useState } from "react";
+
+const MachinesContent = ({ rowId }) => {
+    const [loading, setLoading] = useState(true);
+    const [data, setData] = useState(null);
+    const request = useRequest();
+
+    useEffect(() => {
+        const fetchData = async () => {
+            try {
+                setLoading(true);
+                const response = await request(`${GET_MACHINES_BY_ID}/${rowId}`);
+                setData(response.data.data);
+            } catch (error) {
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchData();
+    }, [rowId]);
+
+    return (
+        <>
+            <DialogContent>
+                {loading ? (
+                    <DialogLoading />
+                ) : data ? (
+                    <TableContainer>
+                        <Table stickyHeader>
+                            <TableHead>
+                                <TableRow>
+                                    <TableCell>کد ماشین</TableCell>
+                                    <TableCell>نام خودرو</TableCell>
+                                </TableRow>
+                            </TableHead>
+                            <TableBody>
+                                {data.map((machine) => {
+                                    return (
+                                        <TableRow
+                                            key={machine.id}
+                                            sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
+                                        >
+                                            <TableCell>{machine.machine_code}</TableCell>
+                                            <TableCell>{machine.car_name}</TableCell>
+                                        </TableRow>
+                                    );
+                                })}
+                            </TableBody>
+                        </Table>
+                    </TableContainer>
+                ) : (
+                    <Typography textAlign={"center"}>اطلاعات خودرویی در سامانه یافت نشد</Typography>
+                )}
+            </DialogContent>
+        </>
+    );
+};
+export default MachinesContent;

src/components/dashboard/roadMissions/control/RowActions/Machines/index.jsx

@@ -0,0 +1,38 @@
+import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
+import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
+import { useState } from "react";
+import MachinesContent from "./MachinesContent";
+
+const MachinesDialog = ({ rowId }) => {
+    const [openMachinesDialog, setOpenMachinesDialog] = useState(false);
+    return (
+        <>
+            <Tooltip title="خودرو">
+                <IconButton color="primary" onClick={() => setOpenMachinesDialog(true)}>
+                    <DirectionsCarIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                fullWidth
+                open={openMachinesDialog}
+                onClose={() => setOpenMachinesDialog(false)}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+                dir="rtl"
+                maxWidth={"sm"}
+            >
+                <DialogTitle sx={{ fontSize: "large" }}>اطلاعات خودرو</DialogTitle>
+                {openMachinesDialog && <MachinesContent rowId={rowId} />}
+                <DialogActions>
+                    <Button onClick={() => setOpenMachinesDialog(false)} variant="outlined" color="secondary" autoFocus>
+                        بستن
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+};
+export default MachinesDialog;

src/components/dashboard/roadMissions/control/RowActions/Rahdaran/RahdaranContent.jsx

@@ -0,0 +1,74 @@
+import DialogLoading from "@/core/components/DialogLoading";
+import { GET_RAHDARAN_BY_ID } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import {
+    DialogContent,
+    Table,
+    TableBody,
+    TableCell,
+    TableContainer,
+    TableHead,
+    TableRow,
+    Typography,
+} from "@mui/material";
+import { useEffect, useState } from "react";
+
+const RahdaranContent = ({ rowId }) => {
+    const [loading, setLoading] = useState(true);
+    const [data, setData] = useState(null);
+    const request = useRequest();
+
+    useEffect(() => {
+        const fetchData = async () => {
+            try {
+                setLoading(true);
+                const response = await request(`${GET_RAHDARAN_BY_ID}/${rowId}`);
+                setData(response.data.data);
+            } catch (error) {
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchData();
+    }, [rowId]);
+
+    return (
+        <>
+            <DialogContent>
+                {loading ? (
+                    <DialogLoading />
+                ) : data ? (
+                    <TableContainer>
+                        <Table stickyHeader>
+                            <TableHead>
+                                <TableRow>
+                                    <TableCell>کد ملی</TableCell>
+                                    <TableCell>نام</TableCell>
+                                    <TableCell>نقش</TableCell>
+                                </TableRow>
+                            </TableHead>
+                            <TableBody>
+                                {data.map((rahdar) => {
+                                    return (
+                                        <TableRow
+                                            key={rahdar.id}
+                                            sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
+                                        >
+                                            <TableCell>{rahdar.code}</TableCell>
+                                            <TableCell>{rahdar.name}</TableCell>
+                                            <TableCell>{rahdar.is_driver ? "راننده" : "همراه"}</TableCell>
+                                        </TableRow>
+                                    );
+                                })}
+                            </TableBody>
+                        </Table>
+                    </TableContainer>
+                ) : (
+                    <Typography textAlign={"center"}>اطلاعات راهداران در سامانه یافت نشد</Typography>
+                )}
+            </DialogContent>
+        </>
+    );
+};
+export default RahdaranContent;

src/components/dashboard/roadMissions/control/RowActions/Rahdaran/index.jsx

@@ -0,0 +1,38 @@
+import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
+import GroupsIcon from "@mui/icons-material/Groups";
+import { useState } from "react";
+import RahdaranContent from "./RahdaranContent";
+
+const RahdaranDialog = ({ rowId }) => {
+    const [openRahdaranDialog, setOpenRahdaranDialog] = useState(false);
+    return (
+        <>
+            <Tooltip title="افراد">
+                <IconButton color="primary" onClick={() => setOpenRahdaranDialog(true)}>
+                    <GroupsIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                fullWidth
+                open={openRahdaranDialog}
+                onClose={() => setOpenRahdaranDialog(false)}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+                dir="rtl"
+                maxWidth={"sm"}
+            >
+                <DialogTitle sx={{ fontSize: "large" }}>لیست افراد</DialogTitle>
+                {openRahdaranDialog && <RahdaranContent rowId={rowId} />}
+                <DialogActions>
+                    <Button onClick={() => setOpenRahdaranDialog(false)} variant="outlined" color="secondary" autoFocus>
+                        بستن
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+};
+export default RahdaranDialog;

src/components/dashboard/roadMissions/control/RowActions/StartMission/StartMissionContent.jsx

@@ -1,38 +1,87 @@
+import LtrTextField from "@/core/components/LtrTextField";
 import { START_MISSION } from "@/core/utils/routes";
 import useRequest from "@/lib/hooks/useRequest";
+import { yupResolver } from "@hookform/resolvers/yup";
 import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
-import { useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { object, string } from "yup";
 
 const StartMissionContent = ({ rowId, mutate, setOpenStartMissionDialog }) => {
-    const [submitting, setSubmitting] = useState(false);
     const requestServer = useRequest({ notificationSuccess: true });
-    const handleClick = () => {
-        setSubmitting(true);
+
+    const validationSchema = object().shape({
+        code: string().length(6, "کد خروج باید 6 رقم باشد").required("لطفاً کد خروج را وارد کنید."),
+    });
+
+    const {
+        control,
+        handleSubmit,
+        formState: { isSubmitting },
+    } = useForm({
+        defaultValues: {
+            code: "",
+        },
+        resolver: yupResolver(validationSchema),
+        mode: "all",
+    });
+
+    const onSubmit = (values) => {
         requestServer(`${START_MISSION}/${rowId}`, "post", {
+            data: {
+                code: values.code,
+            },
             hasSidebarUpdate: true,
         })
             .then(() => {
                 mutate();
                 setOpenStartMissionDialog(false);
-                setSubmitting(false);
             })
-            .catch(() => {
-                setSubmitting(false);
-            });
+            .catch(() => {});
     };
+
     return (
         <>
-            <DialogContent>
+            <DialogContent dividers>
                 <Stack alignItems="center" spacing={2}>
                     <Typography mt={2}>آیا از خروج خودرو و شروع ماموریت اطمینان دارید؟</Typography>
+                    <Stack>
+                        <Controller
+                            control={control}
+                            name={"code"}
+                            render={({ field, fieldState: { error } }) => (
+                                <LtrTextField
+                                    {...field}
+                                    label={"کد خروج"}
+                                    placeholder="xxxxxx"
+                                    error={!!error}
+                                    helperText={error?.message}
+                                    size="small"
+                                    onChange={(e) => {
+                                        if (isNaN(Number(e.target.value))) return;
+                                        e.target.value.length <= 6 ? field.onChange(e.target.value) : null;
+                                    }}
+                                    type="tel"
+                                    autoComplete="off"
+                                    fullWidth
+                                    variant="outlined"
+                                    InputLabelProps={{ shrink: true }}
+                                />
+                            )}
+                        />
+                    </Stack>
                 </Stack>
             </DialogContent>
             <DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
-                <Button onClick={() => setOpenStartMissionDialog(false)} variant="outlined" color="secondary">
+                <Button
+                    onClick={() => setOpenStartMissionDialog(false)}
+                    variant="outlined"
+                    color="secondary"
+                    disabled={isSubmitting}
+                >
                     خیر !
                 </Button>
-                <Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
-                    {submitting ? "درحال ثبت..." : "بله اطمینان دارم"}
+                <Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
+                    {isSubmitting ? "درحال ثبت..." : "بله اطمینان دارم"}
                 </Button>
             </DialogActions>
         </>

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/MapControlPolygon/DrawBound/index.jsx

@@ -1,116 +1,129 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import L from "leaflet";
-import { FeatureGroup, useMap } from "react-leaflet";
-import "leaflet-draw";
-
-const DrawBound = ({ control, controlDispach, bound, setBound }) => {
-    const map = useMap();
-    const featureRef = useRef(null);
-    const [area, setArea] = useState();
-    const drawControlRef = useRef(null);
-
-    const safeFlyToBounds = (layer) => {
-        if (!layer || !map) return;
-        try {
-            const latLngs = layer.getLatLngs();
-            map.flyToBounds(latLngs, {
-                paddingTopLeft: [20, 35],
-                paddingBottomRight: [20, 55],
-            });
-        } catch (e) {
-            console.warn("flyToBounds failed:", e);
-        }
-    };
-
-    const bindEditEvent = (layer) => {
-        if (!layer) return;
-        layer.on("edit", function (e) {
-            const editedLayer = e.target;
-            setArea(editedLayer);
-            setBound(editedLayer);
-            safeFlyToBounds(editedLayer);
-        });
-    };
-
-    const handlerCreatedBound = useCallback((event) => {
-        const { layer } = event;
-        layer.editing.enable();
-        featureRef.current.addLayer(layer); // 🟢 اول اضافه به نقشه
-        setArea(layer);
-        setBound(layer);
-        safeFlyToBounds(layer);
-        bindEditEvent(layer);
-        controlDispach({ type: "SET_STATUS", status: 2 });
-    }, []);
-
-    useEffect(() => {
-        if (
-            control.status === 1 &&
-            drawControlRef.current &&
-            drawControlRef.current._toolbars?.draw?._modes?.polygon?.handler
-        ) {
-            drawControlRef.current._toolbars.draw._modes.polygon.handler.enable();
-        }
-    }, [control.status]);
-
-    useEffect(() => {
-        if (control.status === 0 && area && featureRef.current) {
-            featureRef.current.removeLayer(area);
-            setArea(null);
-            setBound(null);
-        }
-    }, [control.status, area]);
-
-    useEffect(() => {
-        if (control.status === 2 && bound && featureRef.current) {
-            setArea(bound);
-            featureRef.current.addLayer(bound);
-            bound.editing.enable();
-            safeFlyToBounds(bound);
-            bindEditEvent(bound);
-        }
-    }, [control.status, bound]);
-
-    useEffect(() => {
-        if (!featureRef.current) return;
-
-        L.drawLocal.draw.handlers.polygon.tooltip.start = "برای شروع ترسیم محدوده، روی نقشه کلیک کنید";
-        L.drawLocal.draw.handlers.polygon.tooltip.cont = "برای ادامه ترسیم، نقاط بعدی را کلیک کنید";
-        L.drawLocal.draw.handlers.polygon.tooltip.end = "برای بستن محدوده، روی نقطه‌ی شروع کلیک کنید";
-
-        const drawControl = new L.Control.Draw({
-            draw: {
-                polygon: {
-                    shapeOptions: {
-                        color: "#3388ff",
-                        weight: 3,
-                        clickable: true,
-                    },
-                },
-                polyline: false,
-                rectangle: false,
-                circle: false,
-                marker: false,
-                circlemarker: false,
-            },
-            edit: {
-                featureGroup: featureRef.current,
-                edit: true,
-                remove: false,
-            },
-        });
-
-        drawControlRef.current = drawControl;
-        map.addControl(drawControl);
-        map.on(L.Draw.Event.CREATED, handlerCreatedBound);
-
-        return () => {
-            map.off(L.Draw.Event.CREATED, handlerCreatedBound);
-            map.removeControl(drawControl);
-        };
-    }, [map, handlerCreatedBound]);
-
-    return <FeatureGroup ref={featureRef} />;
-};
-
-export default DrawBound;
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import L from "leaflet";
+import { FeatureGroup, useMap } from "react-leaflet";
+import "leaflet-draw";
+
+const DrawBound = ({ control, controlDispach, bound, setBound }) => {
+    const map = useMap();
+    const featureRef = useRef(null);
+    const [area, setArea] = useState();
+    const drawControlRef = useRef(null);
+
+    const safeFlyToBounds = (layer) => {
+        if (!layer || !map) return;
+        try {
+            const latLngs = layer.getLatLngs();
+            map.flyToBounds(latLngs, {
+                paddingTopLeft: [20, 35],
+                paddingBottomRight: [20, 55],
+            });
+        } catch (e) {
+            console.warn("flyToBounds failed:", e);
+        }
+    };
+
+    const safeFitBounds = (layer) => {
+        if (!layer || !map) return;
+        try {
+            const latLngs = layer.getLatLngs();
+            map.fitBounds(latLngs, {
+                paddingTopLeft: [20, 35],
+                paddingBottomRight: [20, 55],
+            });
+        } catch (e) {
+            console.warn("fitBounds failed:", e);
+        }
+    };
+
+    const bindEditEvent = (layer) => {
+        if (!layer) return;
+        layer.on("edit", function (e) {
+            const editedLayer = e.target;
+            setArea(editedLayer);
+            setBound(editedLayer);
+            safeFlyToBounds(editedLayer);
+        });
+    };
+
+    const handlerCreatedBound = useCallback((event) => {
+        const { layer } = event;
+        layer.editing.enable();
+        featureRef.current.addLayer(layer); // 🟢 اول اضافه به نقشه
+        setArea(layer);
+        setBound(layer);
+        safeFlyToBounds(layer);
+        bindEditEvent(layer);
+        controlDispach({ type: "SET_STATUS", status: 2 });
+    }, []);
+
+    useEffect(() => {
+        if (
+            control.status === 1 &&
+            drawControlRef.current &&
+            drawControlRef.current._toolbars?.draw?._modes?.polygon?.handler
+        ) {
+            drawControlRef.current._toolbars.draw._modes.polygon.handler.enable();
+        }
+    }, [control.status]);
+
+    useEffect(() => {
+        if (control.status === 0 && area && featureRef.current) {
+            featureRef.current.removeLayer(area);
+            setArea(null);
+            setBound(null);
+        }
+    }, [control.status, area]);
+
+    useEffect(() => {
+        if (control.status === 2 && bound && featureRef.current) {
+            setArea(bound);
+            featureRef.current.addLayer(bound);
+            bound.editing.enable();
+            safeFitBounds(bound);
+            bindEditEvent(bound);
+        }
+    }, [control.status, bound]);
+
+    useEffect(() => {
+        if (!featureRef.current) return;
+
+        L.drawLocal.draw.handlers.polygon.tooltip.start = "برای شروع ترسیم محدوده، روی نقشه کلیک کنید";
+        L.drawLocal.draw.handlers.polygon.tooltip.cont = "برای ادامه ترسیم، نقاط بعدی را کلیک کنید";
+        L.drawLocal.draw.handlers.polygon.tooltip.end = "برای بستن محدوده، روی نقطه‌ی شروع کلیک کنید";
+
+        const drawControl = new L.Control.Draw({
+            draw: {
+                polygon: {
+                    shapeOptions: {
+                        color: "#3388ff",
+                        weight: 3,
+                        clickable: true,
+                    },
+                },
+                polyline: false,
+                rectangle: false,
+                circle: false,
+                marker: false,
+                circlemarker: false,
+            },
+            edit: {
+                featureGroup: featureRef.current,
+                edit: true,
+                remove: false,
+            },
+        });
+
+        drawControlRef.current = drawControl;
+        map.addControl(drawControl);
+        map.on(L.Draw.Event.CREATED, handlerCreatedBound);
+
+        return () => {
+            map.off(L.Draw.Event.CREATED, handlerCreatedBound);
+            map.removeControl(drawControl);
+        };
+    }, [map, handlerCreatedBound]);
+
+    return <FeatureGroup ref={featureRef} />;
+};
+
+export default DrawBound;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/MapControlPolygon/index.jsx

@@ -1,116 +1,116 @@
-import { Box, Button, Stack, Typography } from "@mui/material";
-import DrawBound from "./DrawBound";
-import { Delete, Edit, Route } from "@mui/icons-material";
-import { useReducer } from "react";
-
-const statusType = [
-    {
-        id: 0,
-        message: "برای آغاز ترسیم محدوده، کلیک کنید!",
-        buttons: [
-            {
-                label: "شروع ترسیم محدوده",
-                key: "start",
-                color: "primary",
-                icon: <Route />,
-                onclick: (controlDispach) => {
-                    controlDispach({ type: "SET_STATUS", status: 1 });
-                },
-            },
-        ],
-    },
-    {
-        id: 1,
-        message: "محدوده‌ی موردنظر را با کلیک روی نقشه مشخص کنید. برای اتمام، روی نقطه‌ی ابتدایی کلیک کنید!",
-        buttons: [],
-    },
-    {
-        id: 2,
-        message: "برای اصلاح محدوده، گوشه‌ها را بکشید. برای ترسیم دوباره، آن را حذف کنید",
-        buttons: [
-            {
-                label: "حذف",
-                key: "end",
-                color: "error",
-                icon: <Delete />,
-                onclick: (controlDispach) => {
-                    controlDispach({ type: "SET_STATUS", status: 0 });
-                },
-            },
-        ],
-    },
-];
-
-const createInitialState = (bound) => {
-    if (bound) {
-        return { status: 2 };
-    }
-    return { status: 0 };
-};
-
-const reducer = (state, action) => {
-    switch (action.type) {
-        case "SET_STATUS":
-            return { ...state, status: action.status };
-        default:
-            return state;
-    }
-};
-
-const MapControl = ({ bound, setBound }) => {
-    const [control, controlDispach] = useReducer(reducer, bound, createInitialState);
-
-    return (
-        <>
-            <DrawBound bound={bound} setBound={setBound} control={control} controlDispach={controlDispach} />
-            <Stack
-                direction={"row"}
-                justifyContent={"center"}
-                sx={{ position: "absolute", left: 0, top: 0, zIndex: 2000, width: "100%" }}
-            >
-                <Box
-                    sx={{
-                        background: (theme) => theme.palette.info.main,
-                        borderBottomLeftRadius: 8,
-                        borderBottomRightRadius: 8,
-                        py: 0.5,
-                        px: 2,
-                    }}
-                >
-                    <Typography align="center" component={"div"} variant="caption" color={"#fff"}>
-                        {statusType.find((st) => st.id == control.status).message}
-                    </Typography>
-                </Box>
-            </Stack>
-            <Box
-                sx={{
-                    position: "absolute",
-                    left: 0,
-                    bottom: 0,
-                    zIndex: 2000,
-                    width: "100%",
-                    py: 1,
-                    background: "linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0))",
-                }}
-            >
-                <Stack direction={"row"} justifyContent={"center"} spacing={2}>
-                    {statusType
-                        .find((st) => st.id == control.status)
-                        .buttons.map((button) => (
-                            <Button
-                                size="small"
-                                key={button.key}
-                                variant="contained"
-                                onClick={() => button.onclick(controlDispach)}
-                                color={button.color}
-                                startIcon={button.icon}
-                            >
-                                {button.label}
-                            </Button>
-                        ))}
-                </Stack>
-            </Box>
-        </>
-    );
-};
-export default MapControl;
+import { Delete, Route } from "@mui/icons-material";
+import { Box, Button, Stack, Typography } from "@mui/material";
+import { useReducer } from "react";
+import DrawBound from "./DrawBound";
+
+const statusType = [
+    {
+        id: 0,
+        message: "برای آغاز ترسیم محدوده، کلیک کنید!",
+        buttons: [
+            {
+                label: "شروع ترسیم محدوده",
+                key: "start",
+                color: "primary",
+                icon: <Route />,
+                onclick: (controlDispach) => {
+                    controlDispach({ type: "SET_STATUS", status: 1 });
+                },
+            },
+        ],
+    },
+    {
+        id: 1,
+        message: "محدوده‌ی موردنظر را با کلیک روی نقشه مشخص کنید. برای اتمام، روی نقطه‌ی ابتدایی کلیک کنید!",
+        buttons: [],
+    },
+    {
+        id: 2,
+        message: "برای اصلاح محدوده، گوشه‌ها را بکشید. برای ترسیم دوباره، آن را حذف کنید",
+        buttons: [
+            {
+                label: "حذف",
+                key: "end",
+                color: "error",
+                icon: <Delete />,
+                onclick: (controlDispach) => {
+                    controlDispach({ type: "SET_STATUS", status: 0 });
+                },
+            },
+        ],
+    },
+];
+
+const createInitialState = (bound) => {
+    if (bound) {
+        return { status: 2 };
+    }
+    return { status: 0 };
+};
+
+const reducer = (state, action) => {
+    switch (action.type) {
+        case "SET_STATUS":
+            return { ...state, status: action.status };
+        default:
+            return state;
+    }
+};
+
+const MapControlPolygon = ({ bound, setBound }) => {
+    const [control, controlDispach] = useReducer(reducer, bound, createInitialState);
+
+    return (
+        <>
+            <DrawBound bound={bound} setBound={setBound} control={control} controlDispach={controlDispach} />
+            <Stack
+                direction={"row"}
+                justifyContent={"center"}
+                sx={{ position: "absolute", left: 0, top: 0, zIndex: 2000, width: "100%" }}
+            >
+                <Box
+                    sx={{
+                        background: (theme) => theme.palette.info.main,
+                        borderBottomLeftRadius: 8,
+                        borderBottomRightRadius: 8,
+                        py: 0.5,
+                        px: 2,
+                    }}
+                >
+                    <Typography align="center" component={"div"} variant="caption" color={"#fff"}>
+                        {statusType.find((st) => st.id == control.status).message}
+                    </Typography>
+                </Box>
+            </Stack>
+            <Box
+                sx={{
+                    position: "absolute",
+                    left: 0,
+                    bottom: 0,
+                    zIndex: 2000,
+                    width: "100%",
+                    py: 1,
+                    background: "linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0))",
+                }}
+            >
+                <Stack direction={"row"} justifyContent={"center"} spacing={2}>
+                    {statusType
+                        .find((st) => st.id == control.status)
+                        .buttons.map((button) => (
+                            <Button
+                                size="small"
+                                key={button.key}
+                                variant="contained"
+                                onClick={() => button.onclick(controlDispach)}
+                                color={button.color}
+                                startIcon={button.icon}
+                            >
+                                {button.label}
+                            </Button>
+                        ))}
+                </Stack>
+            </Box>
+        </>
+    );
+};
+export default MapControlPolygon;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/MapControlPolyline/DrawBound/index.jsx

@@ -0,0 +1,129 @@
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import L from "leaflet";
+import { FeatureGroup, useMap } from "react-leaflet";
+import "leaflet-draw";
+
+const DrawBound = ({ control, controlDispach, bound, setBound }) => {
+    const map = useMap();
+    const featureRef = useRef(null);
+    const [area, setArea] = useState();
+    const drawControlRef = useRef(null);
+
+    const safeFlyToBounds = (layer) => {
+        if (!layer || !map) return;
+        try {
+            const latLngs = layer.getLatLngs();
+            map.flyToBounds(latLngs, {
+                paddingTopLeft: [20, 35],
+                paddingBottomRight: [20, 55],
+            });
+        } catch (e) {
+            console.warn("flyToBounds failed:", e);
+        }
+    };
+
+    const safeFitBounds = (layer) => {
+        if (!layer || !map) return;
+        try {
+            const latLngs = layer.getLatLngs();
+            map.fitBounds(latLngs, {
+                paddingTopLeft: [20, 35],
+                paddingBottomRight: [20, 55],
+            });
+        } catch (e) {
+            console.warn("fitBounds failed:", e);
+        }
+    };
+
+    const bindEditEvent = (layer) => {
+        if (!layer) return;
+        layer.on("edit", function (e) {
+            const editedLayer = e.target;
+            setArea(editedLayer);
+            setBound(editedLayer);
+            safeFlyToBounds(editedLayer);
+        });
+    };
+
+    const handlerCreatedBound = useCallback((event) => {
+        const { layer } = event;
+        layer.editing.enable();
+        featureRef.current.addLayer(layer); // 🟢 اول اضافه به نقشه
+        setArea(layer);
+        setBound(layer);
+        safeFlyToBounds(layer);
+        bindEditEvent(layer);
+        controlDispach({ type: "SET_STATUS", status: 2 });
+    }, []);
+
+    useEffect(() => {
+        if (
+            control.status === 1 &&
+            drawControlRef.current &&
+            drawControlRef.current._toolbars?.draw?._modes?.polyline?.handler
+        ) {
+            drawControlRef.current._toolbars.draw._modes.polyline.handler.enable();
+        }
+    }, [control.status]);
+
+    useEffect(() => {
+        if (control.status === 0 && area && featureRef.current) {
+            featureRef.current.removeLayer(area);
+            setArea(null);
+            setBound(null);
+        }
+    }, [control.status, area]);
+
+    useEffect(() => {
+        if (control.status === 2 && bound && featureRef.current) {
+            setArea(bound);
+            featureRef.current.addLayer(bound);
+            bound.editing.enable();
+            safeFitBounds(bound);
+            bindEditEvent(bound);
+        }
+    }, [control.status, bound]);
+
+    useEffect(() => {
+        if (!featureRef.current) return;
+
+        L.drawLocal.draw.handlers.polyline.tooltip.start = "برای شروع ترسیم مسیر، روی نقشه کلیک کنید";
+        L.drawLocal.draw.handlers.polyline.tooltip.cont = "برای ادامه ترسیم، نقاط بعدی را کلیک کنید";
+        L.drawLocal.draw.handlers.polyline.tooltip.end = "برای بستن مسیر، روی نقطه پایانی کلیک کنید";
+
+        const drawControl = new L.Control.Draw({
+            draw: {
+                polyline: {
+                    shapeOptions: {
+                        color: "#3388ff",
+                        weight: 3,
+                        clickable: true,
+                    },
+                },
+                polygon: false,
+                rectangle: false,
+                circle: false,
+                marker: false,
+                circlemarker: false,
+            },
+            edit: {
+                featureGroup: featureRef.current,
+                edit: true,
+                remove: false,
+            },
+        });
+
+        drawControlRef.current = drawControl;
+        map.addControl(drawControl);
+        map.on(L.Draw.Event.CREATED, handlerCreatedBound);
+
+        return () => {
+            map.off(L.Draw.Event.CREATED, handlerCreatedBound);
+            map.removeControl(drawControl);
+        };
+    }, [map, handlerCreatedBound]);
+
+    return <FeatureGroup ref={featureRef} />;
+};
+
+export default DrawBound;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/MapControlPolyline/index.jsx

@@ -0,0 +1,116 @@
+import { Delete, Route } from "@mui/icons-material";
+import { Box, Button, Stack, Typography } from "@mui/material";
+import { useReducer } from "react";
+import DrawBound from "./DrawBound";
+
+const statusType = [
+    {
+        id: 0,
+        message: "برای آغاز ترسیم مسیر، کلیک کنید!",
+        buttons: [
+            {
+                label: "شروع ترسیم مسیر",
+                key: "start",
+                color: "primary",
+                icon: <Route />,
+                onclick: (controlDispach) => {
+                    controlDispach({ type: "SET_STATUS", status: 1 });
+                },
+            },
+        ],
+    },
+    {
+        id: 1,
+        message: "مسیر موردنظر را با کلیک روی نقشه مشخص کنید. برای اتمام، روی نقطه‌ی پایانی کلیک کنید!",
+        buttons: [],
+    },
+    {
+        id: 2,
+        message: "برای اصلاح مسیر، گوشه‌ها را بکشید. برای ترسیم دوباره، آن را حذف کنید",
+        buttons: [
+            {
+                label: "حذف",
+                key: "end",
+                color: "error",
+                icon: <Delete />,
+                onclick: (controlDispach) => {
+                    controlDispach({ type: "SET_STATUS", status: 0 });
+                },
+            },
+        ],
+    },
+];
+
+const createInitialState = (bound) => {
+    if (bound) {
+        return { status: 2 };
+    }
+    return { status: 0 };
+};
+
+const reducer = (state, action) => {
+    switch (action.type) {
+        case "SET_STATUS":
+            return { ...state, status: action.status };
+        default:
+            return state;
+    }
+};
+
+const MapControlPolyline = ({ bound, setBound }) => {
+    const [control, controlDispach] = useReducer(reducer, bound, createInitialState);
+
+    return (
+        <>
+            <DrawBound bound={bound} setBound={setBound} control={control} controlDispach={controlDispach} />
+            <Stack
+                direction={"row"}
+                justifyContent={"center"}
+                sx={{ position: "absolute", left: 0, top: 0, zIndex: 2000, width: "100%" }}
+            >
+                <Box
+                    sx={{
+                        background: (theme) => theme.palette.info.main,
+                        borderBottomLeftRadius: 8,
+                        borderBottomRightRadius: 8,
+                        py: 0.5,
+                        px: 2,
+                    }}
+                >
+                    <Typography align="center" component={"div"} variant="caption" color={"#fff"}>
+                        {statusType.find((st) => st.id == control.status).message}
+                    </Typography>
+                </Box>
+            </Stack>
+            <Box
+                sx={{
+                    position: "absolute",
+                    left: 0,
+                    bottom: 0,
+                    zIndex: 2000,
+                    width: "100%",
+                    py: 1,
+                    background: "linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0))",
+                }}
+            >
+                <Stack direction={"row"} justifyContent={"center"} spacing={2}>
+                    {statusType
+                        .find((st) => st.id == control.status)
+                        .buttons.map((button) => (
+                            <Button
+                                size="small"
+                                key={button.key}
+                                variant="contained"
+                                onClick={() => button.onclick(controlDispach)}
+                                color={button.color}
+                                startIcon={button.icon}
+                            >
+                                {button.label}
+                            </Button>
+                        ))}
+                </Stack>
+            </Box>
+        </>
+    );
+};
+export default MapControlPolyline;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/SelectBoundType/index.jsx

@@ -0,0 +1,25 @@
+import SelectBox from "@/core/components/SelectBox";
+
+export const boundTypes = [
+    { id: "polygon", name_fa: "محدوده" },
+    { id: "polyline", name_fa: "مسیر" },
+];
+
+const SelectBoundType = ({ boundType, setBoundType, setBound, setAllData }) => {
+    return (
+        <>
+            <SelectBox
+                value={boundType}
+                label="نوع منطقه عملیاتی"
+                selectors={boundTypes}
+                schema={{ name: "name_fa", value: "id" }}
+                onChange={(newValue) => {
+                    setBound(null);
+                    setBoundType(newValue);
+                    setAllData({ bound_type: newValue });
+                }}
+            />
+        </>
+    );
+};
+export default SelectBoundType;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Area/index.jsx

@@ -1,8 +1,10 @@
 import MapLoading from "@/core/components/MapLayer/Loading";
-import { Box, Button, DialogActions, DialogContent } from "@mui/material";
+import { Box, Button, DialogActions, DialogContent, Stack } from "@mui/material";
 import dynamic from "next/dynamic";
-import MapControl from "./MapControl";
 import { useCallback, useState } from "react";
+import MapControlPolygon from "./MapControlPolygon";
+import MapControlPolyline from "./MapControlPolyline";
+import SelectBoundType from "./SelectBoundType";
 const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
     loading: () => <MapLoading />,
     ssr: false,
@@ -10,6 +12,7 @@ const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
 
 const Area = ({ allData, setAllData, handlePrev, setTabState }) => {
     const [bound, setBound] = useState(allData.bound);
+    const [boundType, setBoundType] = useState(allData.bound_type);
 
     const handleNext = useCallback(() => {
         setAllData({ bound: bound });
@@ -18,12 +21,24 @@ const Area = ({ allData, setAllData, handlePrev, setTabState }) => {
 
     return (
         <>
-            <DialogContent>
-                <Box sx={{ width: "100%", height: "400px" }}>
-                    <MapLayer style={{ borderRadius: "4px" }}>
-                        <MapControl bound={bound} setBound={setBound} />
-                    </MapLayer>
-                </Box>
+            <DialogContent dividers>
+                <Stack spacing={2}>
+                    <SelectBoundType
+                        boundType={boundType}
+                        setBoundType={setBoundType}
+                        setBound={setBound}
+                        setAllData={setAllData}
+                    />
+                    <Box sx={{ width: "100%", height: "400px" }}>
+                        <MapLayer style={{ borderRadius: "4px" }}>
+                            {boundType == "polygon" ? (
+                                <MapControlPolygon bound={bound} setBound={setBound} boundType={boundType} />
+                            ) : (
+                                <MapControlPolyline bound={bound} setBound={setBound} boundType={boundType} />
+                            )}
+                        </MapLayer>
+                    </Box>
+                </Stack>
             </DialogContent>
             <DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
                 <Button onClick={handlePrev} variant="outlined" color="secondary" size="large">

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetDateTime/MissionDates/index.jsx

@@ -1,93 +1,95 @@
-import MuiDatePicker from "@/core/components/MuiDatePicker";
-import MuiTimePicker from "@/core/components/MuiTimePicker";
-import { Grid } from "@mui/material";
-import { Controller, useWatch } from "react-hook-form";
-
-const MissionDates = ({ control }) => {
-    const type = useWatch({ control, name: "type" });
-    return (
-        <>
-            <Grid item xs={12} sm={6}>
-                <Controller
-                    control={control}
-                    name={"start_date"}
-                    render={({ field, fieldState: { error } }) => {
-                        return (
-                            <MuiDatePicker
-                                name="start_date"
-                                error={error}
-                                value={field.value}
-                                placeholder={"تاریخ شروع ماموریت را وارد کنید"}
-                                label={"تاریخ شروع ماموریت"}
-                                setFieldValue={(name, value) => field.onChange(value || [])}
-                                helperText={error ? error.message : null}
-                            />
-                        );
-                    }}
-                />
-            </Grid>
-            {type == 1 && (
-                <Grid item xs={12} sm={6}>
-                    <Controller
-                        control={control}
-                        name={"start_time"}
-                        render={({ field, fieldState: { error } }) => {
-                            return (
-                                <MuiTimePicker
-                                    name="start_time"
-                                    error={error}
-                                    value={field.value}
-                                    placeholder={"زمان شروع ماموریت را وارد کنید"}
-                                    label={"زمان شروع ماموریت"}
-                                    setFieldValue={(name, value) => field.onChange(value || null)}
-                                    helperText={error ? error.message : null}
-                                />
-                            );
-                        }}
-                    />
-                </Grid>
-            )}
-            <Grid item xs={12} sm={6}>
-                <Controller
-                    control={control}
-                    name={"end_date"}
-                    render={({ field, fieldState: { error } }) => {
-                        return (
-                            <MuiDatePicker
-                                name="end_date"
-                                error={error}
-                                value={field.value}
-                                placeholder={"تاریخ پایان ماموریت را وارد کنید"}
-                                label={"تاریخ پایان ماموریت"}
-                                setFieldValue={(name, value) => field.onChange(value || [])}
-                                helperText={error ? error.message : null}
-                            />
-                        );
-                    }}
-                />
-            </Grid>
-            {type == 1 && (
-                <Grid item xs={12} sm={6}>
-                    <Controller
-                        control={control}
-                        name={"end_time"}
-                        render={({ field, fieldState: { error } }) => {
-                            return (
-                                <MuiTimePicker
-                                    name="end_time"
-                                    error={error}
-                                    value={field.value}
-                                    placeholder={"زمان پایان ماموریت را وارد کنید"}
-                                    label={"زمان پایان ماموریت"}
-                                    setFieldValue={(name, value) => field.onChange(value || null)}
-                                    helperText={error ? error.message : null}
-                                />
-                            );
-                        }}
-                    />
-                </Grid>
-            )}
-        </>
-    );
-};
-export default MissionDates;
+import MuiDatePicker from "@/core/components/MuiDatePicker";
+import MuiTimePicker from "@/core/components/MuiTimePicker";
+import { Grid } from "@mui/material";
+import { Controller, useWatch } from "react-hook-form";
+
+const MissionDates = ({ control }) => {
+    const type = useWatch({ control, name: "type" });
+    return (
+        <>
+            <Grid item xs={12} sm={6}>
+                <Controller
+                    control={control}
+                    name={"start_date"}
+                    render={({ field, fieldState: { error } }) => {
+                        return (
+                            <MuiDatePicker
+                                name="start_date"
+                                error={error}
+                                value={field.value}
+                                placeholder={"تاریخ شروع ماموریت را وارد کنید"}
+                                label={"تاریخ شروع ماموریت"}
+                                setFieldValue={(name, value) => field.onChange(value || [])}
+                                helperText={error ? error.message : null}
+                            />
+                        );
+                    }}
+                />
+            </Grid>
+            {type == 1 && (
+                <Grid item xs={12} sm={6}>
+                    <Controller
+                        control={control}
+                        name={"start_time"}
+                        render={({ field, fieldState: { error } }) => {
+                            return (
+                                <MuiTimePicker
+                                    name="start_time"
+                                    error={error}
+                                    value={field.value}
+                                    views={["hours"]}
+                                    placeholder={"زمان شروع ماموریت را وارد کنید"}
+                                    label={"زمان شروع ماموریت"}
+                                    setFieldValue={(name, value) => field.onChange(value || null)}
+                                    helperText={error ? error.message : null}
+                                />
+                            );
+                        }}
+                    />
+                </Grid>
+            )}
+            <Grid item xs={12} sm={6}>
+                <Controller
+                    control={control}
+                    name={"end_date"}
+                    render={({ field, fieldState: { error } }) => {
+                        return (
+                            <MuiDatePicker
+                                name="end_date"
+                                error={error}
+                                value={field.value}
+                                placeholder={"تاریخ پایان ماموریت را وارد کنید"}
+                                label={"تاریخ پایان ماموریت"}
+                                setFieldValue={(name, value) => field.onChange(value || [])}
+                                helperText={error ? error.message : null}
+                            />
+                        );
+                    }}
+                />
+            </Grid>
+            {type == 1 && (
+                <Grid item xs={12} sm={6}>
+                    <Controller
+                        control={control}
+                        name={"end_time"}
+                        render={({ field, fieldState: { error } }) => {
+                            return (
+                                <MuiTimePicker
+                                    name="end_time"
+                                    error={error}
+                                    value={field.value}
+                                    views={["hours"]}
+                                    placeholder={"زمان پایان ماموریت را وارد کنید"}
+                                    label={"زمان پایان ماموریت"}
+                                    setFieldValue={(name, value) => field.onChange(value || null)}
+                                    helperText={error ? error.message : null}
+                                />
+                            );
+                        }}
+                    />
+                </Grid>
+            )}
+        </>
+    );
+};
+export default MissionDates;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetDateTime/index.jsx

@@ -0,0 +1,86 @@
+import SelectBox from "@/core/components/SelectBox";
+import StyledForm from "@/core/components/StyledForm";
+import { missionTypes } from "@/core/utils/missionTypes";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { Box, Button, DialogActions, DialogContent, Grid, Stack } from "@mui/material";
+import moment from "jalali-moment";
+import { Controller, useForm } from "react-hook-form";
+import { object, string } from "yup";
+import MissionDates from "./MissionDates";
+
+const validationSchema = object({
+    type: string().required("نوع ماموریت را مشخص کنید!"),
+    start_date: string().required("تاریخ شروع ماموریت را مشخص کنید!"),
+    start_time: string().when("type", {
+        is: "1",
+        then: (schema) => schema.required("زمان شروع ماموریت را مشخص کنید!"),
+        otherwise: (schema) => schema.notRequired(),
+    }),
+    end_date: string().required("تاریخ پایان ماموریت را مشخص کنید!"),
+    end_time: string().when("type", {
+        is: "1",
+        then: (schema) => schema.required("زمان شروع ماموریت را مشخص کنید!"),
+        otherwise: (schema) => schema.notRequired(),
+    }),
+});
+
+const GetDateTime = ({ allData, setAllData, handlePrev, setTabState }) => {
+    const defaultValues = {
+        type: allData.type,
+        start_date: allData.start_date,
+        start_time: allData.start_time ? moment(allData.start_time).toDate() : null,
+        end_date: allData.end_date,
+        end_time: allData.end_time ? moment(allData.end_time).toDate() : null,
+    };
+
+    const { control, handleSubmit } = useForm({
+        defaultValues,
+        resolver: yupResolver(validationSchema),
+        mode: "all",
+    });
+
+    const handleNext = (data) => {
+        setAllData(data);
+        setTabState((s) => s + 1);
+    };
+
+    return (
+        <StyledForm onSubmit={handleSubmit(handleNext)}>
+            <DialogContent dividers>
+                <Box sx={{ flex: 1 }}>
+                    <Stack>
+                        <Grid container spacing={2}>
+                            <Grid item xs={12}>
+                                <Controller
+                                    control={control}
+                                    name={"type"}
+                                    render={({ field, fieldState: { error } }) => (
+                                        <SelectBox
+                                            value={field.value}
+                                            label="نوع زمانبندی"
+                                            selectors={missionTypes}
+                                            schema={{ name: "name_fa", value: "id" }}
+                                            error={error}
+                                            onChange={field.onChange}
+                                            helperText={error?.message}
+                                        />
+                                    )}
+                                />
+                            </Grid>
+                            <MissionDates control={control} />
+                        </Grid>
+                    </Stack>
+                </Box>
+            </DialogContent>
+            <DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
+                <Button onClick={handlePrev} variant="outlined" color="secondary" size="large">
+                    {"مرحله قبلی"}
+                </Button>
+                <Button variant="contained" size="large" type="submit">
+                    مرحله بعد
+                </Button>
+            </DialogActions>
+        </StyledForm>
+    );
+};
+export default GetDateTime;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/FastReactCode/Dialog/List/RowActions/SelectId/index.jsx

@@ -0,0 +1,20 @@
+import { Done } from "@mui/icons-material";
+import { IconButton, Tooltip } from "@mui/material";
+
+const SelectId = ({ row, onChange, setOpenFastReactDialog }) => {
+    const handleClick = () => {
+        onChange(row.original.id);
+        setOpenFastReactDialog(false);
+    };
+
+    return (
+        <>
+            <Tooltip title="انتخاب" arrow placement="right">
+                <IconButton color="primary" sx={{ textTransform: "unset", alignSelf: "center" }} onClick={handleClick}>
+                    <Done />
+                </IconButton>
+            </Tooltip>
+        </>
+    );
+};
+export default SelectId;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/FastReactCode/Dialog/List/RowActions/index.jsx

@@ -0,0 +1,10 @@
+import SelectId from "./SelectId";
+
+const RowActions = ({ row, onChange, setOpenFastReactDialog }) => {
+    return (
+        <>
+            <SelectId row={row} onChange={onChange} setOpenFastReactDialog={setOpenFastReactDialog} />
+        </>
+    );
+};
+export default RowActions;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/FastReactCode/Dialog/List/index.jsx

@@ -0,0 +1,274 @@
+import DataTableWithAuth from "@/core/components/DataTableWithAuth";
+import { GET_FAST_REACT_COMPLAINTS } from "@/core/utils/routes";
+import { Box, Stack, Typography } from "@mui/material";
+import { useMemo } from "react";
+import RowActions from "./RowActions";
+import { usePermissions } from "@/lib/hooks/usePermissions";
+import { useAuth } from "@/lib/contexts/auth";
+import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
+import DescriptionForm from "@/components/dashboard/fastReact/complaintList/RowActions/DescriptionDialog";
+import LocationForm from "@/components/dashboard/fastReact/complaintList/RowActions/LocationDialog";
+import moment from "jalali-moment";
+import useProvinces from "@/lib/hooks/useProvince";
+import useEdaratLists from "@/lib/hooks/useEdaratLists";
+
+const FastReactList = ({ onChange, setOpenFastReactDialog }) => {
+    const { data: userPermissions } = usePermissions();
+    const hasCountryPermission = userPermissions?.includes("show-fast-react");
+    const { user } = useAuth();
+    const columns = useMemo(() => {
+        const dynamicColumns = {
+            header: "استان",
+            id: "road_observeds__province_id",
+            enableColumnFilter: true,
+            datatype: "numeric",
+            filterMode: "equals",
+            grow: false,
+            size: 130,
+            ColumnSelectComponent: (props) => {
+                const { provinces, errorProvinces, loadingProvinces } = useProvinces();
+                const getColumnSelectOptions = useMemo(() => {
+                    if (loadingProvinces) {
+                        return [{ value: "loading", label: "در حال بارگذاری..." }];
+                    }
+                    if (errorProvinces) {
+                        return [{ value: "error", label: "خطا در بارگذاری" }];
+                    }
+                    return [
+                        { value: "", label: "کل کشور" },
+                        ...provinces.map((province) => ({
+                            value: province.id,
+                            label: province.name_fa,
+                        })),
+                    ];
+                }, [provinces, errorProvinces, loadingProvinces]);
+                return (
+                    <CustomSelectByDependency
+                        {...props}
+                        value={loadingProvinces ? "loading" : props.filterParameters.value}
+                        columnSelectOption={getColumnSelectOptions}
+                    />
+                );
+            },
+            Cell: ({ row }) => <>{row.original.province_fa}</>,
+        };
+        return [
+            {
+                accessorKey: "id",
+                header: "کد یکتا",
+                id: "road_observeds__id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "equals",
+                sortDescFirst: false,
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+            },
+            ...(hasCountryPermission ? [dynamicColumns] : []),
+            {
+                header: "اداره",
+                id: "road_observeds__edarate_shahri_id",
+                enableColumnFilter: true,
+                datatype: "numeric",
+                filterMode: "equals",
+                dependencyId: hasCountryPermission ? "road_observeds__province_id" : null,
+                grow: false,
+                size: 120,
+                ColumnSelectComponent: (props) => {
+                    const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
+                        hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
+                    );
+                    const [prevDependency, setPrevDependency] = useState(
+                        hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
+                    );
+
+                    const getColumnSelectOptions = useMemo(() => {
+                        if (hasCountryPermission && props.dependencyFieldValue.value === "") {
+                            return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
+                        }
+                        if (loadingEdaratList) {
+                            return [{ value: "loading", label: "در حال بارگذاری..." }];
+                        }
+                        if (errorEdaratList) {
+                            return [{ value: "error", label: "خطا در بارگذاری" }];
+                        }
+                        return [
+                            { value: "", label: "کل ادارات" },
+                            ...edaratList.map((edare) => ({
+                                value: edare.id,
+                                label: edare.name_fa,
+                            })),
+                        ];
+                    }, [edaratList, loadingEdaratList, errorEdaratList]);
+                    useEffect(() => {
+                        if (hasCountryPermission) return;
+                        if (prevDependency === props.dependencyFieldValue?.value) return;
+                        props.handleChange({ ...props.filterParameters, value: "" });
+                        setPrevDependency(props.dependencyFieldValue?.value);
+                    }, [props.dependencyFieldValue?.value, hasCountryPermission]);
+                    return (
+                        <CustomSelectByDependency
+                            {...props}
+                            value={
+                                props.dependencyFieldValue?.value === ""
+                                    ? "empty"
+                                    : loadingEdaratList
+                                      ? "loading"
+                                      : props.filterParameters.value
+                            }
+                            columnSelectOption={getColumnSelectOptions}
+                        />
+                    );
+                },
+                Cell: ({ row }) => <>{row.original.edarate_shahri_name_fa}</>,
+            },
+            {
+                header: "اطلاعات ثبت‌ شده در سامانه سوانح",
+                id: "fkInfo",
+                enableColumnFilter: false,
+                enableSorting: false,
+                grow: false,
+                size: 50,
+                columns: [
+                    {
+                        accessorKey: "fk_RegisteredEventMessage",
+                        header: "کد سوانح",
+                        id: "fk_RegisteredEventMessage",
+                        enableColumnFilter: true,
+                        datatype: "text",
+                        filterMode: "equals",
+                        sortDescFirst: false,
+                        columnFilterModeOptions: ["equals", "contains"],
+                        grow: false,
+                        size: 100,
+                    },
+                    {
+                        accessorKey: "Title",
+                        header: "موضوع گزارش",
+                        id: "Title",
+                        enableColumnFilter: false,
+                        datatype: "text",
+                        filterMode: "equals",
+                        sortDescFirst: false,
+                        columnFilterModeOptions: ["equals", "contains"],
+                        grow: false,
+                        size: 100,
+                    },
+                    {
+                        accessorKey: "FeatureTypeTitle",
+                        header: "نوع گزارش",
+                        id: "FeatureTypeTitle",
+                        enableColumnFilter: false,
+                        datatype: "text",
+                        filterMode: "equals",
+                        sortDescFirst: false,
+                        columnFilterModeOptions: ["equals", "contains"],
+                        grow: false,
+                        size: 100,
+                    },
+                    {
+                        accessorKey: "Description",
+                        header: "توضیح گزارش",
+                        id: "Description",
+                        enableColumnFilter: false,
+                        datatype: "text",
+                        filterMode: "equals",
+                        sortDescFirst: false,
+                        columnFilterModeOptions: ["equals", "contains"],
+                        grow: false,
+                        size: 100,
+                        muiTableBodyCellProps: {
+                            sx: {
+                                borderLeft: "1px solid #e1e1e1",
+                                py: 0,
+                                "&:first-of-type": {
+                                    borderLeft: "unset",
+                                },
+                            },
+                        },
+                        Cell: ({ renderedCellValue }) => {
+                            if (renderedCellValue) {
+                                return (
+                                    <Stack alignItems={"center"} justifyContent={"center"}>
+                                        <DescriptionForm description={renderedCellValue} title={"توضیح گزارش"} />
+                                    </Stack>
+                                );
+                            }
+                            return <Typography variant="body2">-</Typography>;
+                        },
+                    },
+                    {
+                        header: "موقعیت",
+                        id: "location",
+                        enableColumnFilter: false,
+                        enableSorting: false,
+                        datatype: "array",
+                        grow: false,
+                        size: 100,
+                        muiTableBodyCellProps: {
+                            sx: {
+                                borderLeft: "1px solid #e1e1e1",
+                                py: 0,
+                                "&:first-of-type": {
+                                    borderLeft: "unset",
+                                },
+                            },
+                        },
+                        Cell: ({ row }) => {
+                            return (
+                                <Stack alignItems={"center"} justifyContent={"center"}>
+                                    <LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
+                                </Stack>
+                            );
+                        },
+                    },
+                    {
+                        accessorKey: "MobileForSendEventSms",
+                        header: "شماره تماس گیرنده",
+                        id: "MobileForSendEventSms",
+                        enableColumnFilter: false,
+                        datatype: "text",
+                        filterMode: "equals",
+                        sortDescFirst: false,
+                        columnFilterModeOptions: ["equals", "contains"],
+                        grow: false,
+                        size: 100,
+                    },
+                    {
+                        accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                        header: "تاریخ ثبت",
+                        id: "StartTime_DateTime",
+                        enableColumnFilter: true,
+                        datatype: "date",
+                        filterMode: "between",
+                        grow: false,
+                        size: 100,
+                    },
+                ],
+            },
+        ];
+    }, []);
+
+    return (
+        <>
+            <Box sx={{ mt: 3, p: 1 }}>
+                <DataTableWithAuth
+                    need_filter={true}
+                    table_title="لیست شکایات"
+                    columns={columns}
+                    sorting={[{ id: "StartTime_DateTime", desc: true }]}
+                    table_url={GET_FAST_REACT_COMPLAINTS}
+                    page_name={"roadMissionsOperator"}
+                    table_name={"roadMissionsOperatorFastReactList"}
+                    enableRowActions
+                    positionActionsColumn={"first"}
+                    RowActions={(props) => (
+                        <RowActions {...props} onChange={onChange} setOpenFastReactDialog={setOpenFastReactDialog} />
+                    )}
+                />
+            </Box>
+        </>
+    );
+};
+export default FastReactList;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/FastReactCode/Dialog/index.jsx

@@ -0,0 +1,49 @@
+import { Close, Edit } from "@mui/icons-material";
+import { Button, Chip, Dialog, Divider, IconButton } from "@mui/material";
+import FastReactList from "./List";
+import { useState, forwardRef } from "react";
+
+const FastReactDialog = forwardRef(({ onChange, value }, ref) => {
+    const [openFastReactDialog, setOpenFastReactDialog] = useState(false);
+
+    return (
+        <>
+            <Divider ref={ref}>
+                {value === "" ? (
+                    <Button onClick={() => setOpenFastReactDialog(true)} variant="outlined">
+                        انتخاب شکایت
+                    </Button>
+                ) : (
+                    <Chip
+                        label={`کد شکایت: ${value}`}
+                        variant="outlined"
+                        deleteIcon={<Edit />}
+                        onDelete={() => setOpenFastReactDialog(true)}
+                    />
+                )}
+            </Divider>
+            <Dialog open={openFastReactDialog} fullWidth maxWidth="md">
+                <IconButton
+                    aria-label="close"
+                    onClick={() => setOpenFastReactDialog(false)}
+                    sx={(theme) => ({
+                        position: "absolute",
+                        right: 8,
+                        top: 8,
+                        zIndex: 50,
+                        color: theme.palette.grey[500],
+                    })}
+                >
+                    <Close />
+                </IconButton>
+                {openFastReactDialog && (
+                    <FastReactList onChange={onChange} setOpenFastReactDialog={setOpenFastReactDialog} />
+                )}
+            </Dialog>
+        </>
+    );
+});
+
+FastReactDialog.displayName = "FastReactDialog";
+
+export default FastReactDialog;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/FastReactCode/index.jsx

@@ -0,0 +1,22 @@
+import { Divider, Stack } from "@mui/material";
+import { Controller, useWatch } from "react-hook-form";
+import FastReactDialog from "./Dialog";
+
+const FastReactCode = ({ control }) => {
+    const category_id = useWatch({ control, name: "category_id" });
+
+    if (category_id != 3) return null;
+
+    return (
+        <Controller
+            control={control}
+            name={"road_observed_id"}
+            render={({ field }) => (
+                <Stack justifyContent={"center"} sx={{ height: "100%" }}>
+                    <FastReactDialog {...field} />
+                </Stack>
+            )}
+        />
+    );
+};
+export default FastReactCode;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/GetItemInfo/index.jsx

@@ -1,41 +1,37 @@
 import PersianTextField from "@/core/components/PersianTextField";
 import SelectBox from "@/core/components/SelectBox";
 import StyledForm from "@/core/components/StyledForm";
+import { machineType } from "@/core/utils/machineTypes";
+import { missionCategoryTypes } from "@/core/utils/missionCategoryTypes";
+import { missionRegions } from "@/core/utils/missionRegions";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { ExitToApp } from "@mui/icons-material";
 import { Box, Button, DialogActions, DialogContent, Grid, Stack } from "@mui/material";
 import { Controller, useForm } from "react-hook-form";
-import { object, string } from "yup";
-import MissionDates from "./MissionDates";
-import moment from "jalali-moment";
+import { array, object, string } from "yup";
+import FastReactCode from "./FastReactCode";
 
 const validationSchema = object({
-    type: string().required("نوع ماموریت را مشخص کنید!"),
-    start_date: string().required("تاریخ شروع ماموریت را مشخص کنید!"),
-    start_time: string().when("type", {
-        is: "1",
-        then: (schema) => schema.required("زمان شروع ماموریت را مشخص کنید!"),
-        otherwise: (schema) => schema.notRequired(),
-    }),
-    end_date: string().required("تاریخ پایان ماموریت را مشخص کنید!"),
-    end_time: string().when("type", {
-        is: "1",
-        then: (schema) => schema.required("زمان شروع ماموریت را مشخص کنید!"),
-        otherwise: (schema) => schema.notRequired(),
-    }),
+    explanation: string().required("موضوع را مشخص کنید!"),
     end_point: string().required("مقصد را مشخص کنید!"),
     region: string().required("محور ماموریت را مشخص کنید!"),
+    category_id: string().required("نوع ماموریت را مشخص کنید!"),
+    requested_machines: array().min(1, "نوع خودرو را مشخص کنید!").required("نوع خودرو را مشخص کنید!"),
+    road_observed_id: string().when("category_id", {
+        is: "3",
+        then: (schema) => schema.required("کد یکتا شکایت را مشخص کنید!"),
+        otherwise: (schema) => schema.notRequired(),
+    }),
 });
 
-const GetItemInfo = ({ types, regions, allData, setAllData, handlePrev, setTabState }) => {
+const GetItemInfo = ({ allData, setAllData, handlePrev, setTabState }) => {
     const defaultValues = {
-        type: allData.type,
-        start_date: allData.start_date,
-        start_time: allData.start_time ? moment(allData.start_time).toDate() : null,
-        end_date: allData.end_date,
-        end_time: allData.end_time ? moment(allData.end_time).toDate() : null,
+        explanation: allData.explanation,
         end_point: allData.end_point,
         region: allData.region,
+        requested_machines: allData.requested_machines,
+        category_id: allData.category_id,
+        road_observed_id: allData.road_observed_id,
     };
 
     const { control, handleSubmit } = useForm({
@@ -58,16 +54,20 @@ const GetItemInfo = ({ types, regions, allData, setAllData, handlePrev, setTabSt
                             <Grid item xs={12} sm={6}>
                                 <Controller
                                     control={control}
-                                    name={"type"}
+                                    name={"explanation"}
                                     render={({ field, fieldState: { error } }) => (
-                                        <SelectBox
+                                        <PersianTextField
                                             value={field.value}
-                                            label="نوع ماموریت"
-                                            selectors={types}
-                                            schema={{ name: "name_fa", value: "id" }}
-                                            error={error}
+                                            variant="outlined"
+                                            name="explanation"
                                             onChange={field.onChange}
+                                            label="موضوع"
+                                            placeholder={"موضوع را وارد کنید"}
+                                            fullWidth
+                                            size="small"
+                                            error={error}
                                             helperText={error?.message}
+                                            InputLabelProps={{ shrink: true }}
                                         />
                                     )}
                                 />
@@ -79,8 +79,8 @@ const GetItemInfo = ({ types, regions, allData, setAllData, handlePrev, setTabSt
                                     render={({ field, fieldState: { error } }) => (
                                         <SelectBox
                                             value={field.value}
-                                            label="محدوده ماموریت"
-                                            selectors={regions}
+                                            label="محدوده"
+                                            selectors={missionRegions}
                                             schema={{ name: "name_fa", value: "id" }}
                                             error={error}
                                             onChange={field.onChange}
@@ -89,8 +89,44 @@ const GetItemInfo = ({ types, regions, allData, setAllData, handlePrev, setTabSt
                                     )}
                                 />
                             </Grid>
-                            <MissionDates control={control} />
-                            <Grid item xs={12}>
+                            <Grid item xs={12} sm={6}>
+                                <Controller
+                                    control={control}
+                                    name={"category_id"}
+                                    render={({ field, fieldState: { error } }) => (
+                                        <SelectBox
+                                            value={field.value}
+                                            label="نوع ماموریت"
+                                            selectors={missionCategoryTypes}
+                                            schema={{ name: "name_fa", value: "id" }}
+                                            error={error}
+                                            onChange={field.onChange}
+                                            helperText={error?.message}
+                                        />
+                                    )}
+                                />
+                            </Grid>
+                            <Grid item xs={12} sm={6}>
+                                <FastReactCode control={control} />
+                            </Grid>
+                            <Grid item xs={12} sm={6}>
+                                <Controller
+                                    control={control}
+                                    name={"requested_machines"}
+                                    render={({ field, fieldState: { error } }) => (
+                                        <SelectBox
+                                            value={field.value[0] || ""}
+                                            label="نوع خودرو"
+                                            selectors={machineType}
+                                            schema={{ name: "name_fa", value: "id" }}
+                                            error={error}
+                                            onChange={(newValue) => field.onChange([newValue])}
+                                            helperText={error?.message}
+                                        />
+                                    )}
+                                />
+                            </Grid>
+                            <Grid item xs={12} sm={6}>
                                 <Controller
                                     control={control}
                                     name={"end_point"}

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Rahdaran/Form/index.jsx

@@ -1,4 +1,4 @@
-import RahdarCode from "@/core/components/RahdarCode";
+import RahdarNameOrCode from "@/core/components/RahdarNameOrCode";
 import StyledForm from "@/core/components/StyledForm";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { Add } from "@mui/icons-material";
@@ -7,7 +7,7 @@ import { Controller, useForm } from "react-hook-form";
 import { object } from "yup";
 
 const schema = object().shape({
-    rahdar: object().required("راهدار الزامی است."),
+    rahdar: object().required("همراه الزامی است."),
 });
 const RahdaranForm = ({ setRahdaran }) => {
     const defaultValues = {
@@ -38,9 +38,10 @@ const RahdaranForm = ({ setRahdaran }) => {
                         control={control}
                         render={({ field, fieldState: { error } }) => {
                             return (
-                                <RahdarCode
-                                    rahdarsCode={field.value}
-                                    setRahdarsCode={(value) => field.onChange(value)}
+                                <RahdarNameOrCode
+                                    title="همراه"
+                                    rahdarsName={field.value}
+                                    setRahdarsName={(value) => field.onChange(value)}
                                     error={error}
                                     multiple={false}
                                 />
@@ -56,7 +57,7 @@ const RahdaranForm = ({ setRahdaran }) => {
                     disabled={isSubmitting || !isValid}
                     startIcon={<Add />}
                 >
-                    افزودن راهدار
+                    افزودن همراه
                 </Button>
             </Stack>
         </StyledForm>

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Rahdaran/List/index.jsx

@@ -33,7 +33,7 @@ const RahdaranList = ({ rahdaran, setRahdaran }) => {
                                         <Typography variant="body2">{rahdar.name}</Typography>
                                     </Stack>
                                     <Stack direction={"row"} spacing={0.5}>
-                                        <Typography variant="caption">کد راهدار:</Typography>
+                                        <Typography variant="caption">کدملی:</Typography>
                                         <Typography variant="body2">{rahdar.code}</Typography>
                                     </Stack>
                                 </Stack>
@@ -46,7 +46,7 @@ const RahdaranList = ({ rahdaran, setRahdaran }) => {
                 ))}
                 {rahdaran.length == 0 && (
                     <Collapse>
-                        <Typography align="center">راهداری ثبت نشده است</Typography>
+                        <Typography align="center">همراهی ثبت نشده است</Typography>
                     </Collapse>
                 )}
             </TransitionGroup>

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Rahdaran/index.jsx

@@ -17,7 +17,7 @@ const Rahdaran = ({ allData, setAllData, setTabState, handlePrev }) => {
                 <Box sx={{ flex: 1 }}>
                     <RahdaranForm setRahdaran={setRahdaran} />
                     <Divider sx={{ my: 2 }}>
-                        <Chip label="لیست راهداران" />
+                        <Chip label="لیست همراهان" />
                     </Divider>
                     <RahdaranList rahdaran={rahdaran} setRahdaran={setRahdaran} />
                 </Box>
@@ -26,8 +26,8 @@ const Rahdaran = ({ allData, setAllData, setTabState, handlePrev }) => {
                 <Button onClick={handlePrev} variant="outlined" color="secondary" size="large">
                     {"مرحله قبلی"}
                 </Button>
-                <Button variant="contained" size="large" disabled={rahdaran.length == 0} onClick={handleNext}>
-                    {rahdaran.length == 0 ? "ثبت حداقل یک راهدار" : "مرحله بعد"}
+                <Button variant="contained" size="large" onClick={handleNext}>
+                    {"مرحله بعد"}
                 </Button>
             </DialogActions>
         </>

src/components/dashboard/roadMissions/operator/Actions/Create/Form/RequestMachines/Form/index.jsx

@@ -1,89 +0,0 @@
-import LtrTextField from "@/core/components/LtrTextField";
-import SelectBox from "@/core/components/SelectBox";
-import StyledForm from "@/core/components/StyledForm";
-import { machineType } from "@/core/utils/machineTypes";
-import { yupResolver } from "@hookform/resolvers/yup";
-import { Add } from "@mui/icons-material";
-import { Button, Grid, Stack } from "@mui/material";
-import moment from "jalali-moment";
-import { Controller, useForm } from "react-hook-form";
-import { object, string } from "yup";
-
-const validationSchema = object({
-    type: string().required("نوع خودرو را مشخص کنید!"),
-    count: string().required("تعداد خودرو را مشخص کنید!"),
-});
-
-const RequestMachinesForm = ({ requests, setRequests }) => {
-    const usedTypeIds = requests.map((r) => r.type);
-    const filteredMachineTypes = machineType.filter((mt) => !usedTypeIds.includes(mt.id));
-
-    const defaultValues = {
-        type: "",
-        count: "",
-    };
-
-    const { control, handleSubmit, reset } = useForm({
-        defaultValues,
-        resolver: yupResolver(validationSchema),
-        mode: "all",
-    });
-
-    const submit = (data) => {
-        setRequests((r) => [...r, { id: moment().valueOf(), ...data }]);
-        reset();
-    };
-    return (
-        <StyledForm onSubmit={handleSubmit(submit)}>
-            <Stack>
-                <Grid container spacing={2}>
-                    <Grid item xs={12} sm={5}>
-                        <Controller
-                            control={control}
-                            name={"type"}
-                            render={({ field, fieldState: { error } }) => (
-                                <SelectBox
-                                    value={field.value}
-                                    label="نوع خودرو"
-                                    selectors={filteredMachineTypes}
-                                    schema={{ name: "name_fa", value: "id" }}
-                                    error={error}
-                                    onChange={field.onChange}
-                                    helperText={error?.message}
-                                />
-                            )}
-                        />
-                    </Grid>
-                    <Grid item xs={12} sm={4}>
-                        <Controller
-                            control={control}
-                            name={"count"}
-                            render={({ field, fieldState: { error } }) => (
-                                <LtrTextField
-                                    fullWidth
-                                    {...field}
-                                    autoComplete="off"
-                                    onChange={(e) => {
-                                        if (isNaN(Number(e.target.value))) return;
-                                        field.onChange(e.target.value);
-                                    }}
-                                    size="small"
-                                    error={!!error}
-                                    helperText={!!error && error.message}
-                                    type="tel"
-                                    label="تعداد خودرو"
-                                />
-                            )}
-                        />
-                    </Grid>
-                    <Grid item xs={12} sm={3}>
-                        <Button variant="outlined" type="submit" fullWidth startIcon={<Add />}>
-                            افزودن خودرو
-                        </Button>
-                    </Grid>
-                </Grid>
-            </Stack>
-        </StyledForm>
-    );
-};
-export default RequestMachinesForm;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/RequestMachines/List/index.jsx

@@ -1,59 +0,0 @@
-import { machineType } from "@/core/utils/machineTypes";
-import { Delete, FireTruck } from "@mui/icons-material";
-import { Card, Collapse, IconButton, Stack, Typography } from "@mui/material";
-import { TransitionGroup } from "react-transition-group";
-
-const RequestMachinesList = ({ requests, setRequests }) => {
-    const handleRemove = (index) => {
-        setRequests((prev) => prev.filter((_, i) => i !== index));
-    };
-
-    return (
-        <Stack>
-            <TransitionGroup>
-                {requests.map((request, index) => (
-                    <Collapse key={request.id}>
-                        <Card
-                            elevation={0}
-                            sx={{
-                                display: "flex",
-                                alignItems: "center",
-                                justifyContent: "space-between",
-                                border: 1,
-                                borderColor: "divider",
-                                px: 1,
-                                py: 1,
-                                my: 1,
-                            }}
-                        >
-                            <Stack direction={"row"} spacing={1}>
-                                <FireTruck color="primary" sx={{ width: "32px", height: "32px" }} />
-                                <Stack>
-                                    <Stack direction={"row"} spacing={0.5}>
-                                        <Typography variant="caption">نوع خودرو:</Typography>
-                                        <Typography variant="body2">
-                                            {machineType.find((t) => t.id == request.type)?.name_fa || ""}
-                                        </Typography>
-                                    </Stack>
-                                    <Stack direction={"row"} spacing={0.5}>
-                                        <Typography variant="caption">تعداد:</Typography>
-                                        <Typography variant="body2">{request.count}</Typography>
-                                    </Stack>
-                                </Stack>
-                            </Stack>
-                            <IconButton color="error" onClick={() => handleRemove(index)}>
-                                <Delete />
-                            </IconButton>
-                        </Card>
-                    </Collapse>
-                ))}
-                {requests.length == 0 && (
-                    <Collapse>
-                        <Typography align="center">درخواستی ثبت نشده است</Typography>
-                    </Collapse>
-                )}
-            </TransitionGroup>
-        </Stack>
-    );
-};
-export default RequestMachinesList;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/RequestMachines/index.jsx

@@ -1,36 +0,0 @@
-import { Box, Button, Chip, DialogActions, DialogContent, Divider } from "@mui/material";
-import { useCallback, useState } from "react";
-import RequestMachinesForm from "./Form";
-import RequestMachinesList from "./List";
-
-const RequestMachines = ({ allData, setAllData, handlePrev, setTabState }) => {
-    const [requests, setRequests] = useState(allData.requested_machines);
-
-    const handleNext = useCallback(() => {
-        setAllData({ requested_machines: requests });
-        setTabState((s) => s + 1);
-    }, [requests]);
-
-    return (
-        <>
-            <DialogContent dividers>
-                <Box sx={{ flex: 1 }}>
-                    <RequestMachinesForm requests={requests} setRequests={setRequests} />
-                    <Divider sx={{ my: 2 }}>
-                        <Chip label="لیست درخواست خودرو ها" />
-                    </Divider>
-                    <RequestMachinesList requests={requests} setRequests={setRequests} />
-                </Box>
-            </DialogContent>
-            <DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
-                <Button onClick={handlePrev} variant="outlined" color="secondary" size="large">
-                    {"مرحله قبلی"}
-                </Button>
-                <Button variant="contained" size="large" disabled={requests.length == 0} onClick={handleNext}>
-                    {requests.length == 0 ? "ثبت حداقل یک درخواست" : "مرحله بعد"}
-                </Button>
-            </DialogActions>
-        </>
-    );
-};
-export default RequestMachines;

src/components/dashboard/roadMissions/operator/Actions/Create/Form/Verify/index.jsx

@@ -1,16 +1,19 @@
 import MapLoading from "@/core/components/MapLayer/Loading";
+import { machineType } from "@/core/utils/machineTypes";
+import { missionCategoryTypes } from "@/core/utils/missionCategoryTypes";
+import { missionRegions } from "@/core/utils/missionRegions";
+import { missionTypes } from "@/core/utils/missionTypes";
 import { Box, Button, Chip, DialogActions, DialogContent, Divider, Stack, Typography } from "@mui/material";
+import moment from "jalali-moment";
 import dynamic from "next/dynamic";
 import { useCallback } from "react";
-import moment from "jalali-moment";
 import ShowBound from "../../../showBound";
-import { machineType } from "@/core/utils/machineTypes";
 const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
     loading: () => <MapLoading />,
     ssr: false,
 });
 
-const Verify = ({ types, regions, allData, handlePrev, submitForm, submitting }) => {
+const Verify = ({ allData, handlePrev, submitForm, submitting }) => {
     const handleNext = useCallback(() => {
         submitForm(allData);
     }, [allData]);
@@ -30,14 +33,47 @@ const Verify = ({ types, regions, allData, handlePrev, submitForm, submitting })
                                 <Chip color="primary" variant="outlined" label="مشخصات ماموریت" />
                             </Divider>
                             <Stack direction={"row"} alignItems={"center"} spacing={1}>
-                                <Typography variant="body2">نوع ماموریت</Typography>
+                                <Typography variant="body2">موضوع ماموریت</Typography>
                                 <Divider sx={{ flex: 1 }} />
-                                <Chip size="small" label={types.find((t) => t.id == allData.type).name_fa} />
+                                <Chip size="small" label={allData.explanation} />
                             </Stack>
                             <Stack direction={"row"} alignItems={"center"} spacing={1}>
-                                <Typography variant="body2">محدوده ماموریت</Typography>
+                                <Typography variant="body2">محدوده</Typography>
                                 <Divider sx={{ flex: 1 }} />
-                                <Chip size="small" label={regions.find((r) => r.id == allData.region).name_fa} />
+                                <Chip size="small" label={missionRegions.find((r) => r.id == allData.region).name_fa} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">نوع ماموریت</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip
+                                    size="small"
+                                    label={missionCategoryTypes.find((t) => t.id == allData.category_id).name_fa}
+                                />
+                            </Stack>
+                            {allData.category_id == 3 && (
+                                <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                    <Typography variant="body2">کد شکایت</Typography>
+                                    <Divider sx={{ flex: 1 }} />
+                                    <Chip size="small" label={allData.road_observed_id} />
+                                </Stack>
+                            )}
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">نوع خودرو</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip
+                                    size="small"
+                                    label={machineType.find((mt) => mt.id == allData.requested_machines[0]).name_fa}
+                                />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">مقصد</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={allData.end_point} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">نوع زمانبندی</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={missionTypes.find((t) => t.id == allData.type).name_fa} />
                             </Stack>
                             <Stack direction={"row"} alignItems={"center"} spacing={1}>
                                 <Typography variant="body2">تاریخ شروع ماموریت</Typography>
@@ -69,37 +105,24 @@ const Verify = ({ types, regions, allData, handlePrev, submitForm, submitting })
                                     />
                                 )}
                             </Stack>
-                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
-                                <Typography variant="body2">مقصد</Typography>
-                                <Divider sx={{ flex: 1 }} />
-                                <Chip size="small" label={allData.end_point} />
-                            </Stack>
                         </Stack>
                         <Stack spacing={1}>
                             <Divider>
-                                <Chip color="primary" variant="outlined" label="خودرو ها" />
+                                <Chip color="primary" variant="outlined" label="همراهان" />
                             </Divider>
-                            {allData.requested_machines.map((request) => (
-                                <Stack key={request.id} direction={"row"} alignItems={"center"} spacing={1}>
-                                    <Typography variant="body2">
-                                        {machineType.find((mt) => mt.id == request.type).name_fa}
-                                    </Typography>
-                                    <Divider sx={{ flex: 1 }} />
-                                    <Chip size="small" label={request.count} />
+                            {allData.rahdaran.length != 0 ? (
+                                allData.rahdaran.map((rahdar) => (
+                                    <Stack key={rahdar.id} direction={"row"} alignItems={"center"} spacing={1}>
+                                        <Typography variant="body2">{rahdar.name}</Typography>
+                                        <Divider sx={{ flex: 1 }} />
+                                        <Chip size="small" label={rahdar.code} />
+                                    </Stack>
+                                ))
+                            ) : (
+                                <Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
+                                    <Typography variant="body2">همراهی ثبت نشده است</Typography>
                                 </Stack>
-                            ))}
-                        </Stack>
-                        <Stack spacing={1}>
-                            <Divider>
-                                <Chip color="primary" variant="outlined" label="راهداران" />
-                            </Divider>
-                            {allData.rahdaran.map((rahdar) => (
-                                <Stack key={rahdar.id} direction={"row"} alignItems={"center"} spacing={1}>
-                                    <Typography variant="body2">{rahdar.name}</Typography>
-                                    <Divider sx={{ flex: 1 }} />
-                                    <Chip size="small" label={rahdar.code} />
-                                </Stack>
-                            ))}
+                            )}
                         </Stack>
                     </Stack>
                 </Box>

src/components/dashboard/roadMissions/operator/Actions/Create/Form/index.jsx

@@ -1,23 +1,12 @@
-import { Engineering, InsertDriveFile, Route, TaxiAlert, Verified } from "@mui/icons-material";
+import { AccessTime, Engineering, InsertDriveFile, Route, Verified } from "@mui/icons-material";
 import { Box, Tab, Tabs } from "@mui/material";
 import { useReducer, useState } from "react";
-import GetItemInfo from "./GetItemInfo";
-import RequestMachines from "./RequestMachines";
-import Rahdaran from "./Rahdaran";
 import Area from "./Area";
+import GetDateTime from "./GetDateTime";
+import GetItemInfo from "./GetItemInfo";
+import Rahdaran from "./Rahdaran";
 import Verify from "./Verify";
 
-const types = [
-    { id: 1, name_fa: "ساعتی" },
-    { id: 2, name_fa: "روزانه" },
-];
-
-const regions = [
-    { id: 1, name_fa: "داخل شهر" },
-    { id: 2, name_fa: "بیرون شهر - داخل محدوده" },
-    { id: 3, name_fa: "بیرون شهر - خارج محدوده" },
-];
-
 function TabPanel(props) {
     const { children, value, index } = props;
     return (
@@ -70,15 +59,13 @@ const CreateForm = ({ defaultValues, submitForm, setOpen, submitting }) => {
                 }}
             >
                 <Tab icon={<InsertDriveFile />} label="مشخصات" />
-                <Tab disabled={tabState < 1} icon={<Route />} label="محدوده" />
-                <Tab disabled={tabState < 2} icon={<TaxiAlert />} label="خودرو ها" />
-                <Tab disabled={tabState < 3} icon={<Engineering />} label="راهداران" />
+                <Tab disabled={tabState < 1} icon={<AccessTime />} label="زمانبندی" />
+                <Tab disabled={tabState < 2} icon={<Route />} label="منطقه عملیاتی" />
+                <Tab disabled={tabState < 3} icon={<Engineering />} label="همراهان" />
                 <Tab disabled={tabState < 4} icon={<Verified />} label="بررسی نهایی" />
             </Tabs>
             <TabPanel value={tabState} index={0}>
                 <GetItemInfo
-                    types={types}
-                    regions={regions}
                     allData={allData}
                     setAllData={(data) => {
                         dispatch({ type: "changeData", data });
@@ -88,7 +75,7 @@ const CreateForm = ({ defaultValues, submitForm, setOpen, submitting }) => {
                 />
             </TabPanel>
             <TabPanel value={tabState} index={1}>
-                <Area
+                <GetDateTime
                     allData={allData}
                     setAllData={(data) => {
                         dispatch({ type: "changeData", data });
@@ -98,7 +85,7 @@ const CreateForm = ({ defaultValues, submitForm, setOpen, submitting }) => {
                 />
             </TabPanel>
             <TabPanel value={tabState} index={2}>
-                <RequestMachines
+                <Area
                     allData={allData}
                     setAllData={(data) => {
                         dispatch({ type: "changeData", data });
@@ -118,14 +105,7 @@ const CreateForm = ({ defaultValues, submitForm, setOpen, submitting }) => {
                 />
             </TabPanel>
             <TabPanel value={tabState} index={4}>
-                <Verify
-                    types={types}
-                    regions={regions}
-                    allData={allData}
-                    handlePrev={handlePrev}
-                    submitForm={submitForm}
-                    submitting={submitting}
-                />
+                <Verify allData={allData} handlePrev={handlePrev} submitForm={submitForm} submitting={submitting} />
             </TabPanel>
         </>
     );

src/components/dashboard/roadMissions/operator/Actions/Create/index.jsx

@@ -20,25 +20,38 @@ const Create = ({ mutate }) => {
     const submitForm = async (result) => {
         setSubmitting(true);
         const bound = result.bound.getLatLngs();
-        let area = bound.map((ring) => ring.map((latlng) => [latlng.lat, latlng.lng]));
+        let area =
+            result.bound_type == "polygon"
+                ? bound.map((ring) => ring.map((latlng) => [latlng.lat, latlng.lng]))[0]
+                : bound.map((latlng) => [latlng.lat, latlng.lng]);
 
         await requestServer(REQUEST_MISSION, "post", {
             data: {
-                area: area[0],
-                rahdaran: result.rahdaran.map((r) => r.id),
+                explanation: result.explanation,
+                category_id: result.category_id,
+                ...(result.category_id == 3
+                    ? {
+                          road_observed_id: result.road_observed_id,
+                      }
+                    : {}),
+                area: {
+                    type: result.bound_type,
+                    coordinates: area,
+                },
+                ...(result.rahdaran.length != 0 ? { rahdaran: result.rahdaran.map((r) => r.id) } : {}),
                 requested_machines: result.requested_machines,
                 type: result.type,
                 zone: result.region,
                 end_point: result.end_point,
                 ...(result.type == 1
                     ? {
-                        start_date: `${result.start_date} ${moment(result.start_time).format("HH:mm")}`,
-                        end_date: `${result.end_date} ${moment(result.end_time).format("HH:mm")}`,
-                    }
+                          start_date: `${result.start_date} ${moment(result.start_time).format("HH:mm")}`,
+                          end_date: `${result.end_date} ${moment(result.end_time).format("HH:mm")}`,
+                      }
                     : {
-                        start_date: result.start_date,
-                        end_date: result.end_date,
-                    }),
+                          start_date: result.start_date,
+                          end_date: result.end_date,
+                      }),
             },
             hasSidebarUpdate: true,
         })
@@ -46,7 +59,7 @@ const Create = ({ mutate }) => {
                 mutate();
                 setOpen(false);
             })
-            .catch((error) => { })
+            .catch((error) => {})
             .finally(() => {
                 setSubmitting(false);
             });
@@ -86,9 +99,13 @@ const Create = ({ mutate }) => {
                 {open && (
                     <CreateForm
                         defaultValues={{
+                            explanation: "",
+                            category_id: "",
+                            road_observed_id: "",
                             rahdaran: [],
                             requested_machines: [],
                             bound: null,
+                            bound_type: "polygon",
                             type: "",
                             start_date: "",
                             start_time: null,

src/components/dashboard/roadMissions/operator/Actions/showArea/index.jsx

@@ -6,12 +6,15 @@ import ShowBound from "../showBound";
 import L from "leaflet";
 
 const ShowArea = ({ area }) => {
-    const bound = useMemo(() => L.polygon([...area]), [area]);
+    const bound = useMemo(
+        () => (area.type == "polygon" ? L.polygon([...area.coordinates]) : L.polyline([...area.coordinates])),
+        [area]
+    );
     const [openAreaDialog, setOpenAreaDialog] = useState(false);
 
     return (
         <>
-            <Tooltip title="محدوده">
+            <Tooltip title="منطقه عملیاتی">
                 <IconButton color="primary" onClick={() => setOpenAreaDialog(true)}>
                     <RemoveRedEye />
                 </IconButton>
@@ -33,7 +36,7 @@ const ShowArea = ({ area }) => {
             >
                 <DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
                     <Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
-                        محدوده
+                        منطقه عملیاتی
                     </Typography>
                     <IconButton onClick={() => setOpenAreaDialog(false)} size="small">
                         <Close />

src/components/dashboard/roadMissions/operator/OperatorList.jsx

@@ -1,17 +1,18 @@
 "use client";
 import DataTableWithAuth from "@/core/components/DataTableWithAuth";
+import { missionCategoryTypes } from "@/core/utils/missionCategoryTypes";
+import { missionRegions } from "@/core/utils/missionRegions";
+import { missionTypes } from "@/core/utils/missionTypes";
 import { GET_ROAD_MISSIONS_OPERATOR_LIST } from "@/core/utils/routes";
 import { Box, Stack } from "@mui/material";
 import moment from "jalali-moment";
 import { useMemo } from "react";
 import ShowArea from "./Actions/showArea";
 import RowActions from "./RowActions";
+import MachinesDialog from "./RowActions/Machines";
 import Toolbar from "./Toolbar";
+import RahdaranDialog from "./RowActions/Rahdaran";
 
-const typeOptions = [
-    { value: 1, label: "روزانه" },
-    { value: 2, label: "ساعتی" },
-];
 const OperatorList = () => {
     const columns = useMemo(
         () => [
@@ -27,8 +28,74 @@ const OperatorList = () => {
                 size: 100,
             },
             {
-                accessorKey: "type",
+                accessorKey: "code",
+                header: "کد خروج",
+                id: "code",
+                enableColumnFilter: false,
+                datatype: "numeric",
+                filterMode: "equals",
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "state_name",
+                header: "وضعیت",
+                id: "state_name",
+                enableColumnFilter: false,
+                datatype: "numeric",
+                filterMode: "equals",
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "explanation",
+                header: "موضوع",
+                id: "explanation",
+                enableColumnFilter: false,
+                datatype: "numeric",
+                filterMode: "equals",
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "category_id",
                 header: "نوع",
+                id: "category_id",
+                enableColumnFilter: true,
+                datatype: "numeric",
+                filterMode: "equals",
+                sortDescFirst: true,
+                grow: false,
+                size: 100,
+                columnSelectOption: () => {
+                    return missionCategoryTypes.map((category) => ({
+                        value: category.id,
+                        label: category.name_fa,
+                    }));
+                },
+                Cell: ({ row }) => row.original.category_name,
+            },
+            {
+                accessorKey: "zone",
+                header: "محدوده",
+                id: "zone",
+                enableColumnFilter: true,
+                datatype: "numeric",
+                filterMode: "equals",
+                sortDescFirst: true,
+                grow: false,
+                size: 100,
+                columnSelectOption: () => {
+                    return missionRegions.map((region) => ({
+                        value: region.id,
+                        label: region.name_fa,
+                    }));
+                },
+                Cell: ({ row }) => row.original.zone_fa,
+            },
+            {
+                accessorKey: "type",
+                header: "نوع زمانبندی",
                 id: "type",
                 enableColumnFilter: true,
                 datatype: "numeric",
@@ -37,15 +104,18 @@ const OperatorList = () => {
                 grow: false,
                 size: 100,
                 columnSelectOption: () => {
-                    return typeOptions.map((type) => ({
-                        value: type.value,
-                        label: type.label,
+                    return missionTypes.map((type) => ({
+                        value: type.id,
+                        label: type.name_fa,
                     }));
                 },
                 Cell: ({ row }) => row.original.type_fa,
             },
             {
-                accessorFn: (row) => moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ شروع",
                 id: "start_date",
                 enableColumnFilter: true,
@@ -55,7 +125,10 @@ const OperatorList = () => {
                 size: 100,
             },
             {
-                accessorFn: (row) => moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ پایان",
                 id: "end_date",
                 enableColumnFilter: true,
@@ -75,7 +148,7 @@ const OperatorList = () => {
                 size: 100,
             },
             {
-                header: "محدوده",
+                header: "منطقه عملیاتی",
                 id: "area",
                 enableColumnFilter: false,
                 datatype: "numeric",
@@ -101,12 +174,66 @@ const OperatorList = () => {
                     ),
             },
             {
-                accessorKey: "state_name",
-                header: "وضعیت",
-                id: "state_name",
-                enableColumnFilter: false,
-                datatype: "numeric",
-                filterMode: "equals",
+                header: "خودرو",
+                id: "cmmsMachines__machine_code",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterMode: "contains",
+                enableSorting: false,
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+                muiTableBodyCellProps: {
+                    sx: {
+                        borderLeft: "1px solid #e1e1e1",
+                        py: 0,
+                        "&:first-of-type": {
+                            borderLeft: "unset",
+                        },
+                    },
+                },
+                Cell: ({ renderedCellValue, row }) => {
+                    return (
+                        <Stack alignItems={"center"} justifyContent={"center"}>
+                            <MachinesDialog rowId={row.original.id} />
+                        </Stack>
+                    );
+                },
+            },
+            {
+                header: "افراد",
+                id: "rahdaran__code",
+                enableColumnFilter: true,
+                enableSorting: false,
+                datatype: "text",
+                filterMode: "contains",
+                columnFilterModeOptions: ["equals", "contains"],
+                grow: false,
+                size: 100,
+                muiTableBodyCellProps: {
+                    sx: {
+                        borderLeft: "1px solid #e1e1e1",
+                        py: 0,
+                        "&:first-of-type": {
+                            borderLeft: "unset",
+                        },
+                    },
+                },
+                Cell: ({ renderedCellValue, row }) => {
+                    return (
+                        <Stack alignItems={"center"} justifyContent={"center"}>
+                            <RahdaranDialog rowId={row.original.id} />
+                        </Stack>
+                    );
+                },
+            },
+            {
+                accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                header: "تاریخ ثبت",
+                id: "request_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterMode: "between",
                 grow: false,
                 size: 100,
             },

src/components/dashboard/roadMissions/operator/RowActions/Edit/EditController/index.jsx

@@ -7,7 +7,13 @@ import L from "leaflet";
 import { GET_RAHDARAN_BY_ID, UPDATE_REQUEST_MISSION } from "@/core/utils/routes";
 
 const EditController = ({ row, mutate, openEditDialog, setOpenEditDialog }) => {
-    const bound = useMemo(() => L.polygon([...row.original.area]), [row.original.area]);
+    const bound = useMemo(
+        () =>
+            row.original.area.type == "polygon"
+                ? L.polygon([...row.original.area.coordinates])
+                : L.polyline([...row.original.area.coordinates]),
+        [row.original.area]
+    );
     const [submitting, setSubmitting] = useState(false);
     const [rahdaran, setRahdaran] = useState(null);
     const [rahdaranLoading, setRahdaranLoading] = useState(false);
@@ -32,21 +38,31 @@ const EditController = ({ row, mutate, openEditDialog, setOpenEditDialog }) => {
 
         await requestServer(`${UPDATE_REQUEST_MISSION}/${row.original.id}`, "post", {
             data: {
-                area: area[0],
-                rahdaran: result.rahdaran.map((r) => r.id),
+                explanation: result.explanation,
+                category_id: result.category_id,
+                ...(result.category_id == 3
+                    ? {
+                          road_observed_id: result.road_observed_id,
+                      }
+                    : {}),
+                area: {
+                    type: result.bound_type,
+                    coordinates: area[0],
+                },
+                ...(result.rahdaran.length != 0 ? { rahdaran: result.rahdaran.map((r) => r.id) } : {}),
                 requested_machines: result.requested_machines,
                 type: result.type,
                 zone: result.region,
                 end_point: result.end_point,
                 ...(result.type == 1
                     ? {
-                        start_date: `${result.start_date} ${moment(result.start_time).format("HH:mm")}`,
-                        end_date: `${result.end_date} ${moment(result.end_time).format("HH:mm")}`,
-                    }
+                          start_date: `${result.start_date} ${moment(result.start_time).format("HH:mm")}`,
+                          end_date: `${result.end_date} ${moment(result.end_time).format("HH:mm")}`,
+                      }
                     : {
-                        start_date: result.start_date,
-                        end_date: result.end_date,
-                    }),
+                          start_date: result.start_date,
+                          end_date: result.end_date,
+                      }),
             },
             hasSidebarUpdate: true,
             notificationSuccess: true,
@@ -55,7 +71,7 @@ const EditController = ({ row, mutate, openEditDialog, setOpenEditDialog }) => {
                 mutate();
                 setOpenEditDialog(false);
             })
-            .catch((error) => { })
+            .catch((error) => {})
             .finally(() => {
                 setSubmitting(false);
             });
@@ -68,9 +84,13 @@ const EditController = ({ row, mutate, openEditDialog, setOpenEditDialog }) => {
             ) : (
                 <CreateForm
                     defaultValues={{
+                        explanation: row.original.explanation,
+                        category_id: row.original.category_id,
+                        road_observed_id: row.original.category_id == 3 ? row.original.road_observed[0].id : "",
                         rahdaran: rahdaran,
                         requested_machines: row.original.requested_machines,
                         bound: bound,
+                        bound_type: row.original.area.type,
                         type: row.original.type,
                         start_date: moment(row.original.start_date).format("YYYY-MM-DD"),
                         start_time: moment(row.original.start_date).toDate(),

src/components/dashboard/roadMissions/operator/RowActions/Machines/MachinesContent.jsx

@@ -0,0 +1,73 @@
+import DialogLoading from "@/core/components/DialogLoading";
+import ShowPlak from "@/core/components/ShowPlak";
+import { GET_MACHINES_BY_ID } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import {
+    DialogContent,
+    Table,
+    TableBody,
+    TableCell,
+    TableContainer,
+    TableHead,
+    TableRow,
+    Typography,
+} from "@mui/material";
+import { useEffect, useState } from "react";
+
+const MachinesContent = ({ rowId }) => {
+    const [loading, setLoading] = useState(true);
+    const [data, setData] = useState(null);
+    const request = useRequest();
+
+    useEffect(() => {
+        const fetchData = async () => {
+            try {
+                setLoading(true);
+                const response = await request(`${GET_MACHINES_BY_ID}/${rowId}`);
+                setData(response.data.data);
+            } catch (error) {
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchData();
+    }, [rowId]);
+
+    return (
+        <>
+            <DialogContent>
+                {loading ? (
+                    <DialogLoading />
+                ) : data ? (
+                    <TableContainer>
+                        <Table stickyHeader>
+                            <TableHead>
+                                <TableRow>
+                                    <TableCell>کد ماشین</TableCell>
+                                    <TableCell>نام خودرو</TableCell>
+                                </TableRow>
+                            </TableHead>
+                            <TableBody>
+                                {data.map((machine) => {
+                                    return (
+                                        <TableRow
+                                            key={machine.id}
+                                            sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
+                                        >
+                                            <TableCell>{machine.machine_code}</TableCell>
+                                            <TableCell>{machine.car_name}</TableCell>
+                                        </TableRow>
+                                    );
+                                })}
+                            </TableBody>
+                        </Table>
+                    </TableContainer>
+                ) : (
+                    <Typography textAlign={"center"}>اطلاعات خودرویی در سامانه یافت نشد</Typography>
+                )}
+            </DialogContent>
+        </>
+    );
+};
+export default MachinesContent;

src/components/dashboard/roadMissions/operator/RowActions/Machines/index.jsx

@@ -0,0 +1,38 @@
+import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
+import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
+import { useState } from "react";
+import MachinesContent from "./MachinesContent";
+
+const MachinesDialog = ({ rowId }) => {
+    const [openMachinesDialog, setOpenMachinesDialog] = useState(false);
+    return (
+        <>
+            <Tooltip title="خودرو">
+                <IconButton color="primary" onClick={() => setOpenMachinesDialog(true)}>
+                    <DirectionsCarIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                fullWidth
+                open={openMachinesDialog}
+                onClose={() => setOpenMachinesDialog(false)}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+                dir="rtl"
+                maxWidth={"sm"}
+            >
+                <DialogTitle sx={{ fontSize: "large" }}>اطلاعات خودرو</DialogTitle>
+                {openMachinesDialog && <MachinesContent rowId={rowId} />}
+                <DialogActions>
+                    <Button onClick={() => setOpenMachinesDialog(false)} variant="outlined" color="secondary" autoFocus>
+                        بستن
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+};
+export default MachinesDialog;

src/components/dashboard/roadMissions/operator/RowActions/Rahdaran/RahdaranContent.jsx

@@ -0,0 +1,74 @@
+import DialogLoading from "@/core/components/DialogLoading";
+import { GET_RAHDARAN_BY_ID } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import {
+    DialogContent,
+    Table,
+    TableBody,
+    TableCell,
+    TableContainer,
+    TableHead,
+    TableRow,
+    Typography,
+} from "@mui/material";
+import { useEffect, useState } from "react";
+
+const RahdaranContent = ({ rowId }) => {
+    const [loading, setLoading] = useState(true);
+    const [data, setData] = useState(null);
+    const request = useRequest();
+
+    useEffect(() => {
+        const fetchData = async () => {
+            try {
+                setLoading(true);
+                const response = await request(`${GET_RAHDARAN_BY_ID}/${rowId}`);
+                setData(response.data.data);
+            } catch (error) {
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchData();
+    }, [rowId]);
+
+    return (
+        <>
+            <DialogContent>
+                {loading ? (
+                    <DialogLoading />
+                ) : data ? (
+                    <TableContainer>
+                        <Table stickyHeader>
+                            <TableHead>
+                                <TableRow>
+                                    <TableCell>کد ملی</TableCell>
+                                    <TableCell>نام</TableCell>
+                                    <TableCell>نقش</TableCell>
+                                </TableRow>
+                            </TableHead>
+                            <TableBody>
+                                {data.map((rahdar) => {
+                                    return (
+                                        <TableRow
+                                            key={rahdar.id}
+                                            sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
+                                        >
+                                            <TableCell>{rahdar.code}</TableCell>
+                                            <TableCell>{rahdar.name}</TableCell>
+                                            <TableCell>{rahdar.is_driver ? "راننده" : "همراه"}</TableCell>
+                                        </TableRow>
+                                    );
+                                })}
+                            </TableBody>
+                        </Table>
+                    </TableContainer>
+                ) : (
+                    <Typography textAlign={"center"}>اطلاعات راهداران در سامانه یافت نشد</Typography>
+                )}
+            </DialogContent>
+        </>
+    );
+};
+export default RahdaranContent;

src/components/dashboard/roadMissions/operator/RowActions/Rahdaran/index.jsx

@@ -0,0 +1,38 @@
+import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
+import GroupsIcon from "@mui/icons-material/Groups";
+import { useState } from "react";
+import RahdaranContent from "./RahdaranContent";
+
+const RahdaranDialog = ({ rowId }) => {
+    const [openRahdaranDialog, setOpenRahdaranDialog] = useState(false);
+    return (
+        <>
+            <Tooltip title="افراد">
+                <IconButton color="primary" onClick={() => setOpenRahdaranDialog(true)}>
+                    <GroupsIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                fullWidth
+                open={openRahdaranDialog}
+                onClose={() => setOpenRahdaranDialog(false)}
+                PaperProps={{
+                    sx: {
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                    },
+                }}
+                dir="rtl"
+                maxWidth={"sm"}
+            >
+                <DialogTitle sx={{ fontSize: "large" }}>لیست افراد</DialogTitle>
+                {openRahdaranDialog && <RahdaranContent rowId={rowId} />}
+                <DialogActions>
+                    <Button onClick={() => setOpenRahdaranDialog(false)} variant="outlined" color="secondary" autoFocus>
+                        بستن
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+};
+export default RahdaranDialog;

src/components/dashboard/roadMissions/operator/RowActions/index.jsx

@@ -1,11 +1,14 @@
 import { Box } from "@mui/material";
 import Edit from "./Edit";
 import Delete from "./Delete";
+import { useAuth } from "@/lib/contexts/auth";
 
 const RowActions = ({ row, mutate }) => {
+    const { user } = useAuth();
+
     return (
         <Box sx={{ display: "flex", gap: 1 }}>
-            {row.original.state_id == 5 && (
+            {row.original.state_id == 5 && user.id == row.original.user_id && (
                 <>
                     <Edit mutate={mutate} row={row} />
                     <Delete mutate={mutate} rowId={row.original.id} />

src/components/dashboard/roadMissions/transportation/Actions/showArea/index.jsx

@@ -6,12 +6,15 @@ import ShowBound from "../showBound";
 import L from "leaflet";
 
 const ShowArea = ({ area }) => {
-    const bound = useMemo(() => L.polygon([...area]), [area]);
+    const bound = useMemo(
+        () => (area.type == "polygon" ? L.polygon([...area.coordinates]) : L.polyline([...area.coordinates])),
+        [area]
+    );
     const [openAreaDialog, setOpenAreaDialog] = useState(false);
 
     return (
         <>
-            <Tooltip title="محدوده">
+            <Tooltip title="منطقه عملیاتی">
                 <IconButton color="primary" onClick={() => setOpenAreaDialog(true)}>
                     <RemoveRedEye />
                 </IconButton>
@@ -33,7 +36,7 @@ const ShowArea = ({ area }) => {
             >
                 <DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
                     <Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
-                        محدوده
+                        منطقه عملیاتی
                     </Typography>
                     <IconButton onClick={() => setOpenAreaDialog(false)} size="small">
                         <Close />

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/DriversDialog/DriversSearch/Form/index.jsx

@@ -0,0 +1,61 @@
+import RahdarNameOrCode from "@/core/components/RahdarNameOrCode";
+import StyledForm from "@/core/components/StyledForm";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { Done } from "@mui/icons-material";
+import { Button, Stack } from "@mui/material";
+import { Controller, useForm } from "react-hook-form";
+import { object } from "yup";
+
+const schema = object().shape({
+    rahdar: object().required("همراه الزامی است."),
+});
+const DriverForm = ({ setDriver, setOpenDriversDialog }) => {
+    const defaultValues = {
+        rahdar: null,
+    };
+
+    const {
+        control,
+        handleSubmit,
+        formState: { isSubmitting, isValid },
+    } = useForm({ defaultValues, resolver: yupResolver(schema), mode: "all" });
+
+    const submit = (data) => {
+        setDriver(data.rahdar);
+        setOpenDriversDialog(false);
+    };
+
+    return (
+        <StyledForm onSubmit={handleSubmit(submit)}>
+            <Stack direction={{ xs: "column", sm: "row" }} justifyContent={"center"} spacing={2}>
+                <Stack sx={{ minWidth: "250px" }}>
+                    <Controller
+                        control={control}
+                        render={({ field, fieldState: { error } }) => {
+                            return (
+                                <RahdarNameOrCode
+                                    title="راننده"
+                                    rahdarsName={field.value}
+                                    setRahdarsName={(value) => field.onChange(value)}
+                                    error={error}
+                                    multiple={false}
+                                />
+                            );
+                        }}
+                        name={"rahdar"}
+                    />
+                </Stack>
+                <Button
+                    variant="contained"
+                    type="submit"
+                    sx={{ textWrap: "nowrap", px: 3 }}
+                    disabled={isSubmitting || !isValid}
+                    startIcon={<Done />}
+                >
+                    انتخاب
+                </Button>
+            </Stack>
+        </StyledForm>
+    );
+};
+export default DriverForm;

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/DriversDialog/DriversSearch/index.jsx

@@ -0,0 +1,11 @@
+import { DialogContent } from "@mui/material";
+import DriverForm from "./Form";
+
+const DriversSearch = ({ setDriver, setOpenDriversDialog }) => {
+    return (
+        <DialogContent dividers>
+            <DriverForm setDriver={setDriver} setOpenDriversDialog={setOpenDriversDialog} />
+        </DialogContent>
+    );
+};
+export default DriversSearch;

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/DriversDialog/index.jsx

@@ -0,0 +1,41 @@
+import { Close, Edit } from "@mui/icons-material";
+import { Button, Dialog, DialogTitle, IconButton } from "@mui/material";
+import { useState } from "react";
+import DriversSearch from "./DriversSearch";
+
+const DriversDialog = ({ setDriver, mode }) => {
+    const [openDriversDialog, setOpenDriversDialog] = useState(false);
+    return (
+        <>
+            {mode == "edit" ? (
+                <IconButton onClick={() => setOpenDriversDialog(true)} size="small">
+                    <Edit />
+                </IconButton>
+            ) : (
+                <Button onClick={() => setOpenDriversDialog(true)} variant="contained" fullWidth size="large">
+                    انتخاب راننده
+                </Button>
+            )}
+            <Dialog open={openDriversDialog} fullWidth maxWidth="xs">
+                <IconButton
+                    aria-label="close"
+                    onClick={() => setOpenDriversDialog(false)}
+                    sx={(theme) => ({
+                        position: "absolute",
+                        right: 8,
+                        top: 8,
+                        zIndex: 50,
+                        color: theme.palette.grey[500],
+                    })}
+                >
+                    <Close />
+                </IconButton>
+                <DialogTitle>انتخاب راننده</DialogTitle>
+                {openDriversDialog && (
+                    <DriversSearch setDriver={setDriver} setOpenDriversDialog={setOpenDriversDialog} />
+                )}
+            </Dialog>
+        </>
+    );
+};
+export default DriversDialog;

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/MachinesDialog/MachineList/RowActions/Allocate/index.jsx

@@ -1,13 +1,9 @@
 import { Done } from "@mui/icons-material";
 import { IconButton, Tooltip } from "@mui/material";
 
-const Allocate = ({ row, request, dispatch, setOpenMachinesDialog }) => {
+const Allocate = ({ row, setMachine, setOpenMachinesDialog }) => {
     const handleClick = () => {
-        dispatch({
-            type: "CHANGE_MACHINE",
-            id: request.id,
-            machine: row.original,
-        });
+        setMachine(row.original);
         setOpenMachinesDialog(false);
     };
 

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/MachinesDialog/MachineList/RowActions/index.jsx

@@ -1,6 +1,6 @@
 import Allocate from "./Allocate";
 
-const RowActions = ({ row, request, dispatch, setOpenMachinesDialog }) => {
-    return <Allocate row={row} request={request} dispatch={dispatch} setOpenMachinesDialog={setOpenMachinesDialog} />;
+const RowActions = ({ row, setMachine, setOpenMachinesDialog }) => {
+    return <Allocate row={row} setMachine={setMachine} setOpenMachinesDialog={setOpenMachinesDialog} />;
 };
 export default RowActions;

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/MachinesDialog/MachineList/index.jsx

@@ -4,7 +4,7 @@ import { useMemo } from "react";
 import RowActions from "./RowActions";
 import { GET_MACHINES_TABLE_LIST } from "@/core/utils/routes";
 
-const MachinesList = ({ request, dispatch, setOpenMachinesDialog }) => {
+const MachinesList = ({ machineType, setMachine, setOpenMachinesDialog }) => {
     const columns = useMemo(
         () => [
             {
@@ -40,6 +40,7 @@ const MachinesList = ({ request, dispatch, setOpenMachinesDialog }) => {
                     need_filter={true}
                     table_title="لیست خودرو ها"
                     columns={columns}
+                    specialFilter={[{ value: machineType, datatype: "text", id: "car_type", fn: "equals" }]}
                     sorting={[{ id: "id", desc: true }]}
                     table_url={GET_MACHINES_TABLE_LIST}
                     page_name={"roadMissionsTransportation"}
@@ -47,12 +48,7 @@ const MachinesList = ({ request, dispatch, setOpenMachinesDialog }) => {
                     enableRowActions
                     positionActionsColumn={"first"}
                     RowActions={(props) => (
-                        <RowActions
-                            {...props}
-                            request={request}
-                            dispatch={dispatch}
-                            setOpenMachinesDialog={setOpenMachinesDialog}
-                        />
+                        <RowActions {...props} setMachine={setMachine} setOpenMachinesDialog={setOpenMachinesDialog} />
                     )}
                 />
             </Box>

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/MachinesDialog/index.jsx

@@ -3,7 +3,7 @@ import { Button, Dialog, IconButton } from "@mui/material";
 import { useState } from "react";
 import MachinesList from "./MachineList";
 
-const MachinesDialog = ({ request, dispatch, mode }) => {
+const MachinesDialog = ({ machineType, setMachine, mode }) => {
     const [openMachinesDialog, setOpenMachinesDialog] = useState(false);
     return (
         <>
@@ -12,11 +12,11 @@ const MachinesDialog = ({ request, dispatch, mode }) => {
                     <Edit />
                 </IconButton>
             ) : (
-                <Button onClick={() => setOpenMachinesDialog(true)} variant="outlined" size="small">
+                <Button onClick={() => setOpenMachinesDialog(true)} variant="contained" fullWidth size="large">
                     انتخاب خودرو
                 </Button>
             )}
-            <Dialog open={openMachinesDialog} fullWidth maxWidth="md">
+            <Dialog open={openMachinesDialog} fullWidth maxWidth="xs">
                 <IconButton
                     aria-label="close"
                     onClick={() => setOpenMachinesDialog(false)}
@@ -31,7 +31,11 @@ const MachinesDialog = ({ request, dispatch, mode }) => {
                     <Close />
                 </IconButton>
                 {openMachinesDialog && (
-                    <MachinesList request={request} dispatch={dispatch} setOpenMachinesDialog={setOpenMachinesDialog} />
+                    <MachinesList
+                        machineType={machineType}
+                        setMachine={setMachine}
+                        setOpenMachinesDialog={setOpenMachinesDialog}
+                    />
                 )}
             </Dialog>
         </>

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/Reject/index.jsx

@@ -10,7 +10,7 @@ const Reject = ({ isSubmitting, rowId, mutate, setOpenAllocationDialog }) => {
             <Button onClick={() => setOpenRejectDialog(true)} variant="outlined" color="error" disabled={isSubmitting}>
                 رد درخواست
             </Button>
-            <Dialog open={openRejectDialog} fullWidth maxWidth="sm">
+            <Dialog open={openRejectDialog} fullWidth maxWidth="xs">
                 <IconButton
                     aria-label="close"
                     onClick={() => setOpenRejectDialog(false)}

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/Form/index.jsx

@@ -1,44 +1,34 @@
-import { machineType } from "@/core/utils/machineTypes";
-import { Alert, Box, Button, Chip, DialogActions, DialogContent, Divider, Typography } from "@mui/material";
-import { Stack } from "@mui/system";
-import { useReducer, useState } from "react";
-import MachinesDialog from "./MachinesDialog";
-import useRequest from "@/lib/hooks/useRequest";
+import MapLayer from "@/core/components/MapLayer";
 import { ALLOCATE_REQUEST_MISSION } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import { Box, Button, Chip, DialogActions, DialogContent, Divider, Paper, Typography } from "@mui/material";
+import { Stack } from "@mui/system";
+import { useMemo, useState } from "react";
+import ShowBound from "../../../Actions/showBound";
 import Reject from "./Reject";
-
-const initValue = (requested_machines) => {
-    let arr = [];
-    let counter = 0;
-    for (let i = 0; i < requested_machines.length; i++) {
-        const request = requested_machines[i];
-        for (let j = 0; j < request.count; j++) {
-            counter++;
-            arr.push({ id: counter, type: request.type, machine: null, position: j + 1 });
-        }
-    }
-    return arr;
-};
-
-const reducer = (state, action) => {
-    switch (action.type) {
-        case "CHANGE_MACHINE":
-            return state.map((s) => (s.id == action.id ? { ...s, machine: action.machine } : s));
-        default:
-            return state;
-    }
-};
-
-const AllocationForm = ({ rowId, mutate, setOpenAllocationDialog, requested_machines }) => {
+import { missionRegions } from "@/core/utils/missionRegions";
+import { machineType } from "@/core/utils/machineTypes";
+import { missionTypes } from "@/core/utils/missionTypes";
+import moment from "jalali-moment";
+import MachinesDialog from "./MachinesDialog";
+import DriversDialog from "./DriversDialog";
+const AllocationForm = ({ row, mutate, setOpenAllocationDialog }) => {
+    const bound = useMemo(
+        () =>
+            row.area.type == "polygon" ? L.polygon([...row.area.coordinates]) : L.polyline([...row.area.coordinates]),
+        [row.area]
+    );
     const requestServer = useRequest({ notificationSuccess: true });
-    const [requests, dispatch] = useReducer(reducer, requested_machines, initValue);
+    const [machine, setMachine] = useState();
+    const [driver, setDriver] = useState();
     const [isSubmitting, setIsSubmitting] = useState(false);
 
-    const handleSubmit = async (_requests) => {
+    const handleSubmit = async (_machine, _driver) => {
         setIsSubmitting(true);
-        await requestServer(`${ALLOCATE_REQUEST_MISSION}/${rowId}`, "post", {
+        await requestServer(`${ALLOCATE_REQUEST_MISSION}/${row.id}`, "post", {
             data: {
-                machines: _requests.map((r) => r.machine.id),
+                machines: [_machine.id],
+                driver: _driver.id,
             },
             hasSidebarUpdate: true,
         })
@@ -55,36 +45,129 @@ const AllocationForm = ({ rowId, mutate, setOpenAllocationDialog, requested_mach
     return (
         <>
             <DialogContent dividers>
-                <Stack spacing={2}>
-                    {requests.map((request) => (
-                        <Stack key={request.id} direction={"row"} alignItems={"center"} spacing={1}>
-                            <Typography variant="body2">
-                                {machineType.find((mt) => mt.id == request.type).name_fa} {request.position}
-                            </Typography>
-                            <Divider sx={{ flex: 1 }}>
-                                {!request.machine && (
-                                    <Chip label="خودرویی انتخاب نشده" size="small" color="error" variant="outlined" />
+                <Box sx={{ flex: 1 }}>
+                    <Stack spacing={3}>
+                        <Paper elevation={24}>
+                            <Stack spacing={2} sx={{ p: 2 }}>
+                                <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                    <Typography variant="body" fontWeight={"bold"} color={"primary"}>
+                                        نوع خودرو درخواستی
+                                    </Typography>
+                                    <Divider sx={{ flex: 1 }} />
+                                    <Chip
+                                        label={machineType.find((mt) => mt.id == row.requested_machines[0]).name_fa}
+                                    />
+                                </Stack>
+                                <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                    {machine ? (
+                                        <>
+                                            <Typography variant="body2">خودرو</Typography>
+                                            <Divider sx={{ flex: 1 }} />
+                                            <Chip
+                                                label={
+                                                    machine
+                                                        ? `${machine.machine_code} | ${machine.car_name}`
+                                                        : "خودرویی انتخاب نشده"
+                                                }
+                                                size="small"
+                                            />
+                                            <Divider sx={{ flex: 1 }} />
+                                            <MachinesDialog
+                                                machineType={row.requested_machines[0]}
+                                                setMachine={setMachine}
+                                                mode={"edit"}
+                                            />
+                                        </>
+                                    ) : (
+                                        <MachinesDialog
+                                            machineType={row.requested_machines[0]}
+                                            setMachine={setMachine}
+                                        />
+                                    )}
+                                </Stack>
+                                {machine && (
+                                    <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                        {driver ? (
+                                            <>
+                                                <Typography variant="body2">راننده</Typography>
+                                                <Divider sx={{ flex: 1 }} />
+                                                <Chip
+                                                    label={
+                                                        machine
+                                                            ? `${driver.code} | ${driver.name}`
+                                                            : "راننده ای انتخاب نشده"
+                                                    }
+                                                    size="small"
+                                                />
+                                                <Divider sx={{ flex: 1 }} />
+                                                <DriversDialog setDriver={setDriver} mode={"edit"} />
+                                            </>
+                                        ) : (
+                                            <DriversDialog setDriver={setDriver} />
+                                        )}
+                                    </Stack>
                                 )}
+                            </Stack>
+                        </Paper>
+                        <Stack spacing={1}>
+                            <Divider>
+                                <Chip color="primary" variant="outlined" label="مشخصات ماموریت" />
                             </Divider>
-                            {request.machine ? (
-                                <>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">موضوع ماموریت</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={row.explanation} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">محدوده</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={missionRegions.find((r) => r.id == row.zone).name_fa} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">مقصد</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={row.end_point} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">نوع زمانبندی</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                <Chip size="small" label={missionTypes.find((t) => t.id == row.type).name_fa} />
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">تاریخ شروع ماموریت</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                {row.type == 1 ? (
                                     <Chip
                                         size="small"
-                                        label={`${request.machine.machine_code} | ${request.machine.car_name}`}
+                                        label={`${moment(row.start_date).format("HH:mm")} | ${moment(row.start_date).locale("fa").format("YYYY/MM/DD")}`}
                                     />
-                                    <MachinesDialog request={request} dispatch={dispatch} mode={"edit"} />
-                                </>
-                            ) : (
-                                <MachinesDialog request={request} dispatch={dispatch} />
-                            )}
+                                ) : (
+                                    <Chip
+                                        size="small"
+                                        label={moment(row.start_date).locale("fa").format("YYYY/MM/DD")}
+                                    />
+                                )}
+                            </Stack>
+                            <Stack direction={"row"} alignItems={"center"} spacing={1}>
+                                <Typography variant="body2">تاریخ پایان ماموریت</Typography>
+                                <Divider sx={{ flex: 1 }} />
+                                {row.type == 1 ? (
+                                    <Chip
+                                        size="small"
+                                        label={`${moment(row.end_date).format("HH:mm")} | ${moment(row.end_date).locale("fa").format("YYYY/MM/DD")}`}
+                                    />
+                                ) : (
+                                    <Chip size="small" label={moment(row.end_date).locale("fa").format("YYYY/MM/DD")} />
+                                )}
+                            </Stack>
                         </Stack>
-                    ))}
-                    {requests.some((r) => !r.machine) && (
-                        <Alert color="warning" icon={false}>
-                            برای تایید و تخصیص باید همه خودرو ها انتخاب شده باشند!
-                        </Alert>
-                    )}
-                </Stack>
+                        <Box sx={{ width: "100%", height: "200px" }}>
+                            <MapLayer style={{ borderRadius: "4px" }}>
+                                <ShowBound bound={bound} />
+                            </MapLayer>
+                        </Box>
+                    </Stack>
+                </Box>
             </DialogContent>
             <DialogActions sx={{ display: "flex", justifyContent: "space-between" }}>
                 <Stack direction={"row"} spacing={1}>
@@ -98,17 +181,17 @@ const AllocationForm = ({ rowId, mutate, setOpenAllocationDialog, requested_mach
                     </Button>
                     <Reject
                         isSubmitting={isSubmitting}
-                        rowId={rowId}
+                        rowId={row.id}
                         mutate={mutate}
                         setOpenAllocationDialog={setOpenAllocationDialog}
                     />
                 </Stack>
                 <Box>
                     <Button
-                        onClick={() => handleSubmit(requests)}
+                        onClick={() => handleSubmit(machine, driver)}
                         variant="contained"
                         color="primary"
-                        disabled={requests.some((r) => !r.machine) || isSubmitting}
+                        disabled={!machine || !driver || isSubmitting}
                         autoFocus
                     >
                         تایید و تخصیص

src/components/dashboard/roadMissions/transportation/RowActions/Allocation/index.jsx

@@ -8,7 +8,7 @@ const Allocation = ({ row, mutate }) => {
 
     return (
         <>
-            <Tooltip title="لیست خودرو های درخواستی" arrow placement="right">
+            <Tooltip title="تخصیص خودرو" arrow placement="right">
                 <IconButton
                     color="primary"
                     sx={{ textTransform: "unset", alignSelf: "center" }}
@@ -19,7 +19,7 @@ const Allocation = ({ row, mutate }) => {
                     <LocalShipping />
                 </IconButton>
             </Tooltip>
-            <Dialog open={openAllocationDialog} fullWidth maxWidth="sm">
+            <Dialog open={openAllocationDialog} fullWidth maxWidth="xs">
                 <IconButton
                     aria-label="close"
                     onClick={() => setOpenAllocationDialog(false)}
@@ -33,11 +33,10 @@ const Allocation = ({ row, mutate }) => {
                 >
                     <Close />
                 </IconButton>
-                <DialogTitle>لیست خودرو های درخواستی</DialogTitle>
+                <DialogTitle>تخصیص خودرو</DialogTitle>
                 {openAllocationDialog && (
                     <AllocationForm
-                        requested_machines={row.original.requested_machines}
-                        rowId={row.original.id}
+                        row={row.original}
                         mutate={mutate}
                         setOpenAllocationDialog={setOpenAllocationDialog}
                     />

src/components/dashboard/roadMissions/transportation/TransportationList.jsx

@@ -6,13 +6,10 @@ import moment from "jalali-moment";
 import { useMemo } from "react";
 import ShowArea from "./Actions/showArea";
 import RowActions from "./RowActions";
+import { missionRegions } from "@/core/utils/missionRegions";
+import { missionTypes } from "@/core/utils/missionTypes";
 
 const TransportationList = () => {
-    const typeOptions = [
-        { value: 1, label: "روزانه" },
-        { value: 2, label: "ساعتی" },
-    ];
-
     const columns = useMemo(
         () => [
             {
@@ -26,9 +23,47 @@ const TransportationList = () => {
                 grow: false,
                 size: 100,
             },
+            {
+                accessorKey: "state_name",
+                header: "وضعیت",
+                id: "state_name",
+                enableColumnFilter: false,
+                datatype: "numeric",
+                filterMode: "equals",
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "explanation",
+                header: "موضوع",
+                id: "explanation",
+                enableColumnFilter: false,
+                datatype: "numeric",
+                filterMode: "equals",
+                grow: false,
+                size: 100,
+            },
+            {
+                accessorKey: "zone",
+                header: "محدوده",
+                id: "zone",
+                enableColumnFilter: true,
+                datatype: "numeric",
+                filterMode: "equals",
+                sortDescFirst: true,
+                grow: false,
+                size: 100,
+                columnSelectOption: () => {
+                    return missionRegions.map((region) => ({
+                        value: region.id,
+                        label: region.name_fa,
+                    }));
+                },
+                Cell: ({ row }) => row.original.zone_fa,
+            },
             {
                 accessorKey: "type",
-                header: "نوع",
+                header: "نوع زمانبندی",
                 id: "type",
                 enableColumnFilter: true,
                 datatype: "numeric",
@@ -37,15 +72,18 @@ const TransportationList = () => {
                 grow: false,
                 size: 100,
                 columnSelectOption: () => {
-                    return typeOptions.map((type) => ({
-                        value: type.value,
-                        label: type.label,
+                    return missionTypes.map((type) => ({
+                        value: type.id,
+                        label: type.name_fa,
                     }));
                 },
                 Cell: ({ row }) => row.original.type_fa,
             },
             {
-                accessorFn: (row) => moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.start_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.start_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ شروع",
                 id: "start_date",
                 enableColumnFilter: true,
@@ -55,7 +93,10 @@ const TransportationList = () => {
                 size: 100,
             },
             {
-                accessorFn: (row) => moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                accessorFn: (row) =>
+                    row.type == 1
+                        ? moment(row.end_date).locale("fa").format("HH:mm | yyyy/MM/DD")
+                        : moment(row.end_date).locale("fa").format("yyyy/MM/DD"),
                 header: "تاریخ پایان",
                 id: "end_date",
                 enableColumnFilter: true,
@@ -75,7 +116,7 @@ const TransportationList = () => {
                 size: 100,
             },
             {
-                header: "محدوده",
+                header: "منطقه عملیاتی",
                 id: "area",
                 enableColumnFilter: false,
                 datatype: "numeric",
@@ -100,6 +141,16 @@ const TransportationList = () => {
                         "-"
                     ),
             },
+            {
+                accessorFn: (row) => moment(row.request_date).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                header: "تاریخ ثبت",
+                id: "request_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterMode: "between",
+                grow: false,
+                size: 100,
+            },
         ],
         []
     );

src/components/layouts/dashboard/headerWithLogo/HaederBottom/index.jsx

@@ -10,19 +10,20 @@ const HeaderBottom = () => {
             direction="row"
             justifyContent={"space-between"}
             sx={{
-                px: 2,
-                py: 1,
+                pl: 2,
                 background: (theme) => theme.palette.primary2.main,
             }}
             spacing={2}
         >
-            <Stack spacing={4} alignItems={"center"} direction={"row"}>
-                <Image alt="" priority src={RmsLogo.src} width={50} height={54} />
-                <Stack alignItems={"center"} spacing={1}>
-                    <Typography variant="h6" sx={{ color: (theme) => theme.palette.primary2.contrastText }}>
+            <Stack sx={{ py: 0.5 }} spacing={4} alignItems={"center"} direction={"row"}>
+                <Image alt="" priority src={RmsLogo.src} width={40} height={43} />
+                <Stack alignItems={"center"} spacing={0.5}>
+                    <Typography sx={{ color: (theme) => theme.palette.primary2.contrastText }}>
                         سامانه جامع راهداری
                     </Typography>
-                    <Typography sx={{ color: (theme) => theme.palette.primary2.contrastText }}>rms.rmto.ir</Typography>
+                    <Typography variant="caption" sx={{ color: (theme) => theme.palette.primary2.contrastText }}>
+                        rms.rmto.ir
+                    </Typography>
                 </Stack>
             </Stack>
             <Stack sx={{ display: { xs: "none", sm: "flex" } }}>
@@ -30,13 +31,11 @@ const HeaderBottom = () => {
                     sx={{
                         p: 1,
                         background: "#fff",
-                        border: 2,
-                        borderColor: (theme) => theme.palette.primary.main,
-                        borderRadius: 2,
-                        borderStyle: "dashed",
+                        borderTopLeftRadius: 8,
+                        borderBottomLeftRadius: 8,
                     }}
                 >
-                    <Image alt="" priority src={HeaderLogo.src} width={140} height={32} />
+                    <Image alt="" priority src={HeaderLogo.src} width={117} height={27} />
                 </Box>
             </Stack>
         </Stack>

src/components/layouts/dashboard/headerWithSidebar/index.jsx

@@ -9,8 +9,8 @@ import moment from "jalali-moment";
 import { headerMenu } from "@/core/utils/headerMenu";
 import SidebarMenu from "./Sidebar/SidebarMenu";
 
-const drawerWidth = 300;
-const headersHeight = 72;
+const drawerWidth = 275;
+const headersHeight = 51;
 
 const Main = styled(Stack, { shouldForwardProp: (prop) => prop !== "open" })(({ theme, open }) => ({
     flexGrow: 1,

src/core/components/DataTable/Main.js

@@ -51,15 +51,16 @@ const DataTable_Main = (props) => {
         const params = new URLSearchParams();
         params.set("start", `${pagination.pageIndex * pagination.pageSize}`);
         params.set("size", pagination.pageSize);
-        if (specialFilter) {
-            const filteredSpecialFilterData = Object.values(specialFilter).filter(
-                (filter) => !isArrayEmpty(filter.value)
-            );
-            params.set("filters", JSON.stringify(filteredSpecialFilterData || []));
-        } else {
-            const filteredFilterData = DataTableFilterDataStructure(filterData, isArrayEmpty);
-            params.set("filters", JSON.stringify(filteredFilterData.length === 0 ? [] : filteredFilterData));
-        }
+
+        const filteredSpecialFilterData = specialFilter
+            ? Object.values(specialFilter).filter((filter) => !isArrayEmpty(filter.value))
+            : [];
+
+        const filteredFilterData = DataTableFilterDataStructure(filterData, isArrayEmpty);
+
+        const combinedFilters = [...filteredSpecialFilterData, ...filteredFilterData];
+
+        params.set("filters", JSON.stringify(combinedFilters));
         params.set(
             "sorting",
             JSON.stringify(

src/core/components/MuiTimePicker.jsx

@@ -9,7 +9,18 @@ import { parseISO } from "date-fns";
 const parseIfString = (val) =>
     val instanceof Date ? val : typeof val === "string" && val !== "" ? parseISO(val) : null;
 
-function MuiTimePicker({ value, setFieldValue, name, minTime, maxTime, helperText, placeholder, error, label }) {
+function MuiTimePicker({
+    value,
+    setFieldValue,
+    views = ["hours", "minutes"],
+    name,
+    minTime,
+    maxTime,
+    helperText,
+    placeholder,
+    error,
+    label,
+}) {
     // Ensure value, minTime, maxTime are Date objects
     const parsedValue = parseIfString(value);
     const parsedMinTime = parseIfString(minTime);
@@ -28,9 +39,10 @@ function MuiTimePicker({ value, setFieldValue, name, minTime, maxTime, helperTex
                         id={name}
                         closeOnSelect
                         label={label}
+                        format="HH:mm"
                         ampm={false}
                         timeSteps={{ hours: 1, minutes: 5 }}
-                        views={["hours", "minutes"]}
+                        views={views}
                         name={name}
                         onChange={(newValue) => {
                             setFieldValue(name, newValue);

src/core/components/NotificationDesign/AskForKeepData.jsx

@@ -13,7 +13,7 @@ function filterFalseValues(obj) {
     for (const [key, value] of Object.entries(obj)) {
         if (value === false) {
             result[key] = false;
-        } else if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
+        } else if (typeof value === "object" && value !== null && !Array.isArray(value)) {
             const nested = filterFalseValues(value);
             if (Object.keys(nested).length > 0) {
                 result[key] = nested;

src/core/components/RahdarCode.jsx

@@ -1,11 +1,10 @@
 "use client";
+import { GET_RAHDARANS_LIST_SEARCH } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
 import { Autocomplete, CircularProgress, TextField } from "@mui/material";
 import { useEffect, useState } from "react";
-import useRequest from "@/lib/hooks/useRequest";
-import { debounce } from "@mui/material/utils";
-import { GET_RAHDARANS_LIST_SEARCH } from "@/core/utils/routes";
 
-const RahdarCode = ({ rahdarsCode, setRahdarsCode, error, multiple = true }) => {
+const RahdarCode = ({ title = "راهدار", rahdarsCode, setRahdarsCode, error, multiple = true }) => {
     const [inputValue, setInputValue] = useState(""); // مدیریت مقدار تایپ‌شده
     const [options, setOptions] = useState([]);
     const [loading, setLoading] = useState(false);
@@ -13,30 +12,27 @@ const RahdarCode = ({ rahdarsCode, setRahdarsCode, error, multiple = true }) =>
 
     useEffect(() => {
         const fetchRahdarCodes = (inputValue, controller) => {
-            const debouncer = debounce((query) => {
-                if ((query || "").length < 3) {
-                    setOptions([]);
-                    return;
-                }
-                setLoading(true);
-                requestServer(`${GET_RAHDARANS_LIST_SEARCH}?code=${query}`, "get", {
-                    requestOptions: { signal: controller.signal },
+            if ((inputValue || "").length < 3) {
+                setOptions([]);
+                return;
+            }
+            setLoading(true);
+            requestServer(`${GET_RAHDARANS_LIST_SEARCH}?code=${inputValue}`, "get", {
+                requestOptions: { signal: controller.signal },
+            })
+                .then((response) => {
+                    const combinedArray = rahdarsCode
+                        ? [...rahdarsCode, ...response.data.data]
+                        : [...response.data.data];
+                    const uniqueArray = Array.from(new Map(combinedArray.map((item) => [item.id, item])).values());
+                    setOptions(uniqueArray || []);
                 })
-                    .then((response) => {
-                        const combinedArray = rahdarsCode
-                            ? [...rahdarsCode, ...response.data.data]
-                            : [...response.data.data];
-                        const uniqueArray = Array.from(new Map(combinedArray.map((item) => [item.id, item])).values());
-                        setOptions(uniqueArray || []);
-                    })
-                    .catch(() => {
-                        setOptions([]);
-                    })
-                    .finally(() => {
-                        setLoading(false);
-                    });
-            }, 500);
-            debouncer(inputValue);
+                .catch(() => {
+                    setOptions([]);
+                })
+                .finally(() => {
+                    setLoading(false);
+                });
         };
 
         const controller = new AbortController();
@@ -64,17 +60,17 @@ const RahdarCode = ({ rahdarsCode, setRahdarsCode, error, multiple = true }) =>
                 return option.code === (value?.code || value);
             }}
             loading={loading}
-            loadingText="درحال جستجوی کد راهدار"
+            loadingText={`درحال جستجوی کد ${title}`}
             noOptionsText={
-                (inputValue || "").length < 3 ? "حداقل سه رقم از کد راهدار را وارد کنید" : "کد راهداری یافت نشد"
+                (inputValue || "").length < 3 ? `حداقل سه رقم کد ملی ${title} را وارد کنید` : `${title}ی یافت نشد`
             }
             fullWidth
             renderInput={(params) => (
                 <TextField
                     {...params}
-                    label={multiple ? "راهداران" : "راهدار"}
+                    label={multiple ? `${title}ان` : `${title}`}
                     fullWidth
-                    placeholder={multiple ? "کد راهداران را وارد کنید" : "کد راهدار را وارد کنید"}
+                    placeholder={multiple ? `کد ملی ${title}ان را وارد کنید` : `کد ملی ${title} را وارد کنید`}
                     error={!!error}
                     helperText={error?.message}
                     InputLabelProps={{

src/core/components/RahdarNameOrCode.jsx

@@ -0,0 +1,93 @@
+"use client";
+import { GET_RAHDARANS_LIST_SEARCH } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import { Autocomplete, CircularProgress, TextField } from "@mui/material";
+import { useEffect, useState } from "react";
+
+const RahdarNameOrCode = ({ title = "راهدار", rahdarsName, setRahdarsName, error, multiple = true }) => {
+    const [inputValue, setInputValue] = useState(""); // مدیریت مقدار تایپ‌شده
+    const [options, setOptions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const requestServer = useRequest();
+
+    useEffect(() => {
+        const fetchRahdarNames = (inputValue, controller) => {
+            if ((inputValue || "").length < 3) {
+                setOptions([]);
+                return;
+            }
+            setLoading(true);
+            requestServer(`${GET_RAHDARANS_LIST_SEARCH}?search=${inputValue}`, "get", {
+                requestOptions: { signal: controller.signal },
+            })
+                .then((response) => {
+                    const combinedArray = rahdarsName
+                        ? [...rahdarsName, ...response.data.data]
+                        : [...response.data.data];
+                    const uniqueArray = Array.from(new Map(combinedArray.map((item) => [item.id, item])).values());
+                    setOptions(uniqueArray || []);
+                })
+                .catch(() => {
+                    setOptions([]);
+                })
+                .finally(() => {
+                    setLoading(false);
+                });
+        };
+
+        const controller = new AbortController();
+        fetchRahdarNames(inputValue, controller);
+        return () => controller.abort();
+    }, [inputValue]);
+
+    return (
+        <Autocomplete
+            multiple={multiple} // قابلیت انتخاب چندگانه داینامیک
+            value={rahdarsName} // آرایه موارد انتخاب‌شده
+            size="small"
+            onChange={(event, newValue) => {
+                setRahdarsName(multiple ? newValue || [] : newValue || null); // مدیریت حالت چندگانه و تک‌گانه
+            }}
+            inputValue={inputValue} // مقدار تایپ‌شده
+            onInputChange={(event, newInputValue) => {
+                setInputValue(newInputValue || ""); // به‌روزرسانی مقدار تایپ‌شده
+            }}
+            options={options} // گزینه‌های موجود
+            getOptionLabel={(option) => (typeof option === "string" ? option : `${option.code} - ${option.name}`)}
+            isOptionEqualToValue={(option, value) => {
+                if (!value) return false;
+                if (value === "") return option.code === "";
+                return option.code === (value?.code || value);
+            }}
+            loading={loading}
+            loadingText={`درحال جستجوی ${title}`}
+            noOptionsText={(inputValue || "").length < 3 ? `حداقل سه کاراکتر وارد کنید` : `${title}ی یافت نشد`}
+            fullWidth
+            renderInput={(params) => (
+                <TextField
+                    {...params}
+                    label={multiple ? `${title}ان` : `${title}`}
+                    fullWidth
+                    placeholder={
+                        multiple ? `نام یا کدملی ${title}ان را وارد کنید` : `نام یا کدملی ${title} را وارد کنید`
+                    }
+                    error={!!error}
+                    helperText={error?.message}
+                    InputLabelProps={{
+                        shrink: true,
+                    }}
+                    InputProps={{
+                        ...params.InputProps,
+                        endAdornment: (
+                            <>
+                                {loading ? <CircularProgress size="25px" color="inherit" /> : null}
+                                {params.InputProps.endAdornment}
+                            </>
+                        ),
+                    }}
+                />
+            )}
+        />
+    );
+};
+export default RahdarNameOrCode;

src/core/utils/machineTypes.js

@@ -1,4 +1,4 @@
 export const machineType = [
-    { id: "grader", name_fa: "گریدر" },
-    { id: "loder", name_fa: "لودر" },
+    { id: "گریدر", name_fa: "گریدر" },
+    { id: "لودر", name_fa: "لودر" },
 ];

src/core/utils/missionCategoryTypes.js

@@ -0,0 +1,5 @@
+export const missionCategoryTypes = [
+    { id: 1, name_fa: "فعالیت روزانه" },
+    { id: 2, name_fa: "گشت راهداری" },
+    { id: 3, name_fa: "واکنش سریع" },
+];

src/core/utils/missionRegions.js

@@ -0,0 +1,5 @@
+export const missionRegions = [
+    { id: 1, name_fa: "داخل شهر" },
+    { id: 2, name_fa: "بیرون شهر - داخل محدوده" },
+    { id: 3, name_fa: "بیرون شهر - خارج محدوده" },
+];

src/core/utils/missionTypes.js

@@ -0,0 +1,4 @@
+export const missionTypes = [
+    { id: 1, name_fa: "ساعتی" },
+    { id: 2, name_fa: "روزانه" },
+];

src/core/utils/pageMenu.js

@@ -96,6 +96,7 @@ export const pageMenu = [
         label: "ماموریت ها",
         type: "menu",
         icon: <Mediation sx={{ width: "inherit", height: "inherit" }} />,
+        badges: [{ key: "mission.total" }],
         hasSubitems: true,
         Subitems: [
             {
@@ -103,13 +104,19 @@ export const pageMenu = [
                 label: "کارتابل",
                 type: "page",
                 route: "/dashboard/road-missions/operator",
-                permissions: ["manage-request-portal-country", "manage-request-portal-province", "manage-request-portal-city"],
+                badges: [{ key: "mission.request_portal" }],
+                permissions: [
+                    "manage-request-portal-country",
+                    "manage-request-portal-province",
+                    "manage-request-portal-city",
+                ],
             },
             {
                 id: "roadMissionsManagemnetNaqlie",
                 label: "نقلیه",
                 type: "page",
                 route: "/dashboard/road-missions/transportation",
+                badges: [{ key: "mission.transportation" }],
                 permissions: ["manage-transportation-unit"],
             },
             {
@@ -117,6 +124,7 @@ export const pageMenu = [
                 label: "کنترل",
                 type: "page",
                 route: "/dashboard/road-missions/control",
+                badges: [{ key: "mission.control" }],
                 permissions: ["manage-control-unit"],
             },
         ],

src/core/utils/pageMenuDev.js

@@ -1,28 +1,29 @@
-import SpaceDashboardIcon from "@mui/icons-material/SpaceDashboard";
-import GroupsIcon from "@mui/icons-material/Groups";
+import { Mediation } from "@mui/icons-material";
 import AccountTreeIcon from "@mui/icons-material/AccountTree";
-import FactCheckIcon from "@mui/icons-material/FactCheck";
-import FireTruckIcon from "@mui/icons-material/FireTruck";
-import RouteIcon from "@mui/icons-material/Route";
-import DoorbellIcon from "@mui/icons-material/Doorbell";
-import ElectricBoltIcon from "@mui/icons-material/ElectricBolt";
-import CottageIcon from "@mui/icons-material/Cottage";
-import GppMaybeIcon from "@mui/icons-material/GppMaybe";
-import GavelIcon from "@mui/icons-material/Gavel";
-import BallotIcon from "@mui/icons-material/Ballot";
-import AssistantIcon from "@mui/icons-material/Assistant";
 import AdminPanelSettingsIcon from "@mui/icons-material/AdminPanelSettings";
-import MapIcon from "@mui/icons-material/Map";
-import SpeedIcon from "@mui/icons-material/Speed";
-import EngineeringIcon from "@mui/icons-material/Engineering";
 import AssessmentIcon from "@mui/icons-material/Assessment";
 import AssignmentLateIcon from "@mui/icons-material/AssignmentLate";
-import LockPersonIcon from "@mui/icons-material/LockPerson";
-import LineAxisIcon from "@mui/icons-material/LineAxis";
-import ScienceIcon from "@mui/icons-material/Science";
-import DriveEtaIcon from "@mui/icons-material/DriveEta";
+import AssistantIcon from "@mui/icons-material/Assistant";
+import BallotIcon from "@mui/icons-material/Ballot";
 import BiotechIcon from "@mui/icons-material/Biotech";
-import { Mediation } from "@mui/icons-material";
+import CottageIcon from "@mui/icons-material/Cottage";
+import DoorbellIcon from "@mui/icons-material/Doorbell";
+import DriveEtaIcon from "@mui/icons-material/DriveEta";
+import ElectricBoltIcon from "@mui/icons-material/ElectricBolt";
+import EngineeringIcon from "@mui/icons-material/Engineering";
+import FactCheckIcon from "@mui/icons-material/FactCheck";
+import FireTruckIcon from "@mui/icons-material/FireTruck";
+import GavelIcon from "@mui/icons-material/Gavel";
+import GppMaybeIcon from "@mui/icons-material/GppMaybe";
+import GroupsIcon from "@mui/icons-material/Groups";
+import HandymanIcon from "@mui/icons-material/Handyman";
+import LineAxisIcon from "@mui/icons-material/LineAxis";
+import LockPersonIcon from "@mui/icons-material/LockPerson";
+import MapIcon from "@mui/icons-material/Map";
+import RouteIcon from "@mui/icons-material/Route";
+import ScienceIcon from "@mui/icons-material/Science";
+import SpaceDashboardIcon from "@mui/icons-material/SpaceDashboard";
+import SpeedIcon from "@mui/icons-material/Speed";
 
 export const pageMenuDev = [
     {
@@ -95,6 +96,7 @@ export const pageMenuDev = [
         label: "ماموریت ها",
         type: "menu",
         icon: <Mediation sx={{ width: "inherit", height: "inherit" }} />,
+        badges: [{ key: "mission.total" }],
         hasSubitems: true,
         Subitems: [
             {
@@ -102,13 +104,19 @@ export const pageMenuDev = [
                 label: "کارتابل",
                 type: "page",
                 route: "/dashboard/road-missions/operator",
-                permissions: ["manage-request-portal-country", "manage-request-portal-province", "manage-request-portal-city"],
+                badges: [{ key: "mission.request_portal" }],
+                permissions: [
+                    "manage-request-portal-country",
+                    "manage-request-portal-province",
+                    "manage-request-portal-city",
+                ],
             },
             {
                 id: "roadMissionsManagemnetNaqlie",
                 label: "نقلیه",
                 type: "page",
                 route: "/dashboard/road-missions/transportation",
+                badges: [{ key: "mission.transportation" }],
                 permissions: ["manage-transportation-unit"],
             },
             {
@@ -116,6 +124,7 @@ export const pageMenuDev = [
                 label: "کنترل",
                 type: "page",
                 route: "/dashboard/road-missions/control",
+                badges: [{ key: "mission.control" }],
                 permissions: ["manage-control-unit"],
             },
         ],
@@ -535,6 +544,14 @@ export const pageMenuDev = [
         icon: <BiotechIcon sx={{ width: "inherit", height: "inherit" }} />,
         permissions: ["azmayesh-type-management"],
     },
+    {
+        id: "rahdaran",
+        label: "راهداران",
+        type: "page",
+        route: "/dashboard/rahdaran",
+        icon: <HandymanIcon sx={{ width: "inherit", height: "inherit" }} />,
+        permissions: ["all"],
+    },
     {
         id: "adminManagement",
         label: "مدیریت سامانه",
@@ -572,7 +589,7 @@ export const pageMenuDev = [
                 type: "page",
                 route: "/dashboard/car-details",
                 icon: <DriveEtaIcon sx={{ width: "inherit", height: "inherit" }} />,
-                permissions: [""],
+                permissions: ["show-rahdaran"],
             },
         ],
     },

src/core/utils/routes.js

@@ -29,57 +29,66 @@ export const ADD_AZMAYESH_TYPE = api + "/api/v3/azmayesh_types/store";
 export const UPDATE_AZMAYESH_TYPE = api + "/api/v3/azmayesh_types/update";
 
 //road patrol
-export const GET_ROAD_PATROL_OPERATOR_LIST = api + "/api/v3/road_patrols/operator_index";
-export const EXPORT_ROAD_PATROL_OPERATOR_LIST = api + "/api/v3/road_patrols/operator_report";
-export const GET_ROAD_PATROL_SUPERVISOR_LIST = api + "/api/v3/road_patrols/supervisor_index";
-export const EXPORT_ROAD_PATROL_SUPERVISOR_LIST = api + "/api/v3/road_patrols/supervisor_report";
-export const EXPORT_PROVINCE_ROAD_PATROL_REPORTS = api + "/api/v3/road_patrol_reports/province_activity_excel";
-export const EXPORT_COUNTRY_ROAD_PATROL_REPORTS = api + "/api/v3/road_patrol_reports/country_activity_excel";
-export const DELETE_ROAD_PATROL_SUPERVISOR = api + "/api/v3/road_patrols/delete";
+export const GET_ROAD_PATROL_OPERATOR_LIST = api + "/api/v3/road_patrols/operator";
+export const EXPORT_ROAD_PATROL_OPERATOR_LIST = api + "/api/v3/road_patrols/operator/excel";
+export const GET_ROAD_PATROL_SUPERVISOR_LIST = api + "/api/v3/road_patrols/supervisor";
+export const EXPORT_ROAD_PATROL_SUPERVISOR_LIST = api + "/api/v3/road_patrols/supervisor/excel";
+export const DELETE_ROAD_PATROL_SUPERVISOR = api + "/api/v3/road_patrols/operator/delete";
 export const GET_CMMS_MACHINE_ROAD_PATROL = api + "/api/v3/road_patrols/machines";
 export const GET_ROAD_PATROL_OPERATOR_REPORT = api + "/v2/road_patrols/operator/report";
 export const GET_ROAD_PATROL_SUPERVISOR_REPORT = api + "/v2/road_patrols/operator/report";
 export const GET_RAHDARAN_ROAD_POTROL = api + "/api/v3/road_patrols/rahdaran";
-export const CREATE_PATROL = api + "/api/v3/road_patrols/store";
+export const CREATE_PATROL = api + "/api/v3/road_patrols/operator/store";
 export const GET_FMS_DATA = api + "/api/v3/fms_vehicle/get_activity";
 export const GET_OTP_TOKEN = api + "/api/v3/otp/get_token";
-export const GET_PROVINCE_ACTIVITY_REPORT = api + "/api/v3/road_patrol_reports/country_activity";
-export const GET_CITY_ACTIVITY_REPORT = api + "/api/v3/road_patrol_reports/province_activity";
+
+export const GET_PROVINCE_ACTIVITY_REPORT = api + "/api/v3/road_patrols/report/country_activity";
+export const GET_CITY_ACTIVITY_REPORT = api + "/api/v3/road_patrols/report/province_activity";
+export const EXPORT_COUNTRY_ROAD_PATROL_REPORTS = api + "/api/v3/road_patrols/report/country_activity_excel";
+export const EXPORT_PROVINCE_ROAD_PATROL_REPORTS = api + "/api/v3/road_patrols/report/province_activity_excel";
 
 // road items
-export const GET_ROAD_ITEMS_SUPERVISOR_LIST = api + "/api/v3/road_items/supervisor_index";
-export const EXPORT_ROAD_ITEMS_SUPERVISOR_LIST = api + "/api/v3/road_items/supervisor_report";
-export const GET_ROAD_ITEMS_OPERATOR_LIST = api + "/api/v3/road_items/operator_index";
-export const EXPORT_ROAD_ITEMS_OPERATOR_LIST = api + "/api/v3/road_items/operator_report";
-export const EXPORT_PROVINCE_ROAD_ITEM_REPORTS_PER_ITEM =
-    api + "/api/v3/road_item_reports/province_activity_excel_per_item";
-export const EXPORT_COUNTRY_ROAD_ITEM_REPORTS_PER_ITEM =
-    api + "/api/v3/road_item_reports/country_activity_excel_per_item";
-export const EXPORT_PROVINCE_ROAD_ITEM_REPORTS_PER_SUB_ITEM =
-    api + "/api/v3/road_item_reports/province_activity_excel_per_sub_item";
-export const EXPORT_COUNTRY_ROAD_ITEM_REPORTS_PER_SUB_ITEM =
-    api + "/api/v3/road_item_reports/country_activity_excel_per_sub_item";
+export const GET_ROAD_ITEMS_SUPERVISOR_LIST = api + "/api/v3/road_items/supervisor";
+export const EXPORT_ROAD_ITEMS_SUPERVISOR_LIST = api + "/api/v3/road_items/supervisor/excel";
+export const GET_ROAD_ITEMS_OPERATOR_LIST = api + "/api/v3/road_items/operator";
+export const EXPORT_ROAD_ITEMS_OPERATOR_LIST = api + "/api/v3/road_items/operator/excel";
+
 export const GET_ROAD_ITEMS_ITEM = api + "/api/v3/items";
 export const GET_ROAD_ITEMS_SUB_ITEM = api + "/api/v3/sub_items";
 export const GET_EDARAT_LISTS = api + "/public/contents/edarate_shahri_by_province";
-export const CREATE_ROAD_ITEMS = api + "/api/v3/road_items/store";
-export const UPDATE_ROAD_ITEMS = api + "/api/v3/road_items/update";
-export const VERIFY_BY_SUPERVISOR = api + "/api/v3/road_items/verify_by_supervisor";
-export const REJECT_BY_SUPERVISOR = api + "/api/v3/road_items/verify_by_supervisor";
-export const DELETE_BY_SUPERVISOR = api + "/api/v3/road_items/delete";
-export const RESTORE_BY_SUPERVISOR = api + "/api/v3/road_items/restore";
+
+export const CREATE_ROAD_ITEMS = api + "/api/v3/road_items/operator";
+export const UPDATE_ROAD_ITEMS = api + "/api/v3/road_items/operator";
+export const VERIFY_BY_SUPERVISOR = api + "/api/v3/road_items/supervisor/confirm";
+export const REJECT_BY_SUPERVISOR = api + "/api/v3/road_items/supervisor/reject";
+export const DELETE_BY_SUPERVISOR = api + "/api/v3/road_items/operator";
+export const RESTORE_BY_SUPERVISOR = api + "/api/v3/road_items/supervisor/reject";
+
 export const GET_CAR_LIST_SEARCH = api + "/api/v3/cmms_machines/search";
 export const GET_RAHDARANS_LIST_SEARCH = api + "/api/v3/rahdaran/search";
+
 export const GET_OBSERVED_GASHT_LIST = api + "/api/v3/observed_items/filter";
-export const GET_ROAD_ITEMS_REPORT_MAP = api + "/api/v3/road_item_reports/activities_on_map";
-export const GET_ROAD_ITEM = api + "/api/v3/road_item_reports/show_on_map";
-export const GET_PROVINCE_ACTIVITY_PER_ITEM = api + "/api/v3/road_item_reports/country_activity_per_item";
-export const GET_CITY_ACTIVITY_PER_ITEM = api + "/api/v3/road_item_reports/province_activity_per_item";
-export const GET_PROVINCE_ACTIVITY_PER_SUB_ITEM = api + "/api/v3/road_item_reports/country_activity_per_sub_item";
-export const GET_CITY_ACTIVITY_PER_SUB_ITEM = api + "/api/v3/road_item_reports/province_activity_per_sub_item";
-export const GET_IMAGES_ROAD_ITEM = api + "/api/v3/road_items/files";
-export const GET_CMMS_MACHINE_ROAD_ITEM = api + "/api/v3/road_items/machines";
-export const GET_RAHDARAN_ROAD_ITEM = api + "/api/v3/road_items/rahdaran";
+
+export const GET_ROAD_ITEMS_REPORT_MAP = api + "/api/v3/road_items/reports/activities_on_map";
+export const GET_ROAD_ITEM = api + "/api/v3/road_items/reports/show_on_map";
+
+export const GET_PROVINCE_ACTIVITY_PER_ITEM = api + "/api/v3/road_items/reports/country_activity_per_item";
+export const GET_CITY_ACTIVITY_PER_ITEM = api + "/api/v3/road_items/reports/province_activity_per_item";
+export const GET_PROVINCE_ACTIVITY_PER_SUB_ITEM = api + "/api/v3/road_items/reports/country_activity_per_sub_item";
+export const GET_CITY_ACTIVITY_PER_SUB_ITEM = api + "/api/v3/road_items/reports/province_activity_per_sub_item";
+
+export const EXPORT_COUNTRY_ROAD_ITEM_REPORTS_PER_ITEM =
+    api + "/api/v3/road_items/reports/country_activity_excel_per_item";
+export const EXPORT_PROVINCE_ROAD_ITEM_REPORTS_PER_ITEM =
+    api + "/api/v3/road_item/reports/province_activity_excel_per_item";
+export const EXPORT_COUNTRY_ROAD_ITEM_REPORTS_PER_SUB_ITEM =
+    api + "/api/v3/road_items/reports/country_activity_excel_per_sub_item";
+export const EXPORT_PROVINCE_ROAD_ITEM_REPORTS_PER_SUB_ITEM =
+    api + "/api/v3/road_items/reports/province_activity_excel_per_sub_item";
+
+export const GET_IMAGES_ROAD_ITEM = api + "/api/v3/road_items/details/files";
+export const GET_CMMS_MACHINE_ROAD_ITEM = api + "/api/v3/road_items/details/machines";
+export const GET_RAHDARAN_ROAD_ITEM = api + "/api/v3/road_items/details/rahdaran";
 
 // damage items
 export const GET_RECEIPT_DAMAGE_ITEMS_LIST = api + "/api/v3/damages";
@@ -185,9 +194,16 @@ export const REQUEST_MISSION = api + "/api/v3/missions/request_portal";
 export const UPDATE_REQUEST_MISSION = api + "/api/v3/missions/request_portal";
 export const DELETE_REQUEST_MISSION = api + "/api/v3/missions/request_portal";
 export const GET_RAHDARAN_BY_ID = api + "/api/v3/missions/details/rahdaran";
+export const GET_MACHINES_BY_ID = api + "/api/v3/missions/details/machines";
 export const ALLOCATE_REQUEST_MISSION = api + "/api/v3/missions/transportation_unit/allocate";
 export const DEALLOCATE_REQUEST_MISSION = api + "/api/v3/missions/transportation_unit/deallocate";
 export const START_MISSION = api + "/api/v3/missions/control_unit/start";
 export const FINISH_MISSION = api + "/api/v3/missions/control_unit/finish";
 
 export const GET_MACHINES_TABLE_LIST = api + "/api/v3/cmms_machines";
+
+// rahdaran
+export const GET_RAHDARAN_TABLE_LIST = api + "/api/v3/rahdaran";
+export const DELETE_RAHDARAN_ITEM = api + "/api/v3/rahdaran";
+export const UPDATE_RAHDARAN_ITEM = api + "/api/v3/rahdaran";
+export const CREATE_RAHDARAN_ITEM = api + "/api/v3/rahdaran";