Resolve #86c2grd6k "Feature/road safety edit"

src/app/(withAuth)/dashboard/permissions/page.js

@@ -5,7 +5,7 @@ export const metadata = {
 };
 const Page = () => {
     return (
-        <WithPermission permission_name={["show-permissions-page"]}>
+        <WithPermission permission_name={["manage-permissions"]}>
             <PermissionTablePage />
         </WithPermission>
     );

src/app/(withAuth)/dashboard/user-activities/page.js

@@ -5,7 +5,7 @@ export const metadata = {
 };
 const Page = () => {
     return (
-        <WithPermission permission_name={["show-user-activities-page"]}>
+        <WithPermission permission_name={["manage-log-list"]}>
             <UserActivitiesPage />
         </WithPermission>
     );

src/components/dashboard/roadSafety/operator/Form/EditAxisType/EditFormContent.jsx

@@ -0,0 +1,102 @@
+import SelectBox from "@/core/components/SelectBox";
+import StyledForm from "@/core/components/StyledForm";
+import { UPDATE_SAFETY_AND_PRIVACY } from "@/core/utils/routes";
+import useRequest from "@/lib/hooks/useRequest";
+import { yupResolver } from "@hookform/resolvers/yup";
+import BeenhereIcon from "@mui/icons-material/Beenhere";
+import ExitToAppIcon from "@mui/icons-material/ExitToApp";
+import { Button, DialogActions, DialogContent, Grid, Stack } from "@mui/material";
+import { Controller, useForm } from "react-hook-form";
+import { object, string } from "yup";
+
+const validationSchema = object({
+    axis_type_id: string().required("نوع محور را مشخص کنید!"),
+});
+
+const EditFormContent = ({ setOpen, mutate, row }) => {
+    const requestServer = useRequest({ notificationSuccess: true });
+    const defaultValues = {
+        axis_type_id: row.original.axis_type_id || "",
+    };
+
+    const handleClose = () => {
+        setOpen(false);
+    };
+
+    const {
+        control,
+        handleSubmit,
+        formState: { isSubmitting },
+    } = useForm({
+        defaultValues,
+        resolver: yupResolver(validationSchema),
+        mode: "onBlur",
+    });
+    const onSubmitBase = async (data) => {
+        const formData = new FormData();
+        formData.append("axis_type_id", data.axis_type_id);
+        await requestServer(`${UPDATE_SAFETY_AND_PRIVACY}/${row.original.id}`, "post", {
+            data: formData,
+        })
+            .then((response) => {
+                mutate();
+                setOpen(false);
+            })
+            .catch((error) => {});
+    };
+
+    return (
+        <StyledForm onSubmit={handleSubmit(onSubmitBase)}>
+            <DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
+                <Stack>
+                    <Grid container spacing={2}>
+                        <Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
+                            <Controller
+                                control={control}
+                                name={"axis_type_id"}
+                                render={({ field, fieldState: { error } }) => (
+                                    <SelectBox
+                                        value={field.value}
+                                        label="نوع محور"
+                                        selectors={[
+                                            { id: 1, name_fa: "آزادراه" },
+                                            { id: 2, name_fa: "بزرگراه" },
+                                            { id: 3, name_fa: "اصلی" },
+                                            { id: 4, name_fa: "فرعی" },
+                                            { id: 5, name_fa: "روستایی" },
+                                        ]}
+                                        schema={{ name: "name_fa", value: "id" }}
+                                        error={error}
+                                        onChange={field.onChange}
+                                        helperText={error?.message}
+                                    />
+                                )}
+                            />
+                        </Grid>
+                    </Grid>
+                </Stack>
+            </DialogContent>
+            <DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
+                <Button
+                    onClick={handleClose}
+                    variant="outlined"
+                    color="secondary"
+                    size="large"
+                    startIcon={<ExitToAppIcon />}
+                >
+                    بستن
+                </Button>
+                <Button
+                    variant="contained"
+                    size="large"
+                    disabled={isSubmitting}
+                    type={"submit"}
+                    endIcon={<BeenhereIcon />}
+                >
+                    {isSubmitting ? "در حال ویرایش" : "ویرایش"}
+                </Button>
+            </DialogActions>
+        </StyledForm>
+    );
+};
+export default EditFormContent;

src/components/dashboard/roadSafety/operator/Form/EditAxisType/OperatorEditForm.jsx

@@ -0,0 +1,26 @@
+import { Dialog, DialogTitle, IconButton } from "@mui/material";
+import CloseIcon from "@mui/icons-material/Close";
+import EditFormContent from "./EditFormContent";
+
+const OperatorEditForm = ({ open, setOpen, mutate, row }) => {
+    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>
+            <DialogTitle>ویرایش محور</DialogTitle>
+            {open && <EditFormContent setOpen={setOpen} mutate={mutate} row={row} />}
+        </Dialog>
+    );
+};
+export default OperatorEditForm;

src/components/dashboard/roadSafety/operator/Form/EditAxisType/index.jsx

@@ -0,0 +1,19 @@
+import { Dialog, IconButton, Tooltip } from "@mui/material";
+import { useState } from "react";
+import EditIcon from "@mui/icons-material/Edit";
+import OperatorEditForm from "./OperatorEditForm";
+
+const EditAxisType = ({ row, mutate }) => {
+    const [openEditDialog, setOpenEditDialog] = useState(false);
+    return (
+        <>
+            <Tooltip title="ویرایش محور">
+                <IconButton color="primary" onClick={() => setOpenEditDialog(true)}>
+                    <EditIcon />
+                </IconButton>
+            </Tooltip>
+            <OperatorEditForm open={openEditDialog} setOpen={setOpenEditDialog} mutate={mutate} row={row} />
+        </>
+    );
+};
+export default EditAxisType;

src/components/dashboard/roadSafety/operator/Form/StepOne/CreateFormContent.jsx

@@ -113,7 +113,7 @@ const CreateFormContent = ({ setOpen, mutate }) => {
                     backgroundColor: "#efefef",
                 }}
             >
