Resolve #86c2grd6k "Feature/road safety edit"

This commit is contained in:
AmirHossein Mahmoodi
2025-03-15 08:08:57 +00:00
parent 6dbdb07dc7
commit a3f1096dbd
15 changed files with 276 additions and 44 deletions

View File

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

View File

@@ -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>
);

View File

@@ -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;

View File

@@ -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;

View File

@@ -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;

View File

@@ -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" }}>

View File

@@ -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: "بزرگراه" },

View File

@@ -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",

View File

@@ -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")} />}
{row.original?.step === 2 && <StepThree mutate={mutate} rowId={row.getValue("id")} />}
{hasUpdatePermission && row.original?.axis_type_id == null && <EditAxisType mutate={mutate} row={row} />}
{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>
);

View File

@@ -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}

View File

@@ -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;

View File

@@ -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();

View File

@@ -18,20 +18,17 @@ const ReportPage = () => {
const { data: userPermissions } = usePermissions();
const { user } = useAuth();
const requestServer = useRequest();
const hasProvincesPermission = userPermissions.some((item) =>
[
"show-safety-and-privacy-operator-cartable-province",
"show-safety-and-privacy-operator-cartable-edarate-shahri",
].includes(item)
);
const hasProvincesPermission = userPermissions.includes("show-safety-and-privacy-operator-cartable");
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({

View File

@@ -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",

View File

@@ -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";