Feature/gasht rahdari

package.json

@@ -25,6 +25,7 @@
     "date-fns": "^3.3.1",
     "date-fns-jalali": "^2.13.0-0",
     "dayjs": "^1.11.10",
+    "file-saver": "^2.0.5",
     "formik": "^2.4.5",
     "jalali-moment": "^3.3.11",
     "lz-string": "^1.5.0",

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

@@ -0,0 +1,12 @@
+import WithPermission from "@/core/middlewares/withPermission";
+import OperatorPage from "@/components/dashboard/roadPatrols/operator";
+
+const Page = () => {
+    return (
+        <WithPermission permission_name={["add-road-patrol"]}>
+            <OperatorPage />
+        </WithPermission>
+    );
+};
+
+export default Page;

src/app/(withAuth)/dashboard/road-patrols/supervisor/page.js

@@ -0,0 +1,11 @@
+import WithPermission from "@/core/middlewares/withPermission";
+import SupervisorPage from "@/components/dashboard/roadPatrols/supervisor";
+const Page = () => {
+    return (
+        <WithPermission permission_name={["show-road-patrol-supervise-cartable"]}>
+            <SupervisorPage />
+        </WithPermission>
+    );
+};
+
+export default Page;

src/app/api/fake-operator-list/route.js

@@ -0,0 +1,24 @@
+const data = [
+    {
+        id: 1,
+        operator_name: "امین",
+        phone_number: "09134849737",
+        car_id: "33",
+        start_date: "2024-11-02T11:48:22.000000Z",
+        end_date: "2024-11-03T11:01:14.000000Z",
+        register_date: "2024-11-03T11:01:14.000000Z",
+    },
+    {
+        id: 2,
+        operator_name: "امیر",
+        phone_number: "09134844955",
+        car_id: "233",
+        start_date: "2024-11-02T11:48:22.000000Z",
+        end_date: "2024-11-03T11:01:14.000000Z",
+        register_date: "2024-11-03T11:01:14.000000Z",
+    },
+];
+
+export async function GET() {
+    return Response.json({ data });
+}

src/app/api/fake-supervisor-list/route.js

@@ -0,0 +1,28 @@
+const data = [
+    {
+        id: 1,
+        operator_name: "امین",
+        phone_number: "09134849737",
+        province: "تهران",
+        office: "اداره کل",
+        car_id: "33",
+        start_date: "2024-11-02T11:48:22.000000Z",
+        end_date: "2024-11-03T11:01:14.000000Z",
+        register_date: "2024-11-03T11:01:14.000000Z",
+    },
+    {
+        id: 2,
+        operator_name: "امیر",
+        phone_number: "09134844955",
+        province: "تهران",
+        office: "اداره کل",
+        car_id: "233",
+        start_date: "2024-11-02T11:48:22.000000Z",
+        end_date: "2024-11-03T11:01:14.000000Z",
+        register_date: "2024-11-03T11:01:14.000000Z",
+    },
+];
+
+export async function GET() {
+    return Response.json({ data });
+}

src/components/dashboard/roadPatrols/operator/ExcelPrint/index.jsx

