diff --git a/src/components/pages/marketing/MarketingTable.tsx b/src/components/pages/marketing/MarketingTable.tsx index 15ea81d4..63e700da 100644 --- a/src/components/pages/marketing/MarketingTable.tsx +++ b/src/components/pages/marketing/MarketingTable.tsx @@ -1,5 +1,6 @@ 'use client'; +import axios from 'axios'; import Button from '@/components/Button'; import CheckboxInput from '@/components/input/CheckboxInput'; import DateInput from '@/components/input/DateInput'; @@ -36,6 +37,43 @@ import MarketingFilterModal from '@/components/pages/marketing/MarketingFilter'; import ButtonFilter from '@/components/helper/ButtonFilter'; import MarketingTableSkeleton from '@/components/pages/marketing/skeleton/MarketingTableSkeleton'; +const getExportErrorMessage = async ( + error: unknown, + fallbackMessage: string +) => { + if (axios.isAxiosError(error)) { + const responseData = error.response?.data; + + if (responseData instanceof Blob) { + try { + const parsed = JSON.parse(await responseData.text()) as { + message?: string; + }; + return parsed.message || fallbackMessage; + } catch { + return fallbackMessage; + } + } + + if ( + responseData && + typeof responseData === 'object' && + 'message' in responseData && + typeof responseData.message === 'string' + ) { + return responseData.message; + } + + return error.message || fallbackMessage; + } + + if (error instanceof Error) { + return error.message; + } + + return fallbackMessage; +}; + const RowsOptionsMenu = ({ props, deleteClickHandler, @@ -161,6 +199,9 @@ const MarketingTable = () => { const [bulkDeliveryNotes, setBulkDeliveryNotes] = useState(''); const [isSubmittingBulkDelivery, setIsSubmittingBulkDelivery] = useState(false); + const [isExportProgressLoading, setIsExportProgressLoading] = useState(false); + const [exportProgressStartDate, setExportProgressStartDate] = useState(''); + const [exportProgressEndDate, setExportProgressEndDate] = useState(''); const router = useRouter(); const deleteModal = useModal(); @@ -168,6 +209,7 @@ const MarketingTable = () => { const productsModal = useModal(); const deliveryModal = useModal(); const bulkDeliveryModal = useModal(); + const exportProgressInputModal = useModal(); const filterModal = useModal(); const { @@ -439,6 +481,56 @@ const MarketingTable = () => { setIsLoadingExportingToExcel(false); }; + const resetExportProgressForm = useCallback(() => { + setExportProgressStartDate(''); + setExportProgressEndDate(''); + }, []); + + const exportProgressStartDateChangeHandler: ChangeEventHandler = + useCallback((e) => { + setExportProgressStartDate(e.target.value); + }, []); + + const exportProgressEndDateChangeHandler: ChangeEventHandler = + useCallback((e) => { + setExportProgressEndDate(e.target.value); + }, []); + + const exportProgressInputToExcelClickHandler = useCallback(() => { + resetExportProgressForm(); + exportProgressInputModal.openModal(); + }, [exportProgressInputModal, resetExportProgressForm]); + + const submitExportProgressInputHandler = useCallback(async () => { + if (!exportProgressStartDate || !exportProgressEndDate) { + return; + } + + setIsExportProgressLoading(true); + + try { + await MarketingApi.exportInputProgressToExcel( + exportProgressStartDate, + exportProgressEndDate + ); + + exportProgressInputModal.closeModal(); + resetExportProgressForm(); + toast.success('Ekspor berhasil'); + } catch (error) { + toast.error( + await getExportErrorMessage(error, 'Gagal mengekspor input progress') + ); + } finally { + setIsExportProgressLoading(false); + } + }, [ + exportProgressEndDate, + exportProgressInputModal, + exportProgressStartDate, + resetExportProgressForm, + ]); + const columns = useMemo[]>(() => { return [ { @@ -745,6 +837,16 @@ const MarketingTable = () => { Export to Excel + + @@ -928,6 +1030,75 @@ const MarketingTable = () => { + +
+
+

+ Ekspor Input Progress +

+ +
+ +
+ + + +
+ +
+ + +
+
+
(`${this.basePath}${queryString}`, { + method: 'GET', + responseType: 'blob', + }); + + const url = window.URL.createObjectURL(new Blob([res])); + const link = document.createElement('a'); + link.href = url; + + const fileName = `input-progres-penjualan-${formatDate(startDate, 'DD-MM-YYYY')}-ke-${formatDate(endDate, 'DD-MM-YYYY')}.xlsx`; + link.setAttribute('download', fileName); + + document.body.appendChild(link); + link.click(); + link.remove(); + } } export const SalesOrderApi = new SalesOrderService('/marketing/sales-orders');