Merge branch 'release/v1.0.0'
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
HOST="rms.witel.ir"
|
||||
NEXT_PUBLIC_VERSION="0.18.0"
|
||||
NEXT_PUBLIC_VERSION="1.0.0"
|
||||
NEXT_PUBLIC_API_URL="https://rms.witel.ir"
|
||||
NEXT_PUBLIC_MAPTILE_ENDPOINT="https://rmsmap.rmto.ir/141map"
|
||||
@@ -0,0 +1,9 @@
|
||||
import RoadSafetyReportMap from "@/components/dashboard/roadSafety/reports/map";
|
||||
export const metadata = {
|
||||
title: "پراکندگی بر روی نقشه نگهداری حریم",
|
||||
};
|
||||
|
||||
const Page = () => {
|
||||
return <RoadSafetyReportMap />;
|
||||
};
|
||||
export default Page;
|
||||
@@ -1,4 +1,4 @@
|
||||
import ReportPage from "@/components/dashboard/roadSafety/report";
|
||||
import ReportPage from "@/components/dashboard/roadSafety/reports/reportPage";
|
||||
import WithPermission from "@/core/middlewares/withPermission";
|
||||
export const metadata = {
|
||||
title: "کارتابل گزارش نگهداری حریم",
|
||||
13
src/app/(withAuth)/infrastructure/layout.js
Normal file
13
src/app/(withAuth)/infrastructure/layout.js
Normal file
@@ -0,0 +1,13 @@
|
||||
import HeaderWithLogo from "@/components/layouts/dashboard/headerWithLogo";
|
||||
import HeaderWithSidebar from "@/components/layouts/dashboard/headerWithSidebar";
|
||||
import { Stack } from "@mui/material";
|
||||
|
||||
const Layout = ({ children }) => {
|
||||
return (
|
||||
<Stack sx={{ width: "100%", height: "100%" }}>
|
||||
<HeaderWithLogo />
|
||||
<HeaderWithSidebar>{children}</HeaderWithSidebar>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default Layout;
|
||||
7
src/app/(withAuth)/infrastructure/toll-house/loading.jsx
Normal file
7
src/app/(withAuth)/infrastructure/toll-house/loading.jsx
Normal file
@@ -0,0 +1,7 @@
|
||||
"use client";
|
||||
import PageLoading from "@/core/components/PageLoading";
|
||||
|
||||
const Loading = () => {
|
||||
return <PageLoading />;
|
||||
};
|
||||
export default Loading;
|
||||
16
src/app/(withAuth)/infrastructure/toll-house/page.js
Normal file
16
src/app/(withAuth)/infrastructure/toll-house/page.js
Normal file
@@ -0,0 +1,16 @@
|
||||
import WithPermission from "@/core/middlewares/withPermission";
|
||||
import TollHousePage from "@/components/infrastructure/tollHouse";
|
||||
|
||||
export const metadata = {
|
||||
title: "فهرست راهدارخانه ها",
|
||||
};
|
||||
|
||||
const Page = () => {
|
||||
return (
|
||||
<WithPermission permission_name={["show-tollhouse", "show-tollhouse-province"]}>
|
||||
<TollHousePage />
|
||||
</WithPermission>
|
||||
);
|
||||
};
|
||||
|
||||
export default Page;
|
||||
@@ -91,7 +91,7 @@ const CandUAzmayesh = ({ setOpen, mutate, updateInfo, rowId }) => {
|
||||
handleSubmit,
|
||||
setValue,
|
||||
formState: { isSubmitting, errors },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -68,7 +68,7 @@ const FormAndRequest = ({ setOpen, mutate, rowId, updateInfo }) => {
|
||||
setValue,
|
||||
watch,
|
||||
formState: { errors, isSubmitting },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const { fields, append, remove } = useFieldArray({
|
||||
control,
|
||||
|
||||
@@ -30,7 +30,7 @@ const CreateFormContent = ({ setOpen, mutate }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
|
||||
@@ -30,7 +30,7 @@ const EditFormContent = ({ row, rowId, mutate, setOpen }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import SelectBox from "@/core/components/SelectBox";
|
||||
import useEdaratLists from "@/lib/hooks/useEdaratLists";
|
||||
import useCities from "@/lib/hooks/useCities";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
const CityContent = ({ provinceID, field, fieldState: { error } }) => {
|
||||
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(provinceID);
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(provinceID);
|
||||
const [prevDependency, setPrevDependency] = useState(provinceID);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -15,22 +15,16 @@ const CityContent = ({ provinceID, field, fieldState: { error } }) => {
|
||||
return (
|
||||
<SelectBox
|
||||
value={
|
||||
!provinceID
|
||||
? "dependency"
|
||||
: errorEdaratList
|
||||
? "error"
|
||||
: loadingEdaratList
|
||||
? "loading"
|
||||
: field.value || ""
|
||||
!provinceID ? "dependency" : errorCityList ? "error" : loadingCityList ? "loading" : field.value || ""
|
||||
}
|
||||
label={"شهرستان"}
|
||||
selectors={edaratList}
|
||||
selectors={cityList}
|
||||
schema={{ name: "name_fa", value: "id" }}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
helperText={error?.message}
|
||||
isLoading={loadingEdaratList}
|
||||
errorEcured={errorEdaratList}
|
||||
isLoading={loadingCityList}
|
||||
errorEcured={errorCityList}
|
||||
isDependency={!provinceID}
|
||||
dependencyLabel={"ابتدا استان را انتخاب کنید"}
|
||||
/>
|
||||
|
||||
@@ -49,7 +49,7 @@ const DamageItem = ({ baseOnChange, baseDamageItems }) => {
|
||||
const { control, handleSubmit, reset, setValue } = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(schema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const deleteDamageItem = (id) => {
|
||||
setSelectedDamageItemList((prev) => prev.filter((DamageItem) => DamageItem.id !== id));
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
"use client";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { Box, Stack, Typography } from "@mui/material";
|
||||
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
|
||||
import Toolbar from "./Toolbar";
|
||||
import { GET_TECHNICAL_DAMAGE_OPERATOR_LIST } from "@/core/utils/routes";
|
||||
import moment from "jalali-moment";
|
||||
import RowActions from "./RowActions";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
|
||||
import useEdaratLists from "@/lib/hooks/useEdaratLists";
|
||||
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
|
||||
import { GET_TECHNICAL_DAMAGE_OPERATOR_LIST } from "@/core/utils/routes";
|
||||
import useCities from "@/lib/hooks/useCities";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import { Box, Stack, Typography } from "@mui/material";
|
||||
import moment from "jalali-moment";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import RowActions from "./RowActions";
|
||||
import DamageItemDialog from "./RowActions/DamageItemDialog";
|
||||
import DamageReportDialog from "./RowActions/DamageReport";
|
||||
import ImageDialog from "./RowActions/ImageDialog";
|
||||
import LocationForm from "./RowActions/LocationForm";
|
||||
import ShowPlate from "./RowActions/ShowPlate";
|
||||
import DamageItemDialog from "./RowActions/DamageItemDialog";
|
||||
import DamageReportDialog from "./RowActions/DamageReport";
|
||||
import Toolbar from "./Toolbar";
|
||||
|
||||
const OperatorList = () => {
|
||||
const statusOptions = [
|
||||
@@ -94,7 +94,7 @@ const OperatorList = () => {
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
@@ -103,20 +103,20 @@ const OperatorList = () => {
|
||||
if (props.dependencyFieldValue.value === "") {
|
||||
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
|
||||
}
|
||||
if (loadingEdaratList) {
|
||||
if (loadingCityList) {
|
||||
return [{ value: "loading", label: "در حال بارگذاری..." }];
|
||||
}
|
||||
if (errorEdaratList) {
|
||||
if (errorCityList) {
|
||||
return [{ value: "error", label: "خطا در بارگذاری" }];
|
||||
}
|
||||
return [
|
||||
{ value: "", label: "کل شهر ها" },
|
||||
...edaratList.map((edare) => ({
|
||||
value: edare.id,
|
||||
label: edare.name_fa,
|
||||
...cityList.map((city) => ({
|
||||
value: city.id,
|
||||
label: city.name_fa,
|
||||
})),
|
||||
];
|
||||
}, [edaratList, loadingEdaratList, errorEdaratList]);
|
||||
}, [cityList, loadingCityList, errorCityList]);
|
||||
useEffect(() => {
|
||||
if (prevDependency === props.dependencyFieldValue?.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
@@ -128,7 +128,7 @@ const OperatorList = () => {
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingEdaratList
|
||||
: loadingCityList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
|
||||
@@ -82,10 +82,10 @@ const DamagesReportPage = () => {
|
||||
setData({
|
||||
data: [
|
||||
nationalReport,
|
||||
...result.cities.map((edare) => {
|
||||
const filteredReports = result.activities.find((report) => report.city_id == edare.id);
|
||||
...result.cities.map((city) => {
|
||||
const filteredReports = result.activities.find((report) => report.city_id == city.id);
|
||||
return {
|
||||
edare_name: edare.name_fa,
|
||||
edare_name: city.name_fa,
|
||||
...filteredReports,
|
||||
};
|
||||
}),
|
||||
@@ -118,7 +118,7 @@ const DamagesReportPage = () => {
|
||||
const { control, handleSubmit } = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
return (
|
||||
|
||||
@@ -237,10 +237,7 @@ const ComplaintListTable = ({ open, setOpen, mutate }) => {
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
moment(row.StartTime_DateTime, "M/D/YYYY h:mm:ss A")
|
||||
.locale("fa")
|
||||
.format("HH:mm | yyyy/MM/DD"),
|
||||
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "StartTime_DateTime",
|
||||
enableColumnFilter: false,
|
||||
|
||||
@@ -42,7 +42,7 @@ const RegisterActionContent = ({ setOpen, defaultValues, onBaseSubmit }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onChange",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
|
||||
@@ -29,6 +29,7 @@ const RegisterAction = ({ rowId, mutate, mutateParentTable }) => {
|
||||
}
|
||||
await requestServer(`${REGISTER_COMPLAINTS_LIST}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((res) => {
|
||||
mutate();
|
||||
|
||||
@@ -28,7 +28,7 @@ const ReferContent = ({ rowId, mutate, setOpenReferDialog }) => {
|
||||
description: "",
|
||||
},
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
@@ -38,6 +38,7 @@ const ReferContent = ({ rowId, mutate, setOpenReferDialog }) => {
|
||||
formData.append("refer_description", data.description);
|
||||
await requestServer(`${REFER_FAST_REACT}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -47,6 +47,7 @@ const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
|
||||
|
||||
await requestServer(`${UPDATE_FAST_REACT}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -149,10 +149,7 @@ const OperatorList = () => {
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
moment(row.StartTime_DateTime, "M/D/YYYY h:mm:ss A")
|
||||
.locale("fa")
|
||||
.format("HH:mm | yyyy/MM/DD"),
|
||||
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "StartTime_DateTime",
|
||||
enableColumnFilter: false,
|
||||
|
||||
@@ -22,6 +22,7 @@ const ConfirmContent = ({ rowId, mutate, setOpenConfirmDialog }) => {
|
||||
formData.append("verify", 1);
|
||||
requestServer(`${VERIFY_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -22,7 +22,7 @@ const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
|
||||
description: "",
|
||||
},
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
@@ -31,6 +31,7 @@ const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
|
||||
formData.append("verify", 2);
|
||||
requestServer(`${REJECT_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -8,7 +8,7 @@ const RestoreContent = ({ rowId, mutate, setOpenRestoreDialog }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const handleClick = () => {
|
||||
setSubmitting(true);
|
||||
requestServer(`${RESTORE_FAST_REACT}/${rowId}`, "post")
|
||||
requestServer(`${RESTORE_FAST_REACT}/${rowId}`, "post", { hasSidebarUpdate: true })
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenRestoreDialog(false);
|
||||
|
||||
@@ -250,10 +250,7 @@ const SupervisorList = () => {
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
moment(row.StartTime_DateTime, "M/D/YYYY h:mm:ss A")
|
||||
.locale("fa")
|
||||
.format("HH:mm | yyyy/MM/DD"),
|
||||
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
header: "تاریخ ثبت",
|
||||
id: "StartTime_DateTime",
|
||||
enableColumnFilter: false,
|
||||
|
||||
@@ -46,7 +46,7 @@ const RoadSafetyFormContext = ({ rowId, mutate, setOpenRoadSafetyForm }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
formData.append("description", data.description);
|
||||
|
||||
@@ -48,7 +48,7 @@ const DetailDialog = ({ taskModal, setTaskModal, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -37,7 +37,7 @@ const ReferFormContext = ({ setOpenReferDialog, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -57,7 +57,7 @@ const DetailDialog = ({ taskModal, setTaskModal, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -46,7 +46,7 @@ const RoadSafetyFormContext = ({ rowId, mutate, setOpenRoadSafetyForm }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
formData.append("description", data.description);
|
||||
|
||||
@@ -48,7 +48,7 @@ const DetailDialog = ({ taskModal, setTaskModal, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -37,7 +37,7 @@ const ReferFormContext = ({ setOpenReferDialog, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -46,7 +46,7 @@ const RoadSafetyFormContext = ({ rowId, mutate, setOpenRoadSafetyForm }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
formData.append("description", data.description);
|
||||
|
||||
@@ -48,7 +48,7 @@ const DetailDialog = ({ taskModal, setTaskModal, rowId, mutate }) => {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors, touchedFields },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -30,7 +30,7 @@ const CreateFormContent = ({ setOpen, defaultValues, onSubmitBase }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const handleOnSubmit = async (data) => {
|
||||
await onSubmitBase(data);
|
||||
|
||||
@@ -164,7 +164,7 @@ const CreateFormContent = ({ setOpen, onSubmit, is_gasht = false }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
context: { subItemsList, is_gasht },
|
||||
});
|
||||
const onSubmitBase = async (data) => {
|
||||
|
||||
@@ -14,6 +14,7 @@ const OperatorCreateForm = ({ open, setOpen, mutate }) => {
|
||||
}
|
||||
await requestServer(CREATE_ROAD_ITEMS, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
|
||||
@@ -79,7 +79,7 @@ const GashtCreateContent = ({ mutate, setOpen, tabState, setTabState }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const onSearchSubmit = async (data) => {
|
||||
setSpecialFilter([
|
||||
|
||||
@@ -89,7 +89,7 @@ const CompleteItem = ({ subItem, itemInfo, setSubmitCompleteForm, mutate, setOpe
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
context: { subItem },
|
||||
});
|
||||
|
||||
@@ -117,6 +117,7 @@ const CompleteItem = ({ subItem, itemInfo, setSubmitCompleteForm, mutate, setOpe
|
||||
|
||||
await requestServer(CREATE_ROAD_ITEMS, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
|
||||
@@ -69,14 +69,11 @@ const EditController = ({ rowId, mutate, setOpenEditDialog, openEditDialog, row
|
||||
for (const [key, value] of Object.entries(result)) {
|
||||
formData.append(key, value);
|
||||
}
|
||||
await requestServer(
|
||||
`${UPDATE_ROAD_ITEMS}/${rowId}`,
|
||||
"post",
|
||||
{
|
||||
data: formData,
|
||||
},
|
||||
{ notificationSuccess: true }
|
||||
)
|
||||
await requestServer(`${UPDATE_ROAD_ITEMS}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
notificationSuccess: true,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
setOpenEditDialog(false);
|
||||
|
||||
@@ -78,7 +78,7 @@ const EditFormCreate = ({ defaultData, subItem, onSubmitBase, defaultValues, set
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
context: { subItem, is_gasht },
|
||||
});
|
||||
|
||||
|
||||
@@ -153,7 +153,7 @@ const ReportPage = () => {
|
||||
const { control, handleSubmit } = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
|
||||
@@ -59,7 +59,7 @@ const FilterDrawer = ({ defaultValues, setFilterData, closeDrawer }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = (data) => {
|
||||
|
||||
@@ -238,7 +238,7 @@ const SubItemsReports = () => {
|
||||
const { control, handleSubmit } = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
|
||||
@@ -23,6 +23,7 @@ const ConfirmContent = ({ rowId, mutate, setOpenConfirmDialog }) => {
|
||||
formData.append("verify", 1);
|
||||
requestServer(`${VERIFY_BY_SUPERVISOR}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -8,7 +8,9 @@ const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const handleClick = () => {
|
||||
setSubmitting(true);
|
||||
requestServer(`${DELETE_BY_SUPERVISOR}/${rowId}`, "post")
|
||||
requestServer(`${DELETE_BY_SUPERVISOR}/${rowId}`, "post", {
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenDeleteDialog(false);
|
||||
|
||||
@@ -22,7 +22,7 @@ const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
|
||||
description: "",
|
||||
},
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
@@ -31,6 +31,7 @@ const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
|
||||
formData.append("verify", 2);
|
||||
await requestServer(`${REJECT_BY_SUPERVISOR}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
|
||||
@@ -8,7 +8,9 @@ const RestoreContent = ({ rowId, mutate, setOpenRestoreDialog }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const handleClick = () => {
|
||||
setSubmitting(true);
|
||||
requestServer(`${RESTORE_BY_SUPERVISOR}/${rowId}`, "post")
|
||||
requestServer(`${RESTORE_BY_SUPERVISOR}/${rowId}`, "post", {
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenRestoreDialog(false);
|
||||
|
||||
@@ -63,14 +63,14 @@ const CompeleteRequest = ({ allData, handlePrev, mutate, setOpen }) => {
|
||||
handleSubmit: handleSubmitOtp,
|
||||
register: registerOtp,
|
||||
formState: { isSubmitting: isSubmittingOtp, isValid: isValidOtp },
|
||||
} = useForm({ defaultValues: defaultValuesOtp, resolver: yupResolver(schemaOtp), mode: "onBlur" });
|
||||
} = useForm({ defaultValues: defaultValuesOtp, resolver: yupResolver(schemaOtp), mode: "all" });
|
||||
|
||||
const {
|
||||
handleSubmit: handleSubmitSend,
|
||||
setValue: setValueSend,
|
||||
register: registerSend,
|
||||
formState: { isSubmitting: isSubmittingSend, isValid: isValidSend },
|
||||
} = useForm({ defaultValues: defaultValuesSend, resolver: yupResolver(schemaSend), mode: "onBlur" });
|
||||
} = useForm({ defaultValues: defaultValuesSend, resolver: yupResolver(schemaSend), mode: "all" });
|
||||
|
||||
useEffect(() => {
|
||||
if (counter === 0) {
|
||||
|
||||
@@ -91,7 +91,7 @@ const CreateFormContentObservedItem = ({ setOpen, onSubmit }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
context: { subItemsList },
|
||||
});
|
||||
const onSubmitBase = async (data) => {
|
||||
|
||||
@@ -46,7 +46,7 @@ const PatrolDetail = ({ allData, setAllData, handlePrev, setTabState }) => {
|
||||
handleSubmit,
|
||||
setValue,
|
||||
formState: { isSubmitting, isValid },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(schema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(schema), mode: "all" });
|
||||
|
||||
const requestPatrolInfo = async (data) => {
|
||||
setPatrolResultStatus(1);
|
||||
|
||||
@@ -27,7 +27,7 @@ const SuperVisorsDetail = ({ allData, setAllData, handlePrev, setTabState }) =>
|
||||
reset,
|
||||
setValue,
|
||||
formState: { isSubmitting, isValid },
|
||||
} = useForm({ defaultValues, resolver: yupResolver(schema), mode: "onBlur" });
|
||||
} = useForm({ defaultValues, resolver: yupResolver(schema), mode: "all" });
|
||||
|
||||
const requestPatrolInfo = (data) => {
|
||||
setSuperVisorList((prev) => [...prev, data.road_patrol_rahdaran_id]);
|
||||
|
||||
@@ -116,7 +116,7 @@ const ReportPage = () => {
|
||||
const { control, handleSubmit } = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
|
||||
@@ -30,7 +30,7 @@ const EditFormContent = ({ setOpen, mutate, row }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const onSubmitBase = async (data) => {
|
||||
const formData = new FormData();
|
||||
|
||||
@@ -77,7 +77,7 @@ const CreateFormContent = ({ setOpen, mutate }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const onSubmitBase = async (data) => {
|
||||
const startPoint = `${data.start_point.lat},${data.start_point.lng}`;
|
||||
@@ -90,6 +90,7 @@ const CreateFormContent = ({ setOpen, mutate }) => {
|
||||
formData.append("point", startPoint);
|
||||
await requestServer(FIRST_STEP_STORE, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
|
||||
@@ -2,33 +2,42 @@ import { Button, DialogActions, DialogContent, Stack } from "@mui/material";
|
||||
import { Controller, useForm } from "react-hook-form";
|
||||
import { yupResolver } from "@hookform/resolvers/yup";
|
||||
import StyledForm from "@/core/components/StyledForm";
|
||||
import { mixed, object } from "yup";
|
||||
import { mixed, object, string } from "yup";
|
||||
import ImageUpload from "./ImageUpload";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { THIRD_STEP_STORE } from "@/core/utils/routes";
|
||||
import MuiDatePicker from "@/core/components/MuiDatePicker";
|
||||
import MuiTimePicker from "@/core/components/MuiTimePicker";
|
||||
import { format } from "date-fns";
|
||||
|
||||
const StepThreeContent = ({ setOpen, mutate, rowId }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const defaultValues = {
|
||||
action_date: "",
|
||||
action_time: "",
|
||||
action_picture: null,
|
||||
};
|
||||
const validationSchema = object({
|
||||
action_date: string().required("لطفا تاریخ اقدام را انتخاب کنید!"),
|
||||
action_time: string().required("لطفا ساعت اقدام را انتخاب کنید!"),
|
||||
action_picture: mixed().nullable().required("لطفا عکس اقدام را بارگذاری کنید!"),
|
||||
});
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting, errors },
|
||||
formState: { isSubmitting },
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const onSubmit = async (data) => {
|
||||
const formData = new FormData();
|
||||
formData.append("action_date", `${data.action_date} ${format(new Date(data.action_time), "HH:mm")}`);
|
||||
formData.append("action_picture", data.action_picture);
|
||||
await requestServer(`${THIRD_STEP_STORE}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
@@ -40,6 +49,42 @@ const StepThreeContent = ({ setOpen, mutate, rowId }) => {
|
||||
<StyledForm onSubmit={handleSubmit(onSubmit)}>
|
||||
<DialogContent dividers>
|
||||
<Stack spacing={2}>
|
||||
<Stack direction={"row"} spacing={2} justifyContent={"space-between"}>
|
||||
<Controller
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<MuiDatePicker
|
||||
name="action_date"
|
||||
error={error}
|
||||
value={field.value}
|
||||
placeholder={"تاریخ اقدام را وارد کنید"}
|
||||
label={"تاریخ اقدام"}
|
||||
setFieldValue={(name, value) => field.onChange(value || [])}
|
||||
helperText={error ? error.message : null}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
name={"action_date"}
|
||||
/>
|
||||
<Controller
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<MuiTimePicker
|
||||
name="action_time"
|
||||
error={error}
|
||||
value={field.value}
|
||||
placeholder={"زمان اقدام را وارد کنید"}
|
||||
label={"زمان اقدام"}
|
||||
setFieldValue={(name, value) => field.onChange(value || null)}
|
||||
helperText={error ? error.message : null}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
name={"action_time"}
|
||||
/>
|
||||
</Stack>
|
||||
<Controller
|
||||
name="action_picture"
|
||||
control={control}
|
||||
@@ -60,7 +105,7 @@ const StepThreeContent = ({ setOpen, mutate, rowId }) => {
|
||||
بستن
|
||||
</Button>
|
||||
<Button type={"submit"} variant={"contained"} color={"primary"} disabled={isSubmitting}>
|
||||
{isSubmitting ? "درحال ثبت تصویر اقدام" : "ثبت تصویر اقدام"}
|
||||
{isSubmitting ? "درحال ثبت اقدام" : "ثبت اقدام"}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</StyledForm>
|
||||
|
||||
@@ -6,7 +6,7 @@ const StepThree = ({ mutate, rowId }) => {
|
||||
const [open, setOpen] = useState(false);
|
||||
return (
|
||||
<>
|
||||
<Tooltip title="بارگذاری تصویر اقدام">
|
||||
<Tooltip title="ثبت اقدام">
|
||||
<IconButton color="primary" onClick={() => setOpen(true)}>
|
||||
<AddPhotoAlternateIcon />
|
||||
</IconButton>
|
||||
@@ -20,10 +20,10 @@ const StepThree = ({ mutate, rowId }) => {
|
||||
},
|
||||
}}
|
||||
dir="rtl"
|
||||
maxWidth={"sm"}
|
||||
maxWidth={"xs"}
|
||||
fullWidth
|
||||
>
|
||||
<DialogTitle>بارگذاری تصویر اقدام</DialogTitle>
|
||||
<DialogTitle>ثبت اقدام</DialogTitle>
|
||||
<StepThreeContent setOpen={setOpen} mutate={mutate} rowId={rowId} />
|
||||
</Dialog>
|
||||
</>
|
||||
|
||||
@@ -27,7 +27,7 @@ const StepTwoContent = ({ setOpenStepTwoDialog, mutate, rowId }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
|
||||
const handleCreateDamage = (files) => {
|
||||
@@ -48,6 +48,7 @@ const StepTwoContent = ({ setOpenStepTwoDialog, mutate, rowId }) => {
|
||||
data.judiciary_document.map((item, index) => formData.append(`judiciary_document[${index}]`, item));
|
||||
await requestServer(`${SECOND_STEP_STORE}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then((response) => {
|
||||
mutate();
|
||||
|
||||
@@ -19,7 +19,8 @@ import useSafetyAndPrivacyGetItems from "@/lib/hooks/useSafetyAndPrivacyGetItems
|
||||
|
||||
const OperatorList = () => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasCountryPermission = userPermissions?.includes("show-fast-react");
|
||||
const hasCountryPermission = userPermissions?.includes("show-safety-and-privacy-operator-cartable");
|
||||
const hasProvincePermission = userPermissions?.includes("show-safety-and-privacy-operator-cartable-province");
|
||||
const { user } = useAuth();
|
||||
const statusOptions = [
|
||||
{ value: "", label: "همه وضعیت ها" },
|
||||
@@ -37,7 +38,7 @@ const OperatorList = () => {
|
||||
];
|
||||
|
||||
const columns = useMemo(() => {
|
||||
const dynamicColumns = {
|
||||
const ProvinceColumn = {
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
enableColumnFilter: true,
|
||||
@@ -72,6 +73,63 @@ const OperatorList = () => {
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.province_fa}</>,
|
||||
};
|
||||
const EdareShahriColumn = {
|
||||
header: "اداره",
|
||||
id: "edare_shahri_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: hasCountryPermission ? "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.edare_shahri_name}</>,
|
||||
};
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
@@ -85,64 +143,9 @@ const OperatorList = () => {
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
...(hasCountryPermission ? [dynamicColumns] : []),
|
||||
{
|
||||
header: "اداره",
|
||||
id: "edare_shahri_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: hasCountryPermission ? "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
|
||||
);
|
||||
...(hasCountryPermission ? [ProvinceColumn] : []),
|
||||
...(hasProvincePermission ? [EdareShahriColumn] : []),
|
||||
|
||||
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.edare_shahri_name}</>,
|
||||
},
|
||||
{
|
||||
header: "اطلاعات فعالیت",
|
||||
id: "info",
|
||||
@@ -246,6 +249,23 @@ const OperatorList = () => {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
header: "وضعیت",
|
||||
id: "step",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return statusOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.step_fa}</>,
|
||||
},
|
||||
{
|
||||
header: "گام اول (شناسایی)",
|
||||
id: "stepOne",
|
||||
@@ -396,15 +416,13 @@ const OperatorList = () => {
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
row.action_picture_document_upload_date ? (
|
||||
moment(row.action_picture_document_upload_date)
|
||||
.locale("fa")
|
||||
.format("HH:mm | yyyy/MM/DD")
|
||||
row.action_date ? (
|
||||
moment(row.action_date).locale("fa").format("HH:mm | yyyy/MM/DD")
|
||||
) : (
|
||||
<>-</>
|
||||
),
|
||||
header: "تاریخ ثبت اقدام",
|
||||
id: "action_picture_document_upload_date",
|
||||
header: "تاریخ اقدام",
|
||||
id: "action_date",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterMode: "between",
|
||||
@@ -413,23 +431,6 @@ const OperatorList = () => {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
header: "وضعیت",
|
||||
id: "step",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: true,
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return statusOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.step_fa}</>,
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
|
||||
|
||||
@@ -8,7 +8,9 @@ const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const handleClick = () => {
|
||||
setSubmitting(true);
|
||||
requestServer(`${DELETE_SAFETY_AND_PRIVACY}/${rowId}`, "delete")
|
||||
requestServer(`${DELETE_SAFETY_AND_PRIVACY}/${rowId}`, "delete", {
|
||||
hasSidebarUpdate: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenDeleteDialog(false);
|
||||
|
||||
@@ -1,142 +0,0 @@
|
||||
"use client";
|
||||
import PageTitle from "@/core/components/PageTitle";
|
||||
import { LinearProgress, Stack } from "@mui/material";
|
||||
import SearchReportList from "./Search";
|
||||
import { useEffect, useState } from "react";
|
||||
import ReportLists from "./ReportLists";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { GET_ROAD_SAFETY_CITY_ACTIVITY_REPORT, GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT } from "@/core/utils/routes";
|
||||
import moment from "jalali-moment";
|
||||
import * as yup from "yup";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { yupResolver } from "@hookform/resolvers/yup";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
import { useAuth } from "@/lib/contexts/auth";
|
||||
|
||||
const ReportPage = () => {
|
||||
const [data, setData] = useState(null);
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const { user } = useAuth();
|
||||
const requestServer = useRequest();
|
||||
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" },
|
||||
];
|
||||
const [specialFilter, setSpecialFilter] = useState(defaultFilter);
|
||||
|
||||
const onSearchSubmit = async (data) => {
|
||||
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" },
|
||||
]);
|
||||
if (data.province_id === "-1") {
|
||||
try {
|
||||
const response = await requestServer(`${GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT}?${params}`);
|
||||
const result = response.data.data;
|
||||
const nationalReportForItem = result.activities.find((report) => report.province_id === -1);
|
||||
const nationalReport = {
|
||||
edare_name: "کل کشور",
|
||||
...nationalReportForItem,
|
||||
};
|
||||
|
||||
setData({
|
||||
data: [
|
||||
nationalReport,
|
||||
...result.provinces.map((province) => {
|
||||
const filteredReports = result.activities.find(
|
||||
(report) => report.province_id === province.id
|
||||
);
|
||||
return {
|
||||
...filteredReports,
|
||||
edare_name: province.name_fa,
|
||||
};
|
||||
}),
|
||||
],
|
||||
filters: data,
|
||||
});
|
||||
} catch (e) {}
|
||||
} else {
|
||||
try {
|
||||
params.set("province_id", `${data.province_id}`);
|
||||
const response = await requestServer(`${GET_ROAD_SAFETY_CITY_ACTIVITY_REPORT}?${params}`);
|
||||
const result = response.data.data;
|
||||
const nationalReportForItem = result.activities.find((report) => report.edare_shahri_id == "-1");
|
||||
const nationalReport = {
|
||||
...nationalReportForItem,
|
||||
edare_name: "کل استان",
|
||||
};
|
||||
setData({
|
||||
data: [
|
||||
nationalReport,
|
||||
...result.edarateShahri.map((edare) => {
|
||||
const filteredReports = result.activities.find(
|
||||
(report) => report.edare_shahri_id == edare.id
|
||||
);
|
||||
return {
|
||||
edare_name: edare.name_fa,
|
||||
...filteredReports,
|
||||
};
|
||||
}),
|
||||
],
|
||||
filters: data,
|
||||
});
|
||||
} catch (e) {}
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!userPermissions) return;
|
||||
onSearchSubmit(defaultValues);
|
||||
}, [userPermissions]);
|
||||
|
||||
const validationSchema = yup.object().shape({
|
||||
from_date: yup
|
||||
.string()
|
||||
.required("تاریخ ثبت الزامی است!")
|
||||
.matches(/^\d{4}-\d{2}-\d{2}$/, "تاریخ ثبت الزامی است!")
|
||||
.test("is-valid-date", "تاریخ ثبت معتبر نیست!", (value) => moment(value, "YYYY-MM-DD", true).isValid()),
|
||||
date_to: yup
|
||||
.string()
|
||||
.required("تاریخ ثبت الزامی است!")
|
||||
.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({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
});
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
<PageTitle title={" کارتابل گزارش نگهداری حریم راه"} />
|
||||
<SearchReportList
|
||||
control={control}
|
||||
hasProvincesPermission={hasProvincesPermission}
|
||||
handleSubmit={handleSubmit}
|
||||
onSearchSubmit={onSearchSubmit}
|
||||
/>
|
||||
{!data ? <LinearProgress /> : <ReportLists specialFilter={specialFilter} data={data} />}
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default ReportPage;
|
||||
@@ -0,0 +1,25 @@
|
||||
import DoneIcon from "@mui/icons-material/Done";
|
||||
import { Chip, Tooltip, Zoom } from "@mui/material";
|
||||
|
||||
const ClusterSwitch = ({ isCluster, setCluster, disabled, max }) => {
|
||||
return (
|
||||
<Tooltip title={disabled ? `بیشتر از ${max} تا فعالیت باید حالت کلاستر باشد` : ""}>
|
||||
<span>
|
||||
<Chip
|
||||
label={"حالت کلاستر"}
|
||||
variant="outlined"
|
||||
disabled={disabled}
|
||||
color={isCluster ? "success" : "default"}
|
||||
onClick={() => setCluster((c) => !c)}
|
||||
sx={{ borderRadius: 1 }}
|
||||
icon={
|
||||
<Zoom in={isCluster}>
|
||||
<DoneIcon />
|
||||
</Zoom>
|
||||
}
|
||||
/>
|
||||
</span>
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
export default ClusterSwitch;
|
||||
@@ -0,0 +1,44 @@
|
||||
"use client";
|
||||
import { Box, Button, Drawer } from "@mui/material";
|
||||
import FilterListIcon from "@mui/icons-material/FilterList";
|
||||
import { useCallback, useState } from "react";
|
||||
import FilterDrawer from "@/core/components/FilterDrawer";
|
||||
|
||||
const drawerSx = {
|
||||
overflowY: "hidden",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
height: "100%",
|
||||
zIndex: "1300",
|
||||
};
|
||||
|
||||
const boxSx = {
|
||||
width: { xs: 300, sm: 450 },
|
||||
};
|
||||
|
||||
const Filter = ({ filterData, setFilterData }) => {
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const openDrawer = useCallback(() => setOpen(true), []);
|
||||
const closeDrawer = useCallback(() => setOpen(false), []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button onClick={openDrawer} variant="outlined" size="small" endIcon={<FilterListIcon />}>
|
||||
فیلتر
|
||||
</Button>
|
||||
<Drawer open={open} onClose={closeDrawer} sx={drawerSx}>
|
||||
<Box sx={boxSx}>
|
||||
{open && (
|
||||
<FilterDrawer
|
||||
defaultValues={filterData}
|
||||
setFilterData={setFilterData}
|
||||
closeDrawer={closeDrawer}
|
||||
/>
|
||||
)}
|
||||
</Box>
|
||||
</Drawer>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default Filter;
|
||||
@@ -0,0 +1,48 @@
|
||||
import { Box, Stack, Typography } from "@mui/material";
|
||||
|
||||
const Legend = () => {
|
||||
return (
|
||||
<Stack>
|
||||
<Stack direction={"row"} spacing={1} alignItems={"center"}>
|
||||
<Box
|
||||
sx={{
|
||||
width: 8,
|
||||
height: 8,
|
||||
border: 1,
|
||||
borderRadius: "50%",
|
||||
borderColor: (theme) => theme.palette.warning.main,
|
||||
background: (theme) => theme.palette.warning.light,
|
||||
}}
|
||||
/>
|
||||
<Typography variant="caption">گام اول (شناسایی)</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} spacing={1} alignItems={"center"}>
|
||||
<Box
|
||||
sx={{
|
||||
width: 8,
|
||||
height: 8,
|
||||
border: 1,
|
||||
borderRadius: "50%",
|
||||
borderColor: (theme) => theme.palette.error.main,
|
||||
background: (theme) => theme.palette.error.light,
|
||||
}}
|
||||
/>
|
||||
<Typography variant="caption">گام دوم (مستندات قضایی)</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} spacing={1} alignItems={"center"}>
|
||||
<Box
|
||||
sx={{
|
||||
width: 8,
|
||||
height: 8,
|
||||
border: 1,
|
||||
borderRadius: "50%",
|
||||
borderColor: (theme) => theme.palette.success.main,
|
||||
background: (theme) => theme.palette.success.light,
|
||||
}}
|
||||
/>
|
||||
<Typography variant="caption">گام سوم (برخورد)</Typography>
|
||||
</Stack>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default Legend;
|
||||
@@ -0,0 +1,104 @@
|
||||
import { Box, Chip, Divider, Stack, Typography } from "@mui/material";
|
||||
import moment from "jalali-moment";
|
||||
import Image from "next/image";
|
||||
|
||||
const ContentInfoItem = ({ data }) => {
|
||||
return (
|
||||
<Stack spacing={2}>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="کد یکتا" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>{data.id !== "" && data.id}</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="استان" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.province_fa !== "" && data.province_fa}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="اداره" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.edare_shahri_name !== "" && data.edare_shahri_name}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="مورد مشاهده شده" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.info_fa !== "" && data.info_fa}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="نوع محور" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.axis_type_name !== "" && data.axis_type_name}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="وضعیت" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.step_fa !== "" && data.step_fa}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="تاریخ بازدید" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.activity_date_time &&
|
||||
moment(data.activity_date_time).locale("fa").format("HH:mm | yyyy/MM/DD")}
|
||||
</Typography>
|
||||
</Stack>
|
||||
{data.step == 3 && (
|
||||
<Stack direction={"row"} alignItems={"center"}>
|
||||
<Chip size="small" label="تاریخ اقدام" />
|
||||
<Divider sx={{ flex: 1, mx: 2 }} />
|
||||
<Typography sx={{ fontSize: "13px", fontWeight: 400 }}>
|
||||
{data.action_date && moment(data.action_date).locale("fa").format("HH:mm | yyyy/MM/DD")}
|
||||
</Typography>
|
||||
</Stack>
|
||||
)}
|
||||
<Stack spacing={2}>
|
||||
<Stack
|
||||
sx={{ flex: 1, border: 1, borderColor: "divider", borderRadius: 2, p: 1 }}
|
||||
spacing={1}
|
||||
alignItems={"center"}
|
||||
>
|
||||
<Chip size="small" label="تصویر بازدید" />
|
||||
<Box sx={{ position: "relative", height: 300, width: "100%" }}>
|
||||
<Image
|
||||
src={data.recognize_picture}
|
||||
style={{ objectFit: "contain" }}
|
||||
alt="recognize_picture"
|
||||
fill
|
||||
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
|
||||
/>
|
||||
</Box>
|
||||
</Stack>
|
||||
{data.step == 3 && (
|
||||
<Stack
|
||||
sx={{ flex: 1, border: 1, borderColor: "divider", borderRadius: 2, p: 1 }}
|
||||
spacing={1}
|
||||
alignItems={"center"}
|
||||
>
|
||||
<Chip size="small" label="تصویر اقدام" />
|
||||
<Box sx={{ position: "relative", height: 300, width: "100%" }}>
|
||||
<Image
|
||||
src={data.action_picture}
|
||||
style={{ objectFit: "contain" }}
|
||||
alt="action_picture"
|
||||
fill
|
||||
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
|
||||
/>
|
||||
</Box>
|
||||
</Stack>
|
||||
)}
|
||||
</Stack>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default ContentInfoItem;
|
||||
@@ -0,0 +1,51 @@
|
||||
import DialogLoading from "@/core/components/DialogLoading";
|
||||
import { GET_ROAD_SAFETY_DETAILS } from "@/core/utils/routes";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { Button, DialogActions, DialogContent, DialogTitle } from "@mui/material";
|
||||
import { useEffect, useState } from "react";
|
||||
import ContentInfoItem from "./ContentInfoItem";
|
||||
|
||||
const DialogInfoItem = ({ selectedId, closeDialog }) => {
|
||||
const request = useRequest();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [data, setData] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
const controller = new AbortController();
|
||||
|
||||
const fetchItem = async () => {
|
||||
setLoading(true);
|
||||
setData(null);
|
||||
try {
|
||||
const response = await request(`${GET_ROAD_SAFETY_DETAILS}/${selectedId}`, "get", {
|
||||
signal: controller.signal,
|
||||
});
|
||||
setData(response.data.data);
|
||||
} catch (error) {
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchItem();
|
||||
|
||||
return () => {
|
||||
controller.abort();
|
||||
};
|
||||
}, [selectedId]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<DialogTitle>جزئیات فعالیت</DialogTitle>
|
||||
<DialogContent dividers>
|
||||
{loading ? <DialogLoading /> : data && <ContentInfoItem data={data} />}
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={closeDialog} variant="outlined" color="secondary" autoFocus>
|
||||
بستن
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default DialogInfoItem;
|
||||
@@ -0,0 +1,71 @@
|
||||
import { Dialog, useTheme } from "@mui/material";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { CircleMarker, useMap } from "react-leaflet";
|
||||
import MarkerClusterGroup from "react-leaflet-markercluster";
|
||||
import DialogInfoItem from "./DialogInfoItem";
|
||||
|
||||
const PointsOnMap = ({ data, isCluster }) => {
|
||||
const map = useMap();
|
||||
const theme = useTheme();
|
||||
const [selectedId, setSelectedId] = useState(null);
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const openDialog = useCallback(() => setOpen(true), []);
|
||||
const closeDialog = useCallback(() => setOpen(false), []);
|
||||
|
||||
const getMarkerColor = (status) => {
|
||||
if (status === 1) return theme.palette.warning.main;
|
||||
if (status === 2) return theme.palette.error.main;
|
||||
return theme.palette.success.main;
|
||||
};
|
||||
|
||||
const markers = useMemo(() => {
|
||||
return data.map(({ id, lat, lon, step }) => (
|
||||
<CircleMarker
|
||||
eventHandlers={{
|
||||
click: () => {
|
||||
openDialog();
|
||||
setSelectedId(id);
|
||||
},
|
||||
}}
|
||||
key={id}
|
||||
center={L.latLng(lat, lon)}
|
||||
radius={8}
|
||||
color={getMarkerColor(step)}
|
||||
/>
|
||||
));
|
||||
}, [data, theme]);
|
||||
|
||||
useEffect(() => {
|
||||
if (data.length === 0) return;
|
||||
const bounds = L.latLngBounds(data.map(({ lat, lon }) => L.latLng(lat, lon)));
|
||||
map.flyToBounds(bounds, { duration: 0.7 });
|
||||
}, [data]);
|
||||
|
||||
const createClusterCustomIcon = (cluster) => {
|
||||
const count = cluster.getChildCount();
|
||||
return L.divIcon({
|
||||
html: `<div class="custom-marker-cluster">${count}</div>`,
|
||||
className: "custom-marker-cluster",
|
||||
iconSize: L.point(40, 40, true),
|
||||
});
|
||||
};
|
||||
|
||||
if (data.length === 0) return null;
|
||||
|
||||
return (
|
||||
<>
|
||||
{isCluster ? (
|
||||
<MarkerClusterGroup iconCreateFunction={createClusterCustomIcon} showCoverageOnHover={false}>
|
||||
{markers}
|
||||
</MarkerClusterGroup>
|
||||
) : (
|
||||
markers
|
||||
)}
|
||||
<Dialog open={open} onClose={closeDialog} fullWidth maxWidth="sm">
|
||||
{open && <DialogInfoItem selectedId={selectedId} closeDialog={closeDialog} />}
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default PointsOnMap;
|
||||
322
src/components/dashboard/roadSafety/reports/map/index.jsx
Normal file
322
src/components/dashboard/roadSafety/reports/map/index.jsx
Normal file
@@ -0,0 +1,322 @@
|
||||
"use client";
|
||||
import LoadingHardPage from "@/core/components/LoadingHardPage";
|
||||
import MapLoading from "@/core/components/MapLayer/Loading";
|
||||
import isArrayEmpty from "@/core/utils/isArrayEmpty";
|
||||
import { GET_ROAD_SAFETY_REPORT_MAP } from "@/core/utils/routes";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { Box, Stack } from "@mui/material";
|
||||
import dynamic from "next/dynamic";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import ClusterSwitch from "./ClusterSwitch";
|
||||
import Filter from "./Filter";
|
||||
import Legend from "./Legend";
|
||||
import PointsOnMap from "./PointsOnMap";
|
||||
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import CustomSelectByDependency from "@/core/components/FilterDrawer/fieldsType/CustomSelectByDependency";
|
||||
import useEdaratLists from "@/lib/hooks/useEdaratLists";
|
||||
import useSafetyAndPrivacyGetItems from "@/lib/hooks/useSafetyAndPrivacyGetItems";
|
||||
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
|
||||
loading: () => <MapLoading />,
|
||||
ssr: false,
|
||||
});
|
||||
|
||||
const statusOptions = [
|
||||
{ value: "", label: "همه وضعیت ها" },
|
||||
{ value: 1, label: "گام اول (شناسایی)" },
|
||||
{ value: 2, label: "گام دوم (مستندات قضایی)" },
|
||||
{ value: 3, label: "گام سوم (برخورد)" },
|
||||
];
|
||||
const axisOptions = [
|
||||
{ value: "", label: "همه محور ها" },
|
||||
{ value: 1, label: "آزادراه" },
|
||||
{ value: 2, label: "بزرگراه" },
|
||||
{ value: 3, label: "اصلی" },
|
||||
{ value: 4, label: "فرعی" },
|
||||
{ value: 5, label: "روستایی" },
|
||||
];
|
||||
|
||||
const MAX_POINTS = 1000;
|
||||
|
||||
const containerStyles = {
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
p: 1,
|
||||
border: "1px dashed",
|
||||
borderColor: "divider",
|
||||
borderRadius: 1,
|
||||
};
|
||||
|
||||
const controlBarStyles = {
|
||||
p: 1,
|
||||
background: "#fff",
|
||||
};
|
||||
|
||||
const RoadSafetyReportMap = () => {
|
||||
const defaultValues = useMemo(
|
||||
() => [
|
||||
{
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
SelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const getSelectOptions = 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}
|
||||
selectOption={getSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
eader: "اداره",
|
||||
id: "edare_shahri_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
dependencyId: "province_id",
|
||||
value: "",
|
||||
enable: true,
|
||||
SelectComponent: (props) => {
|
||||
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getSelectOptions = useMemo(() => {
|
||||
if (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 (prevDependency === props.dependencyFieldValue?.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue?.value);
|
||||
}, [props.dependencyFieldValue?.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingEdaratList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
selectOption={getSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "مورد مشاهده شده",
|
||||
id: "info_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
SelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useSafetyAndPrivacyGetItems();
|
||||
|
||||
const getSelectOptions = 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}
|
||||
selectOption={getSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "نوع محور",
|
||||
id: "axis_type_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
selectOption: () => {
|
||||
return axisOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "وضعیت",
|
||||
id: "step",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
selectOption: () => {
|
||||
return statusOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "تاریخ ثبت",
|
||||
id: "created_at",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ بازدید",
|
||||
id: "activity_date_time",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ بارگذاری مستندات",
|
||||
id: "judiciary_document_upload_date",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ اقدام",
|
||||
id: "action_date",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
],
|
||||
[]
|
||||
);
|
||||
const requestServer = useRequest();
|
||||
const [filterData, setFilterData] = useState(
|
||||
defaultValues.reduce((acc, item) => {
|
||||
acc[item.id] = item;
|
||||
return acc;
|
||||
}, {})
|
||||
);
|
||||
const [isCluster, setCluster] = useState(false);
|
||||
const [data, setData] = useState([]);
|
||||
const [isLoading, setLoading] = useState(true);
|
||||
|
||||
const buildQueryParams = useCallback(() => {
|
||||
const params = new URLSearchParams();
|
||||
const filters = DataTableFilterDataStructure(filterData, isArrayEmpty);
|
||||
params.set("filters", JSON.stringify(filters || []));
|
||||
return params.toString();
|
||||
}, [filterData]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const params = new URLSearchParams();
|
||||
const filters = DataTableFilterDataStructure(filterData, isArrayEmpty);
|
||||
params.set("filters", JSON.stringify(filters || []));
|
||||
const query = params.toString();
|
||||
const response = await requestServer(`${GET_ROAD_SAFETY_REPORT_MAP}?${query}`);
|
||||
const fetchedData = response?.data?.data || [];
|
||||
|
||||
if (fetchedData.length > MAX_POINTS) {
|
||||
setCluster(true);
|
||||
}
|
||||
setData(fetchedData);
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchData();
|
||||
}, [filterData, buildQueryParams]);
|
||||
|
||||
return (
|
||||
<Box sx={containerStyles}>
|
||||
<MapLayer style={{ borderRadius: "4px" }}>
|
||||
<Stack
|
||||
direction="row-reverse"
|
||||
sx={{ position: "absolute", top: 0, right: 0, width: "100%", zIndex: 1000 }}
|
||||
>
|
||||
<Stack direction="row" spacing={1} sx={{ ...controlBarStyles, borderBottomLeftRadius: "4px" }}>
|
||||
<ClusterSwitch
|
||||
isCluster={isCluster}
|
||||
setCluster={setCluster}
|
||||
disabled={data.length > MAX_POINTS}
|
||||
max={MAX_POINTS}
|
||||
/>
|
||||
<Filter filterData={filterData} setFilterData={setFilterData} />
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
<Stack
|
||||
direction="row-reverse"
|
||||
sx={{ position: "absolute", bottom: 0, right: 0, width: "100%", zIndex: 1000 }}
|
||||
>
|
||||
<Stack direction="row" spacing={1} sx={{ ...controlBarStyles, pb: 0, borderTopLeftRadius: "4px" }}>
|
||||
<Legend />
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
{isLoading && (
|
||||
<Box sx={{ position: "relative", width: "100%", height: "100%", opacity: 0.7, zIndex: 999 }}>
|
||||
<LoadingHardPage width={80} height={80} loading={isLoading} sx={{ position: "absolute" }} />
|
||||
</Box>
|
||||
)}
|
||||
|
||||
<PointsOnMap data={data} isCluster={isCluster} />
|
||||
</MapLayer>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
export default RoadSafetyReportMap;
|
||||
@@ -1,44 +1,39 @@
|
||||
"use client";
|
||||
import { Button, CircularProgress, IconButton, useMediaQuery } 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 DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
|
||||
import isArrayEmpty from "@/core/utils/isArrayEmpty";
|
||||
import { EXPORT_COUNTRY_ROAD_SAFETY_REPORT, EXPORT_PROVINCE_ROAD_SAFETY_REPORT } from "@/core/utils/routes";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { useTheme } from "@emotion/react";
|
||||
import { EXPORT_COUNTRY_ROAD_PATROL_REPORTS, EXPORT_PROVINCE_ROAD_PATROL_REPORTS } from "@/core/utils/routes";
|
||||
import DescriptionIcon from "@mui/icons-material/Description";
|
||||
import { Button, CircularProgress, IconButton, useMediaQuery } from "@mui/material";
|
||||
import FileSaver from "file-saver";
|
||||
import moment from "jalali-moment";
|
||||
import { useState } from "react";
|
||||
|
||||
const PrintExcel = ({ table, filterData }) => {
|
||||
const theme = useTheme();
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
|
||||
const [loading, setLoading] = useState(false);
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
|
||||
if (filter.value) {
|
||||
acc.push({ id: filter.id, 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);
|
||||
const CountryOrProvince = activeFilters.find((item) => item.id === "province_id");
|
||||
const requestUrl =
|
||||
CountryOrProvince.value === "-1" ? EXPORT_COUNTRY_ROAD_PATROL_REPORTS : EXPORT_PROVINCE_ROAD_PATROL_REPORTS;
|
||||
const filters = DataTableFilterDataStructure(filterData, isArrayEmpty);
|
||||
const filterParams = new URLSearchParams();
|
||||
let requestUrl;
|
||||
filterParams.set("filters", JSON.stringify(filters || []));
|
||||
if (filterData.province_id.value === "") {
|
||||
requestUrl = EXPORT_COUNTRY_ROAD_SAFETY_REPORT;
|
||||
} else {
|
||||
filterParams.set("province_id", filterData.province_id.value);
|
||||
requestUrl = EXPORT_PROVINCE_ROAD_SAFETY_REPORT;
|
||||
}
|
||||
|
||||
requestServer(`${requestUrl}?${filterParams}`, "get", {
|
||||
requestOptions: { responseType: "blob" },
|
||||
})
|
||||
.then((response) => {
|
||||
const filename = `خروجی کارتابل گزارشات گشت راهداری تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
|
||||
const filename = `خروجی کارتابل نگهداری حریم راه تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
|
||||
FileSaver.saveAs(response.data, filename);
|
||||
})
|
||||
.catch(() => {})
|
||||
@@ -4,7 +4,7 @@ import { Box } from "@mui/material";
|
||||
import { useMemo } from "react";
|
||||
import Toolbar from "./Toolbar";
|
||||
|
||||
const ReportLists = ({ data, specialFilter }) => {
|
||||
const ReportLists = ({ data, filterData, setFilterData, isLoading }) => {
|
||||
const columns = useMemo(() => {
|
||||
return [
|
||||
{
|
||||
@@ -289,11 +289,13 @@ const ReportLists = ({ data, specialFilter }) => {
|
||||
<DataTableWithAuth
|
||||
TableToolbar={Toolbar}
|
||||
columns={columns}
|
||||
data={data.data}
|
||||
data={data}
|
||||
page_name={"roadSafetyReport"}
|
||||
table_name={"roadSafetyReportList"}
|
||||
enablePagination={false}
|
||||
specialFilter={specialFilter}
|
||||
specialFilter={filterData}
|
||||
setFilterData={setFilterData}
|
||||
loading={isLoading}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
264
src/components/dashboard/roadSafety/reports/reportPage/index.jsx
Normal file
264
src/components/dashboard/roadSafety/reports/reportPage/index.jsx
Normal file
@@ -0,0 +1,264 @@
|
||||
"use client";
|
||||
import CustomSelectByDependency from "@/core/components/FilterDrawer/fieldsType/CustomSelectByDependency";
|
||||
import PageTitle from "@/core/components/PageTitle";
|
||||
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
|
||||
import isArrayEmpty from "@/core/utils/isArrayEmpty";
|
||||
import { GET_ROAD_SAFETY_CITY_ACTIVITY_REPORT, GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT } from "@/core/utils/routes";
|
||||
import { useAuth } from "@/lib/contexts/auth";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import useSafetyAndPrivacyGetItems from "@/lib/hooks/useSafetyAndPrivacyGetItems";
|
||||
import { LinearProgress, Stack } from "@mui/material";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import ReportLists from "./ReportLists";
|
||||
|
||||
const statusOptions = [
|
||||
{ value: "", label: "همه وضعیت ها" },
|
||||
{ value: 1, label: "گام اول (شناسایی)" },
|
||||
{ value: 2, label: "گام دوم (مستندات قضایی)" },
|
||||
{ value: 3, label: "گام سوم (برخورد)" },
|
||||
];
|
||||
const axisOptions = [
|
||||
{ value: "", label: "همه محور ها" },
|
||||
{ value: 1, label: "آزادراه" },
|
||||
{ value: 2, label: "بزرگراه" },
|
||||
{ value: 3, label: "اصلی" },
|
||||
{ value: 4, label: "فرعی" },
|
||||
{ value: 5, label: "روستایی" },
|
||||
];
|
||||
|
||||
const ReportPage = () => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasProvincesPermission = userPermissions.includes("show-safety-and-privacy-operator-cartable");
|
||||
const { user } = useAuth();
|
||||
const requestServer = useRequest();
|
||||
const [data, setData] = useState(null);
|
||||
const [isLoading, setLoading] = useState(true);
|
||||
const defaultValues = useMemo(
|
||||
() => [
|
||||
{
|
||||
header: "استان",
|
||||
id: "province_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: hasProvincesPermission ? "" : user.province_id,
|
||||
enable: hasProvincesPermission,
|
||||
SelectComponent: (props) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const getSelectOptions = 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}
|
||||
selectOption={getSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "مورد مشاهده شده",
|
||||
id: "info_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
SelectComponent: (props) => {
|
||||
const { itemsList, loadingItemsList, errorItemsList } = useSafetyAndPrivacyGetItems();
|
||||
|
||||
const getSelectOptions = 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}
|
||||
selectOption={getSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "نوع محور",
|
||||
id: "axis_type_id",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
selectOption: () => {
|
||||
return axisOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "وضعیت",
|
||||
id: "step",
|
||||
filterMode: "equals",
|
||||
datatype: "numeric",
|
||||
value: "",
|
||||
enable: true,
|
||||
selectOption: () => {
|
||||
return statusOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
},
|
||||
{
|
||||
header: "تاریخ ثبت",
|
||||
id: "created_at",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ بازدید",
|
||||
id: "activity_date_time",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ بارگذاری مستندات",
|
||||
id: "judiciary_document_upload_date",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
{
|
||||
header: "تاریخ اقدام",
|
||||
id: "action_date",
|
||||
filterMode: "between",
|
||||
datatype: "date",
|
||||
value: ["", ""],
|
||||
enable: true,
|
||||
},
|
||||
],
|
||||
[hasProvincesPermission, user.province_id]
|
||||
);
|
||||
|
||||
const [filterData, setFilterData] = useState(
|
||||
defaultValues.reduce((acc, item) => {
|
||||
acc[item.id] = item;
|
||||
return acc;
|
||||
}, {})
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const filters = DataTableFilterDataStructure(filterData, isArrayEmpty);
|
||||
const params = new URLSearchParams();
|
||||
params.set("filters", JSON.stringify(filters || []));
|
||||
if (filterData.province_id.value === "") {
|
||||
try {
|
||||
const response = await requestServer(
|
||||
`${GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT}?${params.toString()}`
|
||||
);
|
||||
const result = response.data.data;
|
||||
const nationalReportForItem = result.activities.find((report) => report.province_id === -1);
|
||||
const nationalReport = {
|
||||
edare_name: "کل کشور",
|
||||
...nationalReportForItem,
|
||||
};
|
||||
|
||||
setData([
|
||||
nationalReport,
|
||||
...result.provinces.map((province) => {
|
||||
const filteredReports = result.activities.find(
|
||||
(report) => report.province_id === province.id
|
||||
);
|
||||
return {
|
||||
...filteredReports,
|
||||
edare_name: province.name_fa,
|
||||
};
|
||||
}),
|
||||
]);
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
} else {
|
||||
params.set("province_id", filterData.province_id.value);
|
||||
try {
|
||||
const response = await requestServer(
|
||||
`${GET_ROAD_SAFETY_CITY_ACTIVITY_REPORT}?${params.toString()}`
|
||||
);
|
||||
const result = response.data.data;
|
||||
const nationalReportForItem = result.activities.find(
|
||||
(report) => report.edare_shahri_id == "-1"
|
||||
);
|
||||
const nationalReport = {
|
||||
...nationalReportForItem,
|
||||
edare_name: "کل استان",
|
||||
};
|
||||
setData([
|
||||
nationalReport,
|
||||
...result.edarateShahri.map((edare) => {
|
||||
const filteredReports = result.activities.find(
|
||||
(report) => report.edare_shahri_id == edare.id
|
||||
);
|
||||
return {
|
||||
edare_name: edare.name_fa,
|
||||
...filteredReports,
|
||||
};
|
||||
}),
|
||||
]);
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchData();
|
||||
}, [filterData]);
|
||||
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
<PageTitle title={" کارتابل گزارش نگهداری حریم راه"} />
|
||||
{!data ? (
|
||||
<LinearProgress />
|
||||
) : (
|
||||
<ReportLists filterData={filterData} setFilterData={setFilterData} isLoading={isLoading} data={data} />
|
||||
)}
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default ReportPage;
|
||||
@@ -21,7 +21,7 @@ const CreateFormContent = ({ setOpen, defaultValues, onSubmitBase }) => {
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "onBlur",
|
||||
mode: "all",
|
||||
});
|
||||
const handleOnSubmit = async (data) => {
|
||||
await onSubmitBase(data);
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
import SelectBox from "@/core/components/SelectBox";
|
||||
import { useEffect, useState } from "react";
|
||||
import useCities from "@/lib/hooks/useCities";
|
||||
|
||||
const CityContent = ({ provinceID, field, fieldState: { error } }) => {
|
||||
const { cityList, loadingCityList, errorCityList } = useCities(provinceID);
|
||||
const [prevDependency, setPrevDependency] = useState(provinceID);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDependency === provinceID) return;
|
||||
field.onChange(null);
|
||||
setPrevDependency(provinceID);
|
||||
}, [provinceID]);
|
||||
|
||||
return (
|
||||
<SelectBox
|
||||
value={
|
||||
!provinceID ? "dependency" : errorCityList ? "error" : loadingCityList ? "loading" : field.value || ""
|
||||
}
|
||||
label={"شهرستان"}
|
||||
selectors={cityList}
|
||||
schema={{ name: "name_fa", value: "id" }}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
helperText={error?.message}
|
||||
isLoading={loadingCityList}
|
||||
errorEcured={errorCityList}
|
||||
isDependency={!provinceID}
|
||||
dependencyLabel={"ابتدا استان را انتخاب کنید"}
|
||||
/>
|
||||
);
|
||||
};
|
||||
export default CityContent;
|
||||
@@ -0,0 +1,14 @@
|
||||
import { Controller, useWatch } from "react-hook-form";
|
||||
import CityContent from "./CityContent";
|
||||
|
||||
const CityController = ({ control }) => {
|
||||
const provinceID = useWatch({ control, name: "province_id" });
|
||||
return (
|
||||
<Controller
|
||||
name="city_id"
|
||||
control={control}
|
||||
render={(props) => <CityContent provinceID={provinceID} {...props} />}
|
||||
/>
|
||||
);
|
||||
};
|
||||
export default CityController;
|
||||
@@ -0,0 +1,192 @@
|
||||
import StyledForm from "@/core/components/StyledForm";
|
||||
import { Box, Button, DialogActions, DialogContent, Tab, Tabs } from "@mui/material";
|
||||
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
|
||||
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
|
||||
import BeenhereIcon from "@mui/icons-material/Beenhere";
|
||||
import OtherHousesIcon from "@mui/icons-material/OtherHouses";
|
||||
import LocalShippingIcon from "@mui/icons-material/LocalShipping";
|
||||
import EditLocationAltIcon from "@mui/icons-material/EditLocationAlt";
|
||||
import React, { useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { yupResolver } from "@hookform/resolvers/yup";
|
||||
import { mixed, number, object, string } from "yup";
|
||||
import TollHouseInfo from "./TollHouseInfo";
|
||||
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
|
||||
import MachineInfo from "@/components/infrastructure/tollHouse/Form/CreateTollHouse/MachineInfo";
|
||||
import TollHouseLocation from "@/components/infrastructure/tollHouse/Form/CreateTollHouse/TollHouseLocation";
|
||||
|
||||
function TabPanel(props) {
|
||||
const { children, value, index } = props;
|
||||
return (
|
||||
<div role="tabpanel" hidden={value !== index}>
|
||||
{value === index && <Box>{children}</Box>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const validationSchema = object({
|
||||
name: string().required("وارد کردن نام راهدارخانه الزامیست!"),
|
||||
status: string().required("وارد کردن وضعیت الزامیست!"),
|
||||
type: string().required("وارد کردن نوع الزامیست!"),
|
||||
phone: string().required("وارد کردن تلفن راهدارخانه الزامیست!"),
|
||||
team_num: string().required("وارد کردن تعداد اکیپ الزامیست!"),
|
||||
staff_num: string().required("وارد کردن تعداد پرسنل الزامیست!"),
|
||||
responsible_name: string().required("وارد کردن نام مسئول الزامیست!"),
|
||||
responsible_mobile: string()
|
||||
.required("وارد کردن تلفن مسئول الزامیست!")
|
||||
.matches(/^09\d{9}$/, "شماره تلفن مسئول باید با ۰۹ شروع شده و ۱۱ رقم باشد!"),
|
||||
successor_name: string().required("وارد کردن نام جانشین الزامیست!"),
|
||||
successor_mobile: string()
|
||||
.required("وارد کردن تلفن جانشین الزامیست!")
|
||||
.matches(/^09\d{9}$/, "شماره تلفن جانشین باید با ۰۹ شروع شده و ۱۱ رقم باشد!"),
|
||||
province_id: number().required("وارد کردن استان الزامیست!"),
|
||||
city_id: number().required("وارد کردن شهرستان الزامیست!"),
|
||||
machines_light: string().required("وارد کردن ماشین آلات سبک الزامیست!"),
|
||||
machines_sheavy: string().required("وارد کردن ماشین آلات نیمه سنگین الزامیست!"),
|
||||
machines_heavy: string().required("وارد کردن ماشین آلات سنگین الزامیست!"),
|
||||
overview_files_1: mixed().nullable().required("لطفا نمای کلی از راهداری را بارگذاری کنید!"),
|
||||
overview_files_2: mixed().nullable().required("لطفا آشیانه ماشین آلات را بارگذاری کنید!"),
|
||||
overview_files_3: mixed().nullable().required("لطفا انباری شن و ماسه را بارگذاری کنید!"),
|
||||
overview_files_4: mixed().nullable().required("لطفا محیط کاری را بارگذاری کنید!"),
|
||||
overview_files_5: mixed().nullable().required("لطفا سایر تصاویر را بارگذاری کنید!"),
|
||||
start_point: mixed()
|
||||
.test("start-point-required", "لطفاً محل پروژه را مشخص کنید!", function (value) {
|
||||
return !!value;
|
||||
})
|
||||
.required("لطفاً محل پروژه را مشخص کنید!"),
|
||||
});
|
||||
const CreateTollHouseContent = ({ setOpen, SubmitCreateTollHouse, defaultValues }) => {
|
||||
const [tabState, setTabState] = useState(0);
|
||||
const handleClose = () => {
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
const handleChangeTab = (event, newValue) => {
|
||||
setTabState(newValue);
|
||||
};
|
||||
const handleNext = async () => {
|
||||
let fieldsToValidate = [];
|
||||
if (tabState === 0) {
|
||||
fieldsToValidate = [
|
||||
"name",
|
||||
"province_id",
|
||||
"city_id",
|
||||
"status",
|
||||
"type",
|
||||
"phone",
|
||||
"team_num",
|
||||
"staff_num",
|
||||
"responsible_name",
|
||||
"responsible_mobile",
|
||||
"successor_name",
|
||||
"successor_mobile",
|
||||
];
|
||||
} else if (tabState === 1) {
|
||||
fieldsToValidate = [
|
||||
"machines_light",
|
||||
"machines_sheavy",
|
||||
"machines_heavy",
|
||||
"overview_files_1",
|
||||
"overview_files_2",
|
||||
"overview_files_3",
|
||||
"overview_files_4",
|
||||
"overview_files_5",
|
||||
];
|
||||
} else if (tabState === 2) {
|
||||
fieldsToValidate = ["start_point"];
|
||||
}
|
||||
const isValid = await trigger(fieldsToValidate);
|
||||
if (isValid) {
|
||||
setTabState(tabState + 1);
|
||||
}
|
||||
};
|
||||
const handlePrev = () => {
|
||||
if (tabState === 0) {
|
||||
handleClose();
|
||||
} else {
|
||||
setTabState(tabState - 1);
|
||||
}
|
||||
};
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
trigger,
|
||||
setValue,
|
||||
formState: { isSubmitting, errors },
|
||||
} = useForm({
|
||||
defaultValues,
|
||||
resolver: yupResolver(validationSchema),
|
||||
mode: "all",
|
||||
});
|
||||
const onSubmitBase = async (data) => {
|
||||
await SubmitCreateTollHouse(data);
|
||||
};
|
||||
return (
|
||||
<StyledForm onSubmit={handleSubmit(onSubmitBase)}>
|
||||
<Tabs
|
||||
allowScrollButtonsMobile
|
||||
value={tabState}
|
||||
onChange={handleChangeTab}
|
||||
variant={"fullWidth"}
|
||||
sx={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
width: "100%",
|
||||
backgroundColor: "#efefef",
|
||||
}}
|
||||
>
|
||||
<Tab icon={<OtherHousesIcon />} label="اطلاعات راهدارخانه" />
|
||||
<Tab disabled={tabState === 0} icon={<LocalShippingIcon />} label="ماشین آلات" />
|
||||
<Tab disabled={tabState === 0 || tabState === 1} icon={<EditLocationAltIcon />} label="موقعیت" />
|
||||
</Tabs>
|
||||
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
|
||||
<Box sx={{ flex: 1 }}>
|
||||
<TabPanel value={tabState} index={0}>
|
||||
<TollHouseInfo control={control} />
|
||||
</TabPanel>
|
||||
<TabPanel value={tabState} index={1}>
|
||||
<MachineInfo control={control} />
|
||||
</TabPanel>
|
||||
<TabPanel value={tabState} index={2}>
|
||||
<TollHouseLocation control={control} setValue={setValue} errors={errors} />
|
||||
</TabPanel>
|
||||
</Box>
|
||||
</DialogContent>
|
||||
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
|
||||
<Button
|
||||
onClick={handlePrev}
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
size="large"
|
||||
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
|
||||
>
|
||||
{tabState === 0 ? "بستن" : "مرحله قبل"}
|
||||
</Button>
|
||||
{tabState !== 2 && (
|
||||
<Button
|
||||
onClick={handleNext}
|
||||
key={"handleNext"}
|
||||
variant="contained"
|
||||
size="large"
|
||||
endIcon={<KeyboardDoubleArrowLeftIcon />}
|
||||
>
|
||||
مرحله بعد
|
||||
</Button>
|
||||
)}
|
||||
{tabState === 2 && (
|
||||
<Button
|
||||
variant="contained"
|
||||
size="large"
|
||||
disabled={isSubmitting}
|
||||
type={"submit"}
|
||||
endIcon={<BeenhereIcon />}
|
||||
>
|
||||
{isSubmitting ? "در حال ثبت راهدارخانه" : "ثبت راهدارخانه"}
|
||||
</Button>
|
||||
)}
|
||||
</DialogActions>
|
||||
</StyledForm>
|
||||
);
|
||||
};
|
||||
export default CreateTollHouseContent;
|
||||
@@ -0,0 +1,77 @@
|
||||
import { FormControl, FormHelperText } from "@mui/material";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import React, { useEffect, useState } from "react";
|
||||
|
||||
const ImageUpload = ({ name, value, onChange, error, title }) => {
|
||||
const [beforeImg, setBeforeImg] = useState(value ? value : null);
|
||||
const [beforeFileType, setBeforeFileType] = useState(value ? "image/" : null);
|
||||
const [beforeFileName, setBeforeFileName] = useState(null);
|
||||
const [showBeforeImage, setShowBeforeImage] = useState(!value);
|
||||
|
||||
useEffect(() => {
|
||||
if (value) {
|
||||
setShowBeforeImage(false);
|
||||
if (typeof value === "string") {
|
||||
setBeforeImg(value);
|
||||
setBeforeFileType("image/");
|
||||
} else if (value instanceof File) {
|
||||
setBeforeImg(URL.createObjectURL(value));
|
||||
setBeforeFileType(value.type);
|
||||
}
|
||||
}
|
||||
}, [value]);
|
||||
|
||||
const handleFileChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
const fileType = event.target?.files?.[0].type;
|
||||
const fileName = event.target?.files?.[0].name;
|
||||
setBeforeImg(URL.createObjectURL(uploadedFile));
|
||||
setBeforeFileType(fileType);
|
||||
setBeforeFileName(fileName);
|
||||
onChange(uploadedFile);
|
||||
setShowBeforeImage(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<FormControl
|
||||
error={error}
|
||||
sx={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
}}
|
||||
>
|
||||
<FormHelperText
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
border: 1,
|
||||
borderBottom: 0,
|
||||
borderColor: "divider",
|
||||
px: 2,
|
||||
py: 1,
|
||||
borderRadius: 2,
|
||||
borderBottomRightRadius: 0,
|
||||
borderBottomLeftRadius: 0,
|
||||
}}
|
||||
id={name}
|
||||
>
|
||||
{title}
|
||||
</FormHelperText>
|
||||
<UploadSystem
|
||||
selectedImage={beforeImg}
|
||||
handleUploadChange={handleFileChange}
|
||||
fileType={beforeFileType}
|
||||
fileName={beforeFileName}
|
||||
setSelectedImage={setBeforeImg}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowBeforeImage}
|
||||
showAddIcon={showBeforeImage}
|
||||
/>
|
||||
<FormHelperText id={name}>{error ? error.message : null}</FormHelperText>
|
||||
</FormControl>
|
||||
);
|
||||
};
|
||||
export default ImageUpload;
|
||||
@@ -0,0 +1,42 @@
|
||||
import { Controller, useWatch } from "react-hook-form";
|
||||
import SelectBox from "@/core/components/SelectBox";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import { Grid } from "@mui/material";
|
||||
import CityController from "./CityController";
|
||||
|
||||
const LogesticController = ({ control }) => {
|
||||
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
|
||||
const isProvince = useWatch({ control, name: "is_province" });
|
||||
return (
|
||||
<Grid container spacing={2}>
|
||||
{!isProvince ? (
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="province_id"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<SelectBox
|
||||
value={errorProvinces ? "error" : loadingProvinces ? "loading" : field.value || ""}
|
||||
label="استان"
|
||||
selectors={provinces}
|
||||
schema={{ name: "name_fa", value: "id" }}
|
||||
error={error}
|
||||
disabled={isProvince}
|
||||
onChange={field.onChange}
|
||||
helperText={error?.message}
|
||||
isLoading={loadingProvinces}
|
||||
errorEcured={errorProvinces}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
) : null}
|
||||
<Grid item xs={12} md={isProvince ? 12 : 6}>
|
||||
<CityController control={control} />
|
||||
</Grid>
|
||||
</Grid>
|
||||
);
|
||||
};
|
||||
export default LogesticController;
|
||||
@@ -0,0 +1,199 @@
|
||||
import { Grid, Stack, TextField } from "@mui/material";
|
||||
import { Controller } from "react-hook-form";
|
||||
import PersianTextField from "@/core/components/PersianTextField";
|
||||
import ImageUpload from "@/components/dashboard/damages/operator/Actions/create/Forms/ImageUpload";
|
||||
|
||||
const MachineInfo = ({ control }) => {
|
||||
return (
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={4}>
|
||||
<Controller
|
||||
name="machines_light"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="ماشین آلات سبک"
|
||||
value={value}
|
||||
placeholder="ماشین آلات سبک را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={4}>
|
||||
<Controller
|
||||
name="machines_sheavy"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="ماشین آلات نیمه سنگین"
|
||||
value={value}
|
||||
placeholder="ماشین آلات نیمه سنگین را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={4}>
|
||||
<Controller
|
||||
name="machines_heavy"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="ماشین آلات سنگین"
|
||||
value={value}
|
||||
placeholder="ماشین آلات سنگین را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="overview_files_1"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => (
|
||||
<ImageUpload
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
title={"نمای کلی از راهداری"}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="overview_files_2"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => (
|
||||
<ImageUpload
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
title={"آشیانه ماشین آلات"}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="overview_files_3"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => (
|
||||
<ImageUpload
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
title={"انباری شن و ماسه"}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="overview_files_4"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => (
|
||||
<ImageUpload
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
title={"محیط کاری"}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={12}>
|
||||
<Controller
|
||||
name="overview_files_5"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => (
|
||||
<ImageUpload
|
||||
name={field.name}
|
||||
value={field.value}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
title={"سایر تصاویر"}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default MachineInfo;
|
||||
@@ -0,0 +1,311 @@
|
||||
import { Grid, Stack, TextField } from "@mui/material";
|
||||
import { Controller } from "react-hook-form";
|
||||
import SelectBox from "@/core/components/SelectBox";
|
||||
import useProvince from "@/lib/hooks/useProvince";
|
||||
import PersianTextField from "@/core/components/PersianTextField";
|
||||
import CityController from "./CityController";
|
||||
import LogesticController from "./LogesticController";
|
||||
|
||||
const TollHouseInfo = ({ control }) => {
|
||||
const { provinces, loadingProvinces, errorProvinces } = useProvince();
|
||||
return (
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="name"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<PersianTextField
|
||||
value={value}
|
||||
variant="outlined"
|
||||
name="name"
|
||||
onChange={onChange}
|
||||
label="نام راهدارخانه"
|
||||
placeholder="نام راهدارخانه را وارد کنید"
|
||||
fullWidth
|
||||
size="small"
|
||||
error={error}
|
||||
helperText={error?.message}
|
||||
InputLabelProps={{ shrink: true }}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="phone"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="تلفن راهدارخانه"
|
||||
value={value}
|
||||
placeholder="تلفن راهدارخانه را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<LogesticController control={control} />
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="status"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<SelectBox
|
||||
value={field.value}
|
||||
label="وضعیت"
|
||||
selectors={[
|
||||
{ id: 0, name: "فعال" },
|
||||
{ id: 1, name: "غیر فعال" },
|
||||
]}
|
||||
schema={{ name: "name", value: "id" }}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
helperText={error?.message}
|
||||
isLoading={false}
|
||||
errorEcured={false}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="type"
|
||||
control={control}
|
||||
render={({ field, fieldState: { error } }) => {
|
||||
return (
|
||||
<SelectBox
|
||||
value={field.value}
|
||||
label="نوع"
|
||||
selectors={[
|
||||
{ id: 0, name: "داعمی" },
|
||||
{ id: 1, name: "موقت" },
|
||||
{ id: 2, name: "فصلی" },
|
||||
]}
|
||||
schema={{ name: "name", value: "id" }}
|
||||
error={error}
|
||||
onChange={field.onChange}
|
||||
helperText={error?.message}
|
||||
isLoading={false}
|
||||
errorEcured={false}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="team_num"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="تعداد اکیپ"
|
||||
value={value}
|
||||
placeholder="تعداد اکیپ را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="staff_num"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="تعداد پرسنل"
|
||||
value={value}
|
||||
placeholder="تعداد پرسنل را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="responsible_name"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<PersianTextField
|
||||
value={value}
|
||||
variant="outlined"
|
||||
name="responsible_name"
|
||||
onChange={onChange}
|
||||
label="نام مسئول"
|
||||
placeholder="نام مسئول را وارد کنید"
|
||||
fullWidth
|
||||
size="small"
|
||||
error={error}
|
||||
helperText={error?.message}
|
||||
InputLabelProps={{ shrink: true }}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="responsible_mobile"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="تلفن مسئول"
|
||||
value={value}
|
||||
placeholder="تلفن مسئول را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="successor_name"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<PersianTextField
|
||||
value={value}
|
||||
variant="outlined"
|
||||
name="responsible_name"
|
||||
onChange={onChange}
|
||||
label="نام جانشین"
|
||||
placeholder="نام جانشین را وارد کنید"
|
||||
fullWidth
|
||||
size="small"
|
||||
error={error}
|
||||
helperText={error?.message}
|
||||
InputLabelProps={{ shrink: true }}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Controller
|
||||
name="successor_mobile"
|
||||
control={control}
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<TextField
|
||||
fullWidth
|
||||
size="small"
|
||||
label="تلفن جانشین"
|
||||
value={value}
|
||||
placeholder="تلفن جانشین را وارد کنید"
|
||||
error={!!error}
|
||||
helperText={error ? error.message : null}
|
||||
variant="outlined"
|
||||
InputLabelProps={{ shrink: true }}
|
||||
type={"tel"}
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
onChange={(event) => {
|
||||
const inputValue = event.target.value;
|
||||
if (isNaN(Number(inputValue))) {
|
||||
return;
|
||||
}
|
||||
onChange(inputValue);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default TollHouseInfo;
|
||||
@@ -0,0 +1,20 @@
|
||||
import MapInfoOneMarker from "@/core/components/MapInfoOneMarker";
|
||||
import { Stack } from "@mui/material";
|
||||
import { useWatch } from "react-hook-form";
|
||||
|
||||
const TollHouseLocation = ({ setValue, errors, control }) => {
|
||||
const StartPoint = useWatch({ control, name: "start_point" });
|
||||
return (
|
||||
<>
|
||||
<Stack sx={{ mt: 2 }}>
|
||||
<MapInfoOneMarker
|
||||
setValue={setValue}
|
||||
StartPoint={StartPoint}
|
||||
errors={errors}
|
||||
title={"برای ثبت محل پروژه، لطفاً نقشه را بیشتر زوم کنید."}
|
||||
/>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default TollHouseLocation;
|
||||
@@ -0,0 +1,140 @@
|
||||
import { Button, Dialog, IconButton, useMediaQuery } from "@mui/material";
|
||||
import { useState } from "react";
|
||||
import CreateTollHouseContent from "./CreateTollHouseContent";
|
||||
import { AddCircle } from "@mui/icons-material";
|
||||
import { useTheme } from "@emotion/react";
|
||||
import { CREATE_TOLL_HOUSE } from "@/core/utils/routes";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import CloseIcon from "@mui/icons-material/Close";
|
||||
import { useAuth } from "@/lib/contexts/auth";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
|
||||
const CreateTollHouse = ({ mutate }) => {
|
||||
const requestServer = useRequest({ notificationSuccess: true });
|
||||
const theme = useTheme();
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
|
||||
const [open, setOpen] = useState(false);
|
||||
const { user } = useAuth();
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasCreateProvincePermission = userPermissions.some((item) => ["add-tollhouse"].includes(item));
|
||||
const handleOpen = () => {
|
||||
setOpen(true);
|
||||
};
|
||||
const SubmitCreateTollHouse = async (result) => {
|
||||
const fields = [
|
||||
"province_id",
|
||||
"city_id",
|
||||
"name",
|
||||
"status",
|
||||
"type",
|
||||
"team_num",
|
||||
"staff_num",
|
||||
"phone",
|
||||
"responsible_name",
|
||||
"responsible_mobile",
|
||||
"successor_name",
|
||||
"successor_mobile",
|
||||
"machines_light",
|
||||
"machines_sheavy",
|
||||
"machines_heavy",
|
||||
"overview_files_1",
|
||||
"overview_files_2",
|
||||
"overview_files_3",
|
||||
"overview_files_4",
|
||||
"overview_files_5",
|
||||
];
|
||||
const formData = new FormData();
|
||||
fields.forEach((field) => {
|
||||
if (result[field] !== undefined && result[field] !== null) {
|
||||
formData.append(field, result[field]);
|
||||
}
|
||||
});
|
||||
formData.append("lat", result.start_point.lat);
|
||||
formData.append("lng", result.start_point.lng);
|
||||
await requestServer(`${CREATE_TOLL_HOUSE}`, "post", {
|
||||
data: formData,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpen(false);
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
const defaultValues = {
|
||||
name: "",
|
||||
is_province: !hasCreateProvincePermission,
|
||||
province_id: !hasCreateProvincePermission ? user.province_id : null,
|
||||
city_id: null,
|
||||
status: "",
|
||||
type: "",
|
||||
phone: "",
|
||||
team_num: "",
|
||||
staff_num: "",
|
||||
responsible_name: "",
|
||||
responsible_mobile: "",
|
||||
successor_name: "",
|
||||
successor_mobile: "",
|
||||
machines_light: "",
|
||||
machines_sheavy: "",
|
||||
machines_heavy: "",
|
||||
overview_files_1: null,
|
||||
overview_files_2: null,
|
||||
overview_files_3: null,
|
||||
overview_files_4: null,
|
||||
overview_files_5: null,
|
||||
start_point: "",
|
||||
};
|
||||
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>
|
||||
)}
|
||||
<Dialog
|
||||
fullWidth
|
||||
open={open}
|
||||
onClose={() => setOpen(false)}
|
||||
PaperProps={{
|
||||
sx: {
|
||||
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
|
||||
},
|
||||
}}
|
||||
maxWidth={"md"}
|
||||
scroll="paper"
|
||||
>
|
||||
<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 && (
|
||||
<CreateTollHouseContent
|
||||
setOpen={setOpen}
|
||||
defaultValues={defaultValues}
|
||||
SubmitCreateTollHouse={SubmitCreateTollHouse}
|
||||
/>
|
||||
)}
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default CreateTollHouse;
|
||||
@@ -0,0 +1,107 @@
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { useEffect, useState } from "react";
|
||||
import { GET_TOLL_HOUSE_DETAILS, UPDATE_TOLL_HOUSE_ITEM } from "@/core/utils/routes";
|
||||
import DialogLoading from "@/core/components/DialogLoading";
|
||||
import CreateTollHouseContent from "../CreateTollHouse/CreateTollHouseContent";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
|
||||
const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasCreateProvincePermission = userPermissions.some((item) => ["add-receipt"].includes(item));
|
||||
const requestServer = useRequest();
|
||||
const [tollHouseItemDetails, setTollHouseItemDetails] = useState(null);
|
||||
const [tollHouseItemDetailsLoading, setTollHouseItemDetailsLoading] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
setTollHouseItemDetailsLoading(true);
|
||||
requestServer(`${GET_TOLL_HOUSE_DETAILS}/${rowId}`, "get")
|
||||
.then((response) => {
|
||||
setTollHouseItemDetails(response.data.data);
|
||||
setTollHouseItemDetailsLoading(false);
|
||||
})
|
||||
.catch((e) => {
|
||||
setTollHouseItemDetailsLoading(false);
|
||||
});
|
||||
}, [rowId]);
|
||||
|
||||
const defaultData = {
|
||||
phone: tollHouseItemDetails?.phone || "",
|
||||
is_province: !hasCreateProvincePermission,
|
||||
province_id: tollHouseItemDetails?.province_id || null,
|
||||
city_id: tollHouseItemDetails?.city_id || null,
|
||||
start_point: { lat: tollHouseItemDetails?.lat || "", lng: tollHouseItemDetails?.lng || "" },
|
||||
name: tollHouseItemDetails?.name || "",
|
||||
status: tollHouseItemDetails?.status || "",
|
||||
type: tollHouseItemDetails?.type || "",
|
||||
team_num: tollHouseItemDetails?.team_num || "",
|
||||
staff_num: tollHouseItemDetails?.staff_num || "",
|
||||
responsible_name: tollHouseItemDetails?.responsible_name || "",
|
||||
responsible_mobile: tollHouseItemDetails?.responsible_mobile || "",
|
||||
successor_name: tollHouseItemDetails?.successor_name || "",
|
||||
successor_mobile: tollHouseItemDetails?.successor_mobile || "",
|
||||
machines_light: tollHouseItemDetails?.machines_light || "",
|
||||
machines_sheavy: tollHouseItemDetails?.machines_sheavy || "",
|
||||
machines_heavy: tollHouseItemDetails?.machines_heavy || "",
|
||||
overview_files_1: tollHouseItemDetails?.files[0]?.path || null,
|
||||
overview_files_2: tollHouseItemDetails?.files[1]?.path || null,
|
||||
overview_files_3: tollHouseItemDetails?.files[2]?.path || null,
|
||||
overview_files_4: tollHouseItemDetails?.files[3]?.path || null,
|
||||
overview_files_5: tollHouseItemDetails?.files[4]?.path || null,
|
||||
};
|
||||
const HandleSubmit = async (result) => {
|
||||
const fields = [
|
||||
"province_id",
|
||||
"city_id",
|
||||
"name",
|
||||
"status",
|
||||
"type",
|
||||
"team_num",
|
||||
"staff_num",
|
||||
"phone",
|
||||
"responsible_name",
|
||||
"responsible_mobile",
|
||||
"successor_name",
|
||||
"successor_mobile",
|
||||
"machines_light",
|
||||
"machines_sheavy",
|
||||
"machines_heavy",
|
||||
];
|
||||
const formData = new FormData();
|
||||
fields.forEach((field) => {
|
||||
if (result[field] !== undefined && result[field] !== null) {
|
||||
formData.append(field, result[field]);
|
||||
}
|
||||
});
|
||||
for (let i = 1; i <= 5; i++) {
|
||||
if (result[`overview_files_${i}`] !== defaultData[`overview_files_${i}`]) {
|
||||
formData.append(`overview_files_${i}`, result[`overview_files_${i}`]);
|
||||
}
|
||||
}
|
||||
formData.append("lat", result.start_point.lat);
|
||||
formData.append("lng", result.start_point.lng);
|
||||
|
||||
await requestServer(`${UPDATE_TOLL_HOUSE_ITEM}/${rowId}`, "post", {
|
||||
data: formData,
|
||||
notificationSuccess: true,
|
||||
})
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenEditDialog(false);
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
return (
|
||||
<>
|
||||
{tollHouseItemDetailsLoading ? (
|
||||
<DialogLoading />
|
||||
) : (
|
||||
<CreateTollHouseContent
|
||||
setOpen={setOpenEditDialog}
|
||||
SubmitCreateTollHouse={HandleSubmit}
|
||||
defaultValues={defaultData}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default EditController;
|
||||
59
src/components/infrastructure/tollHouse/Form/Edit/index.jsx
Normal file
59
src/components/infrastructure/tollHouse/Form/Edit/index.jsx
Normal file
@@ -0,0 +1,59 @@
|
||||
import { Dialog, IconButton, Tooltip } from "@mui/material";
|
||||
import { useState } from "react";
|
||||
import BorderColorIcon from "@mui/icons-material/BorderColor";
|
||||
import EditController from "./EditController";
|
||||
import CloseIcon from "@mui/icons-material/Close";
|
||||
|
||||
const EditForm = ({ row, mutate, rowId }) => {
|
||||
const [openEditDialog, setOpenEditDialog] = useState(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title="ویرایش اطلاعات" arrow placement="right">
|
||||
<IconButton
|
||||
color="primary"
|
||||
sx={{ textTransform: "unset", alignSelf: "center" }}
|
||||
onClick={() => {
|
||||
setOpenEditDialog(true);
|
||||
}}
|
||||
>
|
||||
<BorderColorIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog
|
||||
maxWidth="md"
|
||||
fullWidth
|
||||
open={openEditDialog}
|
||||
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={() => setOpenEditDialog(false)}
|
||||
sx={(theme) => ({
|
||||
position: "absolute",
|
||||
right: 8,
|
||||
top: 8,
|
||||
zIndex: 50,
|
||||
color: theme.palette.grey[500],
|
||||
})}
|
||||
>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
{openEditDialog && (
|
||||
<EditController
|
||||
openEditDialog={openEditDialog}
|
||||
setOpenEditDialog={setOpenEditDialog}
|
||||
rowId={rowId}
|
||||
row={row}
|
||||
mutate={mutate}
|
||||
/>
|
||||
)}
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default EditForm;
|
||||
@@ -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_TOLL_HOUSE_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_TOLL_HOUSE_ITEM}/${rowId}`, "delete")
|
||||
.then(() => {
|
||||
mutate();
|
||||
setOpenDeleteDialog(false);
|
||||
setSubmitting(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;
|
||||
@@ -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;
|
||||
@@ -0,0 +1,45 @@
|
||||
import { Box, Stack, Typography, useTheme } from "@mui/material";
|
||||
import Image from "next/image";
|
||||
|
||||
const ImageFormContent = ({ image, title }) => {
|
||||
const theme = useTheme();
|
||||
return (
|
||||
<Stack
|
||||
spacing={2}
|
||||
alignItems="center"
|
||||
justifyContent="center"
|
||||
sx={{
|
||||
my: 2,
|
||||
padding: 2,
|
||||
borderRadius: "12px",
|
||||
border: `1px solid ${theme.palette.primary.main}`,
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
variant="h6"
|
||||
sx={{
|
||||
color: theme.palette.primary.dark,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
>
|
||||
{title}
|
||||
</Typography>
|
||||
<Box sx={{ width: "100%", position: "relative", aspectRatio: "16/9" }}>
|
||||
<Image
|
||||
src={image}
|
||||
alt="Image"
|
||||
fill={true}
|
||||
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
|
||||
loading="lazy"
|
||||
style={{
|
||||
objectFit: "contain",
|
||||
marginBottom: "16px",
|
||||
borderRadius: "12px",
|
||||
border: `1px solid ${theme.palette.divider}`,
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default ImageFormContent;
|
||||
@@ -0,0 +1,38 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import ImageFormContent from "./ImageFormContent";
|
||||
import DialogLoading from "@/core/components/DialogLoading";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { GET_TOLL_HOUSE_IMAGES } from "@/core/utils/routes";
|
||||
import { Typography } from "@mui/material";
|
||||
|
||||
const ImagesContent = ({ rowId }) => {
|
||||
const requestServer = useRequest();
|
||||
const [tollHouseImages, setTollHouseImages] = useState(null);
|
||||
const [tollHouseImagesLoading, setTollHouseImagesLoading] = useState(false);
|
||||
useEffect(() => {
|
||||
setTollHouseImagesLoading(true);
|
||||
requestServer(`${GET_TOLL_HOUSE_IMAGES}/${rowId}`, "get")
|
||||
.then((response) => {
|
||||
setTollHouseImages(response.data.data);
|
||||
setTollHouseImagesLoading(false);
|
||||
})
|
||||
.catch((e) => {
|
||||
setTollHouseImagesLoading(false);
|
||||
});
|
||||
}, [rowId]);
|
||||
|
||||
return (
|
||||
<>
|
||||
{tollHouseImagesLoading ? (
|
||||
<DialogLoading />
|
||||
) : tollHouseImages ? (
|
||||
tollHouseImages.map((image, index) => {
|
||||
return <ImageFormContent key={index} image={image.path} />;
|
||||
})
|
||||
) : (
|
||||
<Typography textAlign={"center"}>تصویری در سامانه یافت نشد</Typography>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ImagesContent;
|
||||
@@ -0,0 +1,43 @@
|
||||
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
|
||||
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@mui/material";
|
||||
import { useEffect, useState } from "react";
|
||||
import ImagesContent from "./ImagesContent";
|
||||
import useRequest from "@/lib/hooks/useRequest";
|
||||
import { GET_TOLL_HOUSE_IMAGES } from "@/core/utils/routes";
|
||||
import DialogLoading from "@/core/components/DialogLoading";
|
||||
|
||||
const ImageDialog = ({ rowId }) => {
|
||||
const [openImageDialog, setOpenImageDialog] = useState(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title="تصاویر">
|
||||
<IconButton color="primary" onClick={() => setOpenImageDialog(true)}>
|
||||
<PhotoLibraryIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog
|
||||
fullWidth
|
||||
open={openImageDialog}
|
||||
onClose={() => setOpenImageDialog(false)}
|
||||
PaperProps={{
|
||||
sx: {
|
||||
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
|
||||
},
|
||||
}}
|
||||
maxWidth={"sm"}
|
||||
scroll="paper"
|
||||
>
|
||||
<DialogTitle sx={{ fontSize: "large" }}>تصاویر</DialogTitle>
|
||||
<DialogContent>{openImageDialog && <ImagesContent rowId={rowId} />}</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
|
||||
بستن
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default ImageDialog;
|
||||
@@ -0,0 +1,35 @@
|
||||
"use client";
|
||||
import { Box, Button, DialogActions, DialogContent, Stack } from "@mui/material";
|
||||
import React from "react";
|
||||
import dynamic from "next/dynamic";
|
||||
import MapLoading from "@/core/components/MapLayer/Loading";
|
||||
import ShowLocationMarker from "@/core/components/ShowLocationMarker";
|
||||
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
|
||||
loading: () => <MapLoading />,
|
||||
ssr: false,
|
||||
});
|
||||
|
||||
const LocationFormContent = ({ setOpenLocationDialog, start_lat, start_lng, end_lat, end_lng }) => {
|
||||
return (
|
||||
<>
|
||||
<DialogContent>
|
||||
<Box sx={{ width: "400px", height: "400px" }}>
|
||||
<MapLayer>
|
||||
<ShowLocationMarker
|
||||
start_lat={start_lat}
|
||||
start_lng={start_lng}
|
||||
end_lat={end_lat}
|
||||
end_lng={end_lng}
|
||||
/>
|
||||
</MapLayer>
|
||||
</Box>
|
||||
</DialogContent>
|
||||
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
|
||||
<Button onClick={() => setOpenLocationDialog(false)} variant="outlined" color="secondary">
|
||||
بستن
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default LocationFormContent;
|
||||
@@ -0,0 +1,38 @@
|
||||
import React, { useState } from "react";
|
||||
import { Tooltip, IconButton, Dialog, DialogTitle } from "@mui/material";
|
||||
import ExploreIcon from "@mui/icons-material/Explore";
|
||||
import LocationFormContent from "./LocationFormContent";
|
||||
const LocationForm = ({ start_lat, start_lng, end_lat, end_lng }) => {
|
||||
const [openLocationDialog, setOpenLocationDialog] = useState(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title="موقعیت">
|
||||
<IconButton color="primary" onClick={() => setOpenLocationDialog(true)}>
|
||||
<ExploreIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog
|
||||
open={openLocationDialog}
|
||||
onClose={() => setOpenLocationDialog(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>
|
||||
<LocationFormContent
|
||||
start_lat={start_lat}
|
||||
start_lng={start_lng}
|
||||
end_lat={end_lat}
|
||||
end_lng={end_lng}
|
||||
setOpenLocationDialog={setOpenLocationDialog}
|
||||
/>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default LocationForm;
|
||||
21
src/components/infrastructure/tollHouse/RowActions/index.jsx
Normal file
21
src/components/infrastructure/tollHouse/RowActions/index.jsx
Normal file
@@ -0,0 +1,21 @@
|
||||
import { Box } from "@mui/material";
|
||||
import EditForm from "../Form/Edit";
|
||||
import DeleteDialog from "./DeleteDialog";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
|
||||
const RowActions = ({ row, mutate }) => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasEditPermission = userPermissions.some((item) =>
|
||||
["edit-tollhouse", "edit-tollhouse-province"].includes(item)
|
||||
);
|
||||
const hasDeletePermission = userPermissions.some((item) =>
|
||||
["delete-tollhouse", "delete-tollhouse-province"].includes(item)
|
||||
);
|
||||
return (
|
||||
<Box sx={{ display: "flex", gap: 1 }}>
|
||||
{hasEditPermission && <EditForm row={row} mutate={mutate} rowId={row.getValue("id")} />}
|
||||
{hasDeletePermission && <DeleteDialog mutate={mutate} rowId={row.getValue("id")} />}
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
export default RowActions;
|
||||
412
src/components/infrastructure/tollHouse/TollHouseList.jsx
Normal file
412
src/components/infrastructure/tollHouse/TollHouseList.jsx
Normal file
@@ -0,0 +1,412 @@
|
||||
"use client";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { Box, Stack, Typography } from "@mui/material";
|
||||
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
|
||||
import Toolbar from "./Toolbar";
|
||||
import { GET_TOLL_HOUSE_LIST } from "@/core/utils/routes";
|
||||
import moment from "jalali-moment";
|
||||
import RowActions from "./RowActions";
|
||||
import useProvinces from "@/lib/hooks/useProvince";
|
||||
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
|
||||
import useEdaratLists from "@/lib/hooks/useEdaratLists";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
import LocationForm from "./RowActions/LocationForm";
|
||||
import ImageDialog from "./RowActions/ImageForm";
|
||||
|
||||
const statusOptions = [
|
||||
{ value: "", label: "همه وضعیت ها" },
|
||||
{ value: 0, label: "غیرفعال" },
|
||||
{ value: 1, label: "فعال" },
|
||||
];
|
||||
const typeOptions = [
|
||||
{ value: "", label: "همه نوع ها" },
|
||||
{ value: 0, label: "فصلی" },
|
||||
{ value: 1, label: "داعمی" },
|
||||
{ value: 2, label: "موقت" },
|
||||
];
|
||||
const TollHouseList = () => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasProvincePermission = userPermissions.some((item) => ["add-tollhouse"].includes(item));
|
||||
|
||||
const columns = useMemo(() => {
|
||||
return [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: "کد یکتا", // Unique Code
|
||||
id: "id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: false,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
|
||||
{
|
||||
header: "اطلاعات راهدارخانه",
|
||||
id: "tollHouseInfo",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
grow: false,
|
||||
size: 50,
|
||||
columns: [
|
||||
{
|
||||
accessorKey: "name",
|
||||
header: "نام راهدارخانه",
|
||||
id: "name",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
sortDescFirst: false,
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "province_id",
|
||||
header: "استان",
|
||||
id: "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_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "city_id",
|
||||
header: "شهرستان", // Office
|
||||
id: "city_id",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
dependencyId: "province_id",
|
||||
grow: false,
|
||||
size: 120,
|
||||
ColumnSelectComponent: (props) => {
|
||||
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
|
||||
props.dependencyFieldValue.value
|
||||
);
|
||||
const [prevDependency, setPrevDependency] = useState(props.dependencyFieldValue.value);
|
||||
|
||||
const getColumnSelectOptions = useMemo(() => {
|
||||
if (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 (prevDependency === props.dependencyFieldValue?.value) return;
|
||||
props.handleChange({ ...props.filterParameters, value: "" });
|
||||
setPrevDependency(props.dependencyFieldValue?.value);
|
||||
}, [props.dependencyFieldValue?.value]);
|
||||
return (
|
||||
<CustomSelectByDependency
|
||||
{...props}
|
||||
value={
|
||||
props.dependencyFieldValue?.value === ""
|
||||
? "empty"
|
||||
: loadingEdaratList
|
||||
? "loading"
|
||||
: props.filterParameters.value
|
||||
}
|
||||
columnSelectOption={getColumnSelectOptions}
|
||||
/>
|
||||
);
|
||||
},
|
||||
Cell: ({ row }) => <>{row.original.city_name}</>,
|
||||
},
|
||||
{
|
||||
accessorKey: "status",
|
||||
header: "وضعیت",
|
||||
id: "status",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return statusOptions.map((status) => ({
|
||||
value: status.value,
|
||||
label: status.label,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
const status = statusOptions.find((option) => option.value == row.original.status);
|
||||
return <Typography variant="body2">{status?.label || ""}</Typography>;
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "type",
|
||||
header: "نوع",
|
||||
id: "type",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterMode: "equals",
|
||||
grow: false,
|
||||
size: 100,
|
||||
columnSelectOption: () => {
|
||||
return typeOptions.map((type) => ({
|
||||
value: type.value,
|
||||
label: type.label,
|
||||
}));
|
||||
},
|
||||
Cell: ({ row }) => {
|
||||
return <Typography variant={"body2"}>{row.original.type_fa}</Typography>;
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "phone",
|
||||
header: "تلفن راهدارخانه",
|
||||
id: "phone",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "team_num",
|
||||
header: "تعداد اکیپ",
|
||||
id: "team_num",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "staff_num",
|
||||
header: "تعداد پرسنل",
|
||||
id: "staff_num",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "responsible_name",
|
||||
header: "مسئول",
|
||||
id: "responsible_name",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "responsible_mobile",
|
||||
header: "شماره مسئول",
|
||||
id: "responsible_mobile",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "successor_name",
|
||||
header: "جانشین",
|
||||
id: "successor_name",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
{
|
||||
accessorKey: "successor_mobile",
|
||||
header: "شماره جانشین",
|
||||
id: "successor_mobile",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 120,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
header: "ماشین آلات",
|
||||
id: "machines",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "text",
|
||||
grow: false,
|
||||
size: 50,
|
||||
columns: [
|
||||
{
|
||||
accessorKey: "machines_light",
|
||||
header: "ماشین آلات سبک",
|
||||
id: "machines_light",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "machines_sheavy",
|
||||
header: "ماشین آلات نیمه سنگین",
|
||||
id: "machines_sheavy",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
accessorKey: "machines_heavy",
|
||||
header: "ماشین آلات سنگین",
|
||||
id: "machines_heavy",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: true,
|
||||
datatype: "text",
|
||||
filterMode: "equals",
|
||||
columnFilterModeOptions: ["equals", "contains"],
|
||||
grow: false,
|
||||
size: 100,
|
||||
},
|
||||
{
|
||||
header: "تصاویر",
|
||||
id: "images",
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
datatype: "array",
|
||||
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"}>
|
||||
<ImageDialog rowId={row.getValue("id")} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
header: "موقعیت", // Location
|
||||
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: ({ renderedCellValue, row }) => {
|
||||
return (
|
||||
<Stack alignItems={"center"} justifyContent={"center"}>
|
||||
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
|
||||
</Stack>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
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,
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
|
||||
<DataTableWithAuth
|
||||
need_filter={true}
|
||||
columns={columns}
|
||||
table_url={GET_TOLL_HOUSE_LIST}
|
||||
page_name={"tollHouse"}
|
||||
table_name={"tollHouseList"}
|
||||
sorting={[{ id: "id", desc: true }]}
|
||||
TableToolbar={Toolbar}
|
||||
enableRowActions
|
||||
positionActionsColumn={"last"}
|
||||
RowActions={RowActions}
|
||||
/>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default TollHouseList;
|
||||
10
src/components/infrastructure/tollHouse/Toolbar.jsx
Normal file
10
src/components/infrastructure/tollHouse/Toolbar.jsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { Box } from "@mui/material";
|
||||
import CreateTollHouse from "./Form/CreateTollHouse";
|
||||
import { usePermissions } from "@/lib/hooks/usePermissions";
|
||||
|
||||
const Toolbar = ({ table, filterData, mutate }) => {
|
||||
const { data: userPermissions } = usePermissions();
|
||||
const hasAddPermission = userPermissions.some((item) => ["add-tollhouse", "add-tollhouse-province"].includes(item));
|
||||
return <Box sx={{ display: "flex", gap: 1 }}>{hasAddPermission && <CreateTollHouse mutate={mutate} />}</Box>;
|
||||
};
|
||||
export default Toolbar;
|
||||
14
src/components/infrastructure/tollHouse/index.jsx
Normal file
14
src/components/infrastructure/tollHouse/index.jsx
Normal file
@@ -0,0 +1,14 @@
|
||||
"use client";
|
||||
import PageTitle from "@/core/components/PageTitle";
|
||||
import { Stack } from "@mui/material";
|
||||
import TollHouseList from "./TollHouseList";
|
||||
|
||||
const TollHousePage = () => {
|
||||
return (
|
||||
<Stack spacing={1}>
|
||||
<PageTitle title={"فهرست راهدارخانه ها"} />
|
||||
<TollHouseList />
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
export default TollHousePage;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user