Merge branch 'feature/mohammad_excel_reports_page' into 'develop'
Feature/mohammad excel reports page See merge request witel-front-end/loan-facilities/expert!149
This commit is contained in:
@@ -655,6 +655,7 @@
|
|||||||
"provinces": "استان های",
|
"provinces": "استان های",
|
||||||
"province": "استان",
|
"province": "استان",
|
||||||
"all_provinces": "تمامی استان ها",
|
"all_provinces": "تمامی استان ها",
|
||||||
|
"excel_export_reports": "خروجی به اکسل گزارش عملکرد",
|
||||||
"year": "سال",
|
"year": "سال",
|
||||||
"years": "سال های",
|
"years": "سال های",
|
||||||
"text_field_loading_provinces_list": "درحال دریافت استان ها",
|
"text_field_loading_provinces_list": "درحال دریافت استان ها",
|
||||||
|
|||||||
63
src/components/dashboard/reports/ExcelExport/index.jsx
Normal file
63
src/components/dashboard/reports/ExcelExport/index.jsx
Normal file
@@ -0,0 +1,63 @@
|
|||||||
|
import {Accordion, AccordionSummary, Box, Button, CircularProgress, Stack, Typography} from "@mui/material";
|
||||||
|
import AssignmentIcon from '@mui/icons-material/Assignment';
|
||||||
|
import BackupIcon from '@mui/icons-material/Backup';
|
||||||
|
import {useTranslations} from "next-intl";
|
||||||
|
import {GET_EXCEL_EXPORT} from "@/core/data/apiRoutes";
|
||||||
|
import moment from "jalali-moment";
|
||||||
|
import FileSaver from 'file-saver';
|
||||||
|
import useRequest from "@/lib/app/hooks/useRequest";
|
||||||
|
import {useState} from "react";
|
||||||
|
|
||||||
|
const ExcelExport = () => {
|
||||||
|
const t = useTranslations();
|
||||||
|
const requestServer = useRequest();
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const clickHandler = () => {
|
||||||
|
setLoading(true)
|
||||||
|
requestServer(GET_EXCEL_EXPORT, 'get', {
|
||||||
|
auth: true,
|
||||||
|
requestOptions: {responseType: 'blob'}
|
||||||
|
}).then((response) => {
|
||||||
|
const filename = `گزارش عملکرد_${moment().format('jYYYY_jMM_jDD')}.xlsx`;
|
||||||
|
FileSaver.saveAs(response.data, filename);
|
||||||
|
}).catch(() => {
|
||||||
|
}).finally(() => {
|
||||||
|
setLoading(false)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Stack sx={{width: "95%", mx: "auto"}}>
|
||||||
|
<Accordion elevation={0} sx={{
|
||||||
|
width: "100%",
|
||||||
|
mb: 2,
|
||||||
|
borderBottom: 2,
|
||||||
|
borderBottomColor: "divider",
|
||||||
|
backgroundColor: "#f1f1f1",
|
||||||
|
}} expanded={false}>
|
||||||
|
<AccordionSummary sx={{cursor: "unset !important"}}>
|
||||||
|
<Box sx={{width: "100%", display: "flex", alignItems: "center", justifyContent: "space-between"}}>
|
||||||
|
<Box sx={{display: "flex", alignItems: "center", gap: 0.5}}>
|
||||||
|
<AssignmentIcon sx={{color: "primary.main"}}/>
|
||||||
|
<Typography sx={{fontWeight: 500, color: "primary.main"}}>
|
||||||
|
{t("filters.excel_export_reports")}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
<Button onClick={clickHandler} variant="contained"
|
||||||
|
sx={{backgroundColor: "success.main"}}
|
||||||
|
disabled={loading}
|
||||||
|
startIcon={loading ?
|
||||||
|
<CircularProgress size={20} color="inherit"/> :
|
||||||
|
<BackupIcon/>}
|
||||||
|
>
|
||||||
|
{t("filters.export")}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</AccordionSummary>
|
||||||
|
</Accordion>
|
||||||
|
</Stack>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ExcelExport;
|
||||||
@@ -14,7 +14,7 @@ const FunctionalityCharts = ({reportList}) => {
|
|||||||
<Grid container sx={{width: "100%"}}>
|
<Grid container sx={{width: "100%"}}>
|
||||||
{
|
{
|
||||||
Object.entries(reportList).map(([entryKey, innerObject]) => {
|
Object.entries(reportList).map(([entryKey, innerObject]) => {
|
||||||
let percentage = innerObject.total !== 0 ? (innerObject.total - innerObject.pending) / innerObject.total * 100 : 0;
|
let percentage = innerObject.total !== 0 && innerObject.pending !== 64 ? (innerObject.total - innerObject.pending) / innerObject.total * 100 : 0;
|
||||||
const ItemName = DataItemsName.find(item => item.id === entryKey).name;
|
const ItemName = DataItemsName.find(item => item.id === entryKey).name;
|
||||||
return (
|
return (
|
||||||
<Grid key={entryKey} item xs={12} sm={10} md={6} xl={3}
|
<Grid key={entryKey} item xs={12} sm={10} md={6} xl={3}
|
||||||
|
|||||||
@@ -1,8 +1,10 @@
|
|||||||
import LoanDetails from "@/components/dashboard/reports/LoanDetails";
|
import LoanDetails from "@/components/dashboard/reports/LoanDetails";
|
||||||
|
import ExcelExport from "@/components/dashboard/reports/ExcelExport";
|
||||||
|
|
||||||
const DashboardReportsComponent = (props) => {
|
const DashboardReportsComponent = (props) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
<ExcelExport/>
|
||||||
<LoanDetails/>
|
<LoanDetails/>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -225,6 +225,7 @@ export const GET_PERMISSIONS_LIST =
|
|||||||
|
|
||||||
// reports
|
// reports
|
||||||
export const GET_EXPORT = BASE_URL + "/dashboard/exports/navgan"
|
export const GET_EXPORT = BASE_URL + "/dashboard/exports/navgan"
|
||||||
|
export const GET_EXCEL_EXPORT = BASE_URL + "/dashboard/exports/navgan/expert_progress"
|
||||||
export const GET_PROVINCE_PROGRESS = BASE_URL + "/dashboard/reports/navgan/province_progress"
|
export const GET_PROVINCE_PROGRESS = BASE_URL + "/dashboard/reports/navgan/province_progress"
|
||||||
export const GET_LOAN_DISTRIBUTION = BASE_URL + "/dashboard/reports/navgan/loan_distribution"
|
export const GET_LOAN_DISTRIBUTION = BASE_URL + "/dashboard/reports/navgan/loan_distribution"
|
||||||
export const GET_LOAN_EXPERTPROGRESS = BASE_URL + "/dashboard/reports/navgan/expert_progress"
|
export const GET_LOAN_EXPERTPROGRESS = BASE_URL + "/dashboard/reports/navgan/expert_progress"
|
||||||
|
|||||||
@@ -8,7 +8,7 @@ const useProvince = () => {
|
|||||||
//swr config
|
//swr config
|
||||||
const fetcher = (...args) => {
|
const fetcher = (...args) => {
|
||||||
return requestServer(args, 'get').then(({data}) => {
|
return requestServer(args, 'get').then(({data}) => {
|
||||||
return data;
|
return data.data;
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
})
|
})
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user