diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx index 969db5e..1473bab 100644 --- a/src/pages/members/kyc/Kyc.tsx +++ b/src/pages/members/kyc/Kyc.tsx @@ -1,8 +1,13 @@ -import { Container, DataGridInner, DataGridProvider, TDataGridProps } from '@/components'; +import { + Container, + DataGridInner, + DataGridProvider, + TDataGridProps, + useDataGrid +} from '@/components'; import { DataTable } from '@/components/ui/DataTable'; import { Table } from '@tanstack/react-table'; import React, { createContext, useContext, useState, useEffect } from 'react'; -import { ManageKycContextProvider } from './hooks'; import { getColumns, initialMember } from './Columns'; import { useAuthContext } from '@/auth'; import { LoaderTransparant } from '@/components'; @@ -17,6 +22,7 @@ import DetailMember from '../manage-members/blocks/DetailMember'; import { Breadcrumbs, Link } from '@mui/material'; import { Helmet } from 'react-helmet'; import { ListToolBar } from './blocks/ListToolBar'; +import { RefreshCw } from 'lucide-react'; const Kyc = () => { const [loading, setLoading] = useState(false); @@ -26,6 +32,7 @@ const Kyc = () => { const [isDialogOpen, setIsDialogOpen] = useState(false); const [dialogOpen, setDialogOpen] = useState(false); const [dialogType, setDialogType] = useState(''); + const [isReloading, setIsReloading] = useState(false); const closeDialog = () => setIsDialogOpen(false); const { getUser } = useAuthContext(); @@ -65,6 +72,9 @@ const Kyc = () => { } catch (error: any) { toast.error(error.message); console.log(error); + } finally { + setLoading(false); + setIsReloading(false); } } @@ -89,12 +99,16 @@ const Kyc = () => { setMember(initialMember); }; + const handleReload = () => { + setIsReloading(true); + fetchCustomers(); + }; + const handleYes = async () => { setLoading(true); const userLogin: any = await getUser(); const updateData: any = member; const customerId = member.id; - const description = member.description; const destinationGroup = updateData.destinationGroup; updateData.updated_by = userLogin.data ? userLogin.data.id : ''; let today = new Date(); @@ -161,17 +175,16 @@ const Kyc = () => { description: updateData.approval_description_agent }); } - setDialogOpen(false); - setIsDialogOpen(false); toast.success(`Success Update & ${dialogType} Kyc Member`); } catch (error: any) { if (error?.response?.data?.error) error.message = error?.response?.data?.error; - setDialogOpen(false); - setIsDialogOpen(false); toast.error(error.message); } finally { + setDialogOpen(false); + setIsDialogOpen(false); await fetchCustomers(); setLoading(false); + setIsReloading(false); } }; @@ -179,11 +192,15 @@ const Kyc = () => { setIsDialogOpen(el); } - if (loading) return ; + // const resetForm = () => { + // setMember(initialMember); + // }; - useEffect(() => { - if (!isDialogOpen) resetForm(); - }, [isDialogOpen]); + // useEffect(() => { + // if (!isDialogOpen) resetForm(); + // }, [isDialogOpen]); + + if (loading) return ; return ( <> @@ -200,14 +217,6 @@ const Kyc = () => { onNo={() => setDialogOpen(false)} /> {member.id ? ( - // { initialData={member} fetchCustomers={fetchCustomers} profession={profession} + dialogType={dialogType} page={'kyc'} /> ) : ( @@ -237,12 +247,20 @@ const Kyc = () => { {/*
*/} -
+
+ {isReloading && ( +
+
+ + Refreshing data... +
+
+ )} } + toolbar={} layout={{ card: true }} sorting={[{ id: 'created_at', desc: true }]} serverSide={false} diff --git a/src/pages/members/kyc/blocks/ListToolBar.tsx b/src/pages/members/kyc/blocks/ListToolBar.tsx index 180e68b..804c008 100644 --- a/src/pages/members/kyc/blocks/ListToolBar.tsx +++ b/src/pages/members/kyc/blocks/ListToolBar.tsx @@ -1,40 +1,44 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { Button } from '@/components/ui/button'; -import { useKycContext } from '../hooks'; +import { useState } from 'react'; -const ListToolBar = () => { +interface ListToolbarProps { + onReload: () => void; + isReloading: boolean; +} + +const ListToolBar = ({ onReload, isReloading }: ListToolbarProps) => { const { table, reload } = useDataGrid(); + const [usernameFilter, setUsernameFilter] = useState(''); + + const handleUsernameChange = (e: React.ChangeEvent) => { + setUsernameFilter(e.target.value); + table.getColumn('username')?.setFilterValue(e.target.value); + }; return (
-
- - - - +
+
- -
diff --git a/src/pages/members/kyc/hooks/ManageKycContext.tsx b/src/pages/members/kyc/hooks/ManageKycContext.tsx deleted file mode 100644 index 2a63fe1..0000000 --- a/src/pages/members/kyc/hooks/ManageKycContext.tsx +++ /dev/null @@ -1,145 +0,0 @@ -import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components'; -import { Toaster } from '@/components/ui/sonner'; -import { apiConfig } from '@/config/api.config'; -import { ColumnDef } from '@tanstack/react-table'; -import { createContext, useCallback, useMemo, useState } from 'react'; -import { ListToolBar } from '../blocks/ListToolBar'; - -interface SelectedUser { - id: string; - name: string; - email: string; - role: string; - description: string; - created_date: Date; -} - -interface ContextProps { - showDetailDialog: boolean; - handleDetailDialog: (show: boolean, selected_user: SelectedUser | null) => void; - showAddDialog: boolean; - handleAddDialog: (show: boolean) => void; - selectedUser: SelectedUser | null; -} - -const initialProps: ContextProps = { - showDetailDialog: false, - handleDetailDialog: () => {}, - showAddDialog: false, - handleAddDialog: () => {}, - selectedUser: null -}; - -const ManageKycContext = createContext(initialProps); -const API_URL = apiConfig.service_dashboard; - -const ManageKycContextProvider = ({ children }: { children: React.ReactNode }) => { - const [showDetailDialog, setShowDetailDialog] = useState(false); - const [showAddDialog, setShowAddDialog] = useState(false); - const [selectedUser, setSelectedUser] = useState(null); - - const handleDetailDialog = useCallback((show: boolean, selected_user: SelectedUser | null) => { - setSelectedUser(show ? selected_user : null); - setShowDetailDialog(show); - }, []); - - const handleAddDialog = useCallback((show: boolean) => { - setShowAddDialog(show); - }, []); - - const columns = useMemo[]>( - () => [ - { - accessorFn: (row) => row.id, - id: 'id', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[100px]' - } - }, - { - accessorFn: (row) => row.created_date, - id: 'created_date', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[250px]' - } - }, - { - accessorFn: (row) => row.name, - id: 'name', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[350px]' - } - }, - { - accessorFn: (row) => row.description, - id: 'description', - header: ({ column }) => , - enableSorting: true, - meta: { - headerClassName: 'w-[350px]' - } - }, - { - id: 'actions', - enableSorting: false, - header: ({ column }) => , - cell: (data: any) => { - const row = data.row.original; - - return ( - <> - - - ); - }, - meta: { - headerClassName: 'w-[100px]', - cellClassName: 'text-center' - } - } - ], - [handleDetailDialog] - ); - - return ( - - - - } - layout={{ card: true }} - sorting={[{ id: 'name', desc: false }]} - serverSide={true} - > - {children} - - - ); -}; - -export { ManageKycContextProvider, ManageKycContext }; -export type { SelectedUser }; diff --git a/src/pages/members/kyc/hooks/index.ts b/src/pages/members/kyc/hooks/index.ts deleted file mode 100644 index 246dfa8..0000000 --- a/src/pages/members/kyc/hooks/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './ManageKycContext'; -export * from './useKycContext'; diff --git a/src/pages/members/kyc/hooks/useKycContext.tsx b/src/pages/members/kyc/hooks/useKycContext.tsx deleted file mode 100644 index 1043f87..0000000 --- a/src/pages/members/kyc/hooks/useKycContext.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { useContext } from 'react'; -import { ManageKycContext } from './ManageKycContext'; - -const useKycContext = () => { - const context = useContext(ManageKycContext); - - if (!context) throw new Error('useKycContext must be used within AuthProvider'); - - return context; -}; - -export { useKycContext }; diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx index 8d27979..6ce815d 100644 --- a/src/pages/members/manage-members/ManageMembers.tsx +++ b/src/pages/members/manage-members/ManageMembers.tsx @@ -3,7 +3,6 @@ import { apiConfig } from '@/config/api.config'; import { getColumns, Members, initialMember } from './Columns'; import { useState, useEffect } from 'react'; import axios from 'axios'; -// import CustomerDialog from './CustomerDetailModal'; import DetailMember from './blocks/DetailMember'; import ConfirmDialog from '@/components/confirm'; import { useAuthContext } from '@/auth'; @@ -15,6 +14,7 @@ const BASE_URL_MASTER_DATA = apiConfig.service_master_data; const BASE_URL = apiConfig.service_customer; import { Helmet } from 'react-helmet'; import ListToolbar from './blocks/ListToolBar'; +import { RefreshCw } from 'lucide-react'; const ManageMembers = () => { const [loading, setLoading] = useState(false); const [members, setMembers] = useState([]); @@ -24,6 +24,7 @@ const ManageMembers = () => { const [isDialogOpen, setIsDialogOpen] = useState(false); const [dialogOpen, setDialogOpen] = useState(false); const [dialogType, setDialogType] = useState(''); + const [isReloading, setIsReloading] = useState(false); const closeDialog = () => { setIsDialogOpen(false); setMember(initialMember); @@ -36,7 +37,7 @@ const ManageMembers = () => { setLoading(false); }, []); - async function fetchCustomers() { + async function fetchCustomers(): Promise { try { let customers = await axios.get(`${BASE_URL}/customer/list`, { params: { @@ -71,6 +72,9 @@ const ManageMembers = () => { } catch (error: any) { toast.error(error.message); console.log(error); + } finally { + setLoading(false); + setIsReloading(false); } } @@ -92,54 +96,57 @@ const ManageMembers = () => { setMember(data); setDialogOpen(true); } - + const handleReload = () => { + setIsReloading(true); + fetchCustomers(); + }; const handleYes = async () => { - setLoading(true); - const userLogin: any = await getUser(); - const updateData: any = member; - updateData.updated_by = userLogin.data ? userLogin.data.id : ''; - let today = new Date(); - updateData.updated_at = today.toString(); - updateData.municipio = updateData.municipio_id; - updateData.posto_adms = updateData.posto_adms_id; - updateData.suco = updateData.suco_id; - updateData.aldeia = updateData.aldeia_id; - delete updateData.id; - delete updateData.pin; - delete updateData.name; - delete updateData.longitude; - delete updateData.latitude; - delete updateData.created_at; - delete updateData.no; - delete updateData.destinationGroup; - delete updateData.statusApproval; - delete updateData.description; - delete updateData.municipio_id; - delete updateData.municipio_name; - delete updateData.posto_adms_id; - delete updateData.posto_adms_name; - delete updateData.suco_id; - delete updateData.suco_name; - delete updateData.aldeia_id; - delete updateData.aldeia_name; - delete updateData.group_name; - delete updateData.group_description; - delete updateData.group_status; - delete updateData.group_created_by; - delete updateData.group_created_at; - delete updateData.group_updated_by; - delete updateData.group_updated_at; - delete updateData.group_deleted_by; - delete updateData.group_deleted_at; - delete updateData.updated_at; try { - const form = new FormData(); + setLoading(true); + const userLogin: any = await getUser(); + const updateData: any = member; + updateData.updated_by = userLogin.data ? userLogin.data.id : ''; + let today = new Date(); + updateData.updated_at = today.toString(); + updateData.municipio = updateData.municipio_id; + updateData.posto_adms = updateData.posto_adms_id; + updateData.suco = updateData.suco_id; + updateData.aldeia = updateData.aldeia_id; + delete updateData.id; + delete updateData.pin; + delete updateData.name; + delete updateData.longitude; + delete updateData.latitude; + delete updateData.created_at; + delete updateData.no; + delete updateData.destinationGroup; + delete updateData.statusApproval; + delete updateData.description; + delete updateData.municipio_id; + delete updateData.municipio_name; + delete updateData.posto_adms_id; + delete updateData.posto_adms_name; + delete updateData.suco_id; + delete updateData.suco_name; + delete updateData.aldeia_id; + delete updateData.aldeia_name; + delete updateData.group_name; + delete updateData.group_description; + delete updateData.group_status; + delete updateData.group_created_by; + delete updateData.group_created_at; + delete updateData.group_updated_by; + delete updateData.group_updated_at; + delete updateData.group_deleted_by; + delete updateData.group_deleted_at; + delete updateData.updated_at; + const formUpdate = new FormData(); for (const property in updateData) { - if (updateData[property]) form.append(property, updateData[property]); + if (updateData[property]) formUpdate.append(property, updateData[property]); } if (dialogType === 'update') { - await axios.put(`${BASE_URL}/customer/update/${selectedMember}`, form, { + await axios.put(`${BASE_URL}/customer/update/${selectedMember}`, formUpdate, { headers: { 'Content-Type': 'multipart/form-data' } @@ -164,11 +171,16 @@ const ManageMembers = () => { delete createMember.approval_description_premium; delete createMember.approval_description_agent; delete createMember.language; - await axios.post(`${BASE_URL}/customers/create`, member); + const formCreate = new FormData(); + for (const property in createMember) { + if (createMember[property]) formCreate.append(property, createMember[property]); + } + await axios.post(`${BASE_URL}/customers/create`, formCreate); toast.success('Success Create Member. PIN sent to email'); } } catch (error: any) { - toast.error(error.message); + if (error?.response?.data?.message) toast.error(error?.response?.data?.message) + else toast.error(error.message); } finally { setDialogOpen(false); closeDialog(); @@ -225,14 +237,29 @@ const ManageMembers = () => { {/*
*/} -
+ +
+ {isReloading && ( +
+
+ + Refreshing data... +
+
+ )} } + toolbar={ + + } onRowSelectionChange={(selected, table: any) => { const selectedRow = table.getSelectedRowModel().rows[0]; if (selectedRow) handleUpdate(selectedRow.original); diff --git a/src/pages/members/manage-members/blocks/AdmAccess.tsx b/src/pages/members/manage-members/blocks/AdmAccess.tsx index bf735c3..3ebe437 100644 --- a/src/pages/members/manage-members/blocks/AdmAccess.tsx +++ b/src/pages/members/manage-members/blocks/AdmAccess.tsx @@ -26,29 +26,10 @@ export default function AdmAccess({page,groups,formData,handleClose,fetchCustome const [dialogType, setDialogType] = useState(''); const [changeGroup, setChangeGroup] = useState(''); const [changeGroupD, setChangeGroupD] = useState(false); - // const [groups, setGroups] = useState([]); useEffect(() => { - // fetchGroups(); }, []); - // const fetchGroups = async () => { - // try { - // let getGroups = await axios.get(`${BASE_URL_CUSTOMER}/groups/list`, { - // params: { - // limit: 50, - // page: 1, - // with_deleted: false, - // order_field: 'name', - // order_direction: 'ASC' - // } - // }); - // setGroups(getGroups.data.data.list); - // } catch (error: any) { - // toast.error(error.message); - // } - // }; - const handleYes = async () => { try { if (dialogType === 'update status') { diff --git a/src/pages/members/manage-members/blocks/DetailMember.tsx b/src/pages/members/manage-members/blocks/DetailMember.tsx index 9852562..1ba2005 100644 --- a/src/pages/members/manage-members/blocks/DetailMember.tsx +++ b/src/pages/members/manage-members/blocks/DetailMember.tsx @@ -41,6 +41,10 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa const [sucos, setSucos] = useState([]); const [groups, setGroups] = useState([]); const [genders] = useState([ { name: 'Male',id: 'M' }, { name: 'Female',id: 'F' }]) + const [previewImg, setPreviewImg] = useState({ + status: false, + img: '' + }); const [banks] = useState([ { name: 'BNCTL',id: 'BNCTL' }, { name: 'BRI',id: 'BRI' }, { name: 'BNU',id: 'BNU' }, { name: 'Mandiri',id: 'Mandiri' } ]) @@ -183,7 +187,7 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa return ( handleAddDialog(open)}> - + Member - {dialogType ==='create' ? "Create" : "View/Edit"} @@ -196,56 +200,66 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa )} -
+ {/*
*/} +
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, groups, 'group_id', 'Group', true, dialogType === "update"||false): ''} {/* {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Group', 'group_name', 'text', true, true): ''} */} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Username', 'username', 'text', true, dialogType==='create'?false:true): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Full Name', 'fullname', 'text', true, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'Photo', 'photouser'): ''} + {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'Photo', 'photouser', previewImg, setPreviewImg): ''} {(formData.id || dialogType === "create") ? generateList(formData, handleChange, genders, 'gender', 'Gender', true, false): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Date of Birth', 'date_birth', 'date', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Phone Number', 'msisdn', 'text', true, dialogType === "update"||false): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Email', 'email', 'text', true, viewOnly): ''} {/* {generateList(formData, handleChange, status, 'status', 'Status', null, true)} */} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, profession, 'profession', 'Profession', false, false): ''} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, municipios, 'municipio_id', 'Municipio', false, false): ''} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, postoAdm, 'posto_adms_id', 'Posto', false, false): ''} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, sucos, 'suco_id', 'Suco', false, false): ''} - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, aldeias, 'aldeia_id', 'Aldeia', false, false): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Nationality', 'nationality', 'text', true, viewOnly): ''} -
- -
    - {nationality.map((item: any, index) => ( -
  • handleChange({target:{name: 'nationality', value: item.name }})} - className="bg-gray-100 px-4 py-2 rounded hover:bg-gray-200 cursor-default transition"> - {item.name} -
    • - ))} - {formData.nationality && nationality.length === 0 && ( -
  • No results found.
    • - )} -
