Update Upload File Request Dashboard PrimeCenter

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

@@ -573,6 +573,10 @@ class ClaimRequestController extends Controller
         $results['timeline'] = $timeline;
         $request_files = DB::table('claim_request_files')
                         ->where('claim_request_files.claim_request_id', '=', $claimRequestId)
+                        ->select(
+                            'claim_request_files.*',
+                            DB::raw('(SELECT files.fileable_id FROM files WHERE files.fileable_id = claim_request_files.claim_request_id AND files.type = claim_request_files.type LIMIT 1) AS check_files'),
+                        )
                         ->get();
         $results['request_files'] = $request_files;
         $documents = DB::table('files')
@@ -682,4 +686,61 @@ class ClaimRequestController extends Controller
         // Menghasilkan kode dengan format yang diinginkan
         return self::$code_prefix . '-' . str_pad($next_number, 5, '0', STR_PAD_LEFT);
     }
+
+    public function requestFiles(Request $request, $claim_id)
+    {
+
+        if ($request->hasFile('fileDiagnosis')) {
+            foreach ($request->fileDiagnosis as $file) {
+                $pathFile = File::storeFile('claim-diagnosis', $claim_id, $file);
+                File::updateOrCreate([
+                    'fileable_type'=>'App\Models\ClaimRequest',
+                    'fileable_id' => $claim_id,
+                    'type' => 'claim-diagnosis',
+                    'name' => File::getFileName('claim-diagnosis', $claim_id, $file),
+                    'original_name' => $file->getClientOriginalName(),
+                    'extension' => $file->getClientOriginalExtension(),
+                    'path' => $pathFile,
+                    'created_by' => auth()->user()->id,
+                    'updated_by' => auth()->user()->id,
+                ]);
+            }
+        }
+
+        if ($request->hasFile('fileKondisis')) {
+            foreach ($request->fileKondisis as $file) {
+                $pathFile = File::storeFile('claim-kondisi', $claim_id, $file);
+                File::updateOrCreate([
+                    'fileable_type'=>'App\Models\ClaimRequest',
+                    'fileable_id' => $claim_id,
+                    'type' => 'claim-kondisi',
+                    'name' => File::getFileName('claim-kondisi', $claim_id, $file),
+                    'original_name' => $file->getClientOriginalName(),
+                    'extension' => $file->getClientOriginalExtension(),
+                    'path' => $pathFile,
+                    'created_by' => auth()->user()->id,
+                    'updated_by' => auth()->user()->id,
+                ]);
+            }
+        }
+
+        if ($request->hasFile('fileResults')) {
+            foreach ($request->fileResults as $file) {
+                $pathFile = File::storeFile('claim-result', $claim_id, $file);
+                File::updateOrCreate([
+                    'fileable_type'=>'App\Models\ClaimRequest',
+                    'fileable_id' => $claim_id,
+                    'type' => 'claim-result',
+                    'name' => File::getFileName('claim-result', $claim_id, $file),
+                    'original_name' => $file->getClientOriginalName(),
+                    'extension' => $file->getClientOriginalExtension(),
+                    'path' => $pathFile,
+                    'created_by' => auth()->user()->id,
+                    'updated_by' => auth()->user()->id,
+                ]);
+            }
+        }
+
+        return Helper::responseJson(data: $request->toArray(), message: 'Invoice Success Uploaded');
+    }
 }

Modules/Internal/Routes/api.php

@@ -260,6 +260,7 @@ Route::prefix('internal')->group(function () {
         Route::post('claim-requests/import', [ClaimRequestController::class, 'importClaim'])->name('claim-requests.importClaim');
         Route::get('claim-requests/detail/{id}', [ClaimRequestController::class, 'claimRequestDetail']);
         Route::post('claim-requests/{id}/invoice-files', [ClaimRequestController::class, 'invoiceFiles']);
+        Route::post('claim-requests/{id}/request-files', [ClaimRequestController::class, 'requestFiles']);
     });
 
     Route::get('province', [ProvinceController::class, 'index']);

frontend/dashboard/src/pages/ClaimRequests/Detail.tsx

