[WIP] A

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

@@ -36,12 +36,12 @@ import { LoadingButton } from '@mui/lab';
 import { enqueueSnackbar } from 'notistack';
 import { Divider } from '@mui/material';
 import Iconify from '@/components/Iconify';
+import DialogDetailClaim from '@/components/dialogs/DialogDetailClaim';
 // import LoadingButton from '@/theme/overrides/LoadingButton';
 
 export default function List() {
   const [searchParams, setSearchParams] = useSearchParams();
   const [importResult, setImportResult] = useState(null);
-  const navigate = useNavigate();
 
   function SearchInput(props: any) {
     // SEARCH
@@ -184,6 +184,16 @@ export default function List() {
           <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>
+          <TableCell>
+            
+          <IconButton
+                          onClick={() => {
+                            handleShowClaim(row);
+                          }}
+                        >
+                          <Iconify icon="eva:eye-fill" />
+                        </IconButton>
+          </TableCell>
         </TableRow>
         {/* COLLAPSIBLE ROW */}
         <TableRow>
@@ -278,6 +288,33 @@ export default function List() {
     );
   }
 
+
+
+  // ---------------------------------------------------------
+  // Dialog Detail Claim Request
+  const [openDialogDetailClaim, setOpenDialogDetailClaim] = useState(false);
+  const [loadingClaimDetail, setLoadingClaimDetail] = useState(true);
+  const [currentClaim, setCurrentClaim] = useState(null);
+
+  function handleShowClaim(claimRequest) {
+    setLoadingClaimDetail(true);
+    setOpenDialogDetailClaim(true);
+
+    axios.get(`/claim-requests/${claimRequest.id}`)
+      .then(({data}) => {
+        setCurrentClaim(data.data);
+        setLoadingClaimDetail(false);
+      })
+      .catch((err) => {
+        enqueueSnackbar(err.message, {variant: 'error'})
+      })
+  }
+
+  function handleDownloadLog() {
+    
+  }
+
+
   return (
     <Card>
       <ImportForm />
@@ -289,6 +326,14 @@ export default function List() {
         handlePageChange={handlePageChange}
         TableContent={<TableContent />}
       />
+
+      
+      <DialogDetailClaim
+        openDialog={openDialogDetailClaim}
+        setOpenDialog={setOpenDialogDetailClaim}
+        title={{ name: 'Claim Request Detail' }}
+        data={{ claim: currentClaim, isLoading: loadingClaimDetail, handleDownloadLog }}
+      ></DialogDetailClaim>
     </Card>
   );
 }