@@ -0,0 +1,59 @@
+import { Button, CircularProgress } from "@mui/material";
+import { useMemo, useState } from "react";
+import moment from "jalali-moment";
+import FileSaver from "file-saver";
+import DescriptionIcon from "@mui/icons-material/Description";
+import useRequest from "@/lib/hooks/useRequest";
+import { EXPORT_OPERATOR_LIST } from "@/core/utils/routes";
+
+const PrintExcel = ({ table, filterData }) => {
+    const [loading, setLoading] = useState(false);
+    const requestServer = useRequest();
+    const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
+        if (filter.value) {
+            // Check if there's an active filter
+            acc.push({ id: key, value: filter.value });
+        }
+        return acc;
+    }, []);
+
+    const filterParams = useMemo(() => {
+        const params = new URLSearchParams();
+        activeFilters.length > 0 &&
+            activeFilters.map((filter, index) => {
+                params.set(`${filter.id}`, filter.value);
+            });
+        return params;
+    }, [activeFilters]);
+
+    const clickHandler = () => {
+        setLoading(true);
+        requestServer(`${EXPORT_OPERATOR_LIST}?${filterParams}`, "get", {
+            requestOptions: { responseType: "blob" },
+        })
+            .then((response) => {
+                const filename = `خروجی کارتابل عملیات تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
+                FileSaver.saveAs(response.data, filename);
+            })
+            .catch(() => {})
+            .finally(() => {
+                setLoading(false);
+            });
+    };
+
+    return (
+        <Button
+            color="primary"
+            variant="contained"
+            size="small"
+            disabled={loading}
+            sx={{ textTransform: "unset", alignSelf: "center" }}
+            startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
+            onClick={clickHandler}
+        >
+            خروجی اکسل
+        </Button>
+    );
+};
+
+export default PrintExcel;

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

@@ -0,0 +1,114 @@
+"use client";
+import { useMemo } from "react";
+import { Box, Typography } from "@mui/material";
+import DataTableWithAuth from "@/core/components/DataTableWithAuth";
+import Toolbar from "./Toolbar";
+import { GET_OPERATOR_LIST } from "@/core/utils/routes";
+import moment from "jalali-moment";
+import RowActions from "./RowActions";
+
+const OperatorList = () => {
+    const columns = useMemo(
+        () => [
+            {
+                accessorKey: "id",
+                header: "کد یکتا",
+                id: "id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "operator_name",
+                header: "نام مامور",
+                id: "operator_name",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "phone_number",
+                header: "تلفن همراه",
+                id: "phone_number",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "car_id",
+                header: "کد خودرو",
+                id: "car_id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "start_date",
+                header: "تاریخ شروع",
+                id: "start_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+            {
+                accessorKey: "end_date",
+                header: "تاریخ پایان",
+                id: "end_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+            {
+                accessorKey: "register_date",
+                header: "تاریخ ثبت",
+                id: "register_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+        ],
+        []
+    );
+
+    return (
+        <>
+            <Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
+                <DataTableWithAuth
+                    table_title={"عملیات"}
+                    need_filter={true}
+                    columns={columns}
+                    table_url={GET_OPERATOR_LIST}
+                    page_name={"operator"}
+                    table_name={"operatorList"}
+                    TableToolbar={Toolbar}
+                    enableRowActions
+                    positionActionsColumn={"last"}
+                    RowActions={RowActions}
+                />
+            </Box>
+        </>
+    );
+};
+export default OperatorList;

src/components/dashboard/roadPatrols/operator/RowActions/ReportForm/index.jsx

@@ -0,0 +1,23 @@
+import { Tooltip, IconButton } from "@mui/material";
+import PrintIcon from "@mui/icons-material/Print";
+
+const ReportForm = ({ rowId }) => {
+    const reportUrl = "https://rms.rmto.ir/v2/road_patrols/operator/report/97314"; // TODO replace id here
+
+    return (
+        <Tooltip title="گزارش" arrow placement="right">
+            <IconButton
+                color="primary"
+                component="a"
+                href={reportUrl}
+                target="_blank"
+                rel="noopener noreferrer"
+                sx={{ textTransform: "unset", alignSelf: "center" }}
+            >
+                <PrintIcon />
+            </IconButton>
+        </Tooltip>
+    );
+};
+
+export default ReportForm;

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

@@ -0,0 +1,11 @@
+import { Box } from "@mui/material";
+import ReportForm from "./ReportForm";
+
+const RowActions = ({ row }) => {
+    return (
+        <Box sx={{ display: "flex", gap: 1 }}>
+            <ReportForm rowId={row.getValue("id")} />
+        </Box>
+    );
+};
+export default RowActions;

src/components/dashboard/roadPatrols/operator/Toolbar.jsx

@@ -0,0 +1,10 @@
+import PrintExcel from "./ExcelPrint";
+
+const Toolbar = ({ table, filterData }) => {
+    return (
+        <>
+            <PrintExcel table={table} filterData={filterData} />
+        </>
+    );
+};
+export default Toolbar;

src/components/dashboard/roadPatrols/operator/index.jsx

@@ -0,0 +1,14 @@
+"use client";
+import PageTitle from "@/core/components/PageTitle";
+import { Stack } from "@mui/material";
+import OperatorList from "@/components/dashboard/roadPatrols/operator/OperatorList";
+
+const OperatorPage = () => {
+    return (
+        <Stack spacing={1}>
+            <PageTitle title={"عملیات"} />
+            <OperatorList />
+        </Stack>
+    );
+};
+export default OperatorPage;

src/components/dashboard/roadPatrols/supervisor/ExcelPrint/index.jsx

@@ -0,0 +1,59 @@
+import { Button, CircularProgress } from "@mui/material";
+import { useMemo, useState } from "react";
+import moment from "jalali-moment";
+import FileSaver from "file-saver";
+import DescriptionIcon from "@mui/icons-material/Description";
+import useRequest from "@/lib/hooks/useRequest";
+import { EXPORT_SUPERVISOR_LIST } from "@/core/utils/routes";
+
+const PrintExcel = ({ table, filterData }) => {
+    const [loading, setLoading] = useState(false);
+    const requestServer = useRequest();
+    const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
+        if (filter.value) {
+            // Check if there's an active filter
+            acc.push({ id: key, value: filter.value });
+        }
+        return acc;
+    }, []);
+
+    const filterParams = useMemo(() => {
+        const params = new URLSearchParams();
+        activeFilters.length > 0 &&
+            activeFilters.map((filter, index) => {
+                params.set(`${filter.id}`, filter.value);
+            });
+        return params;
+    }, [activeFilters]);
+
+    const clickHandler = () => {
+        setLoading(true);
+        requestServer(`${EXPORT_SUPERVISOR_LIST}?${filterParams}`, "get", {
+            requestOptions: { responseType: "blob" },
+        })
+            .then((response) => {
+                const filename = `خروجی کارتابل ارزیابی تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
+                FileSaver.saveAs(response.data, filename);
+            })
+            .catch(() => {})
+            .finally(() => {
+                setLoading(false);
+            });
+    };
+
+    return (
+        <Button
+            color="primary"
+            variant="contained"
+            size="small"
+            disabled={loading}
+            sx={{ textTransform: "unset", alignSelf: "center" }}
+            startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
+            onClick={clickHandler}
+        >
+            خروجی اکسل
+        </Button>
+    );
+};
+
+export default PrintExcel;