@@ -40,6 +40,7 @@ export default function Detail() {
     const { themeStretch } = useSettings();
     const [data, setData] = useState();
     const [dataDialog, setDataDialog] = useState();
+    const [document, setDocument] = useState(null);
 
     const { id } = useParams();
 
@@ -49,6 +50,7 @@ export default function Detail() {
         .then((response) => {
             setData(response.data);
             setDataDialog(response.data.data.dialog_submits);
+            setDocument(response.data.data.documents);
 
         })
         .catch((error) => {
@@ -71,11 +73,9 @@ export default function Detail() {
 
     const handleInvoiceInputChange = (event) => {
         if (event.target.files[0]) {
-            console.log('ok');
+            setFileInvoices([...fileInvoices, ...event.target.files]);
-
-        setFileInvoices([...fileInvoices, ...event.target.files]);
         } else {
-        console.log('NO FILE');
+            console.log('NO FILE');
         }
     };
     const removeInvoiceFiles = (filesState, index) => {
@@ -130,6 +130,8 @@ export default function Detail() {
 
     };
 
+    const check_invoice = document?.find((dataInvoice) => dataInvoice.type === 'claim-invoice');
+
     return (
         <Page title='Detail'>
         <Container maxWidth={themeStretch ? false : 'xl'}>
@@ -156,14 +158,16 @@ export default function Detail() {
                         </Button>
                     </Stack>
                 </Grid>
-                <Grid item xs={12} md={12}>
+                {!check_invoice ? (
-                    <Stack direction="row" alignItems="center">
+                    <Grid item xs={12} md={12}>
-                        <Typography variant="subtitle1">Request Claim</Typography>
+                        <Stack direction="row" alignItems="center">
-                        <Button variant="outlined" color="primary" startIcon={ isInvoiceVisible ? < RemoveIcon/> : < AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => handleInvoice()}>
+                            <Typography variant="subtitle1">Request Claim</Typography>
-                            <Typography variant="button" display="block">Invoice</Typography>
+                            <Button variant="outlined" color="primary" startIcon={ isInvoiceVisible ? < RemoveIcon/> : < AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => handleInvoice()}>
-                        </Button>
+                                <Typography variant="button" display="block">Invoice</Typography>
-                    </Stack>
+                            </Button>
-                </Grid>
+                        </Stack>
+                    </Grid>
+                ) : ''}
                 <Grid item xs={12} md={12} sx={{display : isInvoiceVisible ? '' : 'none',}}>
                     <Card sx={{padding: 2}}>
                         <Stack direction="column" spacing={2}>

frontend/dashboard/src/pages/ClaimRequests/DetailTimeline.tsx

@@ -5,16 +5,21 @@ import TimelineSeparator from '@mui/lab/TimelineSeparator';
 import TimelineConnector from '@mui/lab/TimelineConnector';
 import TimelineContent from '@mui/lab/TimelineContent';
 import TimelineDot from '@mui/lab/TimelineDot';
-import {Typography, Card, Stack} from '@mui/material';
+import {Typography, Card, Stack, ButtonBase, Box, Divider} from '@mui/material';
 import { styled } from '@mui/material/styles';
 import Paper from '@mui/material/Paper';
 import Button from '@mui/material/Button';
 import AddIcon from '@mui/icons-material/Add';
 import Iconify from '../../components/Iconify';
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useRef } from 'react';
 import { format } from 'date-fns';
 import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
 import DescriptionIcon from '@mui/icons-material/Description';
+import { LoadingButton } from '@mui/lab';
+import axios from '../../utils/axios';
+import { makeFormData } from '@/utils/jsonToFormData';
+import { enqueueSnackbar } from 'notistack';
+import { useParams} from 'react-router-dom';
 
 const Item1 = styled(Paper)(({ theme }) => ({
   ...theme.typography.body2,
@@ -48,6 +53,71 @@ export default function NoOppositeContent({data}) {
     }
 
   }, [data]);
+
+  // Diagnosis
+  const fileRequestDocumentInputDiagnosis = useRef<HTMLInputElement>(null);
+  const [fileDiagnosis, setFileDiagnosis] = useState([]);
+  const handleRequestDocumentInputChangeDiagnosis = (event) => {
+    if (event.target.files[0]) {
+      setFileDiagnosis([...fileDiagnosis, ...event.target.files]);
+    }
+  };
+  const removeFileDiagnois = (filesState, index) => {
+    setFileDiagnosis(
+      filesState.filter((file, fileIndex) => {
+          return fileIndex != index;
+      })
+    );
+  };
+  // Kondisi
+  const fileRequestDocumentInputKondisi = useRef<HTMLInputElement>(null);
+  const [fileKondisi, setFileKondisi] = useState([]);
+  const handleRequestDocumentInputChangeKondisi = (event) => {
+    if (event.target.files[0]) {
+      setFileKondisi([...fileKondisi, ...event.target.files]);
+    }
+  };
+  const removeFileKondisi = (filesState, index) => {
+    setFileKondisi(
+      filesState.filter((file, fileIndex) => {
+          return fileIndex != index;
+      })
+    );
+  };
+  // Result
+  const fileRequestDocumentInputResult = useRef<HTMLInputElement>(null);
+  const [fileResult, setFileResult] = useState([]);
+  const handleRequestDocumentInputChangeResult = (event) => {
+    if (event.target.files[0]) {
+      setFileResult([...fileResult, ...event.target.files]);
+    }
+  };
+  const removeFileResult = (filesState, index) => {
+    setFileResult(
+      filesState.filter((file, fileIndex) => {
+          return fileIndex != index;
+      })
+    );
+  };
+  const { id } = useParams();
+  const [submitLoading, setSubmitLoading] = useState(false);
+  const submitRequestFiles = () => {
+    setSubmitLoading(true);
+    const formData = makeFormData({
+        fileDiagnosis: fileDiagnosis,
+        fileKondisis: fileKondisi,
+        fileResults: fileResult
+    });
+    axios
+    .post('claim-requests/'+id+'/request-files', formData)
+    .then((response) => {
+        window.location.reload();
+    })
+    .catch(({ response }) => {
+        enqueueSnackbar(response.data.message ?? 'Something Went Wrong', { variant: 'error' });
+    });
+  }
+  const submitButton = requestFile?.find((dataRequestFile) => dataRequestFile.check_files === null);
   return (
     <>
       {timeline?.map((dataTimeline, index) => (
@@ -79,24 +149,233 @@ export default function NoOppositeContent({data}) {
         				</Stack>
                 {dataTimeline.status === 'reviewed' && requestFile ? (
                   <>
-                  {requestFile?.map((dataRequestFile, index) => (
+                    {submitButton ? (
-          				<Stack spacing={2} sx={{marginBottom: 2}} key={index}>
+                      <Typography variant="body2" gutterBottom>Request Document</Typography>
-          					<Typography variant="body2" gutterBottom fontWeight="bold">{dataRequestFile.description}</Typography>
+                    ) : (
-          					<Button variant="outlined" color="primary" startIcon={< AddIcon/>}>
+                      <Typography sx={{color: '#19BBBB'}} variant="body2" gutterBottom>Request Document Success Uploaded</Typography>
-          				    	<Typography variant="button" display="block">
+                    )}
-                        {dataRequestFile.type === 'claim-diagnosis' ? 
+                    {/* Diagnosis */}
-                          'Diagnosis'
+                    {requestFile?.map((dataRequestFile, index) => {
-                        : dataRequestFile.type === 'claim-kondisi' ? 
+                      if(dataRequestFile.type !== 'claim-diagnosis' || dataRequestFile.check_files !== null){
-                          'Condition'
+                        return null;
-                        : dataRequestFile.type === 'claim-result' ?
+                      }
-                          'Supporting Result'
+                      return (
-                        : dataRequestFile.type === 'claim-invoice' ?
+                        <Stack spacing={2} sx={{marginBottom: 2}} key={index}>
-                          'Invoice'
+                          <Typography variant="body2" gutterBottom fontWeight="bold">
-                        : ''}
+                            Diagnosis
-                        </Typography>
+                          </Typography>
-          				    </Button>
+                          <Stack
-          				</Stack>
+                              divider={<Divider orientation="horizontal" flexItem />}
-                  ))}
+                              spacing={1}
+                              sx={{ marginY: 2 }}
+                          >
+                            {fileDiagnosis &&
+                            fileDiagnosis.map((file, index) => (
+                                <Stack direction="row" justifyContent={'space-between'} key={index}>
+                                    <Stack direction="row" spacing={1} sx={{color: '#19BBBB'}}>
+                                        <InsertDriveFileIcon />
+                                        <Typography variant="body2" gutterBottom>{file.name ? file.name : '-'}</Typography>
+                                    </Stack>
+                                    <Iconify
+                                        icon="eva:trash-2-outline"
+                                        color={'darkred'}
+                                        onClick={() => {
+                                          removeFileDiagnois(fileDiagnosis, index);
+                                        }}
+                                        sx={{cursor: 'pointer'}}
+                                    ></Iconify>
+                                </Stack>
+                            ))}
+                          </Stack>
+                          <ButtonBase
+                            sx={{
+                              p: 4,
+                              border: '2px dashed #F9FAFB',
+                              bgcolor: '#919EAB52',
+                              borderRadius: '8px',
+                              width: '100%',
+                              height: '60px',
+                            }}
+                            onClick={() => fileRequestDocumentInputDiagnosis.current?.click()}
+                          >
+                            <Box
+                              sx={{
+                                display: 'flex',
+                                placeItems: 'center',
+                                gap: 1,
+                                placeContent: 'center',
+                              }}
+                            >
+                              <Iconify icon="icon-park-outline:upload-one" fontSize="3em" />
+                              <Typography variant="body1" fontWeight="bold">
+                                Add Result
+                              </Typography>
+                            </Box>
+                            <input
+                              type="file"
+                              id={`file-${index}`}
+                              ref={fileRequestDocumentInputDiagnosis}
+                              style={{ display: 'none' }}
+                              multiple
+                              onChange={(event) => handleRequestDocumentInputChangeDiagnosis(event)}
+                              accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, text/plain, application/pdf"
+                            />
+                          </ButtonBase>
+                        </Stack>
+                      );
+                    })}
+                    {/* Kondisi */}
+                    {requestFile?.map((dataRequestFile, index) => {
+                      if(dataRequestFile.type !== 'claim-kondisi' || dataRequestFile.check_files !== null){
+                        return null;
+                      }
+                      return (
+                        <Stack spacing={2} sx={{marginBottom: 2}} key={index}>
+                          <Typography variant="body2" gutterBottom fontWeight="bold">
+                            Condition
+                          </Typography>
+                          <Stack
+                              divider={<Divider orientation="horizontal" flexItem />}
+                              spacing={1}
+                              sx={{ marginY: 2 }}
+                          >
+                            {fileKondisi &&
+                            fileKondisi.map((file, index) => (
+                                <Stack direction="row" justifyContent={'space-between'} key={index}>
+                                    <Stack direction="row" spacing={1} sx={{color: '#19BBBB'}}>
+                                        <InsertDriveFileIcon />
+                                        <Typography variant="body2" gutterBottom>{file.name ? file.name : '-'}</Typography>
+                                    </Stack>
+                                    <Iconify
+                                        icon="eva:trash-2-outline"
+                                        color={'darkred'}
+                                        onClick={() => {
+                                          removeFileKondisi(fileKondisi, index);
+                                        }}
+                                        sx={{cursor: 'pointer'}}
+                                    ></Iconify>
+                                </Stack>
+                            ))}
+                          </Stack>
+                          <ButtonBase
+                            sx={{
+                              p: 4,
+                              border: '2px dashed #F9FAFB',
+                              bgcolor: '#919EAB52',
+                              borderRadius: '8px',
+                              width: '100%',
+                              height: '60px',
+                            }}
+                            onClick={() => fileRequestDocumentInputKondisi.current?.click()}
+                          >
+                            <Box
+                              sx={{
+                                display: 'flex',
+                                placeItems: 'center',
+                                gap: 1,
+                                placeContent: 'center',
+                              }}
+                            >
+                              <Iconify icon="icon-park-outline:upload-one" fontSize="3em" />
+                              <Typography variant="body1" fontWeight="bold">
+                                Add Result
+                              </Typography>
+                            </Box>
+                            <input
+                              type="file"
+                              id={`file-${index}`}
+                              ref={fileRequestDocumentInputKondisi}
+                              style={{ display: 'none' }}
+                              multiple
+                              onChange={(event) => handleRequestDocumentInputChangeKondisi(event)}
+                              accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, text/plain, application/pdf"
+                            />
+                          </ButtonBase>
+                        </Stack>
+                      );
+                    })}
+                    {/* Supporting Result */}
+                    {requestFile?.map((dataRequestFile, index) => {
+                      if(dataRequestFile.type !== 'claim-result' || dataRequestFile.check_files !== null){
+                        return null;
+                      }
+                      return (
+                        <Stack spacing={2} sx={{marginBottom: 2}} key={index}>
+                          <Typography variant="body2" gutterBottom fontWeight="bold">
+                            Supporting Result
+                          </Typography>
+                          <Stack
+                              divider={<Divider orientation="horizontal" flexItem />}
+                              spacing={1}
+                              sx={{ marginY: 2 }}
+                          >
+                            {fileResult &&
+                            fileResult.map((file, index) => (
+                                <Stack direction="row" justifyContent={'space-between'} key={index}>
+                                    <Stack direction="row" spacing={1} sx={{color: '#19BBBB'}}>
+                                        <InsertDriveFileIcon />
+                                        <Typography variant="body2" gutterBottom>{file.name ? file.name : '-'}</Typography>
+                                    </Stack>
+                                    <Iconify
+                                        icon="eva:trash-2-outline"
+                                        color={'darkred'}
+                                        onClick={() => {
+                                          removeFileResult(fileResult, index);
+                                        }}
+                                        sx={{cursor: 'pointer'}}
+                                    ></Iconify>
+                                </Stack>
+                            ))}
+                          </Stack>
+                          <ButtonBase
+                            sx={{
+                              p: 4,
+                              border: '2px dashed #F9FAFB',
+                              bgcolor: '#919EAB52',
+                              borderRadius: '8px',
+                              width: '100%',
+                              height: '60px',
+                            }}
+                            onClick={() => fileRequestDocumentInputResult.current?.click()}
+                          >
+                            <Box
+                              sx={{
+                                display: 'flex',
+                                placeItems: 'center',
+                                gap: 1,
+                                placeContent: 'center',
+                              }}
+                            >
+                              <Iconify icon="icon-park-outline:upload-one" fontSize="3em" />
+                              <Typography variant="body1" fontWeight="bold">
+                                Add Result
+                              </Typography>
+                            </Box>
+                            <input
+                              type="file"
+                              id={`file-${index}`}
+                              ref={fileRequestDocumentInputResult}
+                              style={{ display: 'none' }}
+                              multiple
+                              onChange={(event) => handleRequestDocumentInputChangeResult(event)}
+                              accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, text/plain, application/pdf"
+                            />
+                          </ButtonBase>
+                        </Stack>
+                      );
+                    })}
+                    {submitButton ? (
+                      <LoadingButton
+                        variant="contained"
+                        sx={{ marginTop: 2, p: 2, backgroundColor: '#19BBBB' }}
+                        onClick={() => {
+                          submitRequestFiles();
+                        }}
+                        loading={submitLoading}
+                      >
+                        Submit
+                      </LoadingButton>
+                    ) : ''}
                   </>
                 ) : ''}
     			   </Stack>

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

@@ -77,7 +77,7 @@ export default function TableList2() {
 
   /* ------------------------------ handle order ------------------------------ */
   const [order, setOrder] = useState<Order>('desc');
-  const [orderBy, setOrderBy] = useState('member_id');
+  const [orderBy, setOrderBy] = useState('submission_date');
 
   const orders = {
     order: order,