update data di service monitoring, dan alarm center benefit summary

This commit is contained in:
pajri
2023-07-07 10:30:17 +07:00
parent 2157c14f8d
commit 40da45c9ff
17 changed files with 2786 additions and 2725 deletions

View File

@@ -21,8 +21,7 @@ import { useState, SyntheticEvent, useContext, useEffect } from 'react';
import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate';
import { useNavigate, useParams } from 'react-router-dom';
import axios from '../../utils/axios';
import { fDate } from '../../utils/formatTime';
// sections
// import ListTable from '../../sections/claimreports/ListTable';
@@ -107,69 +106,70 @@ const StyledTab = styled((props: StyledTabProps) => <Tab disableRipple {...props
})
);
export default function ServiceMonitoring() {
const { themeStretch } = useSettings();
const navigate = useNavigate();
const [value, setValue] = useState(0);
const handleChange = (event: SyntheticEvent, newValue: number) => {
setValue(newValue);
};
const [data, setData] = useState({});
const [data1, setData1] = useState();
const [corporate, setCorporate] = useState();
const {corporateValue} = useContext(UserCurrentCorporateContext);
const {id} = useParams();
const claimId = '2'
console.log('id',id);
const { corporateValue } = useContext(UserCurrentCorporateContext);
const { id } = useParams();
const claimId = '2';
console.log('id', id);
useEffect (() => {
console.log('fetching data...')
axios.get('/data/'+id )
.then(response => {
console.log('data fetched...', response.data)
useEffect(() => {
console.log('fetching data...');
axios
.get('/data/' + id)
.then((response) => {
console.log('data fetched...', response.data);
setData(response.data);
})
.catch(error => {
.catch((error) => {
console.error('error fetching data...', error);
});
axios
.get('/corporate-manage/' + corporateValue)
.then((response) => {
console.log('corporate fetched...', response.data);
setCorporate(response.data);
})
.catch((error) => {
console.error('error fetching corporate...', error);
});
}, []);
console.log('Data:' , data);
console.log('Data:', data);
const [encounterData, setEncounterData] = useState({});
useEffect(() => {
console.log('fetching encounter data...');
axios.get('/claims/${claim_id}/encounters')
.then(response => {
axios
.get('/claims/${claim_id}/encounters')
.then((response) => {
console.log('encounter data fetched...', response.data);
setEncounterData(response.data);
})
.catch(error => {
.catch((error) => {
console.error('error fetching encounter data...', error);
});
}, []);
return (
<Page title="Service Monitoring 123456">
<Container maxWidth={themeStretch ? false : 'xl'}>
<Stack direction="row" alignItems="center" sx={{ marginBottom: 2 }}>
<IconButton onClick={() =>
navigate('/alarm-center')
}
sx={{ marginRight: '10px', color: '#424242' }}>
<IconButton
onClick={() => navigate('/alarm-center')}
sx={{ marginRight: '10px', color: '#424242' }}
>
<Iconify icon="heroicons-outline:arrow-narrow-left" />
</IconButton>
<Typography variant="h5">Service Monitoring</Typography>
@@ -206,23 +206,25 @@ export default function ServiceMonitoring() {
<Stack spacing={2}>
<Stack>
<Typography variant="caption">Nama perusahaan</Typography>
<Typography variant="body2">{corporateValue}</Typography>
<Typography variant="body2">{corporate?.name}</Typography>
</Stack>
<Stack>
<Typography variant="caption">Nama Lengkap</Typography>
<Typography variant="body2">{data.name || 'Loading...'}</Typography>
</Stack>
<Typography variant="caption">Nama Lengkap</Typography>
<Typography variant="body2">{data?.name || 'Loading...'}</Typography>
</Stack>
<Stack>
<Typography variant="caption">Tanggal lahir</Typography>
<Typography variant="body2">{data.birth_date}</Typography>
<Typography variant="body2">
{data?.birth_date ? fDate(data?.birth_date) : ''}
</Typography>
</Stack>
<Stack>
<Typography variant="caption">Email</Typography>
<Typography variant="body2">{data.email}</Typography>
<Typography variant="body2">{data?.email}</Typography>
</Stack>
<Stack>
<Typography variant="caption">No telepon</Typography>
<Typography variant="body2">{data.phone}</Typography>
<Typography variant="body2">{data?.phone}</Typography>
</Stack>
</Stack>
<Stack>

View File

@@ -18,7 +18,6 @@ import { useEffect, useState, useContext } from 'react';
import axios from '../../utils/axios';
import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate';
// ----------------------------------------------------------------------
export default function UserProfile() {
@@ -27,23 +26,21 @@ export default function UserProfile() {
const [data, setData] = useState();
const [data1, setData1] = useState();
const { corporateValue } = useContext(UserCurrentCorporateContext);
const { id } = useParams();
const {corporateValue} = useContext(UserCurrentCorporateContext);
const {id} = useParams();
useEffect (() => {
axios.get('/data/'+id )
.then(response => {
useEffect(() => {
axios
.get(corporateValue + '/members/' + id)
.then((response) => {
setData(response.data);
})
.catch(error => {
.catch((error) => {
console.error(error);
});
}, []);
console.log('data', data)
console.log('data', data);
return (
<Page title="Profile Peserta Jessica Lie">
@@ -52,7 +49,7 @@ export default function UserProfile() {
{/* <IconButton sx={{ marginRight: '10px', color: '#424242' }} onClick={() => navigate()}>
<Iconify icon="heroicons-outline:arrow-narrow-left" />
</IconButton> */}
<ButtonBack/>
<ButtonBack />
<Typography variant="h5">Profil Peserta</Typography>
</Stack>
<Grid container spacing={2}>
@@ -74,7 +71,7 @@ export default function UserProfile() {
<Grid container spacing={2}>
{/* Item 1 */}
<Grid item xs={12}>
<CardPolicyNumber />
<CardPolicyNumber data={data} />
</Grid>
{/* Item 2 */}
<Grid item xs={12}>

View File

@@ -278,7 +278,7 @@ export default function Index() {
params: { ...parameters },
});
console.log('member',corporateMembers );
console.log('member', corporateMembers);
const corporateTopUpLimit = await axios.get(`${corporateValue}/topup`);
setSearchParams(parameters);

View File

@@ -8,6 +8,8 @@ import {
linearProgressClasses,
Grid,
} from '@mui/material';
import { useEffect, useState } from 'react';
import { description } from '../../../../../dashboard/src/_mock/text';
// ----------------------------------------------------------------------
@@ -25,203 +27,49 @@ const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
// ----------------------------------------------------------------------
export default function CardBenefitSummary() {
export default function CardBenefitSummary({ data }) {
const [benefits, setBenefits] = useState([]);
console.log('data', data);
useEffect(() => {
setBenefits(data);
}, [data]);
return (
<div style={{ marginTop: '1rem' }}>
<Typography padding={1} variant="subtitle2">
Benefit Summary
</Typography>
<Card>
{/* {Object.entries(benefits?.data).map(([key, value]) => (
<div key={key}>
<span>Haloo</span>
</div>
))} */}
<Grid container spacing={1} marginTop={1} sx={{ backgroundColor: '#F4F6F8', padding: 1 }}>
{/* Card 1 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Rawat Jalan
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
{benefits?.map((item, key) => (
<Grid item xs={12} sm={6} md={6} lg={4} key={key}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
{item?.description}
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 2 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Rawat Inap
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">0</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
{item?.pivot['limit_amount']}
</Typography>
</Stack>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 3 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Manfaat Special
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 4 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Manfaat Special
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 5 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Perobatan Mata
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 6 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Perawatan Gigi
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 7 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Kehamilan
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 8 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Laboratorium
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
{/* Card 9 */}
<Grid item xs={12} sm={6} md={6} lg={4}>
<Card sx={{ padding: 1 }}>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
Manfaat Farmasi
</Typography>
<Typography variant="body2" color="#0A0A0A">
Yearly Limits
</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<Stack direction="row" spacing={0.25}>
<Typography variant="body2">10.000.000</Typography>
<Typography>/</Typography>
<Typography variant="body2" color="#757575">
10.000.000
</Typography>
</Stack>
</Stack>
</Card>
</Grid>
</Card>
</Grid>
))}
</Grid>
</Card>
</div>

View File

@@ -33,10 +33,10 @@ const rows = [
// ----------------------------------------------------------------------
export default function CardClaimHistory() {
export default function CardClaimHistory(benefitMember) {
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);
};

View File

@@ -9,21 +9,18 @@ import { UserCurrentCorporateContext } from '../../../contexts/UserCurrentCorpor
import { useParams } from 'react-router-dom';
import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
import { enqueueSnackbar } from 'notistack';
import { fDate } from '../../../utils/formatTime';
export default function CardPersonalInformation({data}) {
export default function CardPersonalInformation({ data }) {
/* const [data, setData] = useState(); */
const [openDialog, setOpenDialog] = useState(false);
const [editedData, setEditedData] = useState(null);
const { id } = useParams();
const [weight, setWeight] = useState(data?.last_weight_kg || '');
const [height, setHeight] = useState(data?.last_height_cm || '');
const [email, setEmail] = useState(data?.email || '' );
const [phone, setPhone] = useState(data?.phone || '' );
const [address, setAddress] = useState(data?.main_address_id || '' );
const [email, setEmail] = useState(data?.email || '');
const [phone, setPhone] = useState(data?.phone || '');
const [address, setAddress] = useState(data?.main_address_id || '');
/* const [updatedData, setUpdatedData] = useState(data); */
@@ -31,13 +28,11 @@ export default function CardPersonalInformation({data}) {
setWeight(data?.last_weight_kg || '');
setHeight(data?.last_height_cm || '');
setEmail(data?.email || '');
setPhone(data?.phone||'');
setAddress(data?.main_address_id||'');
setPhone(data?.phone || '');
setAddress(data?.main_address_id || '');
setEditedData(data);
setOpenDialog(true);
};
const handleCloseDialog = () => {
// Close the dialog
@@ -56,7 +51,7 @@ export default function CardPersonalInformation({data}) {
phone: phone,
main_address_id: address,
};
// Update the data in the database using the updatedData object
axios
.put('/data/' + id, updatedData)
@@ -70,17 +65,9 @@ export default function CardPersonalInformation({data}) {
enqueueSnackbar('Failed to update data', { variant: 'error' });
});
};
return (
<Card sx={{ borderRadius: '6px', paddingY: 2 }}>
{/* Stack 1 */}
<Stack
direction="row"
@@ -89,7 +76,9 @@ export default function CardPersonalInformation({data}) {
sx={{ paddingY: 1, paddingX: 3 }}
>
<Typography variant="subtitle2">Informasi Pribadi</Typography>
<Button startIcon={<Iconify icon="heroicons:pencil-solid" />} onClick={handleEditData}>Edit Data</Button>
<Button startIcon={<Iconify icon="heroicons:pencil-solid" />} onClick={handleEditData}>
Edit Data
</Button>
</Stack>
{/* Stack 2 */}
<Stack direction="row" spacing={2} paddingX={2}>
@@ -119,15 +108,15 @@ export default function CardPersonalInformation({data}) {
<Stack direction="row" paddingY={1} spacing={2} sx={{ flex: '100%' }}>
<Stack sx={{ width: '60%' }}>
<Typography variant="caption">Nama Lengkap</Typography>
<Typography variant="body2"> {data ?. name} </Typography>
<Typography variant="body2"> {data?.name} </Typography>
</Stack>
<Stack sx={{ width: '20%' }}>
<Typography variant="caption">Berat Badan </Typography>
<Typography variant="body2">{data ?. last_weight_kg} kg</Typography>
<Typography variant="body2">{data?.last_weight_kg} kg</Typography>
</Stack>
<Stack sx={{ width: '20%' }}>
<Typography variant="caption">Tinggi Badan </Typography>
<Typography variant="body2">{data ?. last_height_cm} cm</Typography>
<Typography variant="body2">{data?.last_height_cm} cm</Typography>
</Stack>
</Stack>
</Stack>
@@ -139,15 +128,18 @@ export default function CardPersonalInformation({data}) {
<Stack direction="row" spacing={2} sx={{ flex: '100%' }}>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Tempat Lahir</Typography>
<Typography variant="body2"> {data ?. birth_place} </Typography>
<Typography variant="body2"> {data?.birth_place} </Typography>
</Stack>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Tanggal Lahir</Typography>
<Typography variant="body2">{data ?. birth_date}</Typography>
<Typography variant="body2">
{' '}
{data?.birth_date ? fDate(data?.birth_date) : ''}
</Typography>
</Stack>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Jenis Kelamin</Typography>
<Typography variant="body2">{data ?. gender}</Typography>
<Typography variant="body2">{data?.gender}</Typography>
</Stack>
</Stack>
</Stack>
@@ -157,18 +149,16 @@ export default function CardPersonalInformation({data}) {
<Stack direction="row" spacing={2} sx={{ flex: '100%' }}>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Nomor Telpon</Typography>
<Typography variant="body2">{data ?. phone}</Typography>
<Typography variant="body2">{data?.phone}</Typography>
</Stack>
<Stack sx={{ width: '100%' }}>
<Typography variant="caption">Email</Typography>
<Typography variant="body2">{data?. email}</Typography>
<Typography variant="body2">{data?.email}</Typography>
</Stack>
</Stack>
<Stack>
<Typography variant="caption">Alamat</Typography>
<Typography variant="body2">
{data ?. main_address_id}
</Typography>
<Typography variant="body2">{data?.main_address_id}</Typography>
</Stack>
</Stack>
{/* Stack 3.3 */}
@@ -183,7 +173,7 @@ export default function CardPersonalInformation({data}) {
>
<Stack>
<Typography variant="caption">Nomor NIK</Typography>
<Typography variant="body2">{data ?. nik}</Typography>
<Typography variant="body2">{data?.nik}</Typography>
</Stack>
<Stack>
<Button variant="contained" startIcon={<VisibilityIcon />}>
@@ -198,65 +188,65 @@ export default function CardPersonalInformation({data}) {
<Stack direction="row" justifyContent="space-between" spacing={2} sx={{ flex: '100%' }}>
<Stack>
<Typography variant="caption">Agama</Typography>
<Typography variant="body2">{data ?. religion}</Typography>
<Typography variant="body2">{data?.religion}</Typography>
</Stack>
<Stack>
<Typography variant="caption">Status</Typography>
<Typography variant="body2">{data ?. marital_status}</Typography>
<Typography variant="body2">{data?.marital_status}</Typography>
</Stack>
<Stack>
<Typography variant="caption">Pendidikan</Typography>
<Typography variant="body2">{data ?. last_education}</Typography>
<Typography variant="body2">{data?.last_education}</Typography>
</Stack>
<Stack>
<Typography variant="caption">Pekerjaan</Typography>
<Typography variant="body2">{data ?. current_employment}</Typography>
<Typography variant="body2">{data?.current_employment}</Typography>
</Stack>
</Stack>
</Stack>
</Stack>
{/* Dialog */}
<Dialog open={openDialog} onClose={handleCloseDialog}>
<DialogTitle>Edit Data</DialogTitle>
<DialogContent>
<Stack spacing={2}>
<TextField
label="Full Name"
value={editedData ? editedData.name : ''}
onChange={(e) => setEditedData({ ...editedData, name: e.target.value })}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Weight (kg)"
value={weight}
onChange={(e) => setWeight(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Height (cm)"
value={height}
onChange={(e) => setHeight(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Email Address"
value={email}
onChange={(e) => setEmail(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Phone No."
value={phone}
onChange={(e) => setPhone(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
{/* <TextField
<Dialog open={openDialog} onClose={handleCloseDialog}>
<DialogTitle>Edit Data</DialogTitle>
<DialogContent>
<Stack spacing={2}>
<TextField
label="Full Name"
value={editedData ? editedData.name : ''}
onChange={(e) => setEditedData({ ...editedData, name: e.target.value })}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Weight (kg)"
value={weight}
onChange={(e) => setWeight(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Height (cm)"
value={height}
onChange={(e) => setHeight(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Email Address"
value={email}
onChange={(e) => setEmail(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
<TextField
label="Phone No."
value={phone}
onChange={(e) => setPhone(e.target.value)}
fullWidth
sx={{ marginTop: '16px' }}
/>
{/* <TextField
label="Address"
value={address}
onChange={(e) => setAddress(e.target.value)}
@@ -264,18 +254,17 @@ export default function CardPersonalInformation({data}) {
sx={{ marginTop: '16px' }}
/> */}
{/* Add more fields as needed */}
</Stack>
</DialogContent>
{/* Add more fields as needed */}
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={handleCloseDialog}>Cancel</Button>
<Button onClick={handleSaveData} variant="contained" color="primary">
Save
</Button>
</DialogActions>
</Dialog>
<DialogActions>
<Button onClick={handleCloseDialog}>Cancel</Button>
<Button onClick={handleSaveData} variant="contained" color="primary">
Save
</Button>
</DialogActions>
</Dialog>
</Card>
);
}

View File

@@ -20,7 +20,6 @@ const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
},
}));
type DataMember = {
id: number;
fullName: string;
@@ -65,18 +64,17 @@ type CardPolicyProps = {
members?: DataMember[];
};
// ----------------------------------------------------------------------
export default function CardPolicyNumber() {
export default function CardPolicyNumber({ data }) {
const { corporateValue } = useContext(UserCurrentCorporateContext);
const [policyNumber, setPolicyNumber] = useState('');
const [policyData, setPolicyData] = useState<CardPolicyProps>();
const { corporateValue } = useContext(UserCurrentCorporateContext);
const [policyNumber,setPolicyNumber] = useState('');
const [policyData, setPolicyData] = useState<CardPolicyProps>();
const [limitMember, setLimitMember] = useState();
const [benefitMember, setBenefitMember] = useState();
/* axios.get(`${corporateValue}/topup`)
/* axios.get(`${corporateValue}/topup`)
.then(response => {
console.log(response.data);
})
@@ -84,63 +82,68 @@ export default function CardPolicyNumber() {
console.error(error);
}); */
useEffect(() => {
useEffect(() => {
axios
.get(`${corporateValue}/topup`)
.then(response => {
.then((response) => {
const { data } = response.data; // Access the 'data' object from the response
const { policyNumber } = data; // Access the 'policyNumber' field from the 'data' object
setPolicyNumber(policyNumber);
})
.catch(error => {
.catch((error) => {
console.error(error);
});
// const corporatePolicyLimit = axios.get(`${corporateValue}/policy`);
// const corporateTopUpLimit = axios.get(`${corporateValue}/topup`);
// setPolicyData({
// limit: corporatePolicyLimit.data.data,
// topUpLimit: corporateTopUpLimit.data.data,
// });
}, [corporateValue]);
setLimitMember(data?.limit);
setBenefitMember(data?.benefits);
const calculateProgressValue = (current:number,total:number) => {
return (current/total) * 100;
// const corporatePolicyLimit = axios.get(`${corporateValue}/policy`);
// const corporateTopUpLimit = axios.get(`${corporateValue}/topup`);
// setPolicyData({
// limit: corporatePolicyLimit.data.data,
// topUpLimit: corporateTopUpLimit.data.data,
// });
}, [corporateValue, data]);
const calculateProgressValue = (current: number, total: number) => {
return (current / total) * 100;
};
const progressValue = calculateProgressValue(limitMember?.current, limitMember?.total);
const getMemberLimitUsage = (memberId: string) => {
if (policyData?.members) {
const member = policyData.members.find(member => member.memberId === memberId);
if (member) {
return member.limit;
}
}
return null;
};
// const getMemberLimitUsage = (memberId: string) => {
// if (policyData?.members) {
// const member = policyData.members.find((member) => member.memberId === memberId);
// if (member) {
// return member.limit;
// }
// }
// return null;
// };
const renderYearlyLimit = () => {
if (policyData) {
const { myLimit } = policyData.limit;
const { balance, total, percentage } = myLimit;
const progressValue = calculateProgressValue(balance, total);
// const renderYearlyLimit = () => {
// if (policyData) {
// const { myLimit } = policyData.limit;
// console.log('myLimit', myLimit);
// const { balance, total, percentage } = myLimit;
// const progressValue = calculateProgressValue(balance, total);
return (
<Stack spacing={1} sx={{ width: '206.5px' }}>
<Typography variant="subtitle2">Yearly Limit</Typography>
<BorderLinearProgress variant="determinate" value={progressValue} />
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
{balance.toLocaleString()} /{' '}
<Typography variant="body2" color="#757575" component="span">
{total.toLocaleString()}
</Typography>
</Typography>
</Stack>
);
}
return null;
};
return (
// return (
// <Stack spacing={1} sx={{ width: '206.5px' }}>
// <Typography variant="subtitle2">Yearly Limit</Typography>
// <BorderLinearProgress variant="determinate" value={progressValue} />
// <Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
// {balance.toLocaleString()} /{' '}
// <Typography variant="body2" color="#757575" component="span">
// {total.toLocaleString()}
// </Typography>
// </Typography>
// </Stack>
// );
// }
// return null;
// };
return (
<Card sx={{ padding: 2 }}>
<Stack>
<Stack direction="row" alignItems="center" spacing={1} justifyContent="space-between">
@@ -153,17 +156,17 @@ export default function CardPolicyNumber() {
</Stack>
<Stack spacing={1} sx={{ width: '206.5px' }}>
<Typography variant="subtitle2">Yearly Limit</Typography>
<BorderLinearProgress variant="determinate" value={100} />
<BorderLinearProgress variant="determinate" value={progressValue} />
<Typography variant="subtitle2" sx={{ fontWeight: 500 }}>
10.000.000 /{' '}
{limitMember?.current}/{' '}
<Typography variant="body2" color="#757575" component="span">
10.000.000
{limitMember?.total}
</Typography>
</Typography>
</Stack>
</Stack>
{/* Benefit Summary */}
<CardBenefitSummary />
<CardBenefitSummary data={benefitMember} />
</Stack>
</Card>
);

View File

@@ -1,8 +1,9 @@
import { format, getTime, formatDistanceToNow } from 'date-fns';
import { format,parseISO, getTime, setHours, setMinutes , formatDistanceToNow } from 'date-fns';
// ----------------------------------------------------------------------
export function fDate(date: Date | string | number) {
console.log(date);
return format(new Date(date), 'dd MMMM yyyy');
}
@@ -23,3 +24,16 @@ export function fToNow(date: Date | string | number) {
addSuffix: true
});
}
// export function fDateString(date) {
// const dateObj = parseISO(date);
// const formattedDate = format(dateObj, 'dd MMMM yyyy');
// return formattedDate;
// }
// export function fFormattedDateString(date : String) {
// console.log(date);
// const datePart = date.split(' ')[0]; // Memisahkan bagian tanggal
// const formattedDate = fDateString(datePart); // Menggunakan fungsi sebelumnya untuk memformat tanggal
// return formattedDate;
// }

View File

@@ -2,6 +2,6 @@ GENERATE_SOURCEMAP=false
PORT=8083
REACT_APP_HOST_API_URL="http://lms.test"
REACT_APP_HOST_API_URL="http://127.0.0.1:8000"
VITE_API_URL="http://lms.test/api/internal"
VITE_API_URL="http://127.0.0.1:8000/api/internal"

View File

@@ -1703,6 +1703,7 @@ packages:
cpu: [arm]
os: [android]
requiresBuild: true
dev: false
optional: true
/@esbuild/linux-loong64/0.15.18:
@@ -1711,6 +1712,7 @@ packages:
cpu: [loong64]
os: [linux]
requiresBuild: true
dev: false
optional: true
/@eslint/eslintrc/1.4.1:
@@ -3412,6 +3414,7 @@ packages:
cpu: [x64]
os: [android]
requiresBuild: true
dev: false
optional: true
/esbuild-android-arm64/0.15.18:
@@ -3420,6 +3423,7 @@ packages:
cpu: [arm64]
os: [android]
requiresBuild: true
dev: false
optional: true
/esbuild-darwin-64/0.15.18:
@@ -3428,6 +3432,7 @@ packages:
cpu: [x64]
os: [darwin]
requiresBuild: true
dev: false
optional: true
/esbuild-darwin-arm64/0.15.18:
@@ -3436,6 +3441,7 @@ packages:
cpu: [arm64]
os: [darwin]
requiresBuild: true
dev: false
optional: true
/esbuild-freebsd-64/0.15.18:
@@ -3444,6 +3450,7 @@ packages:
cpu: [x64]
os: [freebsd]
requiresBuild: true
dev: false
optional: true
/esbuild-freebsd-arm64/0.15.18:
@@ -3452,6 +3459,7 @@ packages:
cpu: [arm64]
os: [freebsd]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-32/0.15.18:
@@ -3460,6 +3468,7 @@ packages:
cpu: [ia32]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-64/0.15.18:
@@ -3468,6 +3477,7 @@ packages:
cpu: [x64]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-arm/0.15.18:
@@ -3476,6 +3486,7 @@ packages:
cpu: [arm]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-arm64/0.15.18:
@@ -3484,6 +3495,7 @@ packages:
cpu: [arm64]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-mips64le/0.15.18:
@@ -3492,6 +3504,7 @@ packages:
cpu: [mips64el]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-ppc64le/0.15.18:
@@ -3500,6 +3513,7 @@ packages:
cpu: [ppc64]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-riscv64/0.15.18:
@@ -3508,6 +3522,7 @@ packages:
cpu: [riscv64]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-linux-s390x/0.15.18:
@@ -3516,6 +3531,7 @@ packages:
cpu: [s390x]
os: [linux]
requiresBuild: true
dev: false
optional: true
/esbuild-netbsd-64/0.15.18:
@@ -3524,6 +3540,7 @@ packages:
cpu: [x64]
os: [netbsd]
requiresBuild: true
dev: false
optional: true
/esbuild-openbsd-64/0.15.18:
@@ -3532,6 +3549,7 @@ packages:
cpu: [x64]
os: [openbsd]
requiresBuild: true
dev: false
optional: true
/esbuild-sunos-64/0.15.18:
@@ -3540,6 +3558,7 @@ packages:
cpu: [x64]
os: [sunos]
requiresBuild: true
dev: false
optional: true
/esbuild-windows-32/0.15.18:
@@ -3548,6 +3567,7 @@ packages:
cpu: [ia32]
os: [win32]
requiresBuild: true
dev: false
optional: true
/esbuild-windows-64/0.15.18:
@@ -3556,6 +3576,7 @@ packages:
cpu: [x64]
os: [win32]
requiresBuild: true
dev: false
optional: true
/esbuild-windows-arm64/0.15.18:
@@ -3564,6 +3585,7 @@ packages:
cpu: [arm64]
os: [win32]
requiresBuild: true
dev: false
optional: true
/esbuild/0.15.18:
@@ -3594,6 +3616,7 @@ packages:
esbuild-windows-32: 0.15.18
esbuild-windows-64: 0.15.18
esbuild-windows-arm64: 0.15.18
dev: false
/escalade/3.1.1:
resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
@@ -4840,6 +4863,7 @@ packages:
resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==}
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
hasBin: true
dev: false
/natural-compare-lite/1.4.0:
resolution: {integrity: sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==}
@@ -5068,6 +5092,7 @@ packages:
nanoid: 3.3.4
picocolors: 1.0.0
source-map-js: 1.0.2
dev: false
/prelude-ls/1.2.1:
resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
@@ -5538,6 +5563,7 @@ packages:
/source-map-js/1.0.2:
resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
engines: {node: '>=0.10.0'}
dev: false
/source-map-support/0.5.21:
resolution: {integrity: sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==}
@@ -5974,6 +6000,7 @@ packages:
rollup: 2.79.1
optionalDependencies:
fsevents: 2.3.2
dev: false
/webidl-conversions/4.0.2:
resolution: {integrity: sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==}