[improvement] update quick member

Modules/Internal/Http/Controllers/Api/CorporateMemberController.php

@@ -141,11 +141,29 @@ class CorporateMemberController extends Controller
      * @param int $id
      * @return Renderable
      */
-    public function update(Request $request, $id)
+    public function update(Request $request)
     {
-        //
+        $member = Member::where('member_id', $request->member_id)->first();
+
+        if ($member) {
+            $member->update([
+                'birth_date' => $request->birth_date,
+                'gender' => $request->gender,
+            ]);
+
+            return response()->json([
+                'member' => $member,
+                'message' => 'Status by member id Updated Successfully'
+            ]);
+        } else {
+            return response()->json([
+                'member' => null,
+                'message' => 'Gagal update, member tidak ditemukan'
+            ]);
+        }
     }
 
+
     /**
      * Remove the specified resource from storage.
      * @param int $id

Modules/Internal/Routes/api.php

@@ -123,6 +123,7 @@ Route::prefix('internal')->group(function () {
         Route::get('corporates/{corporate_id}/members/list', [CorporateMemberController::class, 'generateMemberList']);
         Route::post('corporates/{corporate_id}/members/import', [CorporateMemberController::class, 'import']);
         Route::put('members/{member_id}/activation', [CorporateMemberController::class, 'activation']);
+        Route::post('members/update', [CorporateMemberController::class, 'update']);
 
 
         Route::get('corporates/{corporate_id}/diagnosis', [DiagnosisExclusionController::class, 'listDiagnosis']);

frontend/dashboard/src/pages/Corporates/Member/List.tsx

@@ -62,6 +62,8 @@ import CachedOutlinedIcon from '@mui/icons-material/CachedOutlined';
 import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
 import CloseIcon from '@mui/icons-material/Close';
 import Label from '../../../components/Label';
+import DialogEditMember from './sections/DialogEditMember';
+import { Edit } from '@mui/icons-material';
 
 export default function CorporatePlanList({handleSubmitSuccess}) {
   const navigate = useNavigate();
@@ -566,6 +568,10 @@ export default function CorporatePlanList({handleSubmitSuccess}) {
                   <CachedOutlinedIcon />
                   Update Status
                 </MenuItem>
+                <MenuItem onClick={() => handleEditMember(row)}>
+                  <Edit />
+                  Update Member
+                </MenuItem>
                 <MenuItem onClick={() => handleDownloadEcard(row.id)}>
                   <DownloadIcon />
                   Download E-card
@@ -747,6 +753,8 @@ export default function CorporatePlanList({handleSubmitSuccess}) {
   const [idUpdate, setIdUpdate] = useState('');
 
   const [openDialogStatus, setOpenDialogStatus] = useState(false);
+  const [member, setMember] = useState();
+  
 
   const handleCloseDialogUpdate = () => {
     setNameUpdate('');
@@ -790,6 +798,14 @@ export default function CorporatePlanList({handleSubmitSuccess}) {
     setIdUpdate(data.id);
     setOpenDialogStatus(true);    
   }
+
+  // Handle Update data member
+  const [openDialogEdit, setOpenDialogUpdate] = useState(false);
+  const handleEditMember = (member: any) => {
+      setOpenDialogUpdate(true)
+      setMember(member)
+  }
+
   return (
     <Stack>
       <ImportForm />
@@ -899,6 +915,15 @@ export default function CorporatePlanList({handleSubmitSuccess}) {
           title={{ name: 'Reason For Update' }}
         />
       )}
+
+      {/* Dialog for update birthdate member */}
+      <DialogEditMember
+        openDialog= {openDialogEdit}
+        setOpenDialog = {setOpenDialogUpdate}
+        member = {member}
+      >
+
+      </DialogEditMember>
     </Stack>
   );
 }

frontend/dashboard/src/pages/Corporates/Member/sections/DialogEditMember.tsx