-                <Tab icon={<InsertDriveFileIcon />} label="انتخاب آیتم" />
+                <Tab icon={<InsertDriveFileIcon />} label="انتخاب مورد" />
                 <Tab disabled={tabState === 0} icon={<FileCopyIcon />} label="اطلاعات مورد مشاهده شده" />
             </Tabs>
             <DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>

src/components/dashboard/roadSafety/operator/Form/StepOne/GetSubItemInfo.jsx

@@ -19,7 +19,7 @@ const GetSubItemInfo = ({ itemsList, control, setValue, errors }) => {
                                 icon={<InsertDriveFileIcon />}
                                 label={
                                     <Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
-                                        آیتم انتخاب ‌شده
+                                        مورد انتخاب ‌شده
                                     </Typography>
                                 }
                             />
@@ -40,7 +40,7 @@ const GetSubItemInfo = ({ itemsList, control, setValue, errors }) => {
                             render={({ field, fieldState: { error } }) => (
                                 <SelectBox
                                     value={field.value}
-                                    label="نام محور"
+                                    label="نوع محور"
                                     selectors={[
                                         { id: 1, name_fa: "آزادراه" },
                                         { id: 2, name_fa: "بزرگراه" },

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

@@ -15,6 +15,7 @@ import RecognizePictureDialog from "./RowActions/RecognizePictureDialog";
 import ActionPictureDialog from "./RowActions/ActionPictureDialog";
 import JudiciaryDocumentDialog from "./RowActions/JudiciaryDocumentDialog";
 import LocationForm from "./RowActions/LocationForm";
+import useSafetyAndPrivacyGetItems from "@/lib/hooks/useSafetyAndPrivacyGetItems";
 
 const OperatorList = () => {
     const { data: userPermissions } = usePermissions();
@@ -153,15 +154,40 @@ const OperatorList = () => {
                 columns: [
                     {
                         accessorKey: "info_id",
-                        header: "موضوع مشاهده شده",
+                        header: "مورد مشاهده شده",
                         id: "info_id",
                         enableColumnFilter: true,
-                        datatype: "text",
+                        datatype: "numeric",
                         filterMode: "equals",
-                        sortDescFirst: false,
-                        columnFilterModeOptions: ["equals", "contains"],
                         grow: false,
                         size: 100,
+                        ColumnSelectComponent: (props) => {
+                            const { itemsList, loadingItemsList, errorItemsList } = useSafetyAndPrivacyGetItems();
+
+                            const getColumnSelectOptions = useMemo(() => {
+                                if (loadingItemsList) {
+                                    return [{ value: "loading", label: "در حال بارگذاری..." }];
+                                }
+                                if (errorItemsList) {
+                                    return [{ value: "error", label: "خطا در بارگذاری" }];
+                                }
+                                return [
+                                    { value: "", label: "همه موارد" },
+                                    ...itemsList.map((item) => ({
+                                        value: item.id,
+                                        label: item.name,
+                                    })),
+                                ];
+                            }, [itemsList, loadingItemsList, errorItemsList]);
+
+                            return (
+                                <CustomSelectByDependency
+                                    {...props}
+                                    value={loadingItemsList ? "loading" : props.filterParameters.value}
+                                    columnSelectOption={getColumnSelectOptions}
+                                />
+                            );
+                        },
                         Cell: ({ row }) => <>{row.original.info_fa}</>,
                     },
                     {
@@ -208,10 +234,20 @@ const OperatorList = () => {
                             );
                         },
                     },
+                    {
+                        accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
+                        header: "تاریخ ثبت",
+                        id: "created_at",
+                        enableColumnFilter: true,
+                        datatype: "date",
+                        filterMode: "between",
+                        grow: false,
+                        size: 100,
+                    },
                 ],
             },
             {
-                header: "گام اول",
+                header: "گام اول (شناسایی)",
                 id: "stepOne",
                 enableColumnFilter: false,
                 enableSorting: false,
@@ -265,7 +301,7 @@ const OperatorList = () => {
                 ],
             },
             {
-                header: "گام دوم",
+                header: "گام دوم (مستندات قضایی)",
                 id: "stepTwo",
                 enableColumnFilter: false,
                 enableSorting: false,
@@ -322,7 +358,7 @@ const OperatorList = () => {
                 ],
             },
             {
-                header: "گام سوم",
+                header: "گام سوم (برخورد)",
                 id: "stepThree",
                 enableColumnFilter: false,
                 enableSorting: false,
@@ -367,7 +403,7 @@ const OperatorList = () => {
                             ) : (
                                 <>-</>
                             ),
-                        header: "تاریخ اقدام",
+                        header: "تاریخ ثبت اقدام",
                         id: "action_picture_document_upload_date",
                         enableColumnFilter: true,
                         datatype: "date",
@@ -377,16 +413,6 @@ const OperatorList = () => {
                     },
                 ],
             },
-            {
-                accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
-                header: "تاریخ ثبت",
-                id: "created_at",
-                enableColumnFilter: true,
-                datatype: "date",
-                filterMode: "between",
-                grow: false,
-                size: 100,
-            },
             {
                 header: "وضعیت",
                 id: "step",

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

@@ -1,16 +1,26 @@
-import { Box } from "@mui/material";
-import DeleteForm from "./DeleteDialog";
-import StepTwo from "../Form/StepTwo";
-import StepThree from "../Form/StepThree";
 import { usePermissions } from "@/lib/hooks/usePermissions";
+import { Box } from "@mui/material";
+import EditAxisType from "../Form/EditAxisType";
+import StepThree from "../Form/StepThree";
+import StepTwo from "../Form/StepTwo";
+import DeleteForm from "./DeleteDialog";
 
 const RowActions = ({ row, mutate }) => {
     const { data: userPermissions } = usePermissions();
     const hasDeletePermission = userPermissions?.includes("delete-safety-and-privacy");
+    const hasUpdatePermission = userPermissions?.includes("update-safety-and-privacy");
+    const hasEdarateShahriPermission = userPermissions?.includes(
+        "show-safety-and-privacy-operator-cartable-edarate-shahri"
+    );
     return (
         <Box sx={{ display: "flex", gap: 1 }}>
-            {row.original?.step === 1 && <StepTwo mutate={mutate} rowId={row.getValue("id")} />}
+            {hasUpdatePermission && row.original?.axis_type_id == null && <EditAxisType mutate={mutate} row={row} />}
-            {row.original?.step === 2 && <StepThree mutate={mutate} rowId={row.getValue("id")} />}
+            {hasEdarateShahriPermission && (
+                <>
+                    {row.original?.step === 1 && <StepTwo mutate={mutate} rowId={row.getValue("id")} />}
+                    {row.original?.step === 2 && <StepThree mutate={mutate} rowId={row.getValue("id")} />}
+                </>
+            )}
             {hasDeletePermission && <DeleteForm rowId={row.getValue("id")} mutate={mutate} />}
         </Box>
     );

src/components/dashboard/roadSafety/report/Search/SearchReportField.jsx

@@ -5,14 +5,15 @@ import FromDateController from "./FromDateController";
 import ToDateController from "./ToDateController";
 import SelectProvince from "./SelectProvince";
 import { Controller } from "react-hook-form";
+import SelectAxisType from "./SelectAxisType";
 
 const SearchReportField = ({ control, hasProvincesPermission }) => {
     return (
         <Grid container spacing={2} sx={{ py: 2 }}>
-            <Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
+            <Grid item xs={12} md={hasProvincesPermission ? 2 : 3}>
                 <FromDateController control={control} />
             </Grid>
-            <Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
+            <Grid item xs={12} md={hasProvincesPermission ? 2 : 3}>
                 <ToDateController control={control} />
             </Grid>
             {hasProvincesPermission && (
@@ -20,7 +21,10 @@ const SearchReportField = ({ control, hasProvincesPermission }) => {
                     <SelectProvince control={control} />
                 </Grid>
             )}
-            <Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
+            <Grid item xs={12} md={hasProvincesPermission ? 2 : 3}>
+                <SelectAxisType control={control} />
+            </Grid>
+            <Grid item xs={12} md={hasProvincesPermission ? 3 : 3}>
                 <Controller
                     name="submitButton"
                     control={control}

src/components/dashboard/roadSafety/report/Search/SelectAxisType.jsx

@@ -0,0 +1,45 @@
+import { FormControl, FormHelperText, InputLabel, MenuItem, Select } from "@mui/material";
+import { Controller } from "react-hook-form";
+
+const axisOptions = [
+    { value: 1, label: "آزادراه" },
+    { value: 2, label: "بزرگراه" },
+    { value: 3, label: "اصلی" },
+    { value: 4, label: "فرعی" },
+    { value: 5, label: "روستایی" },
+];
+
+const SelectAxisType = ({ control }) => {
+    return (
+        <Controller
+            name="axis_type_id"
+            control={control}
+            render={({ field, fieldState: { error } }) => (
+                <FormControl error={!!error} size="small" fullWidth>
+                    <InputLabel id="axis_type_id_label">نوع محور</InputLabel>
+                    <Select
+                        {...field}
+                        labelId="axis_type_id_label"
+                        id="axis_type_id"
+                        value={field.value || ""}
+                        label="نوع محور"
+                        onChange={field.onChange}
+                    >
+                        {[
+                            <MenuItem key="-1" value={"-1"}>
+                                همه محور ها
+                            </MenuItem>,
+                            ...axisOptions.map((axisOption, index) => (
+                                <MenuItem key={index} value={axisOption.value}>
+                                    {axisOption.label}
+                                </MenuItem>
+                            )),
+                        ]}
+                    </Select>
+                    {error && <FormHelperText>{error.message}</FormHelperText>}
+                </FormControl>
+            )}
+        />
+    );
+};
+export default SelectAxisType;

src/components/dashboard/roadSafety/report/Search/SelectProvince.jsx

@@ -1,8 +1,6 @@
-import { Controller } from "react-hook-form";
-import MuiDatePicker from "@/core/components/MuiDatePicker";
-import React from "react";
-import { FormControl, FormHelperText, InputLabel, LinearProgress, MenuItem, Select, Typography } from "@mui/material";
 import useProvinces from "@/lib/hooks/useProvince";
+import { FormControl, FormHelperText, InputLabel, MenuItem, Select } from "@mui/material";
+import { Controller } from "react-hook-form";
 
 const SelectProvince = ({ control }) => {
     const { provinces, loadingProvinces, errorProvinces } = useProvinces();

src/components/dashboard/roadSafety/report/index.jsx

@@ -18,20 +18,17 @@ const ReportPage = () => {
     const { data: userPermissions } = usePermissions();
     const { user } = useAuth();
     const requestServer = useRequest();
-    const hasProvincesPermission = userPermissions.some((item) =>
+    const hasProvincesPermission = userPermissions.includes("show-safety-and-privacy-operator-cartable");
-        [
-            "show-safety-and-privacy-operator-cartable-province",
-            "show-safety-and-privacy-operator-cartable-edarate-shahri",
-        ].includes(item)
-    );
 
     const defaultValues = {
         from_date: moment(new Date()).format("YYYY-MM-DD"),
         date_to: moment(new Date()).format("YYYY-MM-DD"),
         province_id: hasProvincesPermission ? "-1" : user.province_id,
+        axis_type_id: "-1",
     };
     const defaultFilter = [
         { value: `${defaultValues.province_id}`, datatype: "numeric", id: "province_id", fn: "equals" },
+        { value: `${defaultValues.axis_type_id}`, datatype: "numeric", id: "axis_type_id", fn: "equals" },
         { value: `${defaultValues.from_date}`, datatype: "date", id: "from_date", fn: "between" },
         { value: `${defaultValues.date_to}`, datatype: "date", id: "date_to", fn: "between" },
     ];
@@ -41,8 +38,11 @@ const ReportPage = () => {
         const params = new URLSearchParams();
         params.set("from_date", `${data.from_date}`);
         params.set("date_to", `${data.date_to}`);
+        if (data.axis_type_id != "-1") params.set("axis_type_id", `${data.axis_type_id}`);
+
         setSpecialFilter([
             { value: `${data.province_id}`, datatype: "numeric", id: "province_id", fn: "equals" },
+            { value: `${data.axis_type_id}`, datatype: "numeric", id: "axis_type_id", fn: "equals" },
             { value: `${data.from_date}`, datatype: "date", id: "from_date", fn: "between" },
             { value: `${data.date_to}`, datatype: "date", id: "date_to", fn: "between" },
         ]);
@@ -118,6 +118,7 @@ const ReportPage = () => {
             .matches(/^\d{4}-\d{2}-\d{2}$/, "تاریخ ثبت الزامی است!")
             .test("is-valid-date", "تاریخ ثبت معتبر نیست!", (value) => moment(value, "YYYY-MM-DD", true).isValid()),
         province_id: yup.string().nullable(),
+        axis_type_id: yup.string().nullable(),
     });
 
     const { control, handleSubmit } = useForm({

src/core/utils/pageMenu.js

@@ -494,7 +494,7 @@ export const pageMenu = [
         type: "page",
         route: "/dashboard/permissions",
         icon: <LockPersonIcon sx={{ width: "inherit", height: "inherit" }} />,
-        permissions: ["show-permissions-page"],
+        permissions: ["manage-permissions"],
     },
     {
         id: "userActivities",
@@ -502,7 +502,7 @@ export const pageMenu = [
         type: "page",
         route: "/dashboard/user-activities",
         icon: <AssignmentLateIcon sx={{ width: "inherit", height: "inherit" }} />,
-        permissions: ["show-user-activities-page"],
+        permissions: ["manage-log-list"],
     },
     {
         id: "CarDetails",

src/core/utils/routes.js

@@ -136,6 +136,7 @@ export const GET_SAFETY_AND_PRIVACY_ITEM = api + "/api/v3/safety_and_privacy/sub
 export const FIRST_STEP_STORE = api + "/api/v3/safety_and_privacy/first_step_store";
 export const SECOND_STEP_STORE = api + "/api/v3/safety_and_privacy/second_step_store";
 export const THIRD_STEP_STORE = api + "/api/v3/safety_and_privacy/third_step_store";
+export const UPDATE_SAFETY_AND_PRIVACY = api + "/api/v3/safety_and_privacy";
 export const EXPORT_OPERATOR_ROAD_SAFETY = api + "/api/v3/safety_and_privacy/excel_report";
 export const GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT = api + "/api/v3/safety_and_privacy_report/country_activity";
 export const GET_ROAD_SAFETY_CITY_ACTIVITY_REPORT = api + "/api/v3/safety_and_privacy_report/province_activity";