108 lines
4.7 KiB
JavaScript
108 lines
4.7 KiB
JavaScript
import { Divider, Grid, Paper, Stack, Typography } from "@mui/material";
|
|
import { useTranslations } from "next-intl";
|
|
import Filter from "../Filter";
|
|
import useChart from "@/lib/app/hooks/useChart";
|
|
import {
|
|
GET_LOAN_EXPERTPROGRESS_BANK_REPORT,
|
|
GET_LOAN_EXPERTPROGRESS_CARTABLE,
|
|
GET_LOAN_EXPERTPROGRESS_PLANING_COUNCIL,
|
|
} from "@/core/data/apiRoutes";
|
|
import LoadingHardPage from "@/core/components/LoadingHardPage";
|
|
import AnalyticsIcon from "@mui/icons-material/Analytics";
|
|
import FunctionalityCharts from "./FunctionalityCharts";
|
|
|
|
const LoanDetails = () => {
|
|
const t = useTranslations();
|
|
|
|
const {
|
|
errorReportList: errorReportList1,
|
|
isLoadingReportList: isLoadingReportList1,
|
|
reportList: reportList1,
|
|
setFilterOption: setFilterOption1,
|
|
mutate: mutate1,
|
|
} = useChart(GET_LOAN_EXPERTPROGRESS_CARTABLE);
|
|
const {
|
|
errorReportList: errorReportList2,
|
|
isLoadingReportList: isLoadingReportList2,
|
|
reportList: reportList2,
|
|
setFilterOption: setFilterOption2,
|
|
mutate: mutate2,
|
|
} = useChart(GET_LOAN_EXPERTPROGRESS_PLANING_COUNCIL);
|
|
const {
|
|
errorReportList: errorReportList3,
|
|
isLoadingReportList: isLoadingReportList3,
|
|
reportList: reportList3,
|
|
setFilterOption: setFilterOption3,
|
|
mutate: mutate3,
|
|
} = useChart(GET_LOAN_EXPERTPROGRESS_BANK_REPORT);
|
|
|
|
return (
|
|
<Paper elevation={2} sx={{ width: "95%", mx: "auto", my: 2, pb: 2, background: "#f7f7f7e6" }}>
|
|
<Filter
|
|
title={t("reports.loan_details")}
|
|
filterItem={[{ type: "province", type_fa: "استان", multiple: false }]}
|
|
setFilterOption={(fields) => {
|
|
setFilterOption1(fields);
|
|
setFilterOption2(fields);
|
|
setFilterOption3(fields);
|
|
}}
|
|
isLoadingReportList={isLoadingReportList1 || isLoadingReportList3 || isLoadingReportList2}
|
|
mutate={() => {
|
|
mutate1();
|
|
mutate2();
|
|
mutate3();
|
|
}}
|
|
/>
|
|
<Grid container sx={{ justifyContent: { xs: "center", position: "relative" } }}>
|
|
{isLoadingReportList1 || isLoadingReportList2 || isLoadingReportList3 ? (
|
|
<Grid item xs={12} sx={{ aspectRatio: "3/0.95" }}>
|
|
<LoadingHardPage
|
|
icon={<AnalyticsIcon sx={{ width: "inherit", height: "inherit" }} />}
|
|
loading={isLoadingReportList1 || isLoadingReportList2 || isLoadingReportList3}
|
|
label={t("reports.loading_fetching_reports")}
|
|
width={100}
|
|
height={100}
|
|
sx={{ position: "absolute", bgcolor: "#f7f7f7e6" }}
|
|
/>
|
|
</Grid>
|
|
) : errorReportList1 || errorReportList2 || errorReportList3 ? (
|
|
<Grid
|
|
item
|
|
xs={12}
|
|
sx={{ aspectRatio: "3/0.95", display: "flex", justifyContent: "center", alignItems: "center" }}
|
|
>
|
|
<Typography
|
|
variant="h6"
|
|
sx={{
|
|
color: "#858585",
|
|
letterSpacing: "0.1rem",
|
|
}}
|
|
>
|
|
{t("reports.error_fetching_reports")}
|
|
</Typography>
|
|
</Grid>
|
|
) : (
|
|
<Stack sx={{ width: "100%" }}>
|
|
<FunctionalityCharts reportList={reportList1.bus} name={t("reports.bus")} />
|
|
<Divider />
|
|
<FunctionalityCharts reportList={reportList1.minibus} name={t("reports.minibus")} />
|
|
<Divider />
|
|
<FunctionalityCharts reportList={reportList2.bus} name={t("reports.planing_council_bus")} />
|
|
<Divider />
|
|
<FunctionalityCharts
|
|
reportList={reportList2.minibus}
|
|
name={t("reports.planing_council_minibus")}
|
|
/>
|
|
<Divider />
|
|
<FunctionalityCharts reportList={reportList3.bus} name={t("reports.bank_report_bus")} />
|
|
<Divider />
|
|
<FunctionalityCharts reportList={reportList3.minibus} name={t("reports.bank_report_minibus")} />
|
|
</Stack>
|
|
)}
|
|
</Grid>
|
|
</Paper>
|
|
);
|
|
};
|
|
|
|
export default LoanDetails;
|