-
- {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Address', 'address', 'text', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Mother Fullname', 'mother_fullname', 'text', true, viewOnly): ''} {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Identity Number', 'identity_number', 'text', false, viewOnly): ''} +
+ {(formData.id || dialogType === "create") ? generateList(formData, handleChange, profession, 'profession', 'Profession', false, false): ''} + {(formData.id || dialogType === "create") ? generateList(formData, handleChange, municipios, 'municipio_id', 'Municipio', false, false): ''} + {(formData.id || dialogType === "create") ? generateList(formData, handleChange, postoAdm, 'posto_adms_id', 'Posto', false, false): ''} + {(formData.id || dialogType === "create") ? generateList(formData, handleChange, sucos, 'suco_id', 'Suco', false, false): ''} + {(formData.id || dialogType === "create") ? generateList(formData, handleChange, aldeias, 'aldeia_id', 'Aldeia', false, false): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Nationality', 'nationality', 'text', true, viewOnly): ''} +
+ +
    + {nationality.map((item: any, index) => ( +
  • handleChange({target:{name: 'nationality', value: item.name }})} + className="bg-gray-100 px-4 py-2 rounded hover:bg-gray-200 cursor-default transition"> + {item.name} +
    • + ))} + {formData.nationality && nationality.length === 0 && ( +
  • No results found.
    • + )} +
+
+ {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Address', 'address', 'text', true, viewOnly): ''} +
+

Bank Information

+ {(formData.id || dialogType === "create") ? generateList(formData, handleChange, banks, 'bank_name', 'Bank Name', false, false): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Bank Account', 'bank_account', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'iBank Number', 'ibank_number', 'text', false, viewOnly): ''} +
+
- {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'License Number', 'license_number', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Merchant Name', 'agent_name', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Merchant Address', 'merchantaddress', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Longitude Merchant', 'longitudemerchant', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Latitude Merchant', 'latitudemerchant', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Selfie', 'file_selfie'): ''} - {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Document', 'file_document_id'): ''} - {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Document & Selfie', 'file_document_id_selfie'): ''} - {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Commercial License', 'file_commercial_license'): ''} +
+

Agent Information

+ {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'License Number', 'license_number', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Merchant Name', 'agent_name', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Merchant Address', 'merchantaddress', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Longitude Merchant', 'longitudemerchant', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Latitude Merchant', 'latitudemerchant', 'text', false, viewOnly): ''} + {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Selfie', 'file_selfie', previewImg, setPreviewImg): ''} + {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Document', 'file_document_id', previewImg, setPreviewImg): ''} + {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Document & Selfie', 'file_document_id_selfie', previewImg, setPreviewImg): ''} + {(formData.id || dialogType === "create") ? generateImage(formData, handleChange, 'File Commercial License', 'file_commercial_license', previewImg, setPreviewImg): ''} +
+ - {(formData.id || dialogType === "create") ? generateList(formData, handleChange, banks, 'bank_name', 'Bank Name', false, false): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Bank Account', 'bank_account', 'text', false, viewOnly): ''} - {(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'iBank Number', 'ibank_number', 'text', false, viewOnly): ''} {(formData.id&&(!page||formData.destinationGroup === "Premium")) ? generateInput(formData, handleChange, 'Approval Premium Description', 'approval_description_premium', 'text', false, viewOnly): ''} {(formData.id&&(!page||formData.destinationGroup === "Agent")) ? generateInput(formData, handleChange, 'Approval Agent Description', 'approval_description_agent', 'text', false, viewOnly): ''} @@ -257,7 +271,7 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa ) : ""} -
+
{/* */} @@ -333,7 +347,7 @@ function generateList(formData:any, handleChange: any, list:any, name:string, la } // ON DEV (UPDATENYA) -function generateImage(formData:any, handleChange:any, label:string, name:string) { +function generateImage(formData:any, handleChange:any, label:string, name:string, previewImg: any, setPreviewImg:any) { const imagePreview = (file:any) => { if (file && file.type && file.type.startsWith('image/')) { const previewURL = URL.createObjectURL(file); @@ -342,8 +356,21 @@ function generateImage(formData:any, handleChange:any, label:string, name:string return file }; + function handlePrevImg(par: boolean) { + if (par) setPreviewImg({ status: true, img: ''}) + if (!par) setPreviewImg({ status: false, img: '' }) + } + + function onClickImg(img: any) { + setPreviewImg({ status: true, img }) + } + return ( <> + {previewImg.status ? ( + + ):''}
diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx index edd00ed..28e2296 100644 --- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx @@ -365,7 +365,7 @@ const EditDialog = () => { return () => clearTimeout(timer); }, [showEditDialog, selectedTransferType, GetData]); - + useEffect(() => { if (showEditDialog === false) { resetForm(); @@ -590,7 +590,7 @@ const EditDialog = () => { - Disbursement + Disbursement Other Change Group Emoney Customer to Agent Change Group Emoney Agent to Customer @@ -604,6 +604,7 @@ const EditDialog = () => { Top Up Escrow Top Up Master Agent Top Up Agent + Purchase Loja
diff --git a/src/pages/transfer/transfertype/blocks/ListToolBar.tsx b/src/pages/transfer/transfertype/blocks/ListToolBar.tsx index 7d9e413..47833ba 100644 --- a/src/pages/transfer/transfertype/blocks/ListToolBar.tsx +++ b/src/pages/transfer/transfertype/blocks/ListToolBar.tsx @@ -12,6 +12,7 @@ const ListToolbar = () => { useEffect(() => { const timer = setTimeout(() => { table.getColumn('name')?.setFilterValue(searchValue); + table.setPageIndex(0); }, 200); return () => clearTimeout(timer); diff --git a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx index dfdd72d..a21febf 100644 --- a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx +++ b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx @@ -185,7 +185,8 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React R: 'Reward Point', TE:'Top Up Escrow', TM:'Top Up Master Agent', - TA:'Top Up Agent' + TA:'Top Up Agent', + PL:'Purchase Loja' }; return mapping[row.type] || 'Unknown';