249 lines
9.9 KiB
JavaScript
249 lines
9.9 KiB
JavaScript
"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 { usePermissions } from "@/lib/hooks/usePermissions";
|
||
import useProvinces from "@/lib/hooks/useProvince";
|
||
import useRequest from "@/lib/hooks/useRequest";
|
||
import useSafetyAndPrivacyGetItems from "@/lib/hooks/useSafetyAndPrivacyGetItems";
|
||
import { Box, 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 requestServer = useRequest();
|
||
const [data, setData] = useState(null);
|
||
const [isLoading, setLoading] = useState(true);
|
||
|
||
const defaultValues = useMemo(() => {
|
||
const provinceFilter = {
|
||
header: "استان",
|
||
id: "province_id",
|
||
filterMode: "equals",
|
||
datatype: "numeric",
|
||
value: "",
|
||
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}
|
||
/>
|
||
);
|
||
},
|
||
};
|
||
|
||
return [
|
||
...(hasProvincesPermission ? [provinceFilter] : []),
|
||
{
|
||
header: "مورد مشاهده شده",
|
||
id: "info_id",
|
||
filterMode: "equals",
|
||
datatype: "numeric",
|
||
value: "",
|
||
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: "",
|
||
selectOption: () => {
|
||
return axisOptions.map((status) => ({
|
||
value: status.value,
|
||
label: status.label,
|
||
}));
|
||
},
|
||
},
|
||
{
|
||
header: "وضعیت",
|
||
id: "step",
|
||
filterMode: "equals",
|
||
datatype: "numeric",
|
||
value: "",
|
||
selectOption: () => {
|
||
return statusOptions.map((status) => ({
|
||
value: status.value,
|
||
label: status.label,
|
||
}));
|
||
},
|
||
},
|
||
{
|
||
header: "تاریخ ثبت",
|
||
id: "created_at",
|
||
filterMode: "between",
|
||
datatype: "date",
|
||
value: ["", ""],
|
||
},
|
||
{
|
||
header: "تاریخ بازدید",
|
||
id: "activity_date_time",
|
||
filterMode: "between",
|
||
datatype: "date",
|
||
value: ["", ""],
|
||
},
|
||
{
|
||
header: "تاریخ بارگذاری مستندات",
|
||
id: "judiciary_document_upload_date",
|
||
filterMode: "between",
|
||
datatype: "date",
|
||
value: ["", ""],
|
||
},
|
||
{
|
||
header: "تاریخ اقدام",
|
||
id: "action_date",
|
||
filterMode: "between",
|
||
datatype: "date",
|
||
value: ["", ""],
|
||
},
|
||
];
|
||
}, []);
|
||
|
||
const [filterData, setFilterData] = useState(
|
||
defaultValues.reduce((acc, item) => {
|
||
acc[item.id] = item;
|
||
return acc;
|
||
}, {})
|
||
);
|
||
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 province_id = filterData.province_id.value;
|
||
if (province_id === "") {
|
||
try {
|
||
const response = await requestServer(`${GET_ROAD_SAFETY_PROVINCE_ACTIVITY_REPORT}?${query}`);
|
||
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) { }
|
||
} else {
|
||
try {
|
||
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([
|
||
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) { }
|
||
}
|
||
} 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;
|