TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixing transactiontype and transactionfee

Browse Source
This commit is contained in:
bagusajisaputroo
2025-04-14 20:09:58 +07:00
parent 18c1687ef7
commit d0ac8c55b4
8 changed files with 711 additions and 597 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/pages/transfer/transferfee/blocks/AddDialog.tsx
View File

@ -86,7 +86,7 @@ const AddFeeDialog = () => {
const [isLoadingCustomers, setIsLoadingCustomers] = useState(false); const [isLoadingCustomers, setIsLoadingCustomers] = useState(false);
const customersWithNames = customers.map((customer) => ({ const customersWithNames = customers.map((customer) => ({
id: customer.id, id: customer.id,
name: customer.username, name: customer.username
})); }));
const initialState = { const initialState = {
name: '', name: '',
@ -126,14 +126,17 @@ const AddFeeDialog = () => {
if (showAddFeeDialog && transactionTypeId) { if (showAddFeeDialog && transactionTypeId) {
setIsLoadingTransactionType(true); setIsLoadingTransactionType(true);
setFormField(prev => ({ setFormField((prev) => ({
...prev, ...prev,
transaction_type: transactionTypeId transaction_type: transactionTypeId
})); }));
const getTransactionTypeDetails = async () => { const getTransactionTypeDetails = async () => {
try { try {
const response = await GetData(`${API_URL}/transactiontype/getdata/${transactionTypeId}`, {}); const response = await GetData(
`${API_URL}/transactiontype/getdata/${transactionTypeId}`,
{}
);
if (response?.status && response?.data) { if (response?.status && response?.data) {
setTransactionTypeName(response.data.name); setTransactionTypeName(response.data.name);
} }
@ -153,7 +156,7 @@ const AddFeeDialog = () => {
const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
if (showAddFeeDialog) { if (showAddFeeDialog) {
setFormField(prev => ({ setFormField((prev) => ({
...prev, ...prev,
created_by: parsedUser?.username, created_by: parsedUser?.username,
created_at: formattedTime created_at: formattedTime
@ -193,7 +196,7 @@ const AddFeeDialog = () => {
page: 1, page: 1,
with_deleted: false, with_deleted: false,
order_field: 'Wallets.name', order_field: 'Wallets.name',
order_direction: 'ASC', order_direction: 'ASC'
}; };
try { try {
const response = await GetData(`${API_URL_MASTER_DATA}/wallet/list`, params); const response = await GetData(`${API_URL_MASTER_DATA}/wallet/list`, params);
@ -325,16 +328,12 @@ const AddFeeDialog = () => {
const renderSelectWithLoading = ( const renderSelectWithLoading = (
value: string, value: string,
onChangeHandler: (value: string) => void, onChangeHandler: (value: string) => void,
options: {id: string, name: string}[] | null, options: { id: string; name: string }[] | null,
placeholder: string, placeholder: string,
isLoading: boolean isLoading: boolean
) => { ) => {
return ( return (
<Select <Select value={value} onValueChange={onChangeHandler} disabled={isLoading}>
value={value}
onValueChange={onChangeHandler}
disabled={isLoading}
>
<SelectTrigger> <SelectTrigger>
{isLoading ? ( {isLoading ? (
<div className="flex items-center"> <div className="flex items-center">
@ -346,7 +345,8 @@ const AddFeeDialog = () => {
)} )}
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
{options && options.map((option) => ( {options &&
options.map((option) => (
<SelectItem value={option.id} key={option.id}> <SelectItem value={option.id} key={option.id}>
{option.name} {option.name}
</SelectItem> </SelectItem>
@ -389,7 +389,9 @@ const AddFeeDialog = () => {
<div className="card flex flex-col gap-5"> <div className="card flex flex-col gap-5">
<div className="card-body grid gap-5 p-0"> <div className="card-body grid gap-5 p-0">
<div className="w-full"> <div className="w-full">
<label className="form-label">Transaction Type ID <span className="text-red-500">*</span></label> <label className="form-label">
Transaction Type ID <span className="text-red-500">*</span>
</label>
{transactionTypeId ? ( {transactionTypeId ? (
<div className="relative"> <div className="relative">
<Input <Input
@ -412,13 +414,15 @@ const AddFeeDialog = () => {
formField.transaction_type, formField.transaction_type,
(transaction_type) => setFormField((prev) => ({ ...prev, transaction_type })), (transaction_type) => setFormField((prev) => ({ ...prev, transaction_type })),
transactionTypes, transactionTypes,
"Select Transaction Type", 'Select Transaction Type',
isLoadingTransactionType isLoadingTransactionType
) )
)} )}
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Transfer Free Name <span className="text-red-500">*</span></label> <label className="form-label">
Transfer Free Name <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="text" type="text"
@ -430,7 +434,9 @@ const AddFeeDialog = () => {
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Description <span className="text-red-500">*</span></label> <label className="form-label">
Description <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="text" type="text"
@ -476,7 +482,9 @@ const AddFeeDialog = () => {
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Period Start <span className="text-red-500">*</span></label> <label className="form-label">
Period Start <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="date" type="date"
@ -488,7 +496,9 @@ const AddFeeDialog = () => {
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Period End <span className="text-red-500">*</span></label> <label className="form-label">
Period End <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="date" type="date"
@ -551,7 +561,9 @@ const AddFeeDialog = () => {
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct From <span className="text-red-500">*</span></label> <label className="form-label">
Deduct From <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.deduct_from} value={formField.deduct_from}
onValueChange={(value) => setFormField({ ...formField, deduct_from: value })} onValueChange={(value) => setFormField({ ...formField, deduct_from: value })}
@ -566,24 +578,31 @@ const AddFeeDialog = () => {
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct From Destination <span className="text-red-500">*</span></label> <label className="form-label">
Deduct From Destination <span className="text-red-500">*</span>
</label>
{renderSelectWithLoading( {renderSelectWithLoading(
formField.deduct_from_account, formField.deduct_from_account,
(value) => setFormField({ ...formField, deduct_from_account: value }), (value) => setFormField({ ...formField, deduct_from_account: value }),
wallets, wallets,
"Select Wallet", 'Select Wallet',
isLoadingWallets isLoadingWallets
)} )}
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit To <span className="text-red-500">*</span></label> <label className="form-label">
Credit To <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.credit_to} value={formField.credit_to}
onValueChange={(value) => setFormField({ onValueChange={(value) =>
setFormField({
...formField, ...formField,
credit_to: value, credit_to: value,
credit_destination: value === 'I' ? '' : '00000000-0000-0000-0000-000000000000' credit_destination:
})} value === 'I' ? '' : '00000000-0000-0000-0000-000000000000'
})
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Credit To" /> <SelectValue placeholder="Select Credit To" />
@ -597,28 +616,34 @@ const AddFeeDialog = () => {
</div> </div>
{formField.credit_to === 'I' && ( {formField.credit_to === 'I' && (
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit Destination <span className="text-red-500">*</span></label> <label className="form-label">
Credit Destination <span className="text-red-500">*</span>
</label>
{renderSelectWithLoading( {renderSelectWithLoading(
formField.credit_destination, formField.credit_destination,
(value) => setFormField({ ...formField, credit_destination: value }), (value) => setFormField({ ...formField, credit_destination: value }),
customersWithNames, customersWithNames,
"Select Customer", 'Select Customer',
isLoadingCustomers isLoadingCustomers
)} )}
</div> </div>
)} )}
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit Destination Account <span className="text-red-500">*</span></label> <label className="form-label">
Credit Destination Account <span className="text-red-500">*</span>
</label>
{renderSelectWithLoading( {renderSelectWithLoading(
formField.credit_destination_account, formField.credit_destination_account,
(value) => setFormField({ ...formField, credit_destination_account: value }), (value) => setFormField({ ...formField, credit_destination_account: value }),
wallets, wallets,
"Select Wallet", 'Select Wallet',
isLoadingWallets isLoadingWallets
)} )}
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Status <span className="text-red-500">*</span></label> <label className="form-label">
Status <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.status} value={formField.status}
onValueChange={(value) => setFormField({ ...formField, status: value })} onValueChange={(value) => setFormField({ ...formField, status: value })}
@ -633,7 +658,9 @@ const AddFeeDialog = () => {
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Status Include <span className="text-red-500">*</span></label> <label className="form-label">
Status Include <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.status_include} value={formField.status_include}
onValueChange={(value) => setFormField({ ...formField, status_include: value })} onValueChange={(value) => setFormField({ ...formField, status_include: value })}
@ -648,7 +675,9 @@ const AddFeeDialog = () => {
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Priority <span className="text-red-500">*</span></label> <label className="form-label">
Priority <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.priority} value={formField.priority}
onValueChange={(value) => setFormField({ ...formField, priority: value })} onValueChange={(value) => setFormField({ ...formField, priority: value })}
@ -675,7 +704,12 @@ const AddFeeDialog = () => {
<Button <Button
variant={'default'} variant={'default'}
type="submit" type="submit"
disabled={isSubmitting || isLoadingTransactionType || isLoadingWallets || isLoadingCustomers} disabled={
isSubmitting ||
isLoadingTransactionType ||
isLoadingWallets ||
isLoadingCustomers
}
> >
{isSubmitting ? 'Saving...' : 'Save Changes'} {isSubmitting ? 'Saving...' : 'Save Changes'}
</Button> </Button>

24
src/pages/transfer/transferfee/blocks/DeleteDialog.tsx
View File

@ -1,4 +1,11 @@
import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle , DialogDescription} from '@/components/ui/dialog'; import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogDescription
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Alert, useDataGrid } from '@/components'; import { Alert, useDataGrid } from '@/components';
import { useCallback, useState } from 'react'; import { useCallback, useState } from 'react';
@ -10,7 +17,8 @@ import { useManageTransferFeeContext } from '../hooks/useManageTransferFeeContex
const API_URL = apiConfig.service_transaction; const API_URL = apiConfig.service_transaction;
const DeleteFeeDialog = () => { const DeleteFeeDialog = () => {
const { showDeleteFeeDialog, handleDeleteFeeDialog, selectedTransferFee } = useManageTransferFeeContext(); const { showDeleteFeeDialog, handleDeleteFeeDialog, selectedTransferFee } =
useManageTransferFeeContext();
const { reload } = useDataGrid(); const { reload } = useDataGrid();
const { DeleteData } = useCallApi(); const { DeleteData } = useCallApi();
const [alert, setAlert] = useState({ const [alert, setAlert] = useState({
@ -19,9 +27,12 @@ const DeleteFeeDialog = () => {
}); });
const doDeleteTransferFee = useCallback(async () => { const doDeleteTransferFee = useCallback(async () => {
const response = await DeleteData(`${API_URL}/transactionfees/delete/${selectedTransferFee}/false`, { const response = await DeleteData(
`${API_URL}/transactionfees/delete/${selectedTransferFee}/false`,
{
id: selectedTransferFee id: selectedTransferFee
}); }
);
if (response?.status) { if (response?.status) {
setAlert({ show: false, message: '' }); setAlert({ show: false, message: '' });
@ -39,7 +50,9 @@ const DeleteFeeDialog = () => {
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden"> <DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden">
<DialogHeader className="p-0 border-0 block"> <DialogHeader className="p-0 border-0 block">
<DialogTitle className="text-lg">Delete Transfer Type</DialogTitle> <DialogTitle className="text-lg">Delete Transfer Type</DialogTitle>
<DialogDescription className="text-sm">Are you sure you want to delete this data?</DialogDescription> <DialogDescription className="text-sm">
Are you sure you want to delete this data?
</DialogDescription>
<Alert variant="warning"> <Alert variant="warning">
<h3 className="text-lg">Are you sure?</h3> <h3 className="text-lg">Are you sure?</h3>
<span className="text-sm">You will delete this data!</span> <span className="text-sm">You will delete this data!</span>
@ -64,4 +77,3 @@ const DeleteFeeDialog = () => {
}; };
export default DeleteFeeDialog; export default DeleteFeeDialog;

114
src/pages/transfer/transferfee/blocks/EditDialog.tsx
View File

@ -8,7 +8,14 @@ import {
SelectValue SelectValue
} from '@/components/ui/select'; } from '@/components/ui/select';
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command'; import {
Command,
CommandEmpty,
CommandGroup,
CommandInput,
CommandItem,
CommandList
} from '@/components/ui/command';
import { import {
Dialog, Dialog,
DialogBody, DialogBody,
@ -96,7 +103,7 @@ const EditFeeDialog = () => {
const formattedTime = updated_time.toISOString().slice(0, 19).replace('T', ' '); const formattedTime = updated_time.toISOString().slice(0, 19).replace('T', ' ');
if (showEditFeeDialog) { if (showEditFeeDialog) {
setFormField(prevState => ({ setFormField((prevState) => ({
...prevState, ...prevState,
updated_by: parsedUser?.username, updated_by: parsedUser?.username,
updated_at: formattedTime updated_at: formattedTime
@ -161,7 +168,10 @@ const EditFeeDialog = () => {
} }
try { try {
const response = await PutData(`${API_URL}/transactionfees/update/${selectedTransferFee}`, payload); const response = await PutData(
`${API_URL}/transactionfees/update/${selectedTransferFee}`,
payload
);
if (response?.status) { if (response?.status) {
toast.success('Successfully updated transfer fee'); toast.success('Successfully updated transfer fee');
@ -191,7 +201,7 @@ const EditFeeDialog = () => {
page: 1, page: 1,
with_deleted: false, with_deleted: false,
order_field: 'Wallets.name', order_field: 'Wallets.name',
order_direction: 'ASC', order_direction: 'ASC'
}; };
try { try {
const response = await GetData(`${API_URL_MASTER_DATA}/wallet/list`, params); const response = await GetData(`${API_URL_MASTER_DATA}/wallet/list`, params);
@ -260,13 +270,12 @@ const EditFeeDialog = () => {
return dateString.split('T')[0]; return dateString.split('T')[0];
}; };
const fetchTransactionFee = useCallback(async (id: string) => { const fetchTransactionFee = useCallback(
async (id: string) => {
try { try {
const response = await GetData(`${API_URL}/transactionfees/getdata/${id}`, { }); const response = await GetData(`${API_URL}/transactionfees/getdata/${id}`, {});
if (response?.status) { if (response?.status) {
setFormField({ setFormField({
...initialState, ...initialState,
name: response.data.name || '', name: response.data.name || '',
@ -282,10 +291,11 @@ const EditFeeDialog = () => {
priority: response.data.priority || '', priority: response.data.priority || '',
status: response.data.status || '', status: response.data.status || '',
status_include: response.data.status_include || '', status_include: response.data.status_include || '',
deduct_from: response.data.deduct_from||'', deduct_from: response.data.deduct_from || '',
deduct_from_account: response.data.deduct_from_account?.id || '', deduct_from_account: response.data.deduct_from_account?.id || '',
credit_to: response.data.credit_to || '', credit_to: response.data.credit_to || '',
credit_destination: response.data.credit_destination?.id || '00000000-0000-0000-0000-000000000000', credit_destination:
response.data.credit_destination?.id || '00000000-0000-0000-0000-000000000000',
credit_destination_account: response.data.credit_destination_account?.id || '', credit_destination_account: response.data.credit_destination_account?.id || '',
updated_by: parsedUser?.username, updated_by: parsedUser?.username,
updated_at: new Date().toISOString().slice(0, 19).replace('T', ' ') updated_at: new Date().toISOString().slice(0, 19).replace('T', ' ')
@ -295,7 +305,9 @@ const EditFeeDialog = () => {
console.error('Error fetching transaction fee details', error); console.error('Error fetching transaction fee details', error);
setAlert({ show: true, message: 'Failed to fetch transaction fee details' }); setAlert({ show: true, message: 'Failed to fetch transaction fee details' });
} }
}, [GetData, parsedUser?.username]); },
[GetData, parsedUser?.username]
);
const hasFetchedRef = useRef(false); const hasFetchedRef = useRef(false);
@ -317,11 +329,14 @@ const EditFeeDialog = () => {
}; };
return ( return (
<Dialog open={showEditFeeDialog} onOpenChange={(open) => { <Dialog
open={showEditFeeDialog}
onOpenChange={(open) => {
if (!open) { if (!open) {
handleCloseDialog(); handleCloseDialog();
} }
}}> }}
>
<DialogContent className="container-fixed max-w-[1080px] flex flex-col p-5 overflow-hidden [&>button]:hidden"> <DialogContent className="container-fixed max-w-[1080px] flex flex-col p-5 overflow-hidden [&>button]:hidden">
<DialogTitle></DialogTitle> <DialogTitle></DialogTitle>
<DialogDescription></DialogDescription> <DialogDescription></DialogDescription>
@ -353,7 +368,9 @@ const EditFeeDialog = () => {
<div className="card flex flex-col gap-5"> <div className="card flex flex-col gap-5">
<div className="card-body grid gap-5 p-0"> <div className="card-body grid gap-5 p-0">
<div className="w-full"> <div className="w-full">
<label className="form-label">Transfer Fee Name <span className="text-red-500">*</span></label> <label className="form-label">
Transfer Fee Name <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="text" type="text"
@ -366,7 +383,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Description <span className="text-red-500">*</span></label> <label className="form-label">
Description <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="text" type="text"
@ -415,7 +434,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Period Start <span className="text-red-500">*</span></label> <label className="form-label">
Period Start <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="date" type="date"
@ -428,7 +449,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Period End <span className="text-red-500">*</span></label> <label className="form-label">
Period End <span className="text-red-500">*</span>
</label>
<Input <Input
className="input" className="input"
type="date" type="date"
@ -495,7 +518,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct From <span className="text-red-500">*</span></label> <label className="form-label">
Deduct From <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.deduct_from} value={formField.deduct_from}
onValueChange={(value) => setFormField({ ...formField, deduct_from: value })} onValueChange={(value) => setFormField({ ...formField, deduct_from: value })}
@ -511,10 +536,14 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct From Destination <span className="text-red-500">*</span></label> <label className="form-label">
Deduct From Destination <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.deduct_from_account} value={formField.deduct_from_account}
onValueChange={(value) => setFormField({ ...formField, deduct_from_account: value })} onValueChange={(value) =>
setFormField({ ...formField, deduct_from_account: value })
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Wallet" /> <SelectValue placeholder="Select Wallet" />
@ -530,14 +559,19 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit To <span className="text-red-500">*</span></label> <label className="form-label">
Credit To <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.credit_to} value={formField.credit_to}
onValueChange={(value) => setFormField({ onValueChange={(value) =>
setFormField({
...formField, ...formField,
credit_to: value, credit_to: value,
credit_destination: value === 'I' ? '' : '00000000-0000-0000-0000-000000000000' credit_destination:
})} value === 'I' ? '' : '00000000-0000-0000-0000-000000000000'
})
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Credit To" /> <SelectValue placeholder="Select Credit To" />
@ -552,10 +586,14 @@ const EditFeeDialog = () => {
{formField.credit_to === 'I' && ( {formField.credit_to === 'I' && (
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit Destination <span className="text-red-500">*</span></label> <label className="form-label">
Credit Destination <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.credit_destination} value={formField.credit_destination}
onValueChange={(value) => setFormField({ ...formField, credit_destination: value })} onValueChange={(value) =>
setFormField({ ...formField, credit_destination: value })
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Customer" /> <SelectValue placeholder="Select Customer" />
@ -572,10 +610,14 @@ const EditFeeDialog = () => {
)} )}
<div className="w-full"> <div className="w-full">
<label className="form-label">Credit Destination Account <span className="text-red-500">*</span></label> <label className="form-label">
Credit Destination Account <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.credit_destination_account} value={formField.credit_destination_account}
onValueChange={(value) => setFormField({ ...formField, credit_destination_account: value })} onValueChange={(value) =>
setFormField({ ...formField, credit_destination_account: value })
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Wallet" /> <SelectValue placeholder="Select Wallet" />
@ -591,7 +633,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Transaction Type ID <span className="text-red-500">*</span></label> <label className="form-label">
Transaction Type ID <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.transaction_type} value={formField.transaction_type}
onValueChange={(transaction_type) => onValueChange={(transaction_type) =>
@ -612,7 +656,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Status <span className="text-red-500">*</span></label> <label className="form-label">
Status <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.status} value={formField.status}
onValueChange={(value) => setFormField({ ...formField, status: value })} onValueChange={(value) => setFormField({ ...formField, status: value })}
@ -628,7 +674,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Status Include <span className="text-red-500">*</span></label> <label className="form-label">
Status Include <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.status_include} value={formField.status_include}
onValueChange={(value) => setFormField({ ...formField, status_include: value })} onValueChange={(value) => setFormField({ ...formField, status_include: value })}
@ -644,7 +692,9 @@ const EditFeeDialog = () => {
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Priority <span className="text-red-500">*</span></label> <label className="form-label">
Priority <span className="text-red-500">*</span>
</label>
<Select <Select
value={formField.priority} value={formField.priority}
onValueChange={(value) => setFormField({ ...formField, priority: value })} onValueChange={(value) => setFormField({ ...formField, priority: value })}

93
src/pages/transfer/transferfee/hooks/ManageTransferFeeContext.tsx
View File

@ -1,15 +1,15 @@
import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components'; import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components';
import { Toaster } from '@/components/ui/sonner'; import { Toaster } from '@/components/ui/sonner';
import { apiConfig } from '@/config/api.config'; import { apiConfig } from '@/config/api.config';
import { useCallApi } from '@/hooks'; import { useCallApi } from '@/hooks';
import { ColumnDef } from '@tanstack/react-table'; import { ColumnDef } from '@tanstack/react-table';
import { createContext, useCallback, useEffect, useMemo, useState } from 'react'; import { createContext, useCallback, useEffect, useMemo, useState } from 'react';
import ListToolbar from '../blocks/ListToolBar'; import ListToolbar from '../blocks/ListToolBar';
import DeleteDialog from '../blocks/DeleteDialog'; import DeleteDialog from '../blocks/DeleteDialog';
import { EditFeeDialog } from '../blocks/EditDialog'; import { EditFeeDialog } from '../blocks/EditDialog';
import { useManageTransferTypeContext } from '../../transfertype/hooks/useManageTransferTypeContext'; import { useManageTransferTypeContext } from '../../transfertype/hooks/useManageTransferTypeContext';
interface ContextProps { interface ContextProps {
showEditFeeDialog: boolean; showEditFeeDialog: boolean;
handleEditFeeDialog: (show: boolean, selected_TransferFee: string | null) => void; handleEditFeeDialog: (show: boolean, selected_TransferFee: string | null) => void;
showAddFeeDialog: boolean; showAddFeeDialog: boolean;
@ -18,10 +18,9 @@
showDeleteFeeDialog: boolean; showDeleteFeeDialog: boolean;
selectedTransferFee: string | null; selectedTransferFee: string | null;
transactionTypeId: string | null; transactionTypeId: string | null;
}
} const initialProps: ContextProps = {
const initialProps: ContextProps = {
showEditFeeDialog: false, showEditFeeDialog: false,
handleEditFeeDialog: () => {}, handleEditFeeDialog: () => {},
showAddFeeDialog: false, showAddFeeDialog: false,
@ -29,29 +28,34 @@
showDeleteFeeDialog: false, showDeleteFeeDialog: false,
handleDeleteFeeDialog: () => {}, handleDeleteFeeDialog: () => {},
selectedTransferFee: null, selectedTransferFee: null,
transactionTypeId: null, transactionTypeId: null
};
}; interface TransferFeeProps {
interface TransferFeeProps {
name: string; name: string;
description: string; description: string;
minimum_amount: number; minimum_amount: number;
maximum_amount:number; maximum_amount: number;
period_start:string; period_start: string;
period_end:string; period_end: string;
deduct_amount: number; deduct_amount: number;
deduct_percentage: number; deduct_percentage: number;
transaction_type: string; transaction_type: string;
status: string; status: string;
status_include: string; status_include: string;
fee: number; fee: number;
} }
const ManageTransferFeeContext = createContext<ContextProps>(initialProps); const ManageTransferFeeContext = createContext<ContextProps>(initialProps);
const API_URL = apiConfig.service_transaction; const API_URL = apiConfig.service_transaction;
const ManageTransferFeeContextProvider = ({ children, transactionTypeId = null }: { children: React.ReactNode; transactionTypeId?: string | null }) => { const ManageTransferFeeContextProvider = ({
children,
transactionTypeId = null
}: {
children: React.ReactNode;
transactionTypeId?: string | null;
}) => {
const [showEditFeeDialog, setShowEditFeeDialog] = useState(false); const [showEditFeeDialog, setShowEditFeeDialog] = useState(false);
const [showAddFeeDialog, setShowAddFeeDialog] = useState(false); const [showAddFeeDialog, setShowAddFeeDialog] = useState(false);
const [showDeleteFeeDialog, setShowDeleteFeeDialog] = useState(false); const [showDeleteFeeDialog, setShowDeleteFeeDialog] = useState(false);
@ -67,10 +71,13 @@
setShowAddFeeDialog(show); setShowAddFeeDialog(show);
}, []); }, []);
const handleDeleteFeeDialog = useCallback((show: boolean, selected_TransferFee: string | null) => { const handleDeleteFeeDialog = useCallback(
(show: boolean, selected_TransferFee: string | null) => {
setSelectedTransferFee(show ? selected_TransferFee : null); setSelectedTransferFee(show ? selected_TransferFee : null);
setShowDeleteFeeDialog(show); setShowDeleteFeeDialog(show);
}, []); },
[]
);
const doGetTransferFeeListData = async ( const doGetTransferFeeListData = async (
page: number, page: number,
limit: number, limit: number,
@ -85,16 +92,19 @@
filter = filter.length === 0 ? {} : { any: filter[0].value.toLowerCase() }; filter = filter.length === 0 ? {} : { any: filter[0].value.toLowerCase() };
try { try {
const response = await GetData(`${API_URL}/transactionfees/getdatabytransactiontype/${selectedTransferType}`, {}); const response = await GetData(
`${API_URL}/transactionfees/getdatabytransactiontype/${selectedTransferType}`,
{}
);
// console.log('API Response:', response?.data); // console.log('API Response:', response?.data);
return { return {
data: response?.data , data: response?.data,
totalCount: 1 totalCount: 1
}; };
} catch (error) { } catch (error) {
console.error("Error fetching transaction fees by transaction type:", error); console.error('Error fetching transaction fees by transaction type:', error);
return { data: [], totalCount: 0 }; return { data: [], totalCount: 0 };
} }
}; };
@ -193,9 +203,7 @@
return mapping[row.credit_to] || 'Unknown'; return mapping[row.credit_to] || 'Unknown';
}, },
id: 'credit_to', id: 'credit_to',
header: ({ column }) => ( header: ({ column }) => <DataGridColumnHeader title="Credit To" column={column} />,
<DataGridColumnHeader title="Credit To" column={column} />
),
enableSorting: true, enableSorting: true,
enableHiding: false, enableHiding: false,
meta: { headerClassName: 'w-[250px]' } meta: { headerClassName: 'w-[250px]' }
@ -216,7 +224,9 @@
{ {
accessorFn: (row) => row.credit_destination_account?.description, accessorFn: (row) => row.credit_destination_account?.description,
id: 'credit_destination_account', id: 'credit_destination_account',
header: ({ column }) => <DataGridColumnHeader title="Credit Destination Account" column={column} />, header: ({ column }) => (
<DataGridColumnHeader title="Credit Destination Account" column={column} />
),
enableSorting: true, enableSorting: true,
enableHiding: false, enableHiding: false,
meta: { headerClassName: 'w-[250px]' } meta: { headerClassName: 'w-[250px]' }
@ -225,15 +235,13 @@
accessorFn: (row: { deduct_from: string }) => { accessorFn: (row: { deduct_from: string }) => {
const mapping: Record<string, string> = { const mapping: Record<string, string> = {
D: 'Destination Member', D: 'Destination Member',
S: 'Source Member', S: 'Source Member'
}; };
return mapping[row.deduct_from]; return mapping[row.deduct_from];
}, },
id: 'deduct_from', id: 'deduct_from',
header: ({ column }) => ( header: ({ column }) => <DataGridColumnHeader title="Deduct From" column={column} />,
<DataGridColumnHeader title="Deduct From" column={column} />
),
enableSorting: true, enableSorting: true,
enableHiding: false, enableHiding: false,
meta: { headerClassName: 'w-[250px]' } meta: { headerClassName: 'w-[250px]' }
@ -241,7 +249,9 @@
{ {
accessorFn: (row) => row.deduct_from_account?.description, accessorFn: (row) => row.deduct_from_account?.description,
id: 'deduct_from_account', id: 'deduct_from_account',
header: ({ column }) => <DataGridColumnHeader title="Deduct From Account" column={column} />, header: ({ column }) => (
<DataGridColumnHeader title="Deduct From Account" column={column} />
),
enableSorting: true, enableSorting: true,
enableHiding: false, enableHiding: false,
meta: { headerClassName: 'w-[250px]' } meta: { headerClassName: 'w-[250px]' }
@ -381,11 +391,10 @@
} }
> >
{children} {children}
</DataGridProvider> </DataGridProvider>
</ManageTransferFeeContext.Provider> </ManageTransferFeeContext.Provider>
</div> </div>
); );
}; };
export { ManageTransferFeeContext, ManageTransferFeeContextProvider }; export { ManageTransferFeeContext, ManageTransferFeeContextProvider };

4
src/pages/transfer/transfertype/blocks/AddDialog.tsx
View File

@ -76,7 +76,6 @@ const AddDialog = () => {
wallet_origin: '', wallet_origin: '',
wallet_destination: '', wallet_destination: '',
minimum_amount: 0, minimum_amount: 0,
maximum_amount: 0, maximum_amount: 0,
max_transaction_per_day: 0, max_transaction_per_day: 0,
@ -222,7 +221,7 @@ const AddDialog = () => {
page: 1, page: 1,
with_deleted: false, with_deleted: false,
order_field: 'wallets.name', order_field: 'wallets.name',
order_direction: 'ASC', order_direction: 'ASC'
}; };
const response = await GetData(`${API_URL_MASTERDATA}/wallet/list`, params); const response = await GetData(`${API_URL_MASTERDATA}/wallet/list`, params);
// console.log(response) // console.log(response)
@ -439,7 +438,6 @@ const AddDialog = () => {
</div> </div>
</div> </div>
<div className="w-full"> <div className="w-full">
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label className="form-label flex items-center gap-1 max-w-56"> <label className="form-label flex items-center gap-1 max-w-56">

22
src/pages/transfer/transfertype/blocks/DeleteDialog.tsx
View File

@ -1,4 +1,10 @@
import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'; import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Alert, useDataGrid } from '@/components'; import { Alert, useDataGrid } from '@/components';
import { useCallback, useState } from 'react'; import { useCallback, useState } from 'react';
@ -12,7 +18,8 @@ import { doSaveLogActivity } from '@/actions/GlobalActions';
const API_URL = apiConfig.service_transaction; const API_URL = apiConfig.service_transaction;
const DeleteDialog = () => { const DeleteDialog = () => {
const { showDeleteDialog, handleDeleteDialog, selectedTransferType } = useManageTransferTypeContext(); const { showDeleteDialog, handleDeleteDialog, selectedTransferType } =
useManageTransferTypeContext();
const { reload } = useDataGrid(); const { reload } = useDataGrid();
const { DeleteData } = useCallApi(); const { DeleteData } = useCallApi();
const [alert, setAlert] = useState({ const [alert, setAlert] = useState({
@ -26,9 +33,12 @@ const DeleteDialog = () => {
return; return;
} }
const response = await DeleteData(`${API_URL}/transactiontype/delete/${selectedTransferType}/false`, { const response = await DeleteData(
`${API_URL}/transactiontype/delete/${selectedTransferType}/false`,
{
id: selectedTransferType id: selectedTransferType
}); }
);
if (response?.status) { if (response?.status) {
setAlert({ show: false, message: '' }); setAlert({ show: false, message: '' });
@ -51,7 +61,9 @@ const DeleteDialog = () => {
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden"> <DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden">
<DialogHeader className="p-0 border-0 block"> <DialogHeader className="p-0 border-0 block">
<DialogTitle className="text-lg">Delete Transfer Type</DialogTitle> <DialogTitle className="text-lg">Delete Transfer Type</DialogTitle>
<DialogDescription className="text-sm">Are you sure you want to delete this data?</DialogDescription> <DialogDescription className="text-sm">
Are you sure you want to delete this data?
</DialogDescription>
<Alert variant="warning"> <Alert variant="warning">
<h3 className="text-lg">Are you sure?</h3> <h3 className="text-lg">Are you sure?</h3>
<span className="text-sm">You will delete this data!</span> <span className="text-sm">You will delete this data!</span>

11
src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx
View File

@ -147,19 +147,19 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React
meta: { headerClassName: 'w-[250px]' } meta: { headerClassName: 'w-[250px]' }
}, },
{ {
accessorFn: (row: {type: string }) => { accessorFn: (row: { type: string }) => {
const mapping: Record<string, string> = { const mapping: Record<string, string> = {
D: 'Disbursement', D: 'Disbursement',
O: 'Other', O: 'Other',
CA: 'Change Group Emoney Customer to Agent', CA: 'Change Group Emoney Customer to Agent',
AC:'Change Group Emoney Agent to Customer', AC: 'Change Group Emoney Agent to Customer',
PC: 'Change Group Point Agent to Customer', PC: 'Change Group Point Agent to Customer',
PA: 'Change Group Point Customer to Agent', PA: 'Change Group Point Customer to Agent',
CE:'Return Customer Emoney', CE: 'Return Customer Emoney',
AD:'Return Agent Deposit', AD: 'Return Agent Deposit',
AM: 'Return Agent Merchant', AM: 'Return Agent Merchant',
AE: 'Return Agent Emoney', AE: 'Return Agent Emoney',
R: 'Reward Point', R: 'Reward Point'
}; };
return mapping[row.type] || 'Unknown'; return mapping[row.type] || 'Unknown';
@ -224,7 +224,6 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React
sorting: any, sorting: any,
filter: any filter: any
) => { ) => {
const orderField = 'created_at'; const orderField = 'created_at';
const orderDirection = sorting.length > 0 ? (sorting[0].desc ? 'DESC' : 'ASC') : 'DESC'; const orderDirection = sorting.length > 0 ? (sorting[0].desc ? 'DESC' : 'ASC') : 'DESC';