src/components/dashboard/roadPatrols/supervisor/RowActions/DeleteForm/DeleteContent.jsx

@@ -0,0 +1,68 @@
+import { Button, DialogActions, DialogContent, Stack, Typography, List, ListItem } from "@mui/material";
+import useRequest from "@/lib/hooks/useRequest";
+import React from "react";
+
+const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
+    const requestServer = useRequest();
+
+    return (
+        <>
+            <DialogContent sx={{ paddingBottom: 0 }}>
+                <Stack alignItems="start" spacing={0}>
+                    <Typography variant="body1" textAlign="start" sx={{ width: "100%" }}>
+                        لطفاً نوع حذف مورد نظر را انتخاب کنید.
+                    </Typography>
+                    <List sx={{ listStyleType: "disc", pl: 1 }}>
+                        <ListItem
+                            sx={{
+                                display: "list-item",
+                                pl: 0,
+                                "&::marker": {
+                                    color: "warning.main",
+                                },
+                            }}
+                        >
+                            <Typography variant="body2">حذف جزئی : حذف گشت بدون اقدامات انجام شده.</Typography>
+                        </ListItem>
+                        <ListItem
+                            sx={{
+                                display: "list-item",
+                                pl: 0,
+                                "&::marker": {
+                                    color: "error.main",
+                                },
+                            }}
+                        >
+                            <Typography variant="body2">حذف کلی : حذف گشت با اقدامات انجام شده.</Typography>
+                        </ListItem>
+                    </List>
+                </Stack>
+            </DialogContent>
+            <DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
+                <Button onClick={() => setOpenDeleteDialog(false)} variant="outlined" color="primary">
+                    بستن
+                </Button>
+                <Button
+                    onClick={() => {
+                        /* handle partial delete */
+                    }}
+                    variant="outlined"
+                    color="warning"
+                >
+                    حذف جزئی
+                </Button>
+                <Button
+                    onClick={() => {
+                        /* handle complete delete */
+                    }}
+                    variant="contained"
+                    color="error"
+                >
+                    حذف کلی
+                </Button>
+            </DialogActions>
+        </>
+    );
+};
+
+export default DeleteContent;

