feat(FE-364): Add PDF export for purchases per supplier

2026-05-25 15:55:48 +00:00 · 2025-12-16 12:00:56 +07:00
parent 2a00da0298
commit 615d4d5ffe
2 changed files with 615 additions and 5 deletions
@@ -23,6 +23,8 @@ import Button from '@/components/Button';
 import Dropdown from '@/components/Dropdown';
 import MenuItem from '@/components/menu/MenuItem';
 import Menu from '@/components/menu/Menu';
+import { generatePurchasesPerSupplierPDF } from '@/components/pages/report/logistic-stock/export/PurchasesPerSupplierExport';
+import toast from 'react-hot-toast';

 interface Totals {
  totalQty: number;
@@ -34,6 +36,9 @@ interface Totals {
 }

 const PurchasesPerSupplierTab = () => {
+  // ===== STATE MANAGEMENT =====
+  const [isPdfExportLoading, setIsPdfExportLoading] = useState(false);
+
  // ===== PAGINATION STATE =====
  const [currentPage, setCurrentPage] = useState(1);
  const [pageSize, setPageSize] = useState(10);
@@ -247,13 +252,121 @@ const PurchasesPerSupplierTab = () => {
      ? purchasePerSupplier.meta
      : undefined;

+  const { data: allDataForExport } = useSWR(
+    isSubmitted
+      ? () => {
+          const params = {
+            area_id: tableFilterState.area_id
+              ? Number(tableFilterState.area_id)
+              : undefined,
+            supplier_id: tableFilterState.supplier_id
+              ? Number(tableFilterState.supplier_id)
+              : undefined,
+            product_id: tableFilterState.product_id
+              ? Number(tableFilterState.product_id)
+              : undefined,
+            product_category_id: tableFilterState.product_category_id
+              ? Number(tableFilterState.product_category_id)
+              : undefined,
+            received_date:
+              tableFilterState.filter_by === 'received_date'
+                ? tableFilterState.start_date || undefined
+                : undefined,
+            po_date:
+              tableFilterState.filter_by === 'po_date'
+                ? tableFilterState.start_date || undefined
+                : undefined,
+            start_date: tableFilterState.start_date || undefined,
+            end_date: tableFilterState.end_date || undefined,
+            sort_by: tableFilterState.sort_by || undefined,
+            filter_by: tableFilterState.filter_by || undefined,
+            limit: 10000,
+            page: 1,
+          };
+
+          return ['logistic-purchase-report-export', params];
+        }
+      : null,
+    ([, params]) =>
+      LogisticApi.getLogisticStockReport(
+        params.area_id,
+        params.supplier_id,
+        params.product_id,
+        params.product_category_id,
+        params.received_date,
+        params.po_date,
+        params.start_date,
+        params.end_date,
+        params.sort_by,
+        params.filter_by,
+        params.page,
+        params.limit
+      )
+  );
+
+  const allExportData: LogisticPurchasePerSupplierReport['rows'] = useMemo(
+    () =>
+      isResponseSuccess(allDataForExport)
+        ? (allDataForExport?.data
+            ?.rows as LogisticPurchasePerSupplierReport['rows']) || []
+        : [],
+    [allDataForExport]
+  );
+
  const handleExportExcel = useCallback(() => {
-    alert('Export to Excel functionality to be implemented.');
+    toast.error('Export to Excel functionality will be implemented.');
  }, []);

-  const handleExportPdf = useCallback(() => {
-    alert('Export to PDF functionality to be implemented.');
-  }, []);
+  const handleExportPdf = useCallback(async () => {
+    if (allExportData.length === 0) {
+      toast.error('Tidak ada data untuk diekspor.');
+      return;
+    }
+
+    setIsPdfExportLoading(true);
+    try {
+      const exportParams = {
+        area_name: tableFilterState.area_id
+          ? areaOptions.find(
+              (opt) => opt.value === Number(tableFilterState.area_id)
+            )?.label || ''
+          : 'Semua Area',
+        supplier_name: tableFilterState.supplier_id
+          ? supplierOptions.find(
+              (opt) => opt.value === Number(tableFilterState.supplier_id)
+            )?.label || ''
+          : 'Semua Supplier',
+        product_name: tableFilterState.product_id
+          ? productOptions.find(
+              (opt) => opt.value === Number(tableFilterState.product_id)
+            )?.label || ''
+          : 'Semua Produk',
+        product_category_name: tableFilterState.product_category_id
+          ? productCategoryOptions.find(
+              (opt) =>
+                opt.value === Number(tableFilterState.product_category_id)
+            )?.label || ''
+          : 'Semua Kategori Produk',
+        filter_by: tableFilterState.filter_by || 'received_date',
+        start_date: tableFilterState.start_date || '',
+        end_date: tableFilterState.end_date || '',
+      };
+
+      await generatePurchasesPerSupplierPDF(allExportData, exportParams);
+      toast.success('PDF berhasil dibuat dan diunduh.');
+    } catch {
+      toast.error('Gagal membuat PDF. Silakan coba lagi.');
+    } finally {
+      setIsPdfExportLoading(false);
+    }
+  }, [
+    allExportData,
+    tableFilterState,
+    areaOptions,
+    supplierOptions,
+    productOptions,
+    productCategoryOptions,
+  ]);

  // ===== PAGINATION HANDLERS =====
  const handlePageChange = (page: number) => {
@@ -483,7 +596,11 @@ const PurchasesPerSupplierTab = () => {
            Reset
          </Button>
          <Dropdown
-            trigger={<Button color='success'>Export</Button>}
+            trigger={
+              <Button color='success' isLoading={isPdfExportLoading}>
+                Export
+              </Button>
+            }
            align='end'
          >
            <Menu className='w-32'>