@@ -0,0 +1,213 @@
+import MuiDialog from "@/components/MuiDialog";
+import { Button, Card, Checkbox, DialogActions, Grid, TextField, TextareaAutosize, Typography, Select } from "@mui/material";
+import { Paper } from "@mui/material";
+import { Stack } from '@mui/material';
+import React, { useEffect, useState } from 'react';
+import { fDateOnly, fDateTimesecond, toTitleCase } from "@/utils/formatTime";
+import axios from "@/utils/axios";
+import { enqueueSnackbar } from "notistack";
+import { useNavigate, useParams } from "react-router";
+import { RHFSelect, RHFTextField, RHFEditor } from "@/components/hook-form";
+import { Autocomplete } from "@mui/material";
+// import { RHFEditor } from "@/components/hook-form/v2";
+
+
+type DialogConfirmationType = {
+    openDialog: boolean;
+    setOpenDialog: any;
+    onSubmit?: void;
+    member: {
+        member_id:string,
+        birth_date:string,
+        gender:string,
+        reason:string
+    }; 
+}
+
+export default function DialogEditMember({member, setOpenDialog, openDialog, onSubmit} : DialogConfirmationType ) {
+    const navigate = useNavigate();
+    const { corporate_id } = useParams();
+
+    const [formData, setFormData] = useState({
+        member_id: member?.member_id,
+        gender: member?.gender,
+        birth_date: member?.birth_date,
+        reason: member?.reason,
+    });
+
+    const [isReasonSelected, setIsReasonSelected] = useState(true);
+    
+    useEffect(() => {
+        // Update formData setiap kali requestLog berubah
+        setFormData({
+            member_id: member?.member_id || '',
+            gender: member?.gender || '',
+            birth_date: member?.birth_date || '',
+            reason: member?.reason || '',
+
+        });
+      }, [member]);
+
+    const handleChange = (field, value) => {
+        setFormData((prevData) => ({
+            ...prevData,
+            [field]: value,
+        }));
+        if (field === 'reason') {
+            setIsReasonSelected(!!value);
+        }
+
+    };
+
+    const handleApprove = () => {
+        setFormData((prevData) => ({
+            ...prevData,
+        }));
+        handleSubmit();
+    };
+    
+
+    const handleSubmit = () => {
+        if (isReasonSelected && formData.reason !== '') {
+            axios
+                .post(`members/update`, formData)
+                .then((response) => {
+                    enqueueSnackbar('Update Member Success', { variant: 'success' });
+                    setOpenDialog(false);
+                    navigate(`/corporates/${corporate_id}/members`)
+                    window.location.reload()
+                })
+                .catch(({ response }) => {
+                    enqueueSnackbar(response.data.message ?? 'Something went wrong!', { variant: 'error' });
+                });
+        } else {
+            setIsReasonSelected(false);
+            alert('Silakan pilih alasan sebelum mengirimkan data.');
+        }
+    }
+
+    const style1 = {
+        color: '#919EAB',
+        width: '30%'
+    }
+    const style2 = {
+        width: '70%'
+    }
+    const marginBottom1 = {
+        marginBottom: 1,
+    }
+
+    const marginBottom2 = {
+        marginBottom: 2,
+    }
+
+    const resetForm = () => {
+        setFormData({
+            member_id: member?.member_id ?? '',
+            gender: member?.gender ?? '',
+            birth_date: member?.birth_date ?? '',
+            reason: member?.reason ?? '',
+            
+        });
+    };
+
+    const handleCloseDialog = () => {
+        setOpenDialog(false);
+        resetForm();
+    }
+
+    const handleNumericInput = (input: any) => {
+        const numericInput = input.replace(/\D/g, '');
+        return numericInput;
+    };
+
+    const reasons = [
+        { value: 'agreement', label: 'Agreement changed' },
+        { value: 'endorsement', label: 'Endorsement' },
+        { value: 'renewal', label: 'Renewal' },
+        { value: 'wrong_setting', label: 'Wrong Setting' },
+        // Add more options as needed
+    ];
+
+    const gender = [
+        { value: 'male', label: 'Male' },
+        { value: 'female', label: 'Female' },
+        { value: '-', label: 'Other' },
+        // Add more options as needed
+    ];
+
+    const getContent = () => (
+        <Stack spacing={1} marginTop={2}>
+            <Typography variant="subtitle2">Are you sure to update this member ?</Typography>
+            <Grid item xs={12} md={12} marginTop={4}>
+                    <Card sx={{padding:2, marginTop:2}}  >
+                        <Stack direction='row' spacing={2} sx={marginBottom2}>
+                            <Typography variant='subtitle2' sx={style1} gutterBottom>Birth Date</Typography>
+                            <TextField
+                                label="Brith Date"
+                                variant="outlined"
+                                fullWidth
+                                type="date"
+                                value={formData.birth_date ? fDateOnly(formData.birth_date) : ''}
+                                onChange={(e) => handleChange('birth_date', e.target.value)}
+                            />
+                        </Stack>
+                        <Stack direction='row' spacing={2} sx={marginBottom2}>
+                            <Typography variant='subtitle2' sx={style1} gutterBottom>Gender</Typography>
+                            <Autocomplete
+                                options={gender}
+                                getOptionLabel={(option) => option.label}
+                                fullWidth
+                                value={gender.find((r) => r.value === formData.gender) || null} // Use find to match the default value
+                                onChange={(e, newValue) => handleChange('gender', newValue?.value)}
+                                renderInput={(params) => (
+                                    <TextField
+                                        {...params}
+                                        label="Gender"
+                                        variant="outlined"
+
+                                    />
+                                )}
+                            />
+                        </Stack>
+                        <Stack direction='row' spacing={2} sx={marginBottom2}>
+                            <Typography variant='subtitle2' sx={style1} gutterBottom>Reason*</Typography>
+                            <Autocomplete
+                                options={reasons}
+                                getOptionLabel={(option) => option.label}
+                                fullWidth
+                                value={reasons.find((r) => r.value === formData.reason) || null} // Use find to match the default value
+                                onChange={(e, newValue) => handleChange('reason', newValue?.value)}
+                                renderInput={(params) => (
+                                    <TextField
+                                        {...params}
+                                        label="Reason"
+                                        variant="outlined"
+                                        required
+                                        error={!isReasonSelected} // Menandai input sebagai salah jika opsi tidak dipilih
+                                        helperText={!isReasonSelected ? 'Alasan harus dipilih' : ''}
+
+                                    />
+                                )}
+                            />
+                        </Stack>
+                    </Card>
+                </Grid>
+                <DialogActions>
+                    <Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialog}>Cancel</Button>
+                    <Button color="primary"  variant="contained" onClick={() => handleApprove()}>Update</Button>
+                </DialogActions>
+        </Stack>
+      );
+
+
+    return (
+        <MuiDialog
+          title={{name: "Update Information Member"}}
+          openDialog={openDialog}
+          setOpenDialog={setOpenDialog}
+          content={getContent()}
+          maxWidth="xl"
+        />
+      );
+}