src/components/dashboard/roadPatrols/supervisor/RowActions/DeleteForm/index.jsx

@@ -0,0 +1,45 @@
+import React, { useState } from "react";
+import {
+    Tooltip,
+    IconButton,
+    Dialog,
+    DialogTitle,
+    DialogContent,
+    DialogActions,
+    Button,
+    Box,
+    Typography,
+} from "@mui/material";
+import DeleteIcon from "@mui/icons-material/Delete";
+import CloseIcon from "@mui/icons-material/Close";
+import DeleteContent from "@/components/dashboard/roadPatrols/supervisor/RowActions/DeleteForm/DeleteContent";
+
+const DeleteForm = ({ 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>
+                <DeleteContent rowId={rowId} mutate={mutate} setOpenDeleteDialog={setOpenDeleteDialog} />
+            </Dialog>
+        </>
+    );
+};
+
+export default DeleteForm;

src/components/dashboard/roadPatrols/supervisor/RowActions/OfficerDescription/index.jsx

@@ -0,0 +1,78 @@
+import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
+import { useState } from "react";
+import useRequest from "@/lib/hooks/useRequest";
+import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
+import CloseIcon from "@mui/icons-material/Close";
+
+const OfficerDescriptionForm = ({ row }) => {
+    const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
+    const requestServer = useRequest();
+
+    const handleSubmit = () => {
+        // requestServer(`${RESERVE_PASSENGER_BOSS}/${rowId}`, "post", { description })
+        //     .then((response) => {
+        //         setOpenOfficerDescriptionDialog(false);
+        //         mutate();
+        //     })
+        //     .catch((error) => {
+        //         console.error(error);
+        //     })
+        //     .finally(() => {
+        //         setIsSubmitting(false);
+        //     });
+    };
+
+    return (
+        <>
+            <Tooltip title="توضیحات مامور">
+                <IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
+                    <RemoveRedEyeIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                open={openOfficerDescriptionDialog}
+                onClose={() => setOpenOfficerDescriptionDialog(false)}
+                PaperProps={{
+                    sx: {
+                        transition: "all .3s",
+                        boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
+                        borderRadius: 2,
+                        padding: 1,
+                    },
+                }}
+                maxWidth="sm"
+                fullWidth
+                dir="rtl"
+            >
+                <DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
+                    <Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
+                        توضیحات مامور
+                    </Typography>
+                    <IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
+                        <CloseIcon />
+                    </IconButton>
+                </DialogTitle>
+                <DialogContent>
+                    <Card sx={{ padding: 2, boxShadow: 3, borderRadius: 2 }}>
+                        <CardContent>
+                            <Typography
+                                gutterBottom
+                                variant="body1"
+                                component="div"
+                                sx={{ fontWeight: "bold", mb: 2, color: "primary.main" }}
+                            >
+                                توضیحات :
+                            </Typography>
+                            <Typography variant="body2">
+                                {row.original.description || "هیچ توضیحی موجود نیست"}{" "}
+                                {/* should replace row.original.description with the back end*/}
+                            </Typography>
+                        </CardContent>
+                    </Card>
+                </DialogContent>
+            </Dialog>
+        </>
+    );
+};
+
+export default OfficerDescriptionForm;

