update

2023-05-24 16:55:56 +07:00
parent fff9b7cb18
commit d999d86959
22 changed files with 979 additions and 139 deletions
--- a/frontend/client-portal/src/sections/alarm-center/user-profile/CardPersonalInformation.tsx
+++ b/frontend/client-portal/src/sections/alarm-center/user-profile/CardPersonalInformation.tsx
@@ -1,12 +1,86 @@
 // mui
-import { Button, IconButton, Card, Stack, Typography } from '@mui/material';
-import { Visibility as VisibilityIcon } from '@mui/icons-material';
+import { Button, IconButton, Card, Stack, Typography, TextField } from '@mui/material';
+import { CardMembership, Visibility as VisibilityIcon } from '@mui/icons-material';
 // components
 import Iconify from '../../../components/Iconify';
+import axios from '../../../utils/axios';
+import { useContext, useEffect, useState } from 'react';
+import { UserCurrentCorporateContext } from '../../../contexts/UserCurrentCorporate';
+import { useParams } from 'react-router-dom';
+import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
+import { enqueueSnackbar } from 'notistack';

-export default function CardPersonalInformation() {
+
+
+
+
+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 [updatedData, setUpdatedData] = useState(data); */
+
+  const handleEditData = () => {
+    setWeight(data?.last_weight_kg || '');
+    setHeight(data?.last_height_cm || '');
+    setEmail(data?.email || '');
+    setPhone(data?.phone||'');
+    setAddress(data?.main_address_id||'');
+    setEditedData(data);
+    setOpenDialog(true);
+  };
+  
+  
+
+  const handleCloseDialog = () => {
+    // Close the dialog
+    /* setOpenDialog(false); */
+    // Reset the edited data
+    setEditedData(null);
+    setOpenDialog(false);
+  };
+
+  const handleSaveData = () => {
+    const updatedData = {
+      ...editedData,
+      last_weight_kg: weight,
+      last_height_cm: height,
+      email: email,
+      phone: phone,
+      main_address_id: address,
+    };
+  
+    // Update the data in the database using the updatedData object
+    axios
+      .put('/data/' + id, updatedData)
+      .then((response) => {
+        // Handle the successful update
+        enqueueSnackbar('Data updated successfully', { variant: 'success' });
+        setOpenDialog(false);
+      })
+      .catch((error) => {
+        // Handle the error
+        enqueueSnackbar('Failed to update data', { variant: 'error' });
+      });
+  };
+  
+  
+  
+
+  
+  
  return (
    <Card sx={{ borderRadius: '6px', paddingY: 2 }}>
+
+    
+
      {/* Stack 1 */}
      <Stack
        direction="row"
@@ -15,7 +89,7 @@ export default function CardPersonalInformation() {
        sx={{ paddingY: 1, paddingX: 3 }}
      >
        <Typography variant="subtitle2">Informasi Pribadi</Typography>
-        <Button startIcon={<Iconify icon="heroicons:pencil-solid" />}>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}>
@@ -45,15 +119,15 @@ export default function CardPersonalInformation() {
        <Stack direction="row" paddingY={1} spacing={2} sx={{ flex: '100%' }}>
          <Stack sx={{ width: '60%' }}>
            <Typography variant="caption">Nama Lengkap</Typography>
-            <Typography variant="body2">Jessica Lie</Typography>
+            <Typography variant="body2"> {data ?. name} </Typography>
          </Stack>
          <Stack sx={{ width: '20%' }}>
-            <Typography variant="caption">Berat Badan</Typography>
-            <Typography variant="body2">40 kg</Typography>
+            <Typography variant="caption">Berat Badan </Typography>
+            <Typography variant="body2">{data ?. last_weight_kg} kg</Typography>
          </Stack>
          <Stack sx={{ width: '20%' }}>
-            <Typography variant="caption">Tinggi Badan</Typography>
-            <Typography variant="body2">165 cm</Typography>
+            <Typography variant="caption">Tinggi Badan </Typography>
+            <Typography variant="body2">{data ?. last_height_cm} cm</Typography>
          </Stack>
        </Stack>
      </Stack>
@@ -65,15 +139,15 @@ export default function CardPersonalInformation() {
          <Stack direction="row" spacing={2} sx={{ flex: '100%' }}>
            <Stack sx={{ width: '100%' }}>
              <Typography variant="caption">Tempat Lahir</Typography>
-              <Typography variant="body2">Jakarta</Typography>
+              <Typography variant="body2"> {data ?. birth_place} </Typography>
            </Stack>
            <Stack sx={{ width: '100%' }}>
              <Typography variant="caption">Tanggal Lahir</Typography>
-              <Typography variant="body2">15-05-1996</Typography>
+              <Typography variant="body2">{data ?. birth_date}</Typography>
            </Stack>
            <Stack sx={{ width: '100%' }}>
              <Typography variant="caption">Jenis Kelamin</Typography>
-              <Typography variant="body2">Perempuan</Typography>
+              <Typography variant="body2">{data ?. gender}</Typography>
            </Stack>
          </Stack>
        </Stack>
@@ -83,18 +157,17 @@ export default function CardPersonalInformation() {
          <Stack direction="row" spacing={2} sx={{ flex: '100%' }}>
            <Stack sx={{ width: '100%' }}>
              <Typography variant="caption">Nomor Telpon</Typography>
-              <Typography variant="body2">081256788765</Typography>
+              <Typography variant="body2">{data ?. phone}</Typography>
            </Stack>
            <Stack sx={{ width: '100%' }}>
              <Typography variant="caption">Email</Typography>
-              <Typography variant="body2">Jessica.lie@gmail.com</Typography>
+              <Typography variant="body2">{data?. email}</Typography>
            </Stack>
          </Stack>
          <Stack>
            <Typography variant="caption">Alamat</Typography>
            <Typography variant="body2">
-              Jl. Kalimantan No.6, Rw. Mekar Jaya, Kec. Serpong, Kota Tangerang Selatan, Banten
-              15310
+            {data ?. main_address_id}
            </Typography>
          </Stack>
        </Stack>
@@ -110,7 +183,7 @@ export default function CardPersonalInformation() {
          >
            <Stack>
              <Typography variant="caption">Nomor NIK</Typography>
-              <Typography variant="body2">081256788765</Typography>
+              <Typography variant="body2">{data ?. nik}</Typography>
            </Stack>
            <Stack>
              <Button variant="contained" startIcon={<VisibilityIcon />}>
@@ -125,23 +198,84 @@ export default function CardPersonalInformation() {
          <Stack direction="row" justifyContent="space-between" spacing={2} sx={{ flex: '100%' }}>
            <Stack>
              <Typography variant="caption">Agama</Typography>
-              <Typography variant="body2">Kristen</Typography>
+              <Typography variant="body2">{data ?. religion}</Typography>
            </Stack>
            <Stack>
              <Typography variant="caption">Status</Typography>
-              <Typography variant="body2">Menikah</Typography>
+              <Typography variant="body2">{data ?. marital_status}</Typography>
            </Stack>
            <Stack>
              <Typography variant="caption">Pendidikan</Typography>
-              <Typography variant="body2">S1</Typography>
+              <Typography variant="body2">{data ?. last_education}</Typography>
            </Stack>
            <Stack>
              <Typography variant="caption">Pekerjaan</Typography>
-              <Typography variant="body2">Ibu Rumah Tangga</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
+              label="Address"
+              value={address}
+              onChange={(e) => setAddress(e.target.value)}
+              fullWidth
+              sx={{ marginTop: '16px' }}
+            />
+
+
+          {/* Add more fields as needed */}
+        </Stack>
+      </DialogContent>
+
+      <DialogActions>
+        <Button onClick={handleCloseDialog}>Cancel</Button>
+        <Button onClick={handleSaveData} variant="contained" color="primary">
+          Save
+        </Button>
+      </DialogActions>
+    </Dialog>
    </Card>
  );
 }
--- a/frontend/client-portal/src/sections/claim-report/CardClaimStatus.tsx
+++ b/frontend/client-portal/src/sections/claim-report/CardClaimStatus.tsx
@@ -28,10 +28,10 @@ const RootStyle = styled(Card)(({ theme }) => ({
 // ----------------------------------------------------------------------

 const defaultData = [
-  { name: 'Requested', value: 0, color: palette.dark.primary.dark },
-  { name: 'Approval', value: 0, color: palette.dark.warning.dark },
+  { name: 'Requested', value: 5, color: palette.dark.primary.dark },
+  { name: 'Approval', value: 1, color: palette.dark.warning.dark },
  { name: 'Disbrusment', value: 0, color: palette.dark.success.dark },
-  { name: 'Rejected', value: 0, color: palette.dark.error.dark },
+  { name: 'Rejected', value: 3, color: palette.dark.error.dark },
 ];

 // ----------------------------------------------------------------------
--- a/frontend/client-portal/src/sections/dashboard/DialogTopUpLimit.tsx
+++ b/frontend/client-portal/src/sections/dashboard/DialogTopUpLimit.tsx
@@ -13,14 +13,17 @@ import Checkbox from '@mui/material/Checkbox';
 import MuiDialog from '../../components/MuiDialog';
 import { FormProvider, RHFTextField } from '../../components/hook-form';
 // React
-import { ReactElement, useEffect, useState } from 'react';
+import { useContext, ReactElement, useEffect, useState } from 'react';
 import { fCurrency } from '../../utils/formatNumber';
+import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate';
+
 // yup
 import * as Yup from 'yup';
 // form
 import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import axios from '../../utils/axios';
+import { enqueueSnackbar } from 'notistack';

 /* ---------------------------------- types --------------------------------- */
 type MuiDialogProps = {
@@ -76,6 +79,8 @@ export default function DialogTopUpLimit({
  const [isDisabledInput, setIsDisabledInput] = useState(false);
  const [isDisabledButton, setIsDisabledButton] = useState(true);
  const [isCheckboxChecked, setIsCheckboxChecked] = useState(false);
+  const [ message, setMessage ] = useState ('');
+  const { corporateValue } = useContext(UserCurrentCorporateContext);

  const TopUpSchema = Yup.object().shape({
    topup: Yup.number().max(
@@ -112,15 +117,32 @@ export default function DialogTopUpLimit({
  }, [openDialog, reset]);

  const onSubmit = async (data: FormValuesProps) => {
+    
+    
    await new Promise((resolve) => setTimeout(resolve, 500));

    setIsDisabledInput(false);
    setIsDisabledButton(true);
    setIsCheckboxChecked(false);

-    // await axios.post('');
-
-    reset();
+    try {
+      // Send the HTTP POST request to the backend
+      await axios.post(corporateValue + '/topup', {
+        topup: data.topup,
+      });
+  
+      // Show a success notification
+      enqueueSnackbar('The request has been sent', { variant: 'success' });
+      setOpenDialog(false);
+  
+      reset();
+    } catch (error) {
+      // Show an error notification
+      enqueueSnackbar('An error occurred', { variant: 'error' });
+      setOpenDialog(false);
+    }
+    
+    
  };

  const onCheckHandler = (value: string) => {
@@ -128,7 +150,7 @@ export default function DialogTopUpLimit({
    value === '0' || value === '' ? setIsDisabledButton(true) : setIsDisabledButton(false);
    setIsCheckboxChecked(!isCheckboxChecked);
    // @ts-ignore
-    setValue('topup', data.maxTopUp);
+    setValue('topup', data.maxTopUp.toString());
  };

  const onTopupHandler = (value: string) => {