file button -> grid

src/pages/pnspsUserDetailPage_Individual/UserInformationCard_Individual.js

@@ -16,7 +16,7 @@ import * as ComboData from "../../utils/ComboData";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
 
-const UserInformationCard_Individual = ({formData,userFile, loadDataFun}) => {
+const UserInformationCard_Individual = ({formData, loadDataFun}) => {
 
     const [currentUserData, setCurrentUserData] = useState(formData);
     const [editMode, setEditMode] = useState(false);
@@ -116,14 +116,6 @@ const UserInformationCard_Individual = ({formData,userFile, loadDataFun}) => {
         }); 
     };
 
-    const downloadFile = ()=>{
-        HttpUtils.fileDownload({
-            fileId: userFile.fileId,
-            skey: userFile.skey,
-            filename: userFile.filename
-        });
-    };
-
     return (
             <MainCard elevation={0}
                       border={false}
@@ -328,7 +320,7 @@ const UserInformationCard_Individual = ({formData,userFile, loadDataFun}) => {
                                     ID No.:
                                 </Grid>
 
-                                <Grid item lg={4}>
+                                <Grid item lg={6}>
                                     <Grid container>
                                         {formik.values.idDocType =="HKID"?
                                         <>
@@ -367,7 +359,6 @@ const UserInformationCard_Individual = ({formData,userFile, loadDataFun}) => {
                                         }
                                     </Grid>
                                 </Grid>
-                                <Button lg={2} variant="contained" onClick={downloadFile} >View File</Button>
                             </Grid>
                         </Grid>
 

src/pages/pnspsUserDetailPage_Individual/index.js

@@ -1,17 +1,17 @@
 // material-ui
-import {Grid, Typography} from '@mui/material';
-import {useEffect, useState} from "react";
 import * as React from "react";
-//import axios from "axios";
+
+import {Grid, Typography} from '@mui/material';
+import FileList from "../../components/FileList"
+import MainCard from "../../components/MainCard";
 import * as HttpUtils from "../../utils/HttpUtils";
 import {useParams} from "react-router-dom";
 import * as UrlUtils from "../../utils/ApiPathConst";
 import * as DateUtils from '../../utils/DateUtils';
 
 import Loadable from 'components/Loadable';
-import { lazy } from 'react';
-const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
-const UserInformationCard = Loadable(lazy(() => import('./UserInformationCard_Individual')));
+const LoadingComponent = Loadable(React.lazy(() => import('../extra-pages/LoadingComponent')));
+const UserInformationCard = Loadable(React.lazy(() => import('./UserInformationCard_Individual')));
 
 // import UserInformationCard from "./UserInformationCard_Individual";
 // import LoadingComponent from "../extra-pages/LoadingComponent";
@@ -22,12 +22,11 @@ const UserInformationCard = Loadable(lazy(() => import('./UserInformationCard_In
 
 const UserMaintainPage_Individual = () => {
     const params = useParams();
-    const [formData, setFormData]  = useState({})
-    const [userFile, setUserFile]  = useState({})
-    const [isLoading, setLoding] = useState(true);
+    const [formData, setFormData]  = React.useState({})
+    const [isLoading, setLoding] = React.useState(true);
 
 
-    useEffect(()=>{
+    React.useEffect(()=>{
         loadData();
     },[]);
 
@@ -61,13 +60,12 @@ const UserMaintainPage_Individual = () => {
                 response.data["lastLoginDate"] = response.data.lastLogin?DateUtils.datetimeStr(response.data.lastLogin):"";
 
                 setFormData(response.data);
-                setUserFile(response.userFile)
             }
         });
     };
 
 
-    useEffect(() => {
+    React.useEffect(() => {
        setLoding(false);
     }, [formData]);
 
@@ -85,11 +83,20 @@ const UserMaintainPage_Individual = () => {
                         <Grid item xs={12} md={12} lg={12}>
                             <UserInformationCard
                                 formData={formData}
-                                userFile={userFile}
                                 loadDataFun={loadData}
                             />
                         </Grid>
-
+                        <Grid item xs={12} md={12} lg={12}>
+                        <MainCard elevation={0} border={false} content={false}>
+                        <Typography variant="h5" sx={{mt: 3, ml: 3, mb: 1}}>
+                            Files
+                        </Typography>
+                            <FileList sx={{mt: 3, ml: 3, mb: 1}}
+                                refId={params.id}
+                                refType={"identification"}
+                            />
+                        </MainCard>
+                    </Grid>
                     </Grid>
                 </Grid>
                 {/*col 2*/}