Merge branch 'master' of https://git.shiblysolution.id/TPAY/dashboard
This commit is contained in:
unknown
@ -1,6 +1,9 @@
|
||||
import { Container, DataGridInner } from '@/components';
|
||||
import { ManageWalletRuleContextProvider } from './hooks/ManageWalletRuleContext';
|
||||
import { Breadcrumbs, Link } from '@mui/material';
|
||||
import AddDialog from './blocks/AddDialog';
|
||||
import EditDialog from './blocks/EditDialog';
|
||||
import DeleteDialog from './blocks/DeleteDialog';
|
||||
|
||||
const WalletRuleMaster = () => {
|
||||
return (
|
||||
@ -24,6 +27,10 @@ const WalletRuleMaster = () => {
|
||||
<div className="grid gap-5 lg:gap-7.5">
|
||||
<DataGridInner />
|
||||
</div>
|
||||
|
||||
<AddDialog />
|
||||
<EditDialog />
|
||||
<DeleteDialog />
|
||||
</Container>
|
||||
</ManageWalletRuleContextProvider>
|
||||
);
|
||||
|
||||
380
src/pages/master/walletRule/blocks/AddDialog.tsx
Normal file
380
src/pages/master/walletRule/blocks/AddDialog.tsx
Normal file
@ -0,0 +1,380 @@
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { useManageWalletRuleContext } from '../hooks/useManageWalletRuleContext';
|
||||
import { Alert, useDataGrid } from '@/components';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import {
|
||||
Dialog,
|
||||
DialogBody,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
|
||||
import {
|
||||
Command,
|
||||
CommandEmpty,
|
||||
CommandGroup,
|
||||
CommandInput,
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { NumericFormat } from 'react-number-format';
|
||||
|
||||
interface GroupProps {
|
||||
ID: string;
|
||||
is_bank: string;
|
||||
name: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
interface WalletProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
id_currency: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
const API_URL_WALLET = apiConfig.service_wallet;
|
||||
const AddDialog = () => {
|
||||
const { showAddDialog, handleAddDialog } = useManageWalletRuleContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [alert, setAlert] = useState({
|
||||
show: false,
|
||||
message: ''
|
||||
});
|
||||
const initialState: {
|
||||
id_wallet: string;
|
||||
id_group: string;
|
||||
max_transaction_per_day: string | number | null;
|
||||
balance_minimum: string | number | null;
|
||||
balance_maximum: string | number | null;
|
||||
credit_limit: string | number | null;
|
||||
monthly_limit: string | number | null;
|
||||
status: string;
|
||||
} = {
|
||||
id_wallet: '',
|
||||
id_group: '',
|
||||
max_transaction_per_day: null,
|
||||
balance_minimum: null,
|
||||
balance_maximum: null,
|
||||
credit_limit: null,
|
||||
monthly_limit: null,
|
||||
status: ''
|
||||
};
|
||||
const [formField, setFormField] = useState(initialState);
|
||||
const [groups, setGroups] = useState<GroupProps[]>([]);
|
||||
const [wallets, setWallets] = useState<WalletProps[]>([]);
|
||||
|
||||
const resetForm = () => {
|
||||
setFormField(initialState);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
const doCreateWalletRule = useCallback(
|
||||
async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
const response = await PostData(`${API_URL_WALLET}/dashboard/wallet_rule`, formField);
|
||||
|
||||
if (response?.status) {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Wallet Rule');
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Create Wallet Rule');
|
||||
setAlert({ show: true, message: 'Failed Create Wallet Rule' });
|
||||
}
|
||||
},
|
||||
[formField]
|
||||
);
|
||||
|
||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (
|
||||
formField.id_group.trim() === '' ||
|
||||
formField.max_transaction_per_day === 0 ||
|
||||
formField.balance_minimum === 0 ||
|
||||
formField.balance_maximum === 0 ||
|
||||
formField.credit_limit === 0 ||
|
||||
formField.monthly_limit === 0 ||
|
||||
formField.status.trim() === ''
|
||||
) {
|
||||
setAlert({ show: true, message: 'Please fill in all required fields.' });
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(formField);
|
||||
doCreateWalletRule(e);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
const getGroupLists = async (sorting: any) => {
|
||||
try {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/group`, {
|
||||
limit: 100,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
|
||||
});
|
||||
|
||||
// console.log('GROUPS: ', response?.data);
|
||||
setGroups(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching groups', error);
|
||||
}
|
||||
};
|
||||
|
||||
const getWalletLists = async (sorting: any) => {
|
||||
try {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/wallet`, {
|
||||
limit: 100,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
|
||||
});
|
||||
|
||||
// console.log('WALLET: ', response?.data);
|
||||
setWallets(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching wallet', error);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getWalletLists([{ id: 'name', desc: false }]);
|
||||
getGroupLists([{ id: 'name', desc: false }]);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (showAddDialog === false) {
|
||||
resetForm();
|
||||
}
|
||||
}, [showAddDialog]);
|
||||
|
||||
return (
|
||||
<Dialog open={showAddDialog} onOpenChange={(open) => handleAddDialog(open)}>
|
||||
<DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Wallet Rule - Create</DialogTitle>
|
||||
<DialogDescription></DialogDescription>
|
||||
</DialogHeader>
|
||||
<DialogBody className="scrollable">
|
||||
<div className="flex flex-col">
|
||||
{alert.show && (
|
||||
<Alert variant="danger">
|
||||
<h3>{alert.message}</h3>
|
||||
</Alert>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="card-body grid gap-5">
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Wallet<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.id_wallet}
|
||||
onValueChange={(value) => setFormField({ ...formField, id_wallet: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Wallet Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{wallets.map((wallet) => (
|
||||
<SelectItem key={wallet.ID} value={wallet.ID}>
|
||||
{wallet.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Group<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.id_group}
|
||||
onValueChange={(value) => setFormField({ ...formField, id_group: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Group Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{groups.map((group) => (
|
||||
<SelectItem key={group.ID} value={group.ID}>
|
||||
{group.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Max Transaction Per Day<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.max_transaction_per_day ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
max_transaction_per_day:
|
||||
values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Max Transaction Per Day"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Balance Minimum<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.balance_minimum ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
balance_minimum: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Balance Minimum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Balance Maximum<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.balance_maximum ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
balance_maximum: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Balance Maximum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Credit Limit<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.credit_limit ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
credit_limit: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Credit Limit"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Monthly Limit<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.monthly_limit ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
monthly_limit: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Monthly Limit"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Status<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) => setFormField({ ...formField, status: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Status" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Active</SelectItem>
|
||||
<SelectItem value="N">Inactive</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-5">
|
||||
<Button type="button" variant="outline" onClick={resetForm}>
|
||||
Reset
|
||||
</Button>
|
||||
<Button variant="default">Create</Button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</DialogBody>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default AddDialog;
|
||||
76
src/pages/master/walletRule/blocks/DeleteDialog.tsx
Normal file
76
src/pages/master/walletRule/blocks/DeleteDialog.tsx
Normal file
@ -0,0 +1,76 @@
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useManageWalletRuleContext } from '../hooks/useManageWalletRuleContext';
|
||||
import { Alert, useDataGrid } from '@/components';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
|
||||
const API_URL_WALLET = apiConfig.service_wallet;
|
||||
|
||||
const DeleteDialog = () => {
|
||||
const { showDeleteDialog, handleDeleteDialog, selectedWalletRule } = useManageWalletRuleContext();
|
||||
const { DeleteData } = useCallApi();
|
||||
const { reload } = useDataGrid();
|
||||
const [alert, setAlert] = useState({ show: false, message: '' });
|
||||
|
||||
const doDeleteWalletRule = useCallback(async () => {
|
||||
if (!selectedWalletRule) {
|
||||
toast.error('No wallet rule selected');
|
||||
return;
|
||||
}
|
||||
|
||||
const response = await DeleteData(
|
||||
`${API_URL_WALLET}/dashboard/wallet_rule/${selectedWalletRule.ID}`,
|
||||
{ id: selectedWalletRule.ID }
|
||||
);
|
||||
|
||||
if (response?.status) {
|
||||
toast.success('Wallet rule deleted successfully');
|
||||
handleDeleteDialog(false, null);
|
||||
reload();
|
||||
setAlert({ show: false, message: '' });
|
||||
} else {
|
||||
toast.error('Failed to delete wallet rule');
|
||||
setAlert({ show: true, message: response?.message });
|
||||
}
|
||||
}, [selectedWalletRule]);
|
||||
|
||||
return (
|
||||
<Dialog open={showDeleteDialog} onOpenChange={(open) => handleDeleteDialog(open, null)}>
|
||||
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden">
|
||||
<DialogHeader className="p-0 border-0 block">
|
||||
<DialogTitle></DialogTitle>
|
||||
<DialogDescription></DialogDescription>
|
||||
<Alert variant="warning">
|
||||
<h3 className="text-lg">Are you sure?</h3>
|
||||
<span className="text-sm">You will delete this data!</span>
|
||||
</Alert>
|
||||
{alert.show && (
|
||||
<Alert variant="danger">
|
||||
<h3>{alert.message}</h3>
|
||||
</Alert>
|
||||
)}
|
||||
</DialogHeader>
|
||||
<DialogFooter className="flex justify-end items-center gap-4 mt-3">
|
||||
<Button variant="outline" onClick={() => handleDeleteDialog(false, null)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="destructive" onClick={doDeleteWalletRule}>
|
||||
Delete
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeleteDialog;
|
||||
418
src/pages/master/walletRule/blocks/EditDialog.tsx
Normal file
418
src/pages/master/walletRule/blocks/EditDialog.tsx
Normal file
@ -0,0 +1,418 @@
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useManageWalletRuleContext } from '../hooks/useManageWalletRuleContext';
|
||||
import { Alert, useDataGrid } from '@/components';
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { toast } from 'sonner';
|
||||
import {
|
||||
Dialog,
|
||||
DialogBody,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
|
||||
import {
|
||||
Command,
|
||||
CommandEmpty,
|
||||
CommandGroup,
|
||||
CommandInput,
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { NumericFormat } from 'react-number-format';
|
||||
|
||||
interface GroupProps {
|
||||
ID: string;
|
||||
is_bank: string;
|
||||
name: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
interface WalletProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
id_currency: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
const API_URL_WALLET = apiConfig.service_wallet;
|
||||
|
||||
const EditDialog = () => {
|
||||
const { showEditDialog, handleEditDialog, selectedWalletRule } = useManageWalletRuleContext();
|
||||
const { GetData, PutData } = useCallApi();
|
||||
const { reload } = useDataGrid();
|
||||
const [alert, setAlert] = useState({
|
||||
show: false,
|
||||
message: ''
|
||||
});
|
||||
const initialState: {
|
||||
id_wallet: string;
|
||||
id_group: string;
|
||||
max_transaction_per_day: string | number | null;
|
||||
balance_minimum: string | number | null;
|
||||
balance_maximum: string | number | null;
|
||||
credit_limit: string | number | null;
|
||||
monthly_limit: string | number | null;
|
||||
status: string;
|
||||
} = {
|
||||
id_wallet: '',
|
||||
id_group: '',
|
||||
max_transaction_per_day: null,
|
||||
balance_minimum: null,
|
||||
balance_maximum: null,
|
||||
credit_limit: null,
|
||||
monthly_limit: null,
|
||||
status: ''
|
||||
};
|
||||
const [formField, setFormField] = useState(initialState);
|
||||
const [groups, setGroups] = useState<GroupProps[]>([]);
|
||||
const [wallets, setWallets] = useState<WalletProps[]>([]);
|
||||
|
||||
const resetForm = () => {
|
||||
setFormField(initialState);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
const doUpdateWalletRule = useCallback(
|
||||
async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
const response = await PutData(
|
||||
`${API_URL_WALLET}/dashboard/wallet_rule/${selectedWalletRule?.ID}`,
|
||||
formField
|
||||
);
|
||||
|
||||
if (response?.status) {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Wallet Rule');
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Update Wallet Rule');
|
||||
setAlert({ show: true, message: 'Failed Update Wallet Rule' });
|
||||
}
|
||||
},
|
||||
[formField]
|
||||
);
|
||||
|
||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (
|
||||
formField.id_group.trim() === '' ||
|
||||
formField.max_transaction_per_day === 0 ||
|
||||
formField.balance_minimum === 0 ||
|
||||
formField.balance_maximum === 0 ||
|
||||
formField.credit_limit === 0 ||
|
||||
formField.monthly_limit === 0 ||
|
||||
formField.status.trim() === ''
|
||||
) {
|
||||
setAlert({ show: true, message: 'Please fill in all required fields.' });
|
||||
return;
|
||||
}
|
||||
|
||||
// console.log(formField);
|
||||
doUpdateWalletRule(e);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
const getGroupLists = async (sorting: any) => {
|
||||
try {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/group`, {
|
||||
limit: 100,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
|
||||
});
|
||||
|
||||
// console.log('GROUPS: ', response?.data);
|
||||
setGroups(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching groups', error);
|
||||
}
|
||||
};
|
||||
|
||||
const getWalletLists = async (sorting: any) => {
|
||||
try {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/wallet`, {
|
||||
limit: 100,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
|
||||
});
|
||||
|
||||
// console.log('WALLET: ', response?.data);
|
||||
setWallets(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching wallet', error);
|
||||
}
|
||||
};
|
||||
|
||||
const doFetchData = useCallback(async (id: string) => {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/wallet_rule/${id}`, { id });
|
||||
|
||||
console.log(response);
|
||||
if (response?.status) {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
id_wallet: response?.data.id_wallet,
|
||||
id_group: response?.data.id_group,
|
||||
max_transaction_per_day: response?.data.max_transaction_per_day,
|
||||
balance_minimum: response?.data.balance_minimum,
|
||||
balance_maximum: response?.data.balance_maximum,
|
||||
credit_limit: response?.data.credit_limit,
|
||||
monthly_limit: response?.data.monthly_limit,
|
||||
status: response?.data.status
|
||||
}));
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
getWalletLists([{ id: 'name', desc: false }]);
|
||||
getGroupLists([{ id: 'name', desc: false }]);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (showEditDialog === false) {
|
||||
resetForm();
|
||||
}
|
||||
}, [showEditDialog]);
|
||||
|
||||
useEffect(() => {
|
||||
if (selectedWalletRule) {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
id_wallet: selectedWalletRule?.id_wallet,
|
||||
id_group: selectedWalletRule?.id_group,
|
||||
max_transaction_per_day: selectedWalletRule?.max_transaction_per_day,
|
||||
balance_minimum: selectedWalletRule?.balance_minimum,
|
||||
balance_maximum: selectedWalletRule?.balance_maximum,
|
||||
credit_limit: selectedWalletRule?.credit_limit,
|
||||
monthly_limit: selectedWalletRule?.monthly_limit,
|
||||
status: selectedWalletRule?.status
|
||||
}));
|
||||
}
|
||||
}, [selectedWalletRule]);
|
||||
// console.log(selectedWalletRule);
|
||||
return (
|
||||
<Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
|
||||
<DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Wallet Rule - Create</DialogTitle>
|
||||
<DialogDescription></DialogDescription>
|
||||
</DialogHeader>
|
||||
<DialogBody className="scrollable">
|
||||
<div className="flex flex-col">
|
||||
{alert.show && (
|
||||
<Alert variant="danger">
|
||||
<h3>{alert.message}</h3>
|
||||
</Alert>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="card-body grid gap-5">
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Wallet<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.id_wallet}
|
||||
onValueChange={(value) => setFormField({ ...formField, id_wallet: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Wallet Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{wallets.map((wallet) => (
|
||||
<SelectItem key={wallet.ID} value={wallet.ID}>
|
||||
{wallet.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Group<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.id_group}
|
||||
onValueChange={(value) => setFormField({ ...formField, id_group: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Group Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{groups.map((group) => (
|
||||
<SelectItem key={group.ID} value={group.ID}>
|
||||
{group.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Max Transaction Per Day<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.max_transaction_per_day ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
max_transaction_per_day:
|
||||
values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Max Transaction Per Day"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Balance Minimum<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.balance_minimum ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
balance_minimum: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Balance Minimum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Balance Maximum<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.balance_maximum ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
balance_maximum: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Balance Maximum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Credit Limit<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.credit_limit ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
credit_limit: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Credit Limit"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Monthly Limit<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.monthly_limit ?? ''}
|
||||
thousandSeparator="."
|
||||
decimalSeparator=","
|
||||
allowNegative={false}
|
||||
onValueChange={(values) => {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
monthly_limit: values.floatValue !== undefined ? values.floatValue : ''
|
||||
}));
|
||||
}}
|
||||
placeholder="Enter Monthly Limit"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<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">
|
||||
Status<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) => setFormField({ ...formField, status: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Status" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Active</SelectItem>
|
||||
<SelectItem value="N">Inactive</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-5">
|
||||
<Button type="button" variant="outline" onClick={resetForm}>
|
||||
Reset
|
||||
</Button>
|
||||
<Button variant="default">Update</Button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</DialogBody>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditDialog;
|
||||
@ -1,17 +1,17 @@
|
||||
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { useManageProductsContext } from '../../products/hooks/useManageProductsContext';
|
||||
import { useManageWalletRuleContext } from '../hooks/useManageWalletRuleContext';
|
||||
|
||||
const ListToolbar = () => {
|
||||
const { table, reload } = useDataGrid();
|
||||
const { handleAddDialog } = useManageProductsContext();
|
||||
const { handleAddDialog } = useManageWalletRuleContext();
|
||||
|
||||
return (
|
||||
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
|
||||
<div className="flex flex-wrap gap-2 lg:gap-5 w-full">
|
||||
<div className="flex justify-between w-full items-center">
|
||||
<div className="flex w-[50%] gap-3 items-center">
|
||||
<label className="input input-sm w-1/3">
|
||||
{/* <label className="input input-sm w-1/3">
|
||||
<KeenIcon icon="magnifier" />
|
||||
<input
|
||||
type="text"
|
||||
@ -19,7 +19,7 @@ const ListToolbar = () => {
|
||||
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
|
||||
/>
|
||||
</label>
|
||||
</label> */}
|
||||
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
|
||||
<Button
|
||||
variant="outline"
|
||||
|
||||
@ -7,8 +7,14 @@ import React, { createContext, useCallback, useMemo, useState } from 'react';
|
||||
import ListToolbar from '../blocks/ListToolbar';
|
||||
|
||||
interface WalletRuleProps {
|
||||
name: string;
|
||||
id_currency: string;
|
||||
ID: string;
|
||||
id_wallet: string;
|
||||
id_group: string;
|
||||
max_transaction_per_day: number | null;
|
||||
balance_minimum: number | null;
|
||||
balance_maximum: number | null;
|
||||
credit_limit: number | null;
|
||||
monthly_limit: number | null;
|
||||
status: string;
|
||||
}
|
||||
|
||||
@ -17,10 +23,10 @@ interface ContextProps {
|
||||
showAddDialog: boolean;
|
||||
handleAddDialog: (show: boolean) => void;
|
||||
showEditDialog: boolean;
|
||||
handleEditDialog: (show: boolean, selected_walletRule: string | null) => void;
|
||||
handleEditDialog: (show: boolean, selected_walletRule: WalletRuleProps | null) => void;
|
||||
showDeleteDialog: boolean;
|
||||
handleDeleteDialog: (show: boolean, selected_walletRule: string | null) => void;
|
||||
selectedWalletRule: string | null;
|
||||
handleDeleteDialog: (show: boolean, selected_walletRule: WalletRuleProps | null) => void;
|
||||
selectedWalletRule: WalletRuleProps | null;
|
||||
getWalletRuleLists: (
|
||||
limit: number,
|
||||
page: number,
|
||||
@ -35,9 +41,9 @@ const initialProps: ContextProps = {
|
||||
showAddDialog: false,
|
||||
handleAddDialog: (show: boolean) => {},
|
||||
showEditDialog: false,
|
||||
handleEditDialog: (show: boolean, selected_walletRule: string | null) => {},
|
||||
handleEditDialog: (show: boolean, selected_walletRule: object | null) => {},
|
||||
showDeleteDialog: false,
|
||||
handleDeleteDialog: (show: boolean, selected_walletRule: string | null) => {},
|
||||
handleDeleteDialog: (show: boolean, selected_walletRule: object | null) => {},
|
||||
selectedWalletRule: null,
|
||||
getWalletRuleLists: async () => undefined
|
||||
};
|
||||
@ -50,22 +56,28 @@ const ManageWalletRuleContextProvider = ({ children }: { children: React.ReactNo
|
||||
const [showAddDialog, setShowAddDialog] = useState(false);
|
||||
const [showEditDialog, setShowEditDialog] = useState(false);
|
||||
const [showDeleteDialog, setShowDeleteDialog] = useState(false);
|
||||
const [selectedWalletRule, setSelectedWalletRule] = useState<string | null>(null);
|
||||
const [selectedWalletRule, setSelectedWalletRule] = useState<WalletRuleProps | null>(null);
|
||||
const { GetData } = useCallApi();
|
||||
|
||||
const handleAddDialog = useCallback((show: boolean) => {
|
||||
setShowAddDialog(show);
|
||||
}, []);
|
||||
|
||||
const handleEditDialog = useCallback((show: boolean, selected_walletRule: string | null) => {
|
||||
setShowEditDialog(show);
|
||||
setSelectedWalletRule(show ? selected_walletRule : null);
|
||||
}, []);
|
||||
const handleEditDialog = useCallback(
|
||||
(show: boolean, selected_walletRule: WalletRuleProps | null) => {
|
||||
setShowEditDialog(show);
|
||||
setSelectedWalletRule(show ? selected_walletRule : null);
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const handleDeleteDialog = useCallback((show: boolean, selected_walletRule: string | null) => {
|
||||
setShowDeleteDialog(show);
|
||||
setSelectedWalletRule(show ? selected_walletRule : null);
|
||||
}, []);
|
||||
const handleDeleteDialog = useCallback(
|
||||
(show: boolean, selected_walletRule: WalletRuleProps | null) => {
|
||||
setShowDeleteDialog(show);
|
||||
setSelectedWalletRule(show ? selected_walletRule : null);
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const columns = useMemo<ColumnDef<any>[]>(
|
||||
() => [
|
||||
@ -142,13 +154,13 @@ const ManageWalletRuleContextProvider = ({ children }: { children: React.ReactNo
|
||||
<>
|
||||
<button
|
||||
className="btn btn-sm btn-icon btn-clear btn-light"
|
||||
onClick={() => handleEditDialog(true, row.id)}
|
||||
onClick={() => handleEditDialog(true, row)}
|
||||
>
|
||||
<KeenIcon icon="notepad-edit" />
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-sm btn-icon btn-clear btn-light"
|
||||
onClick={() => handleDeleteDialog(true, row.id)}
|
||||
onClick={() => handleDeleteDialog(true, row)}
|
||||
>
|
||||
<KeenIcon icon="trash" />
|
||||
</button>
|
||||
@ -176,7 +188,7 @@ const ManageWalletRuleContextProvider = ({ children }: { children: React.ReactNo
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
|
||||
filter: JSON.stringify(filter)
|
||||
});
|
||||
console.log(response?.data);
|
||||
// console.log(response?.data);
|
||||
setWalletRules(response?.data.list);
|
||||
return { data: response?.data.list, totalCount: response?.data.total_count };
|
||||
} catch (error) {
|
||||
@ -194,7 +206,7 @@ const ManageWalletRuleContextProvider = ({ children }: { children: React.ReactNo
|
||||
handleEditDialog,
|
||||
showDeleteDialog,
|
||||
handleDeleteDialog,
|
||||
selectedWalletRule,
|
||||
selectedWalletRule: selectedWalletRule,
|
||||
getWalletRuleLists
|
||||
}}
|
||||
>
|
||||
|
||||
@ -75,7 +75,7 @@ const AddFeeDialog = () => {
|
||||
period_end: '',
|
||||
deduct_amount: 0,
|
||||
deduct_percentage: 0,
|
||||
priority: false,
|
||||
priority: '',
|
||||
status: '',
|
||||
status_include: '',
|
||||
created_by: '',
|
||||
@ -107,7 +107,7 @@ const AddFeeDialog = () => {
|
||||
transaction_type: formField.transaction_type,
|
||||
status: formField.status,
|
||||
status_include: formField.status_include,
|
||||
priority: formField.priority ? 'Y' : 'N'
|
||||
priority: formField.priority
|
||||
};
|
||||
};
|
||||
useEffect(() => {
|
||||
@ -162,7 +162,6 @@ const AddFeeDialog = () => {
|
||||
const response = await PostData(`${API_URL}/transactionfees/create`, {
|
||||
...formField
|
||||
});
|
||||
console.log(response);
|
||||
if (response?.status) {
|
||||
toast.success('Success Create Transfer Fee');
|
||||
reload();
|
||||
@ -202,7 +201,7 @@ const AddFeeDialog = () => {
|
||||
<div className="card flex flex-col gap-5">
|
||||
<div className="card-body grid gap-5 p-0">
|
||||
<div className="w-full">
|
||||
<label className="form-label">Transfer Free Name</label>
|
||||
<label className="form-label">Transfer Free Name <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="text"
|
||||
@ -214,7 +213,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Description</label>
|
||||
<label className="form-label">Description <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="text"
|
||||
@ -226,7 +225,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Minimum Amount</label>
|
||||
<label className="form-label">Minimum Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.minimum_amount}
|
||||
@ -243,7 +242,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Maximum Amount</label>
|
||||
<label className="form-label">Maximum Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.maximum_amount}
|
||||
@ -260,7 +259,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Period Start</label>
|
||||
<label className="form-label">Period Start <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="date"
|
||||
@ -272,7 +271,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Period End</label>
|
||||
<label className="form-label">Period End <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="date"
|
||||
@ -284,7 +283,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Deduct Amount</label>
|
||||
<label className="form-label">Deduct Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.deduct_amount}
|
||||
@ -301,7 +300,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Deduct Percentage</label>
|
||||
<label className="form-label">Deduct Percentage <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.deduct_percentage}
|
||||
@ -318,7 +317,7 @@ const AddFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Transacsion Type ID</label>
|
||||
<label className="form-label">Transacsion Type ID <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.transaction_type}
|
||||
onValueChange={(transaction_type) =>
|
||||
@ -338,7 +337,7 @@ const AddFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Status</label>
|
||||
<label className="form-label">Status <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) => setFormField({ ...formField, status: value })}
|
||||
@ -353,7 +352,7 @@ const AddFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Status Include</label>
|
||||
<label className="form-label">Status Include <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.status_include}
|
||||
onValueChange={(value) => setFormField({ ...formField, status_include: value })}
|
||||
@ -368,12 +367,10 @@ const AddFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Priority</label>
|
||||
<label className="form-label">Priority <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.priority ? 'Y' : 'N'}
|
||||
onValueChange={(value) =>
|
||||
setFormField((prev) => ({ ...prev, priority: value === 'Y' }))
|
||||
}
|
||||
value={formField.priority}
|
||||
onValueChange={(value) => setFormField({ ...formField, priority: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Priority" />
|
||||
|
||||
@ -20,7 +20,6 @@ const DeleteDialog = () => {
|
||||
});
|
||||
|
||||
const doDeleteTransferFee = useCallback(async () => {
|
||||
// Kirim enforce=false untuk memastikan soft delete
|
||||
const response = await DeleteData(`${API_URL}/transactionfees/delete/${selectedTransferFee}/false`, {
|
||||
id: selectedTransferFee
|
||||
});
|
||||
|
||||
@ -72,7 +72,7 @@ const EditFeeDialog = () => {
|
||||
period_end: '',
|
||||
deduct_amount: 0,
|
||||
deduct_percentage: 0,
|
||||
priority: false,
|
||||
priority: '',
|
||||
status: '',
|
||||
status_include: '',
|
||||
transaction_type: '',
|
||||
@ -96,9 +96,7 @@ const EditFeeDialog = () => {
|
||||
async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
const response = await PutData(`${API_URL}/transactionfees/update/${selectedTransferFee}`, {
|
||||
...formField,
|
||||
priority: formField.priority ? 'Y' : 'N' // Ubah ke "Y" atau "N"
|
||||
});
|
||||
...formField, });
|
||||
if (response?.status) {
|
||||
handleEditFeeDialog(false, null);
|
||||
toast.success('Success Update User');
|
||||
@ -190,7 +188,7 @@ const EditFeeDialog = () => {
|
||||
period_end: response.data.period_end,
|
||||
deduct_amount: response.data.deduct_amount,
|
||||
deduct_percentage: response.data.deduct_percentage,
|
||||
priority: response.data.priority === 'Y',
|
||||
priority: response.data.priority,
|
||||
status: response.data.status,
|
||||
status_include: response.data.status_include,
|
||||
transaction_type: response.data.transaction_type.id
|
||||
@ -213,7 +211,7 @@ const EditFeeDialog = () => {
|
||||
period_end: '',
|
||||
deduct_amount: 0,
|
||||
deduct_percentage: 0,
|
||||
priority: false,
|
||||
priority: '',
|
||||
status: '',
|
||||
status_include: '',
|
||||
transaction_type: '',
|
||||
@ -254,7 +252,7 @@ const EditFeeDialog = () => {
|
||||
<div className="card flex flex-col gap-5">
|
||||
<div className="card-body grid gap-5 p-0">
|
||||
<div className="w-full">
|
||||
<label className="form-label">Transfer Free Name</label>
|
||||
<label className="form-label">Transfer Free Name <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="text"
|
||||
@ -266,7 +264,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Description</label>
|
||||
<label className="form-label">Description <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="text"
|
||||
@ -278,7 +276,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Minimum Amount</label>
|
||||
<label className="form-label">Minimum Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.minimum_amount}
|
||||
@ -295,7 +293,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Maximum Amount</label>
|
||||
<label className="form-label">Maximum Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.maximum_amount}
|
||||
@ -312,7 +310,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Period Start</label>
|
||||
<label className="form-label">Period Start <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="date"
|
||||
@ -324,7 +322,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Period End</label>
|
||||
<label className="form-label">Period End <span className="text-red-500">*</span></label>
|
||||
<Input
|
||||
className="input"
|
||||
type="date"
|
||||
@ -336,7 +334,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Deduct Amount</label>
|
||||
<label className="form-label">Deduct Amount <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.deduct_amount}
|
||||
@ -353,7 +351,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Deduct Percentage</label>
|
||||
<label className="form-label">Deduct Percentage <span className="text-red-500">*</span></label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
value={formField.deduct_percentage}
|
||||
@ -370,7 +368,7 @@ const EditFeeDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Transacsion Type ID</label>
|
||||
<label className="form-label">Transacsion Type ID <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.transaction_type}
|
||||
onValueChange={(transaction_type) =>
|
||||
@ -390,7 +388,7 @@ const EditFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Status</label>
|
||||
<label className="form-label">Status <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) => setFormField({ ...formField, status: value })}
|
||||
@ -405,7 +403,7 @@ const EditFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Status Included</label>
|
||||
<label className="form-label">Status Included <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.status_include}
|
||||
onValueChange={(value) =>
|
||||
@ -422,25 +420,23 @@ const EditFeeDialog = () => {
|
||||
</Select>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">Priority</label>
|
||||
<Select
|
||||
value={formField.priority ? 'Y' : 'N'} // Menyesuaikan nilai
|
||||
onValueChange={(value) =>
|
||||
setFormField((prev) => ({ ...prev, priority: value === 'Y' }))
|
||||
}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Priority" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Yes</SelectItem>
|
||||
<SelectItem value="N">No</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<label className="form-label">Priority <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.priority}
|
||||
onValueChange={(value) => setFormField({ ...formField, priority: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Priority" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Yes</SelectItem>
|
||||
<SelectItem value="N">No</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
{/* <div className="w-full">
|
||||
<label className="form-label">Priotity</label>
|
||||
<label className="form-label">Priotity <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.priority}
|
||||
onValueChange={(value) => setFormField({ ...formField, priority: value })}
|
||||
@ -456,7 +452,7 @@ const EditFeeDialog = () => {
|
||||
</div> */}
|
||||
|
||||
{/* <div className="w-full">
|
||||
<label className="form-label">Priority</label>
|
||||
<label className="form-label">Priority <span className="text-red-500">*</span></label>
|
||||
<Select
|
||||
value={formField.priority ? 'Y' : 'N'}
|
||||
onValueChange={(value) =>
|
||||
|
||||
@ -153,7 +153,7 @@ const ManageTransferFeeContextProvider = ({ children }: { children: React.ReactN
|
||||
meta: { headerClassName: 'w-[100px]' }
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => (row.status === 'Y' ? 'Active' : 'Inactieve'),
|
||||
accessorFn: (row) => (row.status === 'Y' ? 'Active' : 'Inactive'),
|
||||
id: 'status',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Status" column={column} />,
|
||||
enableSorting: true,
|
||||
|
||||
@ -128,7 +128,7 @@ const AddDialog = () => {
|
||||
order_direction: sorting[0].desc ? 'DESC' : 'ASC'
|
||||
});
|
||||
setCustomers(response?.data.list);
|
||||
console.log('CUSTOMER: ', response?.data.list);
|
||||
// console.log('CUSTOMER: ', response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching customer', error);
|
||||
}
|
||||
|
||||
@ -143,7 +143,7 @@ const EditDialog = () => {
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc ? 'DESC' : 'ASC'
|
||||
});
|
||||
console.log('CUSTOMER: ', response?.data.list);
|
||||
// console.log('CUSTOMER: ', response?.data.list);
|
||||
setCustomers(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching customer', error);
|
||||
@ -177,7 +177,7 @@ const EditDialog = () => {
|
||||
|
||||
const fetchTransactionType = useCallback(async (id: string) => {
|
||||
const response = await GetData(`${API_URL}/transactiontype/getdata/${id}`, { id });
|
||||
console.log('Transaction Type: ', response?.data);
|
||||
// console.log('Transaction Type: ', response?.data);
|
||||
if (response?.status) {
|
||||
setFormField((prev) => ({
|
||||
...prev,
|
||||
@ -192,11 +192,9 @@ const EditDialog = () => {
|
||||
max_transaction_per_day: response.data.max_transaction_per_day,
|
||||
status_approval: response.data.status_approval,
|
||||
status: response.data.status
|
||||
// updated_by: parsedUser?.username ,
|
||||
// updated_at: new Date().toISOString().slice(0, 19).replace('T', ' ')
|
||||
}));
|
||||
console.log('Transaction Type: ', formField);
|
||||
}
|
||||
// console.log('form fieldd Transaction Type: ', formField);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
@ -242,6 +240,7 @@ const EditDialog = () => {
|
||||
<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">
|
||||
Transfer Type Name
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Input
|
||||
className="input"
|
||||
@ -259,6 +258,7 @@ const EditDialog = () => {
|
||||
<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">
|
||||
Description
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Input
|
||||
className="input"
|
||||
@ -276,6 +276,7 @@ const EditDialog = () => {
|
||||
<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">
|
||||
Minimum Amount
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
@ -298,6 +299,7 @@ const EditDialog = () => {
|
||||
<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">
|
||||
Maximum Amount
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
@ -319,6 +321,7 @@ const EditDialog = () => {
|
||||
<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">
|
||||
Maximum Transaction per day
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<NumericFormat
|
||||
className="input"
|
||||
@ -338,7 +341,8 @@ const EditDialog = () => {
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">From Account</label>
|
||||
<label className="form-label max-w-56">From Account<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.wallet_origin}
|
||||
@ -363,7 +367,8 @@ const EditDialog = () => {
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">To Account</label>
|
||||
<label className="form-label max-w-56">To Account<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.wallet_destination}
|
||||
@ -387,7 +392,8 @@ const EditDialog = () => {
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">Wallet Fee Destination</label>
|
||||
<label className="form-label max-w-56">Wallet Fee Destination<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.wallet_fee_destination}
|
||||
@ -411,7 +417,8 @@ const EditDialog = () => {
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">Select Customer</label>
|
||||
<label className="form-label max-w-56">Select Customer<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.customer_fee_destination}
|
||||
@ -435,7 +442,8 @@ const EditDialog = () => {
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">Status Approval</label>
|
||||
<label className="form-label max-w-56">Status Approval<span className="text-red-500">*</span>
|
||||
</label>
|
||||
|
||||
<div className="grow">
|
||||
<Select
|
||||
@ -458,7 +466,8 @@ const EditDialog = () => {
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-center flex-wrap gap-2.5">
|
||||
<label className="form-label max-w-56">Status</label>
|
||||
<label className="form-label max-w-56">Status<span className="text-red-500">*</span>
|
||||
</label>
|
||||
|
||||
<div className="grow">
|
||||
<Select
|
||||
|
||||
Reference in New Issue
Block a user