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

tambah fitur kalkulator / total benefit

Browse Source
This commit is contained in:
Tb Fajri
2024-01-25 14:57:13 +07:00
parent 3d4aa9ec8a
commit f8be2ce0be
1 changed files with 108 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
frontend/dashboard/src/pages/CustomerService/FinalLog/Detail.tsx
View File

@@ -116,6 +116,22 @@ export default function Detail() {
// Handle Edit Detail Benefit // Handle Edit Detail Benefit
const [openDialogEditBenefit, setDialogEditBenefit] = useState(false) const [openDialogEditBenefit, setDialogEditBenefit] = useState(false)
const [BenefitConfigurationData, setBenefitConfigurationData] = useState<BenefitData>(); const [BenefitConfigurationData, setBenefitConfigurationData] = useState<BenefitData>();
// Buat total data
const totalAmountIncurred = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_incurred || 0);
}, 0);
const totalAmountApprove = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_approved || 0);
}, 0);
const totalAmountNotApprove = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_not_approved || 0);
}, 0);
const totalExcessPaid = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.excess_paid || 0);
}, 0);
return ( return (
<Page title='Detail'> <Page title='Detail'>
<Container maxWidth={themeStretch ? false : 'xl'}> <Container maxWidth={themeStretch ? false : 'xl'}>
@@ -402,8 +418,98 @@ export default function Detail() {
</Grid> </Grid>
</Box> </Box>
))} ))}
<hr/>
<br/>
{requestLog?.benefit_data && requestLog.benefit_data.length > 0 ? (
<Box key={0} sx={{ border: '1px solid rgba(0,0,0,0.125)', px: '24px', py: '20px', marginBottom: '24px', borderRadius: '12px'}}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={6}>
<Typography variant="body2" sx={{ fontWeight: 'bold'}}>
Total Benefit
</Typography>
</Grid>
</Grid>
</Grid>
<Grid item xs={12}>
<Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
<Grid container spacing={1}>
{/* Amount Incurred */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Incurred
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountIncurred)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Approved */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountApprove)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Not Approved */}
<Grid item xs={3}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Not Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountNotApprove)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Excess Paid* */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Excess Paid
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalExcessPaid)}
</Typography>
</Grid>
</Grid>
</Grid>
</Grid>
</Box>
</Grid>
</Grid>
</Box>
)
: (
null
)}
</Card> </Card>
{/* PR Buat pindahin ke componen */} {/* PR Buat pindahin ke componen */}