Update

frontend/hospital-portal/src/sections/dashboard/DialogFinalLog.tsx

@@ -2,13 +2,13 @@ import { styled } from '@mui/material/styles';
 import Iconify from '@/components/Iconify';
 import { fCurrency } from '@/utils/formatNumber';
 import { LoadingButton } from '@mui/lab';
-import { Avatar, Button, Divider, LinearProgress, linearProgressClasses, ButtonBase, Box } from '@mui/material';
+import { Avatar, Button, Divider, LinearProgress, linearProgressClasses, ButtonBase, Box, Autocomplete, FormHelperText } from '@mui/material';
 import { Card } from '@mui/material';
 import { Stack, Typography } from '@mui/material';
 import { fPostFormat } from '@/utils/formatTime';
 import axios from '@/utils/axios';
 import { enqueueSnackbar } from 'notistack';
-import { useRef, useState, useContext } from 'react';
+import { useRef, useState, useContext, useEffect } from 'react';
 import { makeFormData } from '@/utils/jsonToFormData';
 import { format } from 'date-fns';
 import { LanguageContext } from '@/contexts/LanguageContext';
@@ -17,10 +17,10 @@ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import TextField from '@mui/material/TextField';
 
 export default function DialogFinalLog({ member, getData, onClose, handleSubmitSuccess }: any) {
-    const { localeData }: any =  useContext(LanguageContext);
-    //Submission date
-    const [dischargeDate, setDischargeDate] = useState<string>(format(new Date(), "yyyy MMM d HH:mm:ss"));
-
+  const { localeData }: any =  useContext(LanguageContext);
+  //Submission date
+  const [dischargeDate, setDischargeDate] = useState<string>(format(new Date(), "yyyy MMM d HH:mm:ss"));
+  const [serviceCode, setServiceCode] = useState<string>('');
   // ----------------------------------------------------------------------
   // Files Diagnosa
 
@@ -101,6 +101,7 @@ export default function DialogFinalLog({ member, getData, onClose, handleSubmitS
       diagnosa_files: fileDiagnosas,
       kondisi_files: fileKondisis,
       discharge_date: fPostFormat(dischargeDate, 'yyyy-MM-dd HH:mm:ss'),
+      service_code: serviceCode,
     });
     axios
       .post('/request-final-log', formData)
@@ -117,6 +118,22 @@ export default function DialogFinalLog({ member, getData, onClose, handleSubmitS
       });
   }
 