src/components/dashboard/roadPatrols/supervisor/RowActions/ReportForm/index.jsx

@@ -0,0 +1,23 @@
+import { Tooltip, IconButton } from "@mui/material";
+import PrintIcon from "@mui/icons-material/Print";
+
+const ReportForm = ({ rowId }) => {
+    const reportUrl = "https://rms.rmto.ir/v2/road_patrols/operator/report/541938"; // TODO replace id here
+
+    return (
+        <Tooltip title="گزارش" arrow placement="right">
+            <IconButton
+                color="primary"
+                component="a"
+                href={reportUrl}
+                target="_blank"
+                rel="noopener noreferrer"
+                sx={{ textTransform: "unset", alignSelf: "center" }}
+            >
+                <PrintIcon />
+            </IconButton>
+        </Tooltip>
+    );
+};
+
+export default ReportForm;

src/components/dashboard/roadPatrols/supervisor/RowActions/index.jsx

@@ -0,0 +1,15 @@
+import { Box } from "@mui/material";
+import ReportForm from "./ReportForm";
+import DeleteForm from "./DeleteForm";
+import OfficerDescriptionForm from "./OfficerDescription";
+
+const RowActions = ({ row, mutate }) => {
+    return (
+        <Box sx={{ display: "flex", gap: 1 }}>
+            <ReportForm rowId={row.getValue("id")} />
+            <OfficerDescriptionForm row={row} />
+            <DeleteForm rowId={row.getValue("id")} mutate={mutate} />
+        </Box>
+    );
+};
+export default RowActions;

src/components/dashboard/roadPatrols/supervisor/SupervisorList.jsx

