From 1e23c6b332cf2a699e17c14d7d9765b165072307 Mon Sep 17 00:00:00 2001 From: AmirHossein Mahmoodi Date: Sun, 23 Feb 2025 13:30:22 +0000 Subject: [PATCH] Feature/amiriis receipt report --- .../dashboard/damages/report/page.js | 6 + .../damages/report/ExcelPrint/index.jsx | 72 ++++++ .../dashboard/damages/report/ReportLists.jsx | 243 ++++++++++++++++++ .../report/Search/FromDateController.jsx | 28 ++ .../report/Search/SearchReportField.jsx | 45 ++++ .../damages/report/Search/SelectProvince.jsx | 47 ++++ .../report/Search/ToDateController.jsx | 30 +++ .../dashboard/damages/report/Search/index.jsx | 13 + .../dashboard/damages/report/Toolbar.jsx | 11 + .../dashboard/damages/report/index.jsx | 137 ++++++++++ src/core/utils/pageMenu.js | 4 +- src/core/utils/routes.js | 6 + 12 files changed, 640 insertions(+), 2 deletions(-) create mode 100644 src/app/(withAuth)/dashboard/damages/report/page.js create mode 100644 src/components/dashboard/damages/report/ExcelPrint/index.jsx create mode 100644 src/components/dashboard/damages/report/ReportLists.jsx create mode 100644 src/components/dashboard/damages/report/Search/FromDateController.jsx create mode 100644 src/components/dashboard/damages/report/Search/SearchReportField.jsx create mode 100644 src/components/dashboard/damages/report/Search/SelectProvince.jsx create mode 100644 src/components/dashboard/damages/report/Search/ToDateController.jsx create mode 100644 src/components/dashboard/damages/report/Search/index.jsx create mode 100644 src/components/dashboard/damages/report/Toolbar.jsx create mode 100644 src/components/dashboard/damages/report/index.jsx diff --git a/src/app/(withAuth)/dashboard/damages/report/page.js b/src/app/(withAuth)/dashboard/damages/report/page.js new file mode 100644 index 0000000..27d0308 --- /dev/null +++ b/src/app/(withAuth)/dashboard/damages/report/page.js @@ -0,0 +1,6 @@ +import DamagesReportPage from "@/components/dashboard/damages/report" + +const Page = () => { + return +} +export default Page \ No newline at end of file diff --git a/src/components/dashboard/damages/report/ExcelPrint/index.jsx b/src/components/dashboard/damages/report/ExcelPrint/index.jsx new file mode 100644 index 0000000..79ea64f --- /dev/null +++ b/src/components/dashboard/damages/report/ExcelPrint/index.jsx @@ -0,0 +1,72 @@ +"use client"; +import { EXPORT_COUNTRY_RECEIPT_REPORT, EXPORT_PROVINCE_RECEIPT_REPORT } from "@/core/utils/routes"; +import useRequest from "@/lib/hooks/useRequest"; +import { useTheme } from "@emotion/react"; +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 { useMemo, 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_RECEIPT_REPORT : EXPORT_PROVINCE_RECEIPT_REPORT; + requestServer(`${requestUrl}?${filterParams}`, "get", { + requestOptions: { responseType: "blob" }, + }) + .then((response) => { + const filename = `خروجی کارتابل گزارشات خسارات وارده بر ابنیه فنی تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`; + FileSaver.saveAs(response.data, filename); + }) + .catch(() => { }) + .finally(() => { + setLoading(false); + }); + }; + + return ( + <> + {isMobile ? ( + + + + ) : ( + + )} + + ); +}; +export default PrintExcel; diff --git a/src/components/dashboard/damages/report/ReportLists.jsx b/src/components/dashboard/damages/report/ReportLists.jsx new file mode 100644 index 0000000..b12a9b8 --- /dev/null +++ b/src/components/dashboard/damages/report/ReportLists.jsx @@ -0,0 +1,243 @@ +"use client"; +import DataTableWithAuth from "@/core/components/DataTableWithAuth"; +import { Box } from "@mui/material"; +import { useMemo } from "react"; +import Toolbar from "./Toolbar"; + +const ReportLists = ({ data, specialFilter }) => { + console.log(data); + + const columns = useMemo(() => { + return [ + { + accessorKey: "edare_name", + header: "اداره کل", + id: "edare_name", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + }, + { + accessorKey: "tedade", + header: "تعداد کل", + id: "tedade", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + header: "تعداد نحوه شناسایی خسارت", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + columns: [ + { + accessorKey: "police_rah", + header: "گزارش پلیس راه", + id: "police_rah", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + accessorKey: "gozaresh_gasht", + header: "گزارش گشت راهداری", + id: "gozaresh_gasht", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + ] + }, + { + accessorKey: "kol_sabt_shode", + header: "مبلغ کل خسارات ثبت شده (ریال)", + id: "kol_sabt_shode", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + accessorKey: "vasel_shode", + header: "کل مبلغ وصول شده (ریال)", + id: "vasel_shode", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + header: "مبلغ وصول شده به تفکیک نوع پرداخت (ریال)", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + columns: [ + { + accessorKey: "vasel_shode_final", + header: "فیش", + id: "vasel_shode_final", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + accessorKey: "vasel_shode_bimeh", + header: "بیمه", + id: "vasel_shode_bimeh", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + { + accessorKey: "vasel_shode_daghi", + header: "داغی", + id: "vasel_shode_daghi", + enableColumnFilter: false, + enableSorting: false, + datatype: "text", + grow: false, + size: 50, + muiTableBodyCellProps: { + sx: { + textAlign: "center", + borderLeft: "1px solid #e1e1e1", + py: 0, + "&:first-of-type": { + borderLeft: "unset", + }, + }, + }, + Cell: ({ renderedCellValue }) => { + return (renderedCellValue / 1).toLocaleString(); + }, + }, + ] + }, + ]; + }, []); + + return ( + + + + ); +}; + +export default ReportLists; diff --git a/src/components/dashboard/damages/report/Search/FromDateController.jsx b/src/components/dashboard/damages/report/Search/FromDateController.jsx new file mode 100644 index 0000000..b18b320 --- /dev/null +++ b/src/components/dashboard/damages/report/Search/FromDateController.jsx @@ -0,0 +1,28 @@ +import { Controller } from "react-hook-form"; +import MuiDatePicker from "@/core/components/MuiDatePicker"; +import React from "react"; +import moment from "jalali-moment"; + +const FromDateController = ({ control }) => { + return ( + ( + { + const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD"); + onChange(formattedDate); // Update the field value in react-hook-form + }} + helperText={error ? error.message : null} + /> + )} + /> + ); +}; +export default FromDateController; diff --git a/src/components/dashboard/damages/report/Search/SearchReportField.jsx b/src/components/dashboard/damages/report/Search/SearchReportField.jsx new file mode 100644 index 0000000..ab8442c --- /dev/null +++ b/src/components/dashboard/damages/report/Search/SearchReportField.jsx @@ -0,0 +1,45 @@ +import { Button, Grid, LinearProgress, Typography } from "@mui/material"; +import SearchIcon from "@mui/icons-material/Search"; +import React from "react"; +import FromDateController from "./FromDateController"; +import ToDateController from "./ToDateController"; +import SelectProvince from "./SelectProvince"; +import { Controller } from "react-hook-form"; + +const SearchReportField = ({ control, hasProvincesPermission }) => { + return ( + + + + + + + + {hasProvincesPermission && ( + + + + )} + + ( + + )} + /> + + + ); +}; + +export default SearchReportField; diff --git a/src/components/dashboard/damages/report/Search/SelectProvince.jsx b/src/components/dashboard/damages/report/Search/SelectProvince.jsx new file mode 100644 index 0000000..b1d8a39 --- /dev/null +++ b/src/components/dashboard/damages/report/Search/SelectProvince.jsx @@ -0,0 +1,47 @@ +import { Controller } from "react-hook-form"; +import MuiDatePicker from "@/core/components/MuiDatePicker"; +import React from "react"; +import { FormControl, FormHelperText, InputLabel, LinearProgress, MenuItem, Select, Typography } from "@mui/material"; +import useProvinces from "@/lib/hooks/useProvince"; + +const SelectProvince = ({ control }) => { + const { provinces, loadingProvinces, errorProvinces } = useProvinces(); + return ( + ( + + استان + + {error && {error.message}} + + )} + /> + ); +}; +export default SelectProvince; diff --git a/src/components/dashboard/damages/report/Search/ToDateController.jsx b/src/components/dashboard/damages/report/Search/ToDateController.jsx new file mode 100644 index 0000000..6f8b0d8 --- /dev/null +++ b/src/components/dashboard/damages/report/Search/ToDateController.jsx @@ -0,0 +1,30 @@ +import { Controller, useWatch } from "react-hook-form"; +import MuiDatePicker from "@/core/components/MuiDatePicker"; +import React from "react"; +import moment from "jalali-moment"; + +const ToDateController = ({ control }) => { + const minDate = useWatch({ control, name: "from_date" }); + return ( + ( + { + const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD"); + onChange(formattedDate); // Update the field value in react-hook-form + }} + helperText={error ? error.message : null} + /> + )} + /> + ); +}; +export default ToDateController; diff --git a/src/components/dashboard/damages/report/Search/index.jsx b/src/components/dashboard/damages/report/Search/index.jsx new file mode 100644 index 0000000..f29d302 --- /dev/null +++ b/src/components/dashboard/damages/report/Search/index.jsx @@ -0,0 +1,13 @@ +import StyledForm from "@/core/components/StyledForm"; +import SearchReportField from "./SearchReportField"; + +const SearchReportList = ({ handleSubmit, onSearchSubmit, control, hasProvincesPermission }) => { + return ( + <> + + + + + ); +}; +export default SearchReportList; diff --git a/src/components/dashboard/damages/report/Toolbar.jsx b/src/components/dashboard/damages/report/Toolbar.jsx new file mode 100644 index 0000000..7dd930f --- /dev/null +++ b/src/components/dashboard/damages/report/Toolbar.jsx @@ -0,0 +1,11 @@ +import PrintExcel from "./ExcelPrint"; +import { Box } from "@mui/material"; + +const Toolbar = ({ table, filterData, mutate }) => { + return ( + + + + ); +}; +export default Toolbar; diff --git a/src/components/dashboard/damages/report/index.jsx b/src/components/dashboard/damages/report/index.jsx new file mode 100644 index 0000000..4961eb5 --- /dev/null +++ b/src/components/dashboard/damages/report/index.jsx @@ -0,0 +1,137 @@ +'use client' +import PageTitle from "@/core/components/PageTitle"; +import { GET_CITY_RECEIPT_REPORT, GET_PROVINCE_RECEIPT_REPORT } from "@/core/utils/routes"; +import { useAuth } from "@/lib/contexts/auth"; +import { usePermissions } from "@/lib/hooks/usePermissions"; +import useRequest from "@/lib/hooks/useRequest"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { LinearProgress, Stack } from "@mui/material"; +import moment from "jalali-moment"; +import { useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import * as yup from "yup"; +import SearchReportList from "./Search"; +import ReportLists from "./ReportLists"; + +const DamagesReportPage = () => { + const [data, setData] = useState(null); + const { data: userPermissions } = usePermissions(); + const { user } = useAuth(); + const requestServer = useRequest(); + const hasProvincesPermission = userPermissions?.includes("show-receipt"); + + 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, + }; + const defaultFilter = [ + { value: `${defaultValues.province_id}`, datatype: "numeric", id: "province_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}`); + setSpecialFilter([ + { value: `${data.province_id}`, datatype: "numeric", id: "province_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_PROVINCE_RECEIPT_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) { + console.log(e); + } + } else { + try { + params.set("province_id", `${data.province_id}`); + const response = await requestServer(`${GET_CITY_RECEIPT_REPORT}?${params}`); + const result = response.data.data; + const nationalReportForItem = result.activities.find((report) => report.city_id == "-1"); + const nationalReport = { + ...nationalReportForItem, + edare_name: "کل استان", + }; + setData({ + data: [ + nationalReport, + ...result.cities.map((edare) => { + const filteredReports = result.activities.find((report) => report.city_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(), + }); + + const { control, handleSubmit } = useForm({ + defaultValues, + resolver: yupResolver(validationSchema), + mode: "onBlur", + }); + + return ( + + + + {!data ? : } + + ); +} +export default DamagesReportPage \ No newline at end of file diff --git a/src/core/utils/pageMenu.js b/src/core/utils/pageMenu.js index 5aa47d6..19d7689 100644 --- a/src/core/utils/pageMenu.js +++ b/src/core/utils/pageMenu.js @@ -482,10 +482,10 @@ export const pageMenu = [ permissions: ["manage-damage"], }, { - id: "receiptManagmentReport", + id: "damagesManagmentReport", label: "گزارش ها", type: "page", - route: "/dashboard/receipt/report", + route: "/dashboard/damages/report", icon: , permissions: ["show-receipt", 'show-receipt-province'], }, diff --git a/src/core/utils/routes.js b/src/core/utils/routes.js index 78fe1dd..58bcda3 100644 --- a/src/core/utils/routes.js +++ b/src/core/utils/routes.js @@ -95,5 +95,11 @@ export const ATIVITY_RECEIPT_DAMAGE_ITEMS = api + "/api/v3/damages/activate"; export const GET_TECHNICAL_DAMAGE_OPERATOR_LIST = api + "/api/v3/receipts"; export const GET_DAMAGE_ITEM_LIST = api + "/api/v3/damages/list"; +// recept report +export const GET_PROVINCE_RECEIPT_REPORT = api + "/api/v3/receipt_reports/province_report"; +export const GET_CITY_RECEIPT_REPORT = api + "/api/v3/receipt_reports/city_report"; +export const EXPORT_COUNTRY_RECEIPT_REPORT = api + "/api/v3/receipt_reports/province_excel_report"; +export const EXPORT_PROVINCE_RECEIPT_REPORT = api + "/api/v3/receipt_reports/city_excel_report"; + // activity code log export const ACTIVITY_LOG = api + "/api/v3/profile/add_activity";