Display Uploaded Files

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

@@ -34,6 +34,8 @@ import { fCurrency } from '../../utils/formatNumber';
 import EditRoundedIcon from '@mui/icons-material/EditRounded';
 import { LoadingButton } from '@mui/lab';
 import { enqueueSnackbar } from 'notistack';
+import { Divider } from '@mui/material';
+import Iconify from '@/components/Iconify';
 // import LoadingButton from '@/theme/overrides/LoadingButton';
 
 export default function List() {
@@ -179,6 +181,7 @@ export default function List() {
           <TableCell align="left">{row.code}</TableCell>
           <TableCell align="left">{row.member?.full_name}</TableCell>
           <TableCell align="left">{row.submission_date}</TableCell>
+          <TableCell align="left">{row.service_type}</TableCell>
           <TableCell align="right"><Chip label={row.status}/></TableCell>
           <TableCell align="right">{ row.status == 'requested' && (<LoadingButton loading={loadingApprove} variant="outlined" onClick={() => {handleApprove(row)}}>Approve</LoadingButton> )}</TableCell>
         </TableRow>
@@ -187,9 +190,25 @@ export default function List() {
           <TableCell style={{ paddingBottom: 0, paddingTop: 0 }} colSpan={99}>
             <Collapse in={open} timeout="auto" unmountOnExit>
               <Box sx={{ borderBottom: 1 }}>
-                <Typography variant="body2" gutterBottom component="div">
-                  Description : {row.description}
-                </Typography>
+              <Stack
+                divider={<Divider orientation="horizontal" flexItem />}
+                spacing={1}
+                sx={{ marginY: 2 }}
+              >
+                <Box>
+                  <Typography fontWeight={600}>Berkas Hasil Penunjang</Typography>
+                  {row.files_by_type?.result &&
+                    row.files_by_type?.result.map((file, index) => (
+                      <Stack direction="row" key={index}>
+                        <Typography sx={{marginRight: 2}}>-</Typography> <a href={file.url} target="_blank">{file.name}</a>
+                      </Stack>
+                    ))}
+                  
+                  { !row.files_by_type?.result && (
+                    <Typography>Tidak ada berkas</Typography>
+                  )}
+                  </Box>
+              </Stack>
               </Box>
             </Collapse>
           </TableCell>
@@ -217,6 +236,9 @@ export default function List() {
             <TableCell style={headStyle} align="left">
               Submission Date
             </TableCell>
+            <TableCell style={headStyle} align="left">
+              Jenis Layanan
+            </TableCell>
             <TableCell style={headStyle} align="left">
               Status
             </TableCell>

frontend/hospital-portal/pnpm-lock.yaml

@@ -48,7 +48,6 @@ specifiers:
   framer-motion: ^6.5.1
   highlight.js: ^11.7.0
   history: ^5.3.0
-  json2formdata: ^1.0.4
   jsx-runtime: ^1.2.0
   lodash: ^4.17.21
   notistack: 3.0.0-alpha.11
@@ -100,7 +99,6 @@ dependencies:
   framer-motion: 6.5.1_sfoxds7t5ydpegc3knd667wn6m
   highlight.js: 11.7.0
   history: 5.3.0
-  json2formdata: 1.0.4
   jsx-runtime: 1.2.0
   lodash: 4.17.21
   notistack: 3.0.0-alpha.11_pwge5r66yg44rq5pj4ruhckhdm
@@ -4653,10 +4651,6 @@ packages:
     resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
     dev: true
 
-  /json2formdata/1.0.4:
-    resolution: {integrity: sha512-caobS2W+raW3Fg3mt2ANGTPryLOUANxukjdfwkWKHY2pam9G1Ns3tifnaVzctMaqKevxhf7NIycFnTEXWYggdg==}
-    dev: false
-
   /json5/1.0.2:
     resolution: {integrity: sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==}
     hasBin: true

frontend/hospital-portal/src/pages/Dashboard.tsx

@@ -68,7 +68,7 @@ export default function Dashboard() {
       <Container maxWidth={themeStretch ? false : 'xl'}>
         <Grid container spacing={2}>
           <Grid item xs={12} lg={6} md={6}>
-            <CardSearchMember></CardSearchMember>
+            <CardSearchMember handleSubmitSuccess={() => {console.log('submit success')}}></CardSearchMember>
           </Grid>
           <Grid item xs={12} lg={6} md={6}>
             <CardNotification data={itemList} />

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

@@ -45,7 +45,7 @@ const ItemNotificationStyle = styled(Card)(({ theme }) => ({
 
 // ----------------------------------------------------------------------
 
-export default function CardSearchMember() {
+export default function CardSearchMember(handleSubmitSuccess) {
   const {enqueueSnackbar} = useSnackbar();
 
   const [noPolis, setNoPolis] = useState('AW001-01');
@@ -145,7 +145,7 @@ export default function CardSearchMember() {
           title={{name: "Member"}}
           openDialog={openDialogBenefit}
           setOpenDialog={setOpenDialogBenefit}
-          content={DialogMember(currentMember, () => {setOpenDialogBenefit(false)})}
+          content={DialogMember(currentMember, () => {setOpenDialogBenefit(false); handleSubmitSuccess()})}
           maxWidth="md"
         />
     </div>

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

@@ -11,7 +11,7 @@ import { Avatar } from '@mui/material';
 import Iconify from '@/components/Iconify';
 import FormRequestClaim from './FormRequestClaim';
 
-export default function DialogMember(member, closeDialog) {
+export default function DialogMember(member, handleSubmitSuccess) {
     const [currentTab, setCurrentTab] = useState('request')
         
     // ----------------------------------------------------------------------
@@ -92,7 +92,7 @@ export default function DialogMember(member, closeDialog) {
 
                 
                 <TabPanel value={currentTab} index={'request'}>
-                    <FormRequestClaim member={member} handleSubmitSuccess={closeDialog} />
+                    <FormRequestClaim member={member} handleSubmitSuccess={handleSubmitSuccess} />
                 </TabPanel>
             </Box>
         </div>

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

@@ -60,7 +60,7 @@ export default function FormRequestClaim({ member, handleSubmitSuccess }) {
       .post('/claim-requests', formData)
       .then((response) => {
         enqueueSnackbar(response.data.message ?? 'Berhasil membuat data', { variant: 'success' });
-        // handleSubmitSuccess();
+        handleSubmitSuccess();
       })
       .catch(({ response }) => {
         enqueueSnackbar(response.data.message ?? 'Something Went Wrong', { variant: 'error' });
@@ -120,15 +120,15 @@ export default function FormRequestClaim({ member, handleSubmitSuccess }) {
           spacing={1}
           sx={{ marginY: 2 }}
         >
-          {filesResult &&
-            filesResult.map((file, index) => (
+          {fileHasilPenunjangs &&
+            fileHasilPenunjangs.map((file, index) => (
               <Stack direction="row" justifyContent={'space-between'} key={index}>
                 <Typography>{file.name}</Typography>
                 <Iconify
                   icon="eva:trash-2-outline"
                   color={'darkred'}
                   onClick={() => {
-                    removeFiles(filesResult, index);
+                    removeFiles(fileHasilPenunjangs, index);
                   }}
                 ></Iconify>
               </Stack>

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

@@ -357,8 +357,8 @@ export default function TableList(props: any) {
                         sx={{ width: '100%' }}
                       >
                         {statusOptions &&
-                          statusOptions.map((option) => (
-                            <MenuItem value={option} sx={{ textTransform: 'capitalize' }}>
+                          statusOptions.map((option, index) => (
+                            <MenuItem value={option} sx={{ textTransform: 'capitalize' }} key={index}>
                               {option}
                             </MenuItem>
                           ))}