diff --git a/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx b/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx index b288d0a..81eeec5 100644 --- a/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx +++ b/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx @@ -94,66 +94,65 @@ const DetailTransaction = () => { } }, [showDetailDialog]); -const handleExport = async () => { - if (!selectedTransactionId || !transactionDetails) return; + const handleExport = async () => { + if (!selectedTransactionId || !transactionDetails) return; - setIsExporting(true); - try { - const response = await fetch( - `${API_URL}/transaction/export?id_disbursment=${selectedTransactionId}`, - { - method: 'GET', - headers: { - Authorization: `Bearer ${getAuth()?.access_token}` + setIsExporting(true); + try { + const response = await fetch( + `${API_URL}/transaction/export?id_disbursment=${selectedTransactionId}`, + { + method: 'GET', + headers: { + Authorization: `Bearer ${getAuth()?.access_token}` + } + } + ); + + if (!response.ok) { + throw new Error('Failed to fetch file'); + } + + const blob = await response.blob(); + const contentDisposition = response.headers.get('content-disposition'); + + const executionDate = transactionDetails.execution_date; + const formattedDate = executionDate + ? moment(executionDate).format('YYYYMMDD_HHmm') + : moment().format('YYYYMMDD_HHmm'); + + let filename = `transaction_${formattedDate}.xlsx`; + + if (contentDisposition) { + const filenameMatch = contentDisposition.match(/filename\*?=(?:UTF-8'')?"?([^;"\n]*)"?/); + if (filenameMatch && filenameMatch[1]) { + filename = decodeURIComponent(filenameMatch[1]); } } - ); - if (!response.ok) { - throw new Error('Failed to fetch file'); + const url = window.URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = filename; + a.click(); + window.URL.revokeObjectURL(url); + + toast.success('Export successful'); + } catch (error) { + console.error('Error exporting transaction:', error); + toast.error('Failed to export transaction'); + } finally { + setIsExporting(false); } - - const blob = await response.blob(); - const contentDisposition = response.headers.get('content-disposition'); - - const executionDate = transactionDetails.execution_date; - const formattedDate = executionDate - ? moment(executionDate).format('YYYYMMDD_HHmm') - : moment().format('YYYYMMDD_HHmm'); - - let filename = `transaction_${formattedDate}.xlsx`; - - if (contentDisposition) { - const filenameMatch = contentDisposition.match(/filename\*?=(?:UTF-8'')?"?([^;"\n]*)"?/); - if (filenameMatch && filenameMatch[1]) { - filename = decodeURIComponent(filenameMatch[1]); - } - } - - const url = window.URL.createObjectURL(blob); - const a = document.createElement('a'); - a.href = url; - a.download = filename; - a.click(); - window.URL.revokeObjectURL(url); - - toast.success('Export successful'); - } catch (error) { - console.error('Error exporting transaction:', error); - toast.error('Failed to export transaction'); - } finally { - setIsExporting(false); - } -}; - + }; return ( - + Transaction Details - +
{/* Summary Info */} {transactionDetails && ( @@ -213,7 +212,6 @@ const handleExport = async () => {
)} - {/* Log Table */}
{isLoading ? (
@@ -229,96 +227,113 @@ const handleExport = async () => {

Loading Logs Details...

) : ( - - - - - - - - - - - - - - - - - {transactionDetails?.log && transactionDetails.log.length > 0 ? ( - transactionDetails.log.map((log: any, index: number) => ( - - - - - - - - - - - + <> +
+ +
+
+
UsernameFullnameAmountStatusProcess DateInvoice NumberRemark 1Remark 2Remark 3Actions
- {log.customer?.username ?? 'Not Found'} - - {log.customer?.fullname ?? 'Not Found'} - {log.amount ?? '-'} - {renderStatusBadge(log.status) ?? '-'} - - {log.request_date && moment(log.request_date).isValid() - ? moment(log.request_date).format('DD/MM/YYYY HH:mm') - : '-'} - - {log.reference ?? '-'} - {log.remark_1 ?? '-'}{log.remark_2 ?? '-'}{log.remark_3 ?? '-'} - -
+ + + + + + + + + + + + - )) - ) : ( - - - - )} - -
UsernameFullnameAmountStatus + Process Date + + Invoice Number + Remark 1Remark 2Remark 3Actions
- No logs available -
+ + + {transactionDetails?.log && transactionDetails.log.length > 0 ? ( + transactionDetails.log.map((log: any, index: number) => ( + + + {log.customer?.username ?? 'Not Found'} + + + {log.customer?.fullname ?? 'Not Found'} + + + {log.amount ?? '-'} + + + {renderStatusBadge(log.status) ?? '-'} + + + {log.request_date && moment(log.request_date).isValid() + ? moment(log.request_date).format('DD/MM/YYYY HH:mm') + : '-'} + + + {log.reference ?? '-'} + + + {log.remark_1 ?? '-'} + + + {log.remark_2 ?? '-'} + + + {log.remark_3 ?? '-'} + + + + + + )) + ) : ( + + + No logs available + + + )} + + +
+ )} - - {/* Export Button - Moved to bottom right after table */} -
- -
@@ -326,4 +341,4 @@ const handleExport = async () => { ); }; -export default DetailTransaction; \ No newline at end of file +export default DetailTransaction; diff --git a/src/pages/members/manage-members/blocks/DetailMember.tsx b/src/pages/members/manage-members/blocks/DetailMember.tsx index 96dc614..477429f 100644 --- a/src/pages/members/manage-members/blocks/DetailMember.tsx +++ b/src/pages/members/manage-members/blocks/DetailMember.tsx @@ -209,7 +209,7 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa {(formData.id || dialogType === "create") ? generateList(formData, handleChange, groups, 'group_id', 'Group', true, dialogType === "update"||false): ''} {/* {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Group', 'group_name', 'text', true, true): ''} */} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Username', 'username', 'text', true, dialogType==='create'?false:true): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Username', 'username', 'text', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Full Name', 'fullname', 'text', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'Photo', 'photouser', previewImg, setPreviewImg): ''} {(formData.id || dialogType === "create") ? generateList(formData, handleChange, genders, 'gender', 'Gender', true, false): ''} @@ -218,7 +218,7 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Email', 'email', 'text', true, viewOnly): ''} {/* {generateList(formData, handleChange, status, 'status', 'Status', null, true)} */} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Mother Fullname', 'mother_fullname', 'text', true, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, identity_type, 'identity_type', 'Identity Type', false, false): ''} + {(formData.id || dialogType === "create") ? generateList(formData, handleChange, identity_type, 'identity_type', 'Identity Type', false, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Address', 'address', 'text', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Identity Number', 'identity_number', 'text', false, viewOnly): ''}