MS-32/Add feature Export Refunded orders respecting filters

src/shared/api/refundOrders.ts

@@ -3,6 +3,7 @@ import axiosInstance, { endpoints, fetcher } from "./server";
 import useSWR, { mutate } from "swr";
 import { useMemo } from "react";
 import { Order } from "@/contexts/types/main-order";
+import { Resource } from "i18next";
 
 
 export async function useCreateRefundOrder(data: CreateRefundOrderRequest) {
@@ -73,4 +74,34 @@ export function getRefundOrdersByOrderId(orderId: string) {
     );
 
     return memoizedValue;
-}
\ No newline at end of file
+}
+
+export const exportRefundOrders = (
+  refundMethods: RefundMethod[],
+  keyword: string,
+  startDate: Date | null,
+  endDate: Date | null
+) => {
+  const params = {
+    refundMethods: refundMethods.length > 0 ? refundMethods.join(',') : undefined,
+    keyword: keyword || undefined,
+    startDate: startDate ? startDate.toISOString() : undefined,
+    endDate: endDate ? endDate.toISOString() : undefined,
+  };
+
+  axiosInstance
+    .get(endpoints.order.refundOrder.exportRefundOrders, {
+      responseType: 'blob',
+      params,
+    })
+    .then((response) => {
+      const link = document.createElement('a');
+      link.href = window.URL.createObjectURL(response.data);
+      link.download = `refund_orders_${new Date().toISOString().split('T')[0]}.csv`;
+      link.click();
+    })
+    .catch((error) => {
+      console.error('Error exporting refund orders:', error);
+      throw error;
+    });
+};

src/shared/api/server.ts

@@ -250,6 +250,7 @@ export const endpoints = {
     deleteList: `/api/orders/delete-orders`,
     refundOrder: {
       getAllRefundOrders: `/api/orders/refund-order`,
+      exportRefundOrders: `/api/orders/refund-order/export-refunded-orders`,
       createRefundOrder: `/api/orders/refund-order`,
       getRefundOrdersByOrderId: (orderId: string) => `/api/orders/refund-order/fetch-by-order-id/${orderId}`,
     },

src/shared/sections/order/refund-order/all/refund-order-list-view.tsx

@@ -81,6 +81,8 @@ export default function RefundOrderListView() {
     setTotalPages(response.totalPages);
   });
 
+  
+
   const denseHeight = table.dense ? 56 : 56 + 20;
 
   const canReset =

src/shared/sections/order/refund-order/all/refund-order-table-toolbar.tsx

-import { useCallback } from "react";
+import { useCallback, useState } from "react";
 import Stack from "@mui/material/Stack";
 import TextField from "@mui/material/TextField";
 import InputAdornment from "@mui/material/InputAdornment";
@@ -7,6 +7,8 @@ import Iconify from "@/shared/components/iconify";
 import { usePopover } from "@/shared/components/custom-popover";
 import { IRefundOrderTableFilters, IRefundOrderTableFilterValue } from "@/contexts/types/refundOrder";
 import { DateTimePicker } from "@mui/x-date-pickers";
+import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
+import { exportRefundOrders } from "@/shared/api/refundOrders";
 
 type Props = {
   filters: IRefundOrderTableFilters;
@@ -25,9 +27,10 @@ export default function RefundOrderTableToolbar({
       if (event.target.value.length > 3) {
         onFilters("keyword", event.target.value);
       }
-    },[onFilters]
+    }, [onFilters]
   );
 
+
   const handleFilterStartDate = useCallback(
     (newValue: Date | null) => {
       newValue = newValue ? new Date(new Date(newValue).getTime() - new Date(newValue).getTimezoneOffset() * 60000) : null;
@@ -43,6 +46,25 @@ export default function RefundOrderTableToolbar({
     },
     [onFilters]
   );
+  const [openConfirmExport, setOpenConfirmExport] = useState(false);
+
+  const handleExportClick = useCallback(() => {
+    setOpenConfirmExport(true);
+  }, []);
+
+  const handleConfirmExport = useCallback(() => {
+    setOpenConfirmExport(false);
+    exportRefundOrders(
+      filters.refundMethods || [],
+      filters.keyword || '',
+      filters.startDate || null,
+      filters.endDate || null
+    );
+  }, [filters]);
+
+  const handleCancelExport = useCallback(() => {
+    setOpenConfirmExport(false);
+  }, []);
 
   return (
     <>
@@ -115,7 +137,34 @@ export default function RefundOrderTableToolbar({
             }}
           />
         </Stack>
+
+        {filters.endDate && filters.startDate
+          && <Button
+            variant="soft"
+            color="primary"
+            style={{ marginLeft: "auto", width: "150px", height: "50px" }}
+            onClick={handleExportClick}
+          >
+            Exporter
+          </Button>}
       </Stack>
+
+      <Dialog open={openConfirmExport} onClose={handleCancelExport}>
+        <DialogTitle>Confirmer l'export</DialogTitle>
+        <DialogContent>
+          Voulez-vous vraiment exporter les commandes de remboursement avec les filtres actuels ?
+          <br />
+          Cela générera un fichier CSV contenant toutes les données correspondant à vos critères.
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={handleCancelExport} color="secondary">
+            Annuler
+          </Button>
+          <Button onClick={handleConfirmExport} color="primary" variant="contained">
+            Exporter
+          </Button>
+        </DialogActions>
+      </Dialog>
     </>
   );
 }