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

Merge branch 'master' of https://git.shiblysolution.id/TPAY/dashboard

Browse Source
This commit is contained in:
Raja Oktafrianto
2025-04-21 09:53:57 +07:00
parent 814bf9f04f db97899e17
commit ca0e8f33b8
10 changed files with 440 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/config/api.config.ts
View File

@ -8,10 +8,12 @@ interface apiConfigProps {
nationality: string;
service_disbursement: string;
service_notification: string;
service_feedback: string;
}
const API_URL = import.meta.env.VITE_APP_API_URL;
const apiConfig: apiConfigProps = {
service_feedback: `${API_URL}/k`,
// service_dashboard: `${API_URL}${import.meta.env.VITE_ENV != 'development' ? '/d' : ''}`,
service_dashboard: `${API_URL}/d`,
service_customer: `${API_URL}/c`,
@ -22,8 +24,7 @@ const apiConfig: apiConfigProps = {
transaction: `${API_URL}/x`,
service_disbursement: `${API_URL}/s`,
service_notification: `${API_URL}/n`,
nationality: `https://tpay.shiblysolution.id/cms/api/mobile/list-country/
`
nationality: `https://tpay.shiblysolution.id/cms/api/mobile/list-country/`
};
export { apiConfig };

40
src/pages/members/feedback-member/FeedbackMember.tsx Normal file
View File

@ -0,0 +1,40 @@
import { Container, DataGridInner } from '@/components';
import { ManageFeedbackMemberProvider } from './hooks/ManageFeedbackMemberContext';
// import EditDialog from './blocks/EditDialog';
// import DeleteDialog from './blocks/DeleteDialog';
import { Breadcrumbs, Link } from '@mui/material';
import { Helmet } from 'react-helmet';
const FeedbackMemberMaster = () => {
return (
<>
<Helmet><title>TPAY | Manage Provider</title></Helmet>
<ManageFeedbackMemberProvider>
<Container>
<h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Feedback Member</h1>
<Breadcrumbs sx={{ mb: 2 }}>
<Link underline="none" color="inherit" href="/">
<span className="text-sm hover:underline">Dashboard</span>
</Link>
<Link underline="none" color="inherit">
<span className="text-sm">Member</span>
</Link>
<Link underline="none" color="inherit">
<span className="text-sm">Manage Feedback Member</span>
</Link>
</Breadcrumbs>
<div className="grid gap-5 lg:gap-7.5">
<DataGridInner />
</div>
{/* <AddDialog />
<EditDialog />
<DeleteDialog /> */}
</Container>
</ManageFeedbackMemberProvider>
</>
);
};
export default FeedbackMemberMaster;

205
src/pages/members/feedback-member/hooks/ManageFeedbackMemberContext.tsx Normal file
View File

@ -0,0 +1,205 @@
import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components';
import { apiConfig } from '@/config/api.config';
import { useCallApi } from '@/hooks';
import { ColumnDef } from '@tanstack/react-table';
import React, { createContext, useCallback, useMemo, useState } from 'react';
import { Toaster } from 'sonner';
// import ListToolbar from '../blocks/ListToolbar';
interface feedbackProps {
id: string;
name: string;
description: string;
type: string;
status: string;
transactionTypeId: string;
agentId: string;
}
interface ContextProps {
feedback: feedbackProps[];
showEditDialog: boolean;
handleEditDialog: (show: boolean, selected_sucos: string | null) => void;
showAddDialog: boolean;
handleAddDialog: (show: boolean) => void;
showDeleteDialog: boolean;
handleDeleteDialog: (show: boolean, selected_sucos: string | null) => void;
selectedfeedback: string | null;
getfeedbackLists: (
limit: number,
page: number,
with_deleted: boolean,
order_field: any,
order_direction: any
) => Promise<{ data: feedbackProps[]; totalCount: number } | undefined>;
}
const initialProps: ContextProps = {
feedback: [],
showEditDialog: false,
handleEditDialog: () => {},
showAddDialog: false,
handleAddDialog: () => {},
showDeleteDialog: false,
handleDeleteDialog: () => {},
selectedfeedback: null,
getfeedbackLists: async () => undefined
};
const ManageFeedbackMemberContext = createContext<ContextProps>(initialProps);
const API_URL = apiConfig.service_feedback;
const ManageFeedbackMemberProvider = ({ children }: { children: React.ReactNode }) => {
const [feedback, setFeedback] = useState([]);
const [showAddDialog, setShowAddDialog] = useState(false);
const [showEditDialog, setShowEditDialog] = useState(false);
const [showDeleteDialog, setShowDeleteDialog] = useState(false);
const [selectedfeedback, setSelectedfeedback] = useState<string | null>(null);
const { GetData } = useCallApi();
const handleAddDialog = useCallback((show: boolean) => {
setShowAddDialog(show);
}, []);
const handleEditDialog = useCallback((show: boolean, selected_feedback: string | null) => {
setShowEditDialog(show);
setSelectedfeedback(show ? selected_feedback : null);
}, []);
const handleDeleteDialog = useCallback((show: boolean, selected_feedback: string | null) => {
setShowDeleteDialog(show);
setSelectedfeedback(show ? selected_feedback : null);
}, []);
const columns = useMemo<ColumnDef<any>[]>(
() => [
{
accessorFn: (row) => row.feedback_notes,
id: 'feedback_notes',
header: ({ column }) => <DataGridColumnHeader title="Feedback Notes" column={column} />,
enableSorting: false,
enableHiding: false,
meta: {
headerClassName: 'w-[250px]'
}
},
{
accessorFn: (row) => row.feedback_screenshot,
id: 'feedback_screenshot',
header: ({ column }) => <DataGridColumnHeader title="Feedback Screenshot" column={column} />,
enableSorting: false,
enableHiding: false,
meta: {
headerClassName: 'w-[250px]'
}
},
{
accessorFn: (row) => row.review_notes,
id: 'review_notes',
header: ({ column }) => <DataGridColumnHeader title="Review Notes" column={column} />,
enableSorting: false,
enableHiding: false,
meta: {
headerClassName: 'w-[250px]'
}
},
{
accessorFn: (row) => row.review_screenshot,
id: 'review_screenshot',
header: ({ column }) => <DataGridColumnHeader title="Review Screenshot" column={column} />,
enableSorting: false,
enableHiding: false,
meta: {
headerClassName: 'w-[250px]'
}
}
// ,
// {
// id: 'actions',
// header: ({ column }) => <DataGridColumnHeader title="Actions" column={column} />,
// enableSorting: false,
// enableHiding: false,
// cell: (data) => {
// const row = data.row.original;
// return (
// <>
// <button
// className="btn btn-sm btn-icon btn-clear btn-light"
// onClick={() => handleEditDialog(true, row.feedback_id)}
// >
// <KeenIcon icon="notepad-edit" />
// </button>
// <button
// className="btn btn-sm btn-icon btn-clear btn-light"
// onClick={() => handleDeleteDialog(true, row.feedback_id)}
// >
// <KeenIcon icon="trash" />
// </button>
// </>
// );
// },
// meta: {
// headerClassName: 'w-[100px] text-center',
// cellClassName: 'text-center'
// }
// }
],
[handleEditDialog, handleDeleteDialog]
);
const getfeedbackLists = async (page: number, limit: number, sorting: any, filter: any) => {
try {
sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
const response = await GetData(`${API_URL}/feedback/list`, {
limit,
page: page + 1,
with_deleted: false,
order_field: sorting[0].id,
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
// filter: JSON.stringify(filter)
});
// console.log(response?.data);
setFeedback(response?.data.list);
return { data: response?.data.list, totalCount: response?.data.total_count };
} catch (error) {
console.error('Error fetching Feedback Member', error);
}
};
return (
<ManageFeedbackMemberContext.Provider
value={{
feedback,
showEditDialog,
handleEditDialog,
showAddDialog,
handleAddDialog,
showDeleteDialog,
handleDeleteDialog,
selectedfeedback,
getfeedbackLists
}}
>
<Toaster expand visibleToasts={9} duration={3000} />
<DataGridProvider
columns={columns}
pagination={{ size: 10 }}
// toolbar={<ListToolbar />}
layout={{ card: true }}
sorting={[{ id: 'created_at', desc: true }]}
serverSide={true}
onFetchData={({ pageIndex, pageSize, sorting, columnFilters }) =>
getfeedbackLists(pageIndex, pageSize, sorting, columnFilters)
}
>
{children}
</DataGridProvider>
</ManageFeedbackMemberContext.Provider>
);
};
export { ManageFeedbackMemberContext, ManageFeedbackMemberProvider};
export type { feedbackProps };

12
src/pages/members/feedback-member/hooks/useManageFeedbackMemberContext.tsx Normal file
View File

@ -0,0 +1,12 @@
import { useContext } from 'react';
import { ManageFeedbackMemberContext } from './ManageFeedbackMemberContext';
const useManageProviderContext = () => {
const context = useContext(ManageFeedbackMemberContext);
if (!context) throw new Error('useManageProviderContext must be used within AuthProvider');
return context;
};
export { useManageProviderContext };

15
src/pages/members/manage-members/blocks/ListToolBar.tsx
View File

@ -12,7 +12,7 @@ interface ListToolbarProps {
const ListToolbar = ({ createMember, onReload, isReloading }: ListToolbarProps) => {
const [emailFilter, setEmailFilter] = useState('');
const [groupFilter, setGroupFilter] = useState('');
const [usernameFilter, setUsernameFilter] = useState('');
const {table}=useDataGrid();
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@ -20,9 +20,9 @@ const ListToolbar = ({ createMember, onReload, isReloading }: ListToolbarProps)
table.getColumn('username')?.setFilterValue(e.target.value);
};
const handleEmailChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setEmailFilter(e.target.value);
table.getColumn('email')?.setFilterValue(e.target.value);
const handleGroupChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setGroupFilter(e.target.value);
table.getColumn('group_name')?.setFilterValue(e.target.value);
};
return (
@ -37,6 +37,13 @@ const ListToolbar = ({ createMember, onReload, isReloading }: ListToolbarProps)
onChange={handleUsernameChange}
className="input input-sm w-40"
/>
<input
type="text"
placeholder="Search Group"
value={groupFilter}
onChange={handleGroupChange}
className="input input-sm w-40"
/>
</div>
<div className="flex gap-3 items-center">
<Button variant="outline" className="h-7.5 text-[0.8rem]" onClick={createMember}>

77
src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx
View File

@ -30,7 +30,6 @@ const DetailApprovalTransaction = () => {
const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionId}`, {
id: selectedTransactionId
});
console.log(response?.data);
setTransactionDetails(response?.data);
} catch (error) {
console.error('Error fetching transaction', error);
@ -121,11 +120,14 @@ const DetailApprovalTransaction = () => {
</div>
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">
{transactionDetails?.origin_customer?.fullname ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase?.amount) ?? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.transfer.amount)}</p>
</div>
<div>
<p className="text-sm text-gray-500">Fee</p>
@ -292,7 +294,9 @@ const DetailApprovalTransaction = () => {
</div>
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">
{transactionDetails?.origin_customer?.fullname ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Amount</p>
@ -347,10 +351,10 @@ const DetailApprovalTransaction = () => {
<p className="font-medium">{transactionDetails?.description}</p>
</div>
<div>
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
</div>
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
</div>
</div>
<div>
<p className="text-sm text-gray-500">Reference</p>
@ -370,19 +374,21 @@ const DetailApprovalTransaction = () => {
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">
{transactionDetails?.origin_customer?.fullname ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Phone Number</p>
<p className="font-medium">{transactionDetails?.origin_customer.msisdn}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.msisdn ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">{transactionDetails?.origin_customer.email}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.email ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">{transactionDetails?.origin_customer.username}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.username ?? "-"}</p>
</div>
</div>
</div>
@ -391,24 +397,37 @@ const DetailApprovalTransaction = () => {
{activeTab === 'destinationcustomer' && (
<div className="space-y-4">
<h3 className="font-semibold">Destination Customer</h3>
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.fullname}</p>
{transactionDetails?.transfer?.destination_customer ? (
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.fullname ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">MSISDN</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.msisdn ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.email ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.username ?? "-"}
</p>
</div>
</div>
<div>
<p className="text-sm text-gray-500">MSISDN</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.msisdn}</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.email}</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.username}</p>
</div>
</div>
) : (
<p className="text-gray-500">No data available</p>
)}
</div>
)}

37
src/pages/transaction/disbursement-saldo/TransactionDisbursement.tsx
View File

@ -4,10 +4,11 @@ import { Breadcrumbs, Link } from '@mui/material';
import { Helmet } from 'react-helmet';
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { useState } from 'react';
import { useState ,useEffect } from 'react';
import { useCallApi } from '@/hooks';
import { apiConfig } from '@/config/api.config';
import { toast } from 'sonner';
import { getAuth } from '@/auth';
const TransactionDisbursement = () => {
const [form, setForm] = useState({
@ -15,8 +16,28 @@ const TransactionDisbursement = () => {
amount: '',
pin: ''
});
const [wallets, setWallets] = useState([]);
const { GetData, PostData } = useCallApi();
const parsedUser = getAuth()?.user;
const API_URL = apiConfig.transaction;
const API_URL_WALLET = apiConfig.service_wallet
useEffect(() => {
const fetchWallets = async () => {
try {
const response = await GetData(`${API_URL_WALLET}/dashboard/balance/account/${parsedUser.customer.id}`, {});
if (response?.status === true) {
setWallets(response.data || []);
} else {
toast.warning(response?.message || 'Failed to fetch wallet data');
}
} catch (error) {
toast.warning('Failed to fetch wallet data');
}
};
fetchWallets();
}, []);
const handleSubmit = async (e: any) => {
e.preventDefault();
@ -61,6 +82,20 @@ const TransactionDisbursement = () => {
<span className="text-sm">Disbursement Saldo</span>
</Link>
</Breadcrumbs>
{/* Wallet Section */}
<div className="mb-6">
<h2 className="text-md font-semibold text-gray-700 mb-3">Your Wallets</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
{wallets.map((wallet: any) => (
<div key={wallet.id_wallet} className="border rounded-lg p-4 bg-white">
<p className="text-sm text-gray-500">{wallet.wallet}</p>
<p className="text-lg font-semibold text-green-600">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(wallet.amount)}
</p>
</div>
))}
</div>
</div>
<Container className="flex items-center justify-center">
<div className="card max-w-[750px] w-full">
<div className="card-body p-10">

63
src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
View File

@ -120,11 +120,11 @@ const DetailTransaction = () => {
</div>
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.fullname ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase?.amount) ?? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.transfer.amount)}</p>
</div>
<div>
<p className="text-sm text-gray-500">Fee</p>
@ -291,7 +291,7 @@ const DetailTransaction = () => {
</div>
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.fullname ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Amount</p>
@ -367,19 +367,19 @@ const DetailTransaction = () => {
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Full Name</p>
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.fullname ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Phone Number</p>
<p className="font-medium">{transactionDetails?.origin_customer.msisdn}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.msisdn ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">{transactionDetails?.origin_customer.email}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.email ?? "-"}</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">{transactionDetails?.origin_customer.username}</p>
<p className="font-medium">{transactionDetails?.origin_customer?.username ?? "-"}</p>
</div>
</div>
</div>
@ -388,24 +388,37 @@ const DetailTransaction = () => {
{activeTab === 'destinationcustomer' && (
<div className="space-y-4">
<h3 className="font-semibold">Destination Customer</h3>
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.fullname}</p>
{transactionDetails?.transfer?.destination_customer ? (
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Name</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.fullname ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">MSISDN</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.msisdn ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.email ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">
{transactionDetails.transfer.destination_customer.username ?? "-"}
</p>
</div>
</div>
<div>
<p className="text-sm text-gray-500">MSISDN</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.msisdn}</p>
</div>
<div>
<p className="text-sm text-gray-500">Email</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.email}</p>
</div>
<div>
<p className="text-sm text-gray-500">Username</p>
<p className="font-medium">{transactionDetails?.transfer.destination_customer.username}</p>
</div>
</div>
) : (
<p className="text-gray-500">No data available</p>
)}
</div>
)}
@ -430,7 +443,7 @@ const DetailTransaction = () => {
<h3 className="font-semibold">Destination Wallet</h3>
{!transactionDetails?.transfer ? (
<div className="text-center text-sm text-gray-500">No Data available</div>
<div className="text-sm text-gray-500">No Data available</div>
) : (
<div className="grid grid-cols-2 gap-4">
<div>

40
src/pages/transaction/topup/TransactionTopup.tsx
View File

@ -4,24 +4,46 @@ import { Breadcrumbs, Link } from '@mui/material';
import { Helmet } from 'react-helmet';
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { useState } from 'react';
import { useState, useEffect } from 'react';
import { useCallApi } from '@/hooks';
import { apiConfig } from '@/config/api.config';
import { toast } from 'sonner';
import { getAuth } from '@/auth';
const TransactionTopup = () => {
const [form, setForm] = useState({
topupAmount: '',
pin: ''
});
const [wallets, setWallets] = useState([]);
const { GetData, PostData } = useCallApi();
const parsedUser = getAuth()?.user;
const API_URL = apiConfig.transaction;
const API_URL_WALLET = apiConfig.service_wallet
useEffect(() => {
const fetchWallets = async () => {
try {
const response = await GetData(`${API_URL_WALLET}/dashboard/balance/account/${parsedUser.customer.id}`, {});
if (response?.status === true) {
setWallets(response.data || []);
} else {
toast.warning(response?.message || 'Failed to fetch wallet data');
}
} catch (error) {
toast.warning('Failed to fetch wallet data');
}
};
fetchWallets();
}, []);
const handleSubmit = async (e: any) => {
e.preventDefault();
console.log('Submitted Data:', form);
if (form.pin == '' || form.topupAmount) {
if (form.pin == '' || form.topupAmount == '') {
toast.warning('Please fill in all required fields.')
return
}
@ -60,6 +82,20 @@ const TransactionTopup = () => {
<span className="text-sm">Topup</span>
</Link>
</Breadcrumbs>
{/* Wallet Section */}
<div className="mb-6">
<h2 className="text-md font-semibold text-gray-700 mb-3">Your Wallets</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
{wallets.map((wallet: any) => (
<div key={wallet.id_wallet} className="border rounded-lg p-4 bg-white">
<p className="text-sm text-gray-500">{wallet.wallet}</p>
<p className="text-lg font-semibold text-green-600">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(wallet.amount)}
</p>
</div>
))}
</div>
</div>
<Container className="flex items-center justify-center">
<div className="card max-w-[750px] w-full">
<div className="card-body p-10">

14
src/routing/AppRoutingSetup.tsx
View File

@ -42,9 +42,10 @@ import WalletRuleMaster from '@/pages/master/walletRule/WalletRuleMaster';
import WalletHistory from '@/pages/wallet/wallet-history/WalletHistory';
import WalletMaster from '@/pages/master/wallet/WalletMaster';
import CurrencyMaster from '@/pages/master/currency/CurrencyMaster';
import FeedbackMemberMaster from '@/pages/members/feedback-member/FeedbackMember';
// DISBURSEMENT
import HistoryTransactionDisbursement from '@/pages/disbursement/history-transaction/HistoryTransaction'
import HistoryTransactionDisbursement from '@/pages/disbursement/history-transaction/HistoryTransaction';
// DISBURSEMENT
const AppRoutingSetup = (): ReactElement => {
@ -84,6 +85,7 @@ const AppRoutingSetup = (): ReactElement => {
<Route path="/members/member-management" element={<ManageMembers />} />
<Route path="/members/kyc-delete-member" element={<ManageKycDeletion />} />
<Route path="/members/create-member-credential" element={<MemberCredential />} />
<Route path="/members/feedback-member" element={<FeedbackMemberMaster />} />
<Route path="/access/access-type-management" element={<AccessType />} />
@ -98,8 +100,8 @@ const AppRoutingSetup = (): ReactElement => {
<Route path="/transaction" element={<Transaction />} />
<Route path="/approval-transaction" element={<ApprovalTransaction />} />
<Route path="/transaction/topup" element={<TransactionTopup/>} />
<Route path="/transaction/disbursement-saldo" element={<TransactionDisbursement/>} />
<Route path="/transaction/topup" element={<TransactionTopup />} />
<Route path="/transaction/disbursement-saldo" element={<TransactionDisbursement />} />
<Route path="/menu/menu-management" element={<ManageMenu />} />
<Route path="/menu/welcome" element={<Welcome />} />
<Route path="/message/inbox" element={<Inbox />} />
@ -112,9 +114,11 @@ const AppRoutingSetup = (): ReactElement => {
/>
{/* DISBURSEMENT */}
<Route path="/disbursement/transaction-history" element={<HistoryTransactionDisbursement />} />
<Route
path="/disbursement/transaction-history"
element={<HistoryTransactionDisbursement />}
/>
{/* DISBURSEMENT */}
</Route>
</Route>
<Route path="error/*" element={<ErrorsRouting />} />