add excel

src/components/dashboard/damageItems/ExcelPrint/index.jsx

@@ -0,0 +1,75 @@
+"use client";
+import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
+import isArrayEmpty from "@/core/utils/isArrayEmpty";
+import { EXPORT_DAMAGES_ITEMS } 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 && (!Array.isArray(filter.value) || filter.value.some((item) => item.trim() !== ""))) {
+            acc.push({ id: key, value: filter.value });
+        }
+        return acc;
+    }, []);
+
+    const filterParams = useMemo(() => {
+        const params = new URLSearchParams();
+        if (activeFilters.length > 0) {
+            activeFilters.map((filter, index) => {
+                const filteredFilterData = DataTableFilterDataStructure(filterData, isArrayEmpty);
+                params.set("filters", JSON.stringify(filteredFilterData.length === 0 ? [] : filteredFilterData));
+            });
+        } else {
+            params.set("filters", JSON.stringify([]));
+        }
+        return params;
+    }, [activeFilters]);
+
+    const clickHandler = () => {
+        setLoading(true);
+        requestServer(`${EXPORT_DAMAGES_ITEMS}?${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 ? (
+                <IconButton aria-label="خروجی اکسل" color="success" onClick={clickHandler}>
+                    <DescriptionIcon sx={{ fontSize: "25px" }} />
+                </IconButton>
+            ) : (
+                <Button
+                    color="success"
+                    variant="contained"
+                    size="small"
+                    disabled={loading}
+                    sx={{ textTransform: "unset", alignSelf: "center" }}
+                    startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
+                    onClick={clickHandler}
+                >
+                    خروجی اکسل
+                </Button>
+            )}
+        </>
+    );
+};
+export default PrintExcel;

src/components/dashboard/damageItems/Toolbar.jsx

@@ -1,10 +1,13 @@
+import { Box } from "@mui/material";
 import CreateDamage from "./Actions/Create";
+import PrintExcel from "./ExcelPrint";
 
-const Toolbar = ({ mutate }) => {
+const Toolbar = ({ table, filterData, mutate }) => {
     return (
-        <>
+        <Box sx={{ display: "flex", gap: 1 }}>
+            <PrintExcel table={table} filterData={filterData} />
             <CreateDamage mutate={mutate} />
-        </>
+        </Box>
     );
 };
 export default Toolbar;

src/core/utils/routes.js

@@ -95,6 +95,7 @@ export const GET_RECEIPT_DAMAGE_ITEMS_LIST = api + "/api/v3/damages";
 export const CREATE_RECEIPT_DAMAGE_ITEMS = api + "/api/v3/damages";
 export const UPDATE_RECEIPT_DAMAGE_ITEMS = api + "/api/v3/damages";
 export const ATIVITY_RECEIPT_DAMAGE_ITEMS = api + "/api/v3/damages/activate";
+export const EXPORT_DAMAGES_ITEMS = api + "/api/v3/damages/excel";
 
 // damage receipt
 export const GET_TECHNICAL_DAMAGE_OPERATOR_LIST = api + "/api/v3/receipts";