+    const [serviceOptions, setServiceOptions] = useState([
+        { value: '-', label: '-' }
+    ]);
+
+    useEffect(() => {
+      axios.get('service-member/'+member.member_id)
+        .then((response) => {
+          setServiceOptions(response.data);
+      }).catch((error) => {
+        console.error('Error fetching ICD options:', error);
+      });
+      
+    }, []);
+
+    console.log(serviceOptions, member, 'test')
+
   return (
     <Stack>
       <Stack direction="row" justifyContent={'end'} sx={{ marginBottom: 2, marginTop: 2 }} spacing={2}>
@@ -324,23 +341,44 @@ export default function DialogFinalLog({ member, getData, onClose, handleSubmitS
         </Stack>
       </Stack>
 
-      <Stack direction="row" spacing={2}>
-            <Stack spacing={2} sx={{ width: '100%' }}>
-                <Typography variant='subtitle1'>{localeData.txtDischargeDate} *</Typography>
-                <LocalizationProvider dateAdapter={AdapterDateFns}>
-                    <DatePicker
-                        label={localeData.txtDischargeDate}
-                        value={dischargeDate}
-                        onChange={(newValue:any) => {
-                          setDischargeDate(  (newValue));
-                        }}
-                        inputFormat="dd-MM-yyyy HH:mm"
-                        renderInput={(params) => <TextField sx={{width:'40%'}} {...params} required/>}
-                    />
-                </LocalizationProvider>
-            </Stack>
+      <Stack direction="row" spacing={2} sx={{ width: '100%' }}>
+        {/* Kolom Tanggal Discharge */}
+        <Stack spacing={2} sx={{ flex: 1 }}>
+          <Typography variant="subtitle1">{localeData.txtDischargeDate} *</Typography>
+          <LocalizationProvider dateAdapter={AdapterDateFns}>
+            <DatePicker
+              label={localeData.txtDischargeDate}
+              value={dischargeDate}
+              onChange={(newValue: any) => {
+                setDischargeDate(newValue);
+              }}
+              inputFormat="dd-MM-yyyy HH:mm"
+              renderInput={(params) => <TextField {...params} fullWidth required />}
+            />
+          </LocalizationProvider>
         </Stack>
 
+        {/* Kolom Service Type */}
+        <Stack spacing={2} sx={{ flex: 1 }}>
+          <Typography variant="subtitle1">{localeData.txtDialogMember1} *</Typography>
+          <Autocomplete
+            id="service_type"
+            options={serviceOptions}
+            getOptionLabel={(option) => option.label || ""}
+            value={serviceOptions.find((opt) => opt.value == member.service_code) || null}
+            onChange={(event, newValue) => {
+              setServiceCode(newValue?.value || "");
+            }}
+            renderInput={(params) => (
+              <TextField {...params} label={localeData.txtDialogMember1} fullWidth />
+            )}
+          />
+          <FormHelperText style={{ color: "red" }}></FormHelperText>
+        </Stack>
+      </Stack>
+
+      
+
       <LoadingButton
         variant="contained"
         sx={{ marginTop: 2, p: 2, backgroundColor: '#19BBBB' }}

frontend/hospital-portal/src/sections/dashboard/FormRequestLog.tsx

@@ -206,20 +206,20 @@ export default function FormRequestClaim({ member, handleSubmitSuccess }: FormRe
             <Stack spacing={2} sx={{ width: '100%' }}>
                 <Typography variant='subtitle1'>{localeData.txtDialogMember1} *</Typography>
                 <Autocomplete
-                id="service_type"
-                options={member?.services || []}
-                getOptionLabel={(option: MemberService) => option.name || ''}
-                value={member?.services.find((item: MemberService) => item.service_code === serviceCode) || null}
-                onChange={(event: React.ChangeEvent<{}>, newValue: MemberService | null) => {
-                    setServiceCode(newValue?.service_code || '');
-                }}
-                renderInput={(params) => (
-                    <TextField
-                    {...params}
-                    label={localeData.txtDialogMember1}
-                    fullWidth
-                    />
-                )}
+                    id="service_type"
+                    options={member?.services || []}
+                    getOptionLabel={(option: MemberService) => option.name || ''}
+                    value={member?.services.find((item: MemberService) => item.service_code === serviceCode) || null}
+                    onChange={(event: React.ChangeEvent<{}>, newValue: MemberService | null) => {
+                        setServiceCode(newValue?.service_code || '');
+                    }}
+                    renderInput={(params) => (
+                        <TextField
+                        {...params}
+                        label={localeData.txtDialogMember1}
+                        fullWidth
+                        />
+                    )}
                 />
                 <FormHelperText style={{ color: 'red' }}></FormHelperText>
             </Stack>

frontend/hospital-portal/src/sections/dashboard/TableListReqLog.tsx

@@ -348,14 +348,23 @@ export default function TableList() {
 
   
 
-  function handleRequestFinalLog(id:any, full_name:any, no_polis:any, submission_date:any)
+  function handleRequestFinalLog(
+    id:any, 
+    full_name:any, 
+    no_polis:any, 
+    submission_date:any, 
+    service_code:any,
+    member_id:any,
+  )
   {
     setOpenDialogFinalLog(true);
     const datas_view = {
       'id' : id,
       'full_name' : full_name,
       'no_polis' : no_polis,
-      'submission_date' : submission_date
+      'submission_date' : submission_date,
+      'service_code' : service_code,
+      'member_id' : member_id,
     };
     setDataViewFinalDialog(datas_view);
   }
@@ -427,7 +436,7 @@ export default function TableList() {
                     </MenuItem>
                     ):''} 
                     {obj.final_log === 0 && obj.status === 'approved' ? (
-                    <MenuItem onClick={() => handleRequestFinalLog(obj.id, obj.full_name, obj.no_polis, obj.submission_date) }>
+                    <MenuItem onClick={() => handleRequestFinalLog(obj.id, obj.full_name, obj.no_polis, obj.submission_date, obj.service_code, obj.member_id) }>
                       <Iconify icon="fa:file-text" />
                       Request Final LOG
                     </MenuItem>