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

LMSN-191

Browse Source 
Data corporate & member linking ke client portal
This commit is contained in:
ivan-sim
2023-09-27 17:37:21 +07:00
parent 1abb9b2539
commit 544eb32a81
19 changed files with 245 additions and 335 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/client-portal/src/sections/alarm-center/user-profile/CardBenefitSummary.tsx
View File

@@ -29,7 +29,7 @@ const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
export default function CardBenefitSummary({ data }) {
const [benefits, setBenefits] = useState([]);
console.log('data', data);
// console.log('data', data);
useEffect(() => {
setBenefits(data);
}, [data]);
@@ -58,7 +58,7 @@ export default function CardBenefitSummary({ data }) {
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<BorderLinearProgress variant="determinate" value={0} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">0</Typography>
<Typography>/</Typography>

22
frontend/client-portal/src/sections/alarm-center/user-profile/CardClaimHistory.tsx
View File

@@ -13,6 +13,7 @@ import {
} from '@mui/material';
// react
import { useState } from 'react';
import { fDate } from '../../../utils/formatTime';
// ----------------------------------------------------------------------
@@ -20,27 +21,22 @@ function createData(benefitType: string, submissionDate: string, status: string)
return { benefitType, submissionDate, status };
}
const rows = [
createData('Rawat Jalan', '15-10-2022', 'Request'),
createData('Rawat Inap', '15-10-2022', 'Request'),
createData('Manfaat Special', '15-10-2022', 'Request'),
createData('Perobatan Mata', '15-10-2022', 'Request'),
createData('Perawatan Gigi', '15-10-2022', 'Request'),
createData('Kehamilan', '15-10-2022', 'Request'),
createData('Laboratorium', '15-10-2022', 'Request'),
createData('Manfaat Farmasi', '15-10-2022', 'Request'),
];
// ----------------------------------------------------------------------
export default function CardClaimHistory(benefitMember) {
export default function CardClaimHistory({ data }) {
const [page, setPage] = useState(0);
const [rowsPerPage, setRowsPerPage] = useState(5);
console.log('benefitMember', benefitMember);
const handleChangePage = (event: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {
setPage(newPage);
};
// Data claim history
const claimHistory = data?.claim_history;
const rows = claimHistory ? claimHistory.map(history => {
return createData(history.description, fDate(history.submission_date), history.status);
}) : [];
return (
<Card sx={{ padding: 2 }}>
<Stack direction="row" justifyContent="space-between" alignItems="center">

404
frontend/client-portal/src/sections/alarm-center/user-profile/CardFamilyInformation.tsx
View File

@@ -1,9 +1,61 @@
// mui
import { Button, Card, Stack, Typography, Grid, Switch } from '@mui/material';
import { Button, Card, Stack, Typography, Grid, Switch, TextField } from '@mui/material';
// components
import Iconify from '../../../components/Iconify';
import { fDate } from '../../../utils/formatTime';
import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
import { useContext, useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import axios from '../../../utils/axios';
import { enqueueSnackbar } from 'notistack';
export default function CardFamilyInformation() {
export default function CardFamilyInformation({ data }) {
const [openDialog, setOpenDialog] = useState(false);
const [editIndex, setEditIndex] = useState(null);
const [editedFamilyData, setEditedFamilyData] = useState({});
const { id } = useParams();
const handleEditData = (index) => {
setEditIndex(index);
setEditedFamilyData(data?.family[index] || {});
setOpenDialog(true);
};
const handleCloseDialog = () => {
setOpenDialog(false);
};
const handleSaveData = () => {
if (editIndex !== null) {
try {
// Salin data keluarga saat ini
const updatedFamily = [...data?.family];
// Perbarui data keluarga dengan data yang diedit
updatedFamily[editIndex] = editedFamilyData;
// Perbarui data utama dengan data keluarga yang telah diperbarui
const updatedData = { ...data, family: updatedFamily };
axios
.post('/update-family', updatedData.family)
.then((response) => {
enqueueSnackbar('Data updated successfully', { variant: 'success' });
setOpenDialog(false);
window.location.reload();
})
.catch((error) => {
enqueueSnackbar('Failed to update data', { variant: 'error' });
});
} catch (error) {
console.error('Terjadi kesalahan saat menyimpan data:', error);
}
}
};
return (
<Card sx={{ borderRadius: '6px', paddingY: 2 }}>
{/* Stack 1 */}
@@ -14,12 +66,12 @@ export default function CardFamilyInformation() {
sx={{ paddingY: 1, paddingX: 3 }}
>
<Typography variant="subtitle2">Beneficiary / Family</Typography>
<Button startIcon={<Iconify icon="ic:round-add" />}>Add Member</Button>
<Button startIcon={<Iconify icon="ic:round-add" />} disabled>Add Member</Button>
</Stack>
{/* Stack 2 */}
<Grid container maxHeight="307px" spacing={2} paddingX={2} sx={{ overflowY: 'auto' }}>
{/* Card 1 */}
<Grid item xs={12} sm={6} md={6}>
{data?.family.map((familyMember, index) => (
<Grid item xs={12} sm={6} md={6} key={index}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
@@ -39,23 +91,31 @@ export default function CardFamilyInformation() {
style={{ borderRadius: '50%' }}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Husband
{familyMember.relation_with_principal === 'H'
? 'Husband'
: familyMember.relation_with_principal === 'W'
? 'Wife'
: familyMember.relation_with_principal === 'S'
? 'Son'
: familyMember.relation_with_principal === 'D'
? 'Daughter'
: 'Main Member'}
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
<Switch aria-label="switch demo" disabled />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Octa Xavier
{familyMember?.name}
</Typography>
<Typography variant="body2" color="#757575">
14 Jan 1986
{familyMember?.birth_date ? fDate(familyMember?.birth_date) : ''}
</Typography>
<Typography variant="body2" color="#757575">
082113256754
{familyMember?.phone}
</Typography>
{/* Stack 2 */}
<Stack
@@ -64,296 +124,56 @@ export default function CardFamilyInformation() {
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />} disabled>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
{/* Card 2 */}
<Grid item xs={12} sm={6} md={6}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
spacing={2}
sx={{ flex: '100%' }}
>
{/* Row 1 */}
<Stack direction="row" spacing={1}>
<div
style={{
borderRadius: '50%',
width: '24px',
height: '24px',
backgroundColor: '#D9D9D9',
}}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Kid
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Celine Claudia
</Typography>
<Typography variant="body2" color="#757575">
15 Oct 2000
</Typography>
<Typography variant="body2" color="#757575">
082113256754
</Typography>
{/* Stack 2 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
{/* Card 3 */}
<Grid item xs={12} sm={6} md={6}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
spacing={2}
sx={{ flex: '100%' }}
>
{/* Row 1 */}
<Stack direction="row" spacing={1}>
<div
style={{
borderRadius: '50%',
width: '24px',
height: '24px',
backgroundColor: '#D9D9D9',
}}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Kid
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Celine Claudia
</Typography>
<Typography variant="body2" color="#757575">
15 Oct 2000
</Typography>
<Typography variant="body2" color="#757575">
082113256754
</Typography>
{/* Stack 2 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
{/* Card 4 */}
<Grid item xs={12} sm={6} md={6}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
spacing={2}
sx={{ flex: '100%' }}
>
{/* Row 1 */}
<Stack direction="row" spacing={1}>
<div
style={{
borderRadius: '50%',
width: '24px',
height: '24px',
backgroundColor: '#D9D9D9',
}}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Kid
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Celine Claudia
</Typography>
<Typography variant="body2" color="#757575">
15 Oct 2000
</Typography>
<Typography variant="body2" color="#757575">
082113256754
</Typography>
{/* Stack 2 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
{/* Card 5 */}
<Grid item xs={12} sm={6} md={6}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
spacing={2}
sx={{ flex: '100%' }}
>
{/* Row 1 */}
<Stack direction="row" spacing={1}>
<div
style={{
borderRadius: '50%',
width: '24px',
height: '24px',
backgroundColor: '#D9D9D9',
}}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Kid
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Celine Claudia
</Typography>
<Typography variant="body2" color="#757575">
15 Oct 2000
</Typography>
<Typography variant="body2" color="#757575">
082113256754
</Typography>
{/* Stack 2 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
{/* Card 6 */}
<Grid item xs={12} sm={6} md={6}>
<Card sx={{ paddingX: 1.5, paddingY: 1 }}>
{/* Stack 1 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
spacing={2}
sx={{ flex: '100%' }}
>
{/* Row 1 */}
<Stack direction="row" spacing={1}>
<div
style={{
borderRadius: '50%',
width: '24px',
height: '24px',
backgroundColor: '#D9D9D9',
}}
/>
<Typography variant="body2" sx={{ fontWeight: 500 }}>
Kid
</Typography>
</Stack>
{/* Row 2 */}
<Stack alignItems="center">
<Typography variant="caption">Suspend</Typography>
<Switch aria-label="switch demo" />
</Stack>
</Stack>
<Typography variant="body2" color="#757575">
Celine Claudia
</Typography>
<Typography variant="body2" color="#757575">
15 Oct 2000
</Typography>
<Typography variant="body2" color="#757575">
082113256754
</Typography>
{/* Stack 2 */}
<Stack
direction="row"
alignItems="center"
justifyContent="space-between"
marginTop={1.25}
>
<Button color="error" startIcon={<Iconify icon="ic:round-close" />}>
Remove
</Button>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />}>
<Button variant="contained" startIcon={<Iconify icon="heroicons:pencil-solid" />} onClick={ () => handleEditData(index)}>
Edit Data
</Button>
</Stack>
</Card>
</Grid>
))}
</Grid>
{/* Dialog */}
<Dialog open={openDialog} onClose={handleCloseDialog}>
<DialogTitle>Edit Data</DialogTitle>
<DialogContent>
<Stack spacing={2}>
<TextField
label="Name"
value={editedFamilyData?.name || ''}
onChange={(e) => setEditedFamilyData({ ...editedFamilyData, name: e.target.value })}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Email Address"
value={editedFamilyData?.email || ''}
onChange={(e) => setEditedFamilyData({ ...editedFamilyData, email: e.target.value })}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Phone No."
value={editedFamilyData?.phone || ''}
onChange={(e) => setEditedFamilyData({ ...editedFamilyData, phone: e.target.value })}
fullWidth
sx={{ marginTop: '16px' }}
/>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={handleCloseDialog}>Cancel</Button>
<Button onClick={handleSaveData} variant="contained" color="primary">
Save
</Button>
</DialogActions>
</Dialog>
</Card>
);
}

8
frontend/client-portal/src/sections/alarm-center/user-profile/CardPersonalInformation.tsx
View File

@@ -24,6 +24,9 @@ export default function CardPersonalInformation({ data }) {
/* const [updatedData, setUpdatedData] = useState(data); */
//console.log(data);
const handleEditData = () => {
setWeight(data?.last_weight_kg || '');
setHeight(data?.last_height_cm || '');
@@ -59,6 +62,7 @@ export default function CardPersonalInformation({ data }) {
// Handle the successful update
enqueueSnackbar('Data updated successfully', { variant: 'success' });
setOpenDialog(false);
window.location.reload();
})
.catch((error) => {
// Handle the error
@@ -139,7 +143,7 @@ export default function CardPersonalInformation({ data }) {
</Stack>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Jenis Kelamin</Typography>
<Typography variant="body2">{data?.gender}</Typography>
<Typography variant="body2">{data?.gender ? data.gender.charAt(0).toUpperCase() + data.gender.slice(1) : ''}</Typography>
</Stack>
</Stack>
</Stack>
@@ -176,7 +180,7 @@ export default function CardPersonalInformation({ data }) {
<Typography variant="body2">{data?.nik}</Typography>
</Stack>
<Stack>
<Button variant="contained" startIcon={<VisibilityIcon />}>
<Button variant="contained" startIcon={<VisibilityIcon />} disabled>
Lihat Foto
</Button>
</Stack>

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

@@ -154,7 +154,7 @@ export default function DialogTopUpLimit({
};
const onTopupHandler = (value: string) => {
console.log(!!errors);
//console.log(!!errors);
let newValue;