From e783c9a00cbfb7b5cc69b1d2bdf69ce04ba13784 Mon Sep 17 00:00:00 2001 From: bagusajisaputroo Date: Fri, 9 May 2025 17:08:49 +0700 Subject: [PATCH] add DN in status transaction type on transfertype module --- .../transfertype/blocks/AddDialog.tsx | 1 + .../transfertype/blocks/EditDialog.tsx | 739 +++++++++--------- .../hooks/ManageTransferTypeContext.tsx | 38 +- 3 files changed, 405 insertions(+), 373 deletions(-) diff --git a/src/pages/transfer/transfertype/blocks/AddDialog.tsx b/src/pages/transfer/transfertype/blocks/AddDialog.tsx index b57fcab..1458819 100644 --- a/src/pages/transfer/transfertype/blocks/AddDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/AddDialog.tsx @@ -482,6 +482,7 @@ const AddDialog = () => { Disbursment Agent Withdraw Merchant Income Merchant + Donation {errors.type && {errors.type}} diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx index 2dab877..4a18331 100644 --- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx @@ -68,6 +68,7 @@ const EditDialog = () => { message: '' }); const [errors, setErrors] = useState>({}); + const [isLoadingData, setIsLoadingData] = useState(true); const [isLoadingWallets, setIsLoadingWallets] = useState(false); @@ -316,6 +317,7 @@ const EditDialog = () => { if (!showEditDialog || !selectedTransferType) return; const fetchTransactionType = async () => { + setIsLoadingData(true); try { const response = await GetData( `${API_URL}/transactiontype/getdata/${selectedTransferType}`, @@ -357,6 +359,8 @@ const EditDialog = () => { show: true, message: 'Failed to load transaction type data' }); + } finally { + setIsLoadingData(false); } }; @@ -414,7 +418,6 @@ const EditDialog = () => {

Update Transaction Type

-
{
+
{alert.show && ( @@ -436,384 +440,415 @@ const EditDialog = () => {
)} -
-
-
-
- -
- { - setFormField((prev) => ({ ...prev, name: target.value })); - if (target.value) { - setErrors((prev) => ({ ...prev, name: '' })); - } - }} - /> - {errors.name && ( - {errors.name} - )} -
-
-
-
-
- -
- { - setFormField((prev) => ({ ...prev, description: target.value })); - if (target.value) { - setErrors((prev) => ({ ...prev, description: '' })); - } - }} - /> - {errors.description && ( - {errors.description} - )} + {isLoadingData ? ( +
+
+ {[...Array(6)].map((_, idx) => ( +
+
+
+
+ ))} +
+

Loading transaction type data...

+
+ ) : ( + +
+
+
+ +
+ { + setFormField((prev) => ({ ...prev, name: target.value })); + if (target.value) { + setErrors((prev) => ({ ...prev, name: '' })); + } + }} + /> + {errors.name && ( + {errors.name} + )} +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - minimum_amount: values.floatValue || 0 - })); - }} - placeholder="Enter Minimum Amount" - /> +
+
+ +
+ { + setFormField((prev) => ({ ...prev, description: target.value })); + if (target.value) { + setErrors((prev) => ({ ...prev, description: '' })); + } + }} + /> + {errors.description && ( + {errors.description} + )} +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - maximum_amount: values.floatValue || 0 - })); - }} - placeholder="Enter Maximum Amount" - /> +
+
+ +
+ { + setFormField((prev) => ({ + ...prev, + minimum_amount: values.floatValue || 0 + })); + }} + placeholder="Enter Minimum Amount" + /> +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - max_transaction_per_day: values.floatValue || 0 - })); - }} - placeholder="Enter Max Transaction Per Day" - /> -
-
-
-
-
- -
- {renderSelectWithLoading( - formField.wallet_origin, - (value) => setFormField({ ...formField, wallet_origin: value }), - wallets, - 'Select Wallet', - isLoadingWallets - )} - {errors.wallet_origin && ( - {errors.wallet_origin} - )} -
-
-
-
-
- -
- { + setFormField((prev) => ({ ...prev, wallet_destination })); + setErrors((prev) => ({ ...prev, wallet_destination: '' })); + }} > - - - - {wallets.map((wallet) => ( - - {wallet.name} + + + + + {wallets.map((wallet) => ( + + {wallet.name} + + ))} + + + {errors.wallet_destination && ( + + {errors.wallet_destination} + + )} +
+
+
+ +
+
+ +
+ - {errors.wallet_destination && ( - - {errors.wallet_destination} - - )} + + Change Group Emoney Agent to Customer{' '} + + + Change Group Point Agent to Customer{' '} + + Change Group Point Customer to Agent + Return Customer Emoney + Return Agent Deposit + Return Agent Merchant + Return Agent Emoney + Reward Point + Top Up Escrow + Top Up Master Agent + Top Up Agent + Purchase Loja + Disbursment Escrow + Disbursment Master Agent + Disbursment Agent + Withdraw Merchant + Income Merchant + Donation + + + {errors.type && ( + {errors.type} + )} +
-
-
-
- -
- - {errors.type && ( - {errors.type} - )} +
+
+ +
+ + {errors.status_approval && ( + + {errors.status_approval} + + )} +
-
+
+
+ -
-
- -
- - {errors.status_approval && ( - {errors.status_approval} - )} +
+ + {errors.status_kind && ( + {errors.status_kind} + )} +
+
+
+
+
+ +
+ + {errors.status && ( + {errors.status} + )} +
-
-
-
- -
- - {errors.status_kind && ( - {errors.status_kind} - )} -
-
-
-
-
- -
- - {errors.status && ( - {errors.status} - )} -
-
-
- -
-
- -
- - {errors.permission && ( - {errors.permission} - )} -
-
- {groups.map((group) => ( -
- handleGroupChange(group.id)} - /> - -
- ))} +
+
+ +
+ + {errors.permission && ( + {errors.permission} + )} +
+
+ {groups.map((group) => ( +
+ handleGroupChange(group.id)} + /> + +
+ ))} +
-
-
- - +
+ + +
-
- - - -
- -
- - - - - + + )} + + {isLoadingData && ( + + +
+ +
+ + + + + + )}
diff --git a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx index 517b956..c815be0 100644 --- a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx +++ b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx @@ -203,7 +203,8 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React DM: 'Disbursment Master Agent', DA: 'Disbursment Agent', WI: 'Withdraw Merchant', - IC: 'Income Merchant' + IC: 'Income Merchant', + DN: 'Donation' }; return mapping[row.type] || 'Unknown'; @@ -227,20 +228,18 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React { accessorFn: (row: { status_kind: string }) => { const mapping: Record = { - R: "Return", - T: "Transfer", - P: "Purchase", - W: "Withdraw", - U: "Top Up", - N: "Top Up Patner" + R: 'Return', + T: 'Transfer', + P: 'Purchase', + W: 'Withdraw', + U: 'Top Up', + N: 'Top Up Patner' }; return mapping[row.status_kind] || 'Unknown'; }, id: 'status_kind', - header: ({ column }) => ( - - ), + header: ({ column }) => , enableSorting: false, enableHiding: false, meta: { headerClassName: 'w-[250px]' } @@ -295,22 +294,19 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React let filterObject: Record = {}; if (debouncedSearchTerm) { - filterObject["any"] = debouncedSearchTerm.toLowerCase(); + filterObject['any'] = debouncedSearchTerm.toLowerCase(); } if (columnFilters.length > 0) { columnFilters.forEach((filter: any) => { if (filter.id && filter.value) { if (filter.id === 'name') { - filterObject["any"] = filter.value.toLowerCase(); - } - else if (filter.id === 'wallet_origin') { - filterObject["wallet_origin.name"] = filter.value.toLowerCase(); - } - else if (filter.id === 'wallet_destination') { - filterObject["wallet_destination.name"] = filter.value.toLowerCase(); - } - else { + filterObject['any'] = filter.value.toLowerCase(); + } else if (filter.id === 'wallet_origin') { + filterObject['wallet_origin.name'] = filter.value.toLowerCase(); + } else if (filter.id === 'wallet_destination') { + filterObject['wallet_destination.name'] = filter.value.toLowerCase(); + } else { filterObject[filter.id] = filter.value.toLowerCase(); } } @@ -369,4 +365,4 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React }; export { ManageTransferTypeContext, ManageTransferTypeContextProvider }; -export type { TransferType }; \ No newline at end of file +export type { TransferType };