@@ -0,0 +1,132 @@
+"use client";
+import { useMemo } from "react";
+import { Box, Typography } from "@mui/material";
+import DataTableWithAuth from "@/core/components/DataTableWithAuth";
+import Toolbar from "./Toolbar";
+import { GET_SUPERVISOR_LIST } from "@/core/utils/routes";
+import moment from "jalali-moment";
+import RowActions from "./RowActions";
+
+const OperatorList = () => {
+    const columns = useMemo(
+        () => [
+            {
+                accessorKey: "id",
+                header: "کد یکتا",
+                id: "id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "province",
+                header: "استان",
+                id: "province",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "office",
+                header: "اداره",
+                id: "office",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "operator_name",
+                header: "نام مامور",
+                id: "operator_name",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "phone_number",
+                header: "تلفن همراه",
+                id: "phone_number",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "car_id",
+                header: "کد خودرو",
+                id: "car_id",
+                enableColumnFilter: true,
+                datatype: "text",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+            },
+            {
+                accessorKey: "start_date",
+                header: "تاریخ شروع",
+                id: "start_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+            {
+                accessorKey: "end_date",
+                header: "تاریخ پایان",
+                id: "end_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+            {
+                accessorKey: "register_date",
+                header: "تاریخ ثبت",
+                id: "register_date",
+                enableColumnFilter: true,
+                datatype: "date",
+                filterFn: "equals",
+                columnFilterModeOptions: ["equals", "contains"],
+                Cell: ({ renderedCellValue }) => (
+                    <Typography variant="body2">
+                        {renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
+                    </Typography>
+                ),
+            },
+        ],
+        []
+    );
+
+    return (
+        <>
+            <Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
+                <DataTableWithAuth
+                    table_title={"ارزیابی"}
+                    need_filter={true}
+                    columns={columns}
+                    table_url={GET_SUPERVISOR_LIST}
+                    page_name={"supervisor"}
+                    table_name={"supervisorList"}
+                    TableToolbar={Toolbar}
+                    enableRowActions
+                    positionActionsColumn={"last"}
+                    RowActions={RowActions}
+                />
+            </Box>
+        </>
+    );
+};
+export default OperatorList;

src/components/dashboard/roadPatrols/supervisor/Toolbar.jsx

@@ -0,0 +1,10 @@
+import PrintExcel from "./ExcelPrint";
+
+const Toolbar = ({ table, filterData }) => {
+    return (
+        <>
+            <PrintExcel table={table} filterData={filterData} />
+        </>
+    );
+};
+export default Toolbar;

src/components/dashboard/roadPatrols/supervisor/index.jsx

@@ -0,0 +1,14 @@
+"use client";
+import PageTitle from "@/core/components/PageTitle";
+import { Stack } from "@mui/material";
+import SupervisorList from "./SupervisorList";
+
+const SupervisorPage = () => {
+    return (
+        <Stack spacing={1}>
+            <PageTitle title={"ارزیابی"} />
+            <SupervisorList />
+        </Stack>
+    );
+};
+export default SupervisorPage;

src/core/components/DataTable/Main.js

@@ -115,7 +115,9 @@ const DataTable_Main = (props) => {
         onPaginationChange: setPagination,
         onSortingChange: onSortingChange,
         rowCount: totalRowCount,
-        renderTopToolbarCustomActions: ({ table }) => <>{TableToolbar && <TableToolbar mutate={mutate} />}</>,
+        renderTopToolbarCustomActions: ({ table }) => (
+            <>{TableToolbar && <TableToolbar table={table} mutate={mutate} filterData={filterData} />}</>
+        ),
         renderRowActions: ({ row }) => <RowActions row={row} mutate={mutate} />,
         ...props,
     });

src/core/utils/pageMenu.js

@@ -186,7 +186,7 @@ export const pageMenu = [
                         id: "roadPatrolManagmentSupervisorCartable",
                         label: "کارتابل",
                         type: "page",
-                        route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/supervisor/cartable",
+                        route: "/dashboard/road-patrols/supervisor",
                         permissions: [
                             "show-road-patrol-supervise-cartable",
                             "show-road-patrol-supervise-cartable-province",
@@ -206,14 +206,14 @@ export const pageMenu = [
                         id: "roadPatrolManagmentOparationCreate",
                         label: "ثبت اقدام",
                         type: "page",
-                        route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/operator/create",
+                        route: "/dashboard/road-patrols/operator/add",
                         permissions: ["add-road-patrol"],
                     },
                     {
                         id: "roadPatrolManagmentOparationCartable",
                         label: "کارتابل",
                         type: "page",
-                        route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/operator/cartable",
+                        route: "/dashboard/road-patrols/operator",
                         permissions: ["add-road-patrol"],
                     },
                 ],

src/core/utils/routes.js

@@ -27,3 +27,7 @@ export const DELETE_SAMPLE_LIST = api + "/api/v3/azmayesh_samples/delete";
 export const DELETE_AZMAYESH_TYPE_LIST = api + "/api/v3/azmayesh_types/delete";
 export const ADD_AZMAYESH_TYPE = api + "/api/v3/azmayesh_types/store";
 export const UPDATE_AZMAYESH_TYPE = api + "/api/v3/azmayesh_types/update";
+export const GET_OPERATOR_LIST = "/v3/api/fake-operator-list";
+export const EXPORT_OPERATOR_LIST = "https://rms.rmto.ir/v2/road_patrols/operator/cartable/report";
+export const GET_SUPERVISOR_LIST = "/v3/api/fake-supervisor-list";
+export const EXPORT_SUPERVISOR_LIST = "https://rms.rmto.ir/v2/road_patrols/supervisor/cartable/report";