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

update pading and pagination on Manage Members

Browse Source
This commit is contained in:
Wikzyy
2025-04-15 19:36:35 +07:00
parent a247afdea3
commit f71b203eb7
1 changed files with 51 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -7,7 +7,7 @@ import axios from 'axios';
import DetailMember from './blocks/DetailMember'; import DetailMember from './blocks/DetailMember';
import ConfirmDialog from '@/components/confirm'; import ConfirmDialog from '@/components/confirm';
import { useAuthContext } from '@/auth'; import { useAuthContext } from '@/auth';
import { DataGridInner, LoaderTransparant } from '@/components'; import { Container, DataGridInner, LoaderTransparant } from '@/components';
import { DataGridProvider } from '@/components'; import { DataGridProvider } from '@/components';
import { toast } from 'sonner'; import { toast } from 'sonner';
import { Breadcrumbs, Link } from '@mui/material'; import { Breadcrumbs, Link } from '@mui/material';
@ -188,67 +188,59 @@ const ManageMembers = () => {
<Helmet> <Helmet>
<title>TPAY | Manage Members</title> <title>TPAY | Manage Members</title>
</Helmet> </Helmet>
<div> <Container>
<div className="container mx-auto w-full"> <ConfirmDialog
<ConfirmDialog open={dialogOpen}
open={dialogOpen} onClose={() => setDialogOpen(false)}
onClose={() => setDialogOpen(false)} title="Confirm Action"
title="Confirm Action" content={`Are you sure you want to ${dialogType}?`}
content={`Are you sure you want to ${dialogType}?`} onYes={handleYes}
onYes={handleYes} onNo={() => setDialogOpen(false)}
onNo={() => setDialogOpen(false)} />
{member.id !== '' || dialogType === 'create' ? (
<DetailMember
showAddDialog={isDialogOpen}
setShowAddDialog={setShowAddDialog}
handleClose={closeDialog}
handleSubmit={handleSubmit}
initialData={member}
fetchCustomers={fetchCustomers}
profession={profession}
dialogType={dialogType}
/> />
{member.id !== '' || dialogType === 'create' ? ( ) : (
<DetailMember ''
showAddDialog={isDialogOpen} )}
setShowAddDialog={setShowAddDialog} <h1 className="text-xl font-medium leading-none text-gray-900 mb-5">Manage Members</h1>
handleClose={closeDialog} <Breadcrumbs>
handleSubmit={handleSubmit} <Link underline="none" color="inherit" href="/">
initialData={member} <span className="text-sm hover:underline">Dashboard</span>
fetchCustomers={fetchCustomers} </Link>
profession={profession} <Link underline="none" color="inherit">
dialogType={dialogType} <span className="text-sm">Members</span>
/> </Link>
) : (
''
)}
<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>
<div className="grid gap-5 lg:gap-7.5 mx-8 w-auto">
<Breadcrumbs>
<Link underline="none" color="inherit" href="/">
<span className="text-sm hover:underline">Dashboard</span>
</Link>
<Link underline="none" color="inherit">
<span className="text-sm">Members</span>
</Link>
<Link underline="none" color="inherit"> <Link underline="none" color="inherit">
<span className="text-sm">Manage Members</span> <span className="text-sm">Manage Members</span>
</Link> </Link>
</Breadcrumbs> </Breadcrumbs>
</div> {/* <div className="w-full overflow-x-auto px-4"> */}
<div className="w-full overflow-x-auto px-4"> <div className="grid gap-5 lg:gap-7.5 mt-5">
<div className="min-w-[800px]"> <DataGridProvider
<DataGridProvider data={members}
data={members} pagination={{ size: 25 }}
columns={getColumns(handleUpdate)} columns={getColumns(handleUpdate)}
layout={{ card: true }} layout={{ card: true }}
serverSide={false} serverSide={false}
toolbar={ toolbar={<ListToolbar createMember={createMember} />}
<ListToolbar createMember={createMember} /> onRowSelectionChange={(selected, table: any) => {
} const selectedRow = table.getSelectedRowModel().rows[0];
onRowSelectionChange={(selected, table: any) => { if (selectedRow) handleUpdate(selectedRow.original);
const selectedRow = table.getSelectedRowModel().rows[0]; }}
if (selectedRow) handleUpdate(selectedRow.original); ></DataGridProvider>
}}
>
</DataGridProvider>
</div>
</div>
</div> </div>
</div> {/* </div> */}
</Container>
</> </>
); );
}; };