tbfajri/aso
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

fixing table filter and search on dashboard

Browse Source
This commit is contained in:
Fajar
2023-03-24 15:23:41 +07:00
parent 606b3c871a
commit 127cdf8708
6 changed files with 225 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
frontend/client-portal/src/sections/dashboard/DialogTopUpLimit.tsx
View File

@@ -21,14 +21,7 @@ import * as Yup from 'yup';
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
// ----------------------------------------------------------------------
type DataContent = {
info: string;
date: string;
time: string;
};
/* ---------------------------------- types --------------------------------- */
type MuiDialogProps = {
title?: {
name?: string;
@@ -37,24 +30,31 @@ type MuiDialogProps = {
openDialog: boolean;
setOpenDialog: Function;
content?: ReactElement;
data?: DataContent[];
data?: {
companyName: string;
policyNumber: number;
totalMembers: number;
totalCases: number;
totalPersen: number;
myLimit: number;
totalLimit: number;
};
};
type FormValuesProps = {
topup: string;
};
/* -------------------------------------------------------------------------- */
// ----------------------------------------------------------------------
const testData = {
companyName: 'PT. Aman Mineral',
policyNumber: 12345678,
totalMembers: 50,
totalCases: 100,
totalPersen: 75,
myLimit: 375000000,
totalLimit: 500000000,
};
// const testData = {
// companyName: 'PT. Aman Mineral',
// policyNumber: 12345678,
// totalMembers: 50,
// totalCases: 100,
// totalPersen: 75,
// myLimit: 375000000,
// totalLimit: 500000000,
// };
const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
height: 10,
@@ -70,7 +70,12 @@ const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
// ----------------------------------------------------------------------
const DialogTopUpLimit = ({ title, openDialog, setOpenDialog, data }: MuiDialogProps) => {
export default function DialogTopUpLimit({
title,
openDialog,
setOpenDialog,
data,
}: MuiDialogProps) {
const [isDisabledCheckbox, setIsDisabledCheckbox] = useState(false);
const [isDisabledButton, setIsDisabledButton] = useState(true);
@@ -126,42 +131,42 @@ const DialogTopUpLimit = ({ title, openDialog, setOpenDialog, data }: MuiDialogP
<Typography variant="caption" color="#637381">
Company Name
</Typography>
<Typography variant="body2">{testData.companyName}</Typography>
<Typography variant="body2">{data ? data.companyName : ''}</Typography>
</Stack>
<Stack>
<Typography variant="caption" color="#637381">
Policy Number
</Typography>
<Typography variant="body2">{testData.policyNumber}</Typography>
<Typography variant="body2">{data ? data.policyNumber : 0}</Typography>
</Stack>
<Stack direction="row" spacing={22}>
<Stack>
<Typography variant="caption" color="#637381">
Total Member
</Typography>
<Typography variant="body2">{testData.totalMembers} Person</Typography>
<Typography variant="body2">{data ? data.totalMembers : 0} Person</Typography>
</Stack>
<Stack>
<Typography variant="caption" color="#637381">
Total Cases
</Typography>
<Typography variant="body2">{testData.totalCases} Cases</Typography>
<Typography variant="body2">{data ? data.totalCases : 0} Cases</Typography>
</Stack>
</Stack>
<Stack spacing={1} sx={{ backgroundColor: '#F4F6F8', borderRadius: 1.5, padding: 2 }}>
<Stack direction="row" justifyContent="space-between" alignItems="center">
<Stack>
<Typography variant="body2">Company Pooled Fund</Typography>
<Typography variant="body2">{fCurrency(testData.myLimit)}</Typography>
<Typography variant="body2">{fCurrency(data ? data.myLimit : 0)}</Typography>
<Typography variant="caption" color="#919EAB">
/ {testData.totalLimit}
/ {data ? data.totalLimit : 0}
</Typography>
</Stack>
<Stack>
<Typography variant="h5">{testData.totalPersen}%</Typography>
<Typography variant="h5">{data ? data.totalPersen : 0}%</Typography>
</Stack>
</Stack>
<BorderLinearProgress variant="determinate" value={testData.totalPersen} />
<BorderLinearProgress variant="determinate" value={data ? data.totalPersen : 0} />
</Stack>
<Stack spacing={2}>
<Typography variant="subtitle1" marginTop={3}>
@@ -178,7 +183,7 @@ const DialogTopUpLimit = ({ title, openDialog, setOpenDialog, data }: MuiDialogP
<FormControlLabel
sx={{ typography: 'caption' }}
control={<Checkbox />}
label={'Max ' + fCurrency(testData.totalLimit - testData.myLimit)}
label={'Max ' + fCurrency((data ? data.totalLimit : 0) - (data ? data.myLimit : 0))}
onChange={handleSubmit(onCheckHandler)}
/>
@@ -207,6 +212,4 @@ const DialogTopUpLimit = ({ title, openDialog, setOpenDialog, data }: MuiDialogP
maxWidth="xs"
/>
);
};
export default DialogTopUpLimit;
}