Merge branch 'master' of https://git.shiblysolution.id/TPAY/dashboard
This commit is contained in:
@ -61,7 +61,6 @@ const DetailTransaction = () => {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const fetchTransactionDetails = async () => {
|
const fetchTransactionDetails = async () => {
|
||||||
console.log(selectedTransactionId)
|
|
||||||
if (selectedTransactionId) {
|
if (selectedTransactionId) {
|
||||||
try {
|
try {
|
||||||
const response = await GetData(`${API_URL}/transaction/history/${selectedTransactionId}`, {
|
const response = await GetData(`${API_URL}/transaction/history/${selectedTransactionId}`, {
|
||||||
|
|||||||
@ -54,10 +54,6 @@ const TransactionLogViewer = () => {
|
|||||||
detailLogData
|
detailLogData
|
||||||
} = useTransactionContext();
|
} = useTransactionContext();
|
||||||
|
|
||||||
console.log('detailLogData: ', detailLogData)
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog open={showDetailLogDialog} onOpenChange={setShowDetailLogDialog}>
|
<Dialog open={showDetailLogDialog} onOpenChange={setShowDetailLogDialog}>
|
||||||
<DialogContent className="container-fixed max-w-[1280px] w-full h-[90vh] flex flex-col p-6 overflow-hidden">
|
<DialogContent className="container-fixed max-w-[1280px] w-full h-[90vh] flex flex-col p-6 overflow-hidden">
|
||||||
|
|||||||
@ -13,7 +13,7 @@ import axios from 'axios';
|
|||||||
|
|
||||||
const API_URL = apiConfig.service_customer;
|
const API_URL = apiConfig.service_customer;
|
||||||
const DetailDialog = () => {
|
const DetailDialog = () => {
|
||||||
const { showDetailDialog, setShowDetailDialog, detailKyc } = useManageKycDeletionContext();
|
const { showDetailDialog, setShowDetailDialog, detailKyc, handleApproveReject } = useManageKycDeletionContext();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
||||||
@ -38,8 +38,8 @@ const DetailDialog = () => {
|
|||||||
|
|
||||||
<div className="flex justify-end gap-2 mt-3">
|
<div className="flex justify-end gap-2 mt-3">
|
||||||
<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
|
<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
|
||||||
<Button onClick={()=>{}} variant="destructive" color="warning">Reject</Button>
|
<Button onClick={()=>handleApproveReject(detailKyc.id, 'N')} variant="destructive" color="warning">Reject</Button>
|
||||||
<Button onClick={()=>{}} variant="default" color="primary">Approve</Button>
|
<Button onClick={()=>handleApproveReject(detailKyc.id, 'Y')} variant="default" color="primary">Approve</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (<div></div>)}
|
) : (<div></div>)}
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
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 { toast } from 'sonner';
|
||||||
import { apiConfig } from '@/config/api.config';
|
import { apiConfig } from '@/config/api.config';
|
||||||
import { ColumnDef } from '@tanstack/react-table';
|
import { ColumnDef } from '@tanstack/react-table';
|
||||||
import { createContext, useCallback, useMemo, useState } from 'react';
|
import { createContext, useCallback, useMemo, useState } from 'react';
|
||||||
@ -36,6 +37,7 @@ interface ContextProps {
|
|||||||
selectedIdCustomer: string | null;
|
selectedIdCustomer: string | null;
|
||||||
detailKyc: any | null;
|
detailKyc: any | null;
|
||||||
setDetailKyc: React.Dispatch<React.SetStateAction<any>>;
|
setDetailKyc: React.Dispatch<React.SetStateAction<any>>;
|
||||||
|
handleApproveReject: (customerDeletionId: string, status_approve: string) => {};
|
||||||
}
|
}
|
||||||
|
|
||||||
const initialProps: ContextProps = {
|
const initialProps: ContextProps = {
|
||||||
@ -48,6 +50,7 @@ const initialProps: ContextProps = {
|
|||||||
setShowDetailDialog: () => { },
|
setShowDetailDialog: () => { },
|
||||||
detailKyc: async () => {},
|
detailKyc: async () => {},
|
||||||
setDetailKyc: () => { },
|
setDetailKyc: () => { },
|
||||||
|
handleApproveReject: () => ({customerDeletionId: '0', status_approve: 'Y'}),
|
||||||
};
|
};
|
||||||
|
|
||||||
const ManageKycDeletionContext = createContext<ContextProps>(initialProps);
|
const ManageKycDeletionContext = createContext<ContextProps>(initialProps);
|
||||||
@ -83,13 +86,15 @@ export const renderStatusBadge = (statusRaw: string | null | undefined) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// const { reload } = useDataGrid();
|
||||||
|
|
||||||
const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactNode }) => {
|
const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactNode }) => {
|
||||||
const [showDetailDialog, setShowDetailDialog] = useState(false);
|
const [showDetailDialog, setShowDetailDialog] = useState(false);
|
||||||
const [showAddDialog, setShowAddDialog] = useState(false);
|
const [showAddDialog, setShowAddDialog] = useState(false);
|
||||||
const [selectedIdCustomer, setSelectedIdCustomer] = useState<string | null>(null);
|
const [selectedIdCustomer, setSelectedIdCustomer] = useState<string | null>(null);
|
||||||
const [detailKyc, setDetailKyc] = useState<any>();
|
const [detailKyc, setDetailKyc] = useState<any>();
|
||||||
const [manageKyc, setManageKyc] = useState<ManageKycDeletionProps[]>([]);
|
const [manageKyc, setManageKyc] = useState<ManageKycDeletionProps[]>([]);
|
||||||
const { GetData } = useCallApi();
|
const { GetData, PostData } = useCallApi();
|
||||||
|
|
||||||
const getKycDeletionList = async (page: number, limit: number, sorting: any, filter: any) => {
|
const getKycDeletionList = async (page: number, limit: number, sorting: any, filter: any) => {
|
||||||
try {
|
try {
|
||||||
@ -130,12 +135,11 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleDetailDialog = useCallback(async (show: boolean, selected_id_customer: string | null) => {
|
const handleDetailDialog = useCallback(async (show: boolean, selected_id_customer: string | null) => {
|
||||||
|
if (show == true) {
|
||||||
setSelectedIdCustomer(show ? selected_id_customer : null);
|
setSelectedIdCustomer(show ? selected_id_customer : null);
|
||||||
let detailCustomer = await GetData(`${API_URL}/customer_deletion/detail/${selected_id_customer}`, {})
|
let detailCustomer = await GetData(`${API_URL}/customer_deletion/detail/${selected_id_customer}`, {})
|
||||||
setDetailKyc(detailCustomer?.data)
|
setDetailKyc(detailCustomer?.data)
|
||||||
console.log('detailCustomer: ',detailCustomer)
|
}
|
||||||
console.log('detailCustomer2: ',detailCustomer?.data)
|
|
||||||
console.log('detailKyc: ', detailKyc)
|
|
||||||
setShowDetailDialog(show);
|
setShowDetailDialog(show);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
@ -143,6 +147,26 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
|
|||||||
setShowAddDialog(show);
|
setShowAddDialog(show);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const handleApproveReject = useCallback(async (customerDeletionId: string, status_approve: string) => {
|
||||||
|
console.log(customerDeletionId, status_approve)
|
||||||
|
try {
|
||||||
|
let approveReject = await PostData(`${API_URL}/customer_deletion/update_status/${customerDeletionId}`, {
|
||||||
|
status_approve
|
||||||
|
})
|
||||||
|
|
||||||
|
if (approveReject?.status == true) {
|
||||||
|
toast.success('Success update status approval')
|
||||||
|
handleDetailDialog(false, null)
|
||||||
|
} else {
|
||||||
|
toast.warning(`${approveReject?.message}`)
|
||||||
|
handleDetailDialog(false, null)
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
toast.warning('Failed to approve/reject')
|
||||||
|
handleDetailDialog(false, null)
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
const columns = useMemo<ColumnDef<any>[]>(
|
const columns = useMemo<ColumnDef<any>[]>(
|
||||||
() => [
|
() => [
|
||||||
{
|
{
|
||||||
@ -242,7 +266,8 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
|
|||||||
selectedIdCustomer,
|
selectedIdCustomer,
|
||||||
setShowDetailDialog,
|
setShowDetailDialog,
|
||||||
setDetailKyc,
|
setDetailKyc,
|
||||||
detailKyc
|
detailKyc,
|
||||||
|
handleApproveReject,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Toaster expand visibleToasts={9} duration={3000} />
|
<Toaster expand visibleToasts={9} duration={3000} />
|
||||||
|
|||||||
@ -30,7 +30,7 @@ const DetailApprovalTransaction = () => {
|
|||||||
const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionId}`, {
|
const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionId}`, {
|
||||||
id: selectedTransactionId
|
id: selectedTransactionId
|
||||||
});
|
});
|
||||||
// console.log(response?.data);
|
console.log(response?.data);
|
||||||
setTransactionDetails(response?.data);
|
setTransactionDetails(response?.data);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error fetching transaction', error);
|
console.error('Error fetching transaction', error);
|
||||||
@ -190,7 +190,7 @@ const DetailApprovalTransaction = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Name</p>
|
<p className="text-sm text-gray-500">Name</p>
|
||||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -346,9 +346,11 @@ const DetailApprovalTransaction = () => {
|
|||||||
<p className="text-sm text-gray-500">Description</p>
|
<p className="text-sm text-gray-500">Description</p>
|
||||||
<p className="font-medium">{transactionDetails?.description}</p>
|
<p className="font-medium">{transactionDetails?.description}</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Name</p>
|
<p className="text-sm text-gray-500">Name</p>
|
||||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Reference</p>
|
<p className="text-sm text-gray-500">Reference</p>
|
||||||
|
|||||||
@ -189,7 +189,7 @@ const DetailTransaction = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Name</p>
|
<p className="text-sm text-gray-500">Name</p>
|
||||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -347,7 +347,7 @@ const DetailTransaction = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Name</p>
|
<p className="text-sm text-gray-500">Name</p>
|
||||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
<p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-gray-500">Reference</p>
|
<p className="text-sm text-gray-500">Reference</p>
|
||||||
|
|||||||
@ -70,6 +70,8 @@ const AddFeeDialog = () => {
|
|||||||
selectedTransferFee,
|
selectedTransferFee,
|
||||||
transactionTypeId
|
transactionTypeId
|
||||||
} = useManageTransferFeeContext();
|
} = useManageTransferFeeContext();
|
||||||
|
const [customerSearchTerm, setCustomerSearchTerm] = useState('');
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
|
||||||
const [alert, setAlert] = useState({
|
const [alert, setAlert] = useState({
|
||||||
show: false,
|
show: false,
|
||||||
@ -111,6 +113,7 @@ const AddFeeDialog = () => {
|
|||||||
credit_destination_account: ''
|
credit_destination_account: ''
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const [formField, setFormField] = useState(initialState);
|
const [formField, setFormField] = useState(initialState);
|
||||||
|
|
||||||
const resetForm = () => {
|
const resetForm = () => {
|
||||||
@ -151,6 +154,13 @@ const AddFeeDialog = () => {
|
|||||||
}
|
}
|
||||||
}, [showAddFeeDialog, transactionTypeId, GetData]);
|
}, [showAddFeeDialog, transactionTypeId, GetData]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!showAddFeeDialog) {
|
||||||
|
setCustomerSearchTerm('');
|
||||||
|
setOpen(false);
|
||||||
|
}
|
||||||
|
}, [showAddFeeDialog]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const created_time = new Date();
|
const created_time = new Date();
|
||||||
const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
|
const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
|
||||||
@ -619,14 +629,73 @@ const AddFeeDialog = () => {
|
|||||||
<label className="form-label">
|
<label className="form-label">
|
||||||
Credit Destination <span className="text-red-500">*</span>
|
Credit Destination <span className="text-red-500">*</span>
|
||||||
</label>
|
</label>
|
||||||
{renderSelectWithLoading(
|
<div className="relative">
|
||||||
formField.credit_destination,
|
<div
|
||||||
(value) => setFormField({ ...formField, credit_destination: value }),
|
className="flex w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 cursor-pointer"
|
||||||
customersWithNames,
|
onClick={() => setOpen(!open)}
|
||||||
'Select Customer',
|
>
|
||||||
isLoadingCustomers
|
<span className="truncate">
|
||||||
|
{customers.find(
|
||||||
|
(customer) => customer.id === formField.credit_destination
|
||||||
|
)?.username || 'Search customer...'}
|
||||||
|
</span>
|
||||||
|
<path d="m6 9 6 6 6-6"></path>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{open && (
|
||||||
|
<div className="absolute left-0 right-0 top-full z-50 mt-1 max-h-52 overflow-auto rounded-md border border-gray-200 bg-white shadow-lg">
|
||||||
|
<div className="sticky top-0 bg-white p-2 border-b">
|
||||||
|
<Input
|
||||||
|
className="h-8 text-sm"
|
||||||
|
type="text"
|
||||||
|
placeholder="Search customer..."
|
||||||
|
value={customerSearchTerm}
|
||||||
|
onChange={(e) => setCustomerSearchTerm(e.target.value)}
|
||||||
|
autoComplete="off"
|
||||||
|
onClick={(e) => e.stopPropagation()}
|
||||||
|
autoFocus
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{customers
|
||||||
|
.filter(
|
||||||
|
(customer) =>
|
||||||
|
customer.username
|
||||||
|
.toLowerCase()
|
||||||
|
.includes(customerSearchTerm.toLowerCase()) ||
|
||||||
|
customer.msisdn.includes(customerSearchTerm)
|
||||||
|
)
|
||||||
|
.map((customer) => (
|
||||||
|
<div
|
||||||
|
key={customer.id}
|
||||||
|
className="cursor-pointer px-3 py-1.5 text-sm hover:bg-gray-100"
|
||||||
|
onClick={() => {
|
||||||
|
setFormField({
|
||||||
|
...formField,
|
||||||
|
credit_destination: customer.id
|
||||||
|
});
|
||||||
|
setOpen(false);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{customer.username}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{customers.filter(
|
||||||
|
(customer) =>
|
||||||
|
customer.username
|
||||||
|
.toLowerCase()
|
||||||
|
.includes(customerSearchTerm.toLowerCase()) ||
|
||||||
|
customer.msisdn.includes(customerSearchTerm)
|
||||||
|
).length === 0 && (
|
||||||
|
<div className="px-3 py-2 text-sm text-gray-500">
|
||||||
|
No customer found
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="w-full">
|
<div className="w-full">
|
||||||
<label className="form-label">
|
<label className="form-label">
|
||||||
|
|||||||
@ -72,7 +72,6 @@ const EditFeeDialog = () => {
|
|||||||
message: ''
|
message: ''
|
||||||
});
|
});
|
||||||
|
|
||||||
// Loading states
|
|
||||||
const [isLoadingTransferFee, setIsLoadingTransferFee] = useState(false);
|
const [isLoadingTransferFee, setIsLoadingTransferFee] = useState(false);
|
||||||
const [isLoadingTransactionType, setIsLoadingTransactionType] = useState(false);
|
const [isLoadingTransactionType, setIsLoadingTransactionType] = useState(false);
|
||||||
const [isLoadingWallets, setIsLoadingWallets] = useState(false);
|
const [isLoadingWallets, setIsLoadingWallets] = useState(false);
|
||||||
@ -687,9 +686,7 @@ const EditFeeDialog = () => {
|
|||||||
<span className="truncate">
|
<span className="truncate">
|
||||||
{customers.find(customer => customer.id === formField.credit_destination)?.username || 'Search customer...'}
|
{customers.find(customer => customer.id === formField.credit_destination)?.username || 'Search customer...'}
|
||||||
</span>
|
</span>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 opacity-50">
|
|
||||||
<path d="m6 9 6 6 6-6"></path>
|
<path d="m6 9 6 6 6-6"></path>
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{open && (
|
{open && (
|
||||||
@ -702,9 +699,7 @@ const EditFeeDialog = () => {
|
|||||||
value={customerSearchTerm}
|
value={customerSearchTerm}
|
||||||
onChange={(e) => setCustomerSearchTerm(e.target.value)}
|
onChange={(e) => setCustomerSearchTerm(e.target.value)}
|
||||||
autoComplete="off"
|
autoComplete="off"
|
||||||
// Prevent clicks from closing the dropdown
|
|
||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
// Auto focus the input when opened
|
|
||||||
autoFocus
|
autoFocus
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user