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

create member

Browse Source
This commit is contained in:
unknown
2025-04-14 16:47:26 +07:00
parent a003a38cd1
commit d696d696de
6 changed files with 133 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/ui/DataTable.tsx
View File

@ -36,6 +36,7 @@ import {
interface DataTableProps<TData, TValue> {
columns: ColumnDef<TData, TValue>[];
data: TData[];
createData: any;
onUpdate: any;
onDelete: any;
}
@ -46,7 +47,7 @@ export function DataTable<TData, TValue>({
createData,
onUpdate,
onDelete
}: DataTableProps<TData, TValue> & { createData?: () => void }) {
}: DataTableProps<TData, TValue>) {
const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
const [sorting, setSorting] = useState<SortingState>([]);
@ -74,7 +75,7 @@ export function DataTable<TData, TValue>({
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
className="max-w-sm"
/>
{/* <Button onClick={createData} variant="outline" className="h-7.5 text-[0.8rem]">Add Data</Button> */}
{createData?(<Button onClick={createData} variant="outline" className="h-7.5 text-[0.8rem]">Add Data</Button>) : ""}
</div>
<div className="rounded-md border">
<Table className=''>

4
src/pages/members/kyc/Kyc.tsx
View File

@ -157,7 +157,8 @@ const Kyc = () => {
}
if (dialogType === 'update') {
await axios.put(`${BASE_URL}/customer/update/${customerId}`, form);
if (updateData.isneedapproval == 1) await axios.post(`${BASE_URL}/customer/approve`, { customerid: customerId, description: description});
if (updateData.isneedapproval == 1&&destinationGroup === "Premium") await axios.post(`${BASE_URL}/customer/approve`, { customerid: customerId, description: updateData.approval_description_premium});
if (updateData.isneedapproval == 1&&destinationGroup === "Agent") await axios.post(`${BASE_URL}/customer/approve`, { customerid: customerId, description: updateData.approval_description_agent});
}
await fetchCustomers();
setDialogOpen(false);
@ -233,6 +234,7 @@ const Kyc = () => {
<div className="w-full overflow-x-auto px-4">
<div className="min-w-[800px]">
<DataTable
createData={null}
data={members}
columns={columns}
onUpdate={handleUpdate}

31
src/pages/members/manage-members/ManageMembers.tsx
View File

@ -48,6 +48,10 @@ const ManageMembers = () => {
let temp = 1;
let resMembers = customers.data.data.list.map((el: any) => {
el.no = temp++;
if (el.date_birth) {
const d = new Date(el.date_birth);
el.date_birth = d.toLocaleString("sv-SE");
}
el.name = el.fullname;
return el;
});
@ -77,6 +81,7 @@ const ManageMembers = () => {
function createMember() {
setDialogType('create');
setSelectedMember('')
setMember(initialMember);
setIsDialogOpen(true);
}
@ -137,8 +142,27 @@ const ManageMembers = () => {
'Content-Type': 'multipart/form-data'
}
});
// if (dialogType === 'create') await axios.post(`${BASE_URL}/customers/create`, member)
toast.success('Success Update Member');
if (dialogType === 'create') {
const createMember:any = member
createMember.pin = "admin"
delete createMember.password;
delete createMember.try_pin;
delete createMember.license_number;
delete createMember.isneedapproval;
delete createMember.isapproved;
delete createMember.approveddate;
delete createMember.approvedby;
delete createMember.updated_by;
delete createMember.deleted_by;
delete createMember.deleted_at;
delete createMember.group;
delete createMember.point_tier;
delete createMember.approval_description_premium;
delete createMember.approval_description_agent;
delete createMember.language;
await axios.post(`${BASE_URL}/customers/create`, member)
}
toast.success('Success Create Membee. PIN sent to email');
} catch (error: any) {
toast.error(error.message);
} finally {
@ -170,7 +194,7 @@ const ManageMembers = () => {
onYes={handleYes}
onNo={() => setDialogOpen(false)}
/>
{ member.id !== '' ? (
{ (member.id!=='' || dialogType==='create') ? (
<DetailMember
showAddDialog={isDialogOpen}
setShowAddDialog={setShowAddDialog}
@ -179,6 +203,7 @@ const ManageMembers = () => {
initialData={member}
fetchCustomers={fetchCustomers}
profession={profession}
dialogType={dialogType}
/>
): ""}
<h1 className="text-xl font-medium leading-none text-gray-900 mb-3 grid gap-5 lg:gap-7.5 mx-8 w-auto">Manage Members</h1>

29
src/pages/members/manage-members/blocks/AdmAccess.tsx
View File

@ -21,14 +21,7 @@ import ConfirmDialog from '@/components/confirm';
const BASE_URL_CUSTOMER = apiConfig.service_customer;
// ACCESS ADM
export default function AdmAccess(
page: string,
data: any,
handleClose: any,
fetchCustomers: any,
viewOnly: any,
setViewOnly: any
) {
export default function AdmAccess({page,formData,handleClose,fetchCustomers,viewOnly,setViewOnly}: any) {
const [dialogOpen, setDialogOpen] = useState(false);
const [dialogType, setDialogType] = useState('');
const [changeGroup, setChangeGroup] = useState('');
@ -59,10 +52,10 @@ export default function AdmAccess(
const handleYes = async () => {
try {
if (dialogType === 'update status') {
let statusNext = getPinStatus(data.status).res;
let statusNext = getPinStatus(formData.status).res;
if (statusNext)
await axios.put(`${BASE_URL_CUSTOMER}/customer/statuspin`, {
customerid: data.id,
customerid: formData.id,
status: statusNext
});
else toast.error('Handle Active/Suspend only');
@ -70,8 +63,8 @@ export default function AdmAccess(
toast.success('Success Update Status');
}
if (dialogType === 'reset pin') {
if (data.id)
await axios.post(`${BASE_URL_CUSTOMER}/customer/resetpin`, { customerid: data.id });
if (formData.id)
await axios.post(`${BASE_URL_CUSTOMER}/customer/resetpin`, { customerid: formData.id });
else throw { message: 'data.id not found' };
await fetchCustomers();
toast.success('Pin will send to customer MSISDN');
@ -99,10 +92,10 @@ export default function AdmAccess(
async function buttonChangeGroup() {
try {
let dataObj = {
customerid: data.id,
customerid: formData.id,
destination_group: changeGroup
};
if (data.group_id === changeGroup)
if (formData.group_id === changeGroup)
throw { message: `You update same group as the exist customer group` };
if (dataObj.customerid && dataObj.destination_group) {
await axios.post(`${BASE_URL_CUSTOMER}/customer/change-group`, dataObj);
@ -119,14 +112,14 @@ export default function AdmAccess(
function openChangeGroupDialog(e: any) {
e.preventDefault();
setChangeGroup(data.group_id);
setChangeGroup(formData.group_id);
setChangeGroupD(true);
}
function btnConfirmDialog(status: boolean) {
setDialogOpen(status);
}
if (!formData.id) return '';
if (page !== 'kyc') {
return (
<div className="bg-white p-6 rounded-md shadow-md space-y-6">
@ -136,9 +129,9 @@ export default function AdmAccess(
{/* Left Side */}
<div className="space-y-4">
<div className="space-y-2">
<p className="text-sm">Pin Status: {getPinStatus(data.status).msg}</p>
<p className="text-sm">Pin Status: {getPinStatus(formData.status).msg}</p>
<Button variant="default" onClick={(e) => buttonStatus(e)}>
{getPinStatus(data.status).btn}
{getPinStatus(formData.status).btn}
</Button>
</div>
<div className="space-y-2">

5
src/pages/members/manage-members/blocks/CustomerWallet.tsx
View File

@ -6,7 +6,7 @@ import { apiConfig } from '@/config/api.config';
import { toast } from 'sonner';
const BASE_URL_CUSTOMER = apiConfig.service_customer;
export default function CustomerWallet(customerid: any) {
export default function CustomerWallet({customerid}: any) {
const [customerWallet, setCustomerWallet] = useState([]);
if (!customerid) return '';
@ -21,7 +21,6 @@ export default function CustomerWallet(customerid: any) {
});
setCustomerWallet(getCustWallet.data.data.data);
} catch (error: any) {
// toast.error(error.message);
toast.error(`Wallet Not Found`);
}
}
@ -30,7 +29,7 @@ export default function CustomerWallet(customerid: any) {
<div className="bg-white p-6 rounded-md shadow-md space-y-4">
<h2 className="text-lg font-semibold">Wallet Member</h2>
<Card className="p-4">
{customerWallet.length ? (
{customerWallet&&customerWallet.length ? (
<div className="overflow-x-auto">
<table className="min-w-full text-sm text-left">
<thead className="text-xs text-gray-500 border-b">

164
src/pages/members/manage-members/blocks/DetailMember.tsx
View File

@ -29,7 +29,7 @@ import AdmAccess from './AdmAccess';
import CustomerWallet from './CustomerWallet';
const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialData, handleReject, page, fetchCustomers,
handleClose, profession
handleClose, profession, dialogType
}: any) => {
const [formData, setFormData] = useState(initialData || initialMember);
const [viewOnly, setViewOnly] = useState(false);
@ -168,10 +168,17 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa
function buttonOnSubmit(e:any) {
e.preventDefault();
if (page === 'kyc' && formData.destinationGroup === "Premium" && !formData.approval_description_premium) return toast.warning(`Approval Premium Description needed!`)
if (page === 'kyc' && formData.destinationGroup === "Agent" && !formData.approval_description_premium) return toast.warning(`Approval Agent Description needed!`)
if (!formData.msisdn||!formData.email||!formData.fullname||!formData.username||!formData.mother_fullname||!formData.address||!formData.nationality||!formData.date_birth||!formData.gender) {
return toast.warning(`Required fields cannot be empty: msisdn, email, fullname, username, mother Full Name, Address, Nationality, Date Of Birth, Gender.!`)
if (dialogType === 'update') {
if (page === 'kyc' && formData.destinationGroup === "Premium" && !formData.approval_description_premium) return toast.warning(`Approval Premium Description needed!`)
if (page === 'kyc' && formData.destinationGroup === "Agent" && !formData.approval_description_premium) return toast.warning(`Approval Agent Description needed!`)
if (!formData.msisdn||!formData.email||!formData.fullname||!formData.username||!formData.mother_fullname||!formData.address||!formData.nationality||!formData.date_birth||!formData.gender) {
return toast.warning(`Required fields cannot be empty: msisdn, email, fullname, username, mother Full Name, Address, Nationality, Date Of Birth, Gender.!`)
}
}
if (dialogType === 'create') {
if (!formData.msisdn||!formData.email||!formData.fullname||!formData.username||!formData.mother_fullname||!formData.address||!formData.nationality||!formData.date_birth||!formData.gender) {
return toast.warning(`Required fields cannot be empty: msisdn, email, fullname, username, mother Full Name, Address, Nationality, Date Of Birth, Gender.!`)
}
}
// if (page === 'kyc' && !formData.description) return toast.warning(`Description for approval needed!`)
handleSubmit(formData);
@ -204,79 +211,81 @@ const DetailMember = ({ showAddDialog, setShowAddDialog, handleSubmit, initialDa
</Alert>
)}
{/* <form> */}
{/* onSubmit={(e) => buttonOnSubmit(e, formData)} */}
<div className="card-body grid gap-5">
<div className="card-body grid gap-5">
{formData.id ? generateInput(formData, handleChange, 'Group', 'group_name', 'text', true, true): ''}
{formData.id ? generateInput(formData, handleChange, 'Username', 'username', 'text', true, true): ''}
{formData.id ? generateInput(formData, handleChange, 'Full Name', 'fullname', 'text', true, viewOnly): ''}
{formData.id ? generateImage(formData, handleChange, 'Photo', 'photouser'): ''}
{formData.id ? generateList(formData, handleChange, genders, 'gender', 'Gender', null, true): ''}
{formData.id ? generateInput(formData, handleChange, 'Date of Birth', 'date_birth', 'date', true, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Phone Number', 'msisdn', 'text', true, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Email', 'email', 'text', true, viewOnly): ''}
{/* {generateList(formData, handleChange, status, 'status', 'Status', null, true)} */}
{formData.id ? generateList(formData, handleChange, profession, 'profession', 'Profession', null, false): ''}
{formData.id ? generateList(formData, handleChange, municipios, 'municipio', 'Municipio', null, false): ''}
{formData.id ? generateList(formData, handleChange, postoAdm, 'posto_adms', 'Posto', 'posto_adms_id', false): ''}
{formData.id ? generateList(formData, handleChange, sucos, 'suco', 'Suco', 'sucos_id', false): ''}
{formData.id ? generateList(formData, handleChange, aldeias, 'aldeia', 'Aldeia', null, false): ''}
{formData.id ? generateInput(formData, handleChange, 'Nationality', 'nationality', 'text', true, viewOnly): ''}
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label className="form-label flex items-center gap-1 max-w-56"></label>
<ul className="">
{nationality.map((item: any, index) => (
<li key={index} value={item.name}
onClick={() => 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}
</li>
))}
{formData.nationality && nationality.length === 0 && (
<li className="text-gray-500">No results found.</li>
)}
</ul>
</div>
{formData.id ? generateInput(formData, handleChange, 'Address', 'address', 'text', true, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Mother Fullname', 'mother_fullname', 'text', true, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Identity Number', 'identity_number', 'text', false, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'License Number', 'license_number', 'text', false, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Merchant Name', 'agent_name', 'text', false, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Merchant Address', 'merchantaddress', 'text', false, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Longitude Merchant', 'longitudemerchant', 'text', false, viewOnly): ''}
{formData.id ? generateInput(formData, handleChange, 'Latitude Merchant', 'latitudemerchant', 'text', false, viewOnly): ''}
{formData.id ? generateImage(formData, handleChange, 'File Selfie', 'file_selfie'): ''}
{formData.id ? generateImage(formData, handleChange, 'File Document', 'file_document_id'): ''}
{formData.id ? generateImage(formData, handleChange, 'File Document & Selfie', 'file_document_id_selfie'): ''}
{formData.id ? generateImage(formData, handleChange, 'File Commercial License', 'file_commercial_license'): ''}
{formData.id ? generateList(formData, handleChange, banks, 'bank_name', 'Bank Name', null, false): ''}
{formData.id ? generateInput(formData, handleChange, 'Bank Account', 'bank_account', 'text', false, viewOnly): ''}
{formData.id ? 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): ''}
{(formData.id && page!=='kyc') ? AdmAccess(page, formData, handleClose,fetchCustomers, viewOnly, setViewOnly): ""}
{(formData.id && page!=='kyc') ? CustomerWallet(formData.id) : ""}
<div className="flex justify-end gap-5">
<Button onClick={(e:any) => btnPrevDef(e)} color="secondary">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
<Button type="button" variant="outline" onClick={() => handleAddDialog(false)}>Cancel</Button>
{/* <Button onClick={(e) => buttonOnSubmit(e, formData)} variant="default">Save Changes</Button> */}
{
formData.isneedapproval == 1 && page === 'kyc' ? (
<Button onClick={onReject} variant="destructive" color="warning">Reject</Button>
) : ('')
}
<Button onClick={(e) => buttonOnSubmit(e)} color="primary" variant="default">
{ formData.id ? (formData.isneedapproval == 1 && page === 'kyc' ? (`Edit & Approve`) : (`Edit`)) : ("Create") }
</Button>
</div>
{(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") ? generateList(formData, handleChange, genders, 'gender', 'Gender', null, true): ''}
{(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, viewOnly): ''}
{(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', null, false): ''}
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, municipios, 'municipio', 'Municipio', null, false): ''}
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, postoAdm, 'posto_adms', 'Posto', 'posto_adms_id', false): ''}
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, sucos, 'suco', 'Suco', 'sucos_id', false): ''}
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, aldeias, 'aldeia', 'Aldeia', null, false): ''}
{(formData.id || dialogType === "create") ? generateInput(formData, handleChange, 'Nationality', 'nationality', 'text', true, viewOnly): ''}
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label className="form-label flex items-center gap-1 max-w-56"></label>
<ul className="">
{nationality.map((item: any, index) => (
<li key={index} value={item.name}
onClick={() => 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}
</li>
))}
{formData.nationality && nationality.length === 0 && (
<li className="text-gray-500">No results found.</li>
)}
</ul>
</div>
{/* </form> */}
{(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") ? 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'): ''}
{(formData.id || dialogType === "create") ? generateList(formData, handleChange, banks, 'bank_name', 'Bank Name', null, 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): ''}
{(formData.id && page!=='kyc') ? (
<AdmAccess page={page}formData={formData}fetchCustomers={fetchCustomers}handleClose={handleClose}viewOnly={viewOnly}setViewOnly={setViewOnly}/>
): ""}
{(formData.id && page!=='kyc') ? (
<CustomerWallet customerid={formData.id}/>
) : ""}
<div className="flex justify-end gap-5">
<Button onClick={(e:any) => btnPrevDef(e)} color="secondary">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
<Button type="button" variant="outline" onClick={() => handleAddDialog(false)}>Cancel</Button>
{/* <Button onClick={(e) => buttonOnSubmit(e, formData)} variant="default">Save Changes</Button> */}
{
formData.isneedapproval == 1 && page === 'kyc' ? (
<Button onClick={onReject} variant="destructive" color="warning">Reject</Button>
) : ('')
}
<Button onClick={(e) => buttonOnSubmit(e)} color="primary" variant="default">
{ formData.id ? (formData.isneedapproval == 1 && page === 'kyc' ? (`Edit & Approve`) : (`Edit`)) : ("Create") }
</Button>
</div>
</div>
</div>
</DialogBody>
</DialogContent>
@ -289,8 +298,7 @@ export default DetailMember;
function generateInput(formData:any, handleChange:any, label:string, name:string, type: string, required: boolean, disabled: boolean) {
function generateDate(isoString: string) {
const date = new Date(isoString);
return date.toISOString().slice(0, 10); // "2000-01-18"
return isoString.slice(0, 10); // "2000-01-18"
}
return (
<>