add gld user profile

src/layout/MainLayout/Header/index.js

@@ -137,6 +137,14 @@ function Header(props) {
         <li>
           <Link className="emailTemplate" to='/emailTemplate'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Email Template</Typography></Link>
         </li>
+        <li>
+          <Link className="client" ><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 2 }}>Setting</Typography><KeyboardArrowDownIcon sx={{ fontSize: '1.0rem' }} /></Link>
+          <ul className='dropdown'>
+            <li>
+              <Link className="userProfileGld" to='/user/profile'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 2, mt: 1, mb: 1 }}>Users Profile</Typography></Link>
+            </li>
+          </ul>
+        </li>
         <li>
           <Link className="logout" onClick={handleLogout}><Typography variant={"pnspsHeaderTitle"} sx={{ ml: 2 }}>Logout</Typography></Link>
         </li>

src/pages/User/DetailPage/UserAuthTable.js

@@ -4,10 +4,10 @@ import {
 } from "@mui/x-data-grid";
 import {useEffect, useState} from "react";
 import axios from "axios";
-import {apiPath} from "../../../auth/utils";
+import {apiPath} from "auth/utils";
 //import LoadingComponent from "../extra-pages/LoadingComponent";
 import * as React from "react";
-import {GET_AUTH_LIST} from "../../../utils/ApiPathConst";
+import {GET_AUTH_LIST} from "utils/ApiPathConst";
 
 import Loadable from 'components/Loadable';
 import { lazy } from 'react';

src/pages/User/DetailPage/UserGroupCard.js

@@ -23,6 +23,7 @@ const UserGroupCard = ({isCollectData, updateUserGroupList,userData,isNewRecord}
     useEffect(() => {
         //if user data from parent are not null
         if (Object.keys(userData).length > 0 && userData !== undefined) {
+            // console.log(userData.groupIds)
             setCurrentUserData(userData.data);
             setSelectedRow(userData.groupIds);
         }

src/pages/User/DetailPage/UserGroupTable.js

@@ -4,9 +4,9 @@ import {
 } from "@mui/x-data-grid";
 import {useEffect, useState} from "react";
 import axios from "axios";
-import {apiPath} from "../../../auth/utils";
+import {apiPath} from "auth/utils";
 import * as React from "react";
-import {GET_GROUP_COMBO_PATH} from "../../../utils/ApiPathConst";
+import {GET_GROUP_COMBO_PATH} from "utils/ApiPathConst";
 import Loadable from 'components/Loadable';
 import { lazy } from 'react';
 const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
@@ -41,7 +41,9 @@ export default function UserGroupTable({setSelectedRow, userGroup,isNewRecord})
         axios.get(`${apiPath}${GET_GROUP_COMBO_PATH}`)
             .then((response) => {
                 if (response.status === 200) {
+                    // console.log(userGroup)
                     setGroupData(response.data.records);
+                    setCurrentSelectedRow(userGroup);
                 }
             })
             .catch(error => {
@@ -85,7 +87,7 @@ export default function UserGroupTable({setSelectedRow, userGroup,isNewRecord})
                     checkboxSelection
                     rowSelectionModel={currentSelectedRow}
                     onRowSelectionModelChange={(ids) => {
-                        console.log(ids);
+                        // console.log(ids);
                         setSelectedRow(ids);
                         setCurrentSelectedRow(ids);
                     }}

src/pages/User/DetailPage/index.js

@@ -10,7 +10,7 @@ import { useEffect, useState } from "react";
 import * as React from "react";
 import axios from "axios";
 import { useNavigate, useParams } from "react-router-dom";
-import { GLD_USER_PATH, DELETE_USER, POST_ADMIN_USER_REGISTER } from "../../../utils/ApiPathConst";
+import { GLD_USER_PATH, DELETE_USER, POST_ADMIN_USER_REGISTER } from "utils/ApiPathConst";
 
 import Loadable from 'components/Loadable';
 import { lazy } from 'react';
@@ -23,7 +23,7 @@ import {
     getDeletedRecordWithRefList,
     notifyDeleteSuccess,
     notifySaveSuccess,
-} from "../../../utils/CommonFunction";
+} from "utils/CommonFunction";
 import ForwardIcon from '@mui/icons-material/Forward';
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
 

src/pages/User/GLDUserProfile/UserInformationCard.js

@@ -0,0 +1,160 @@
+// material-ui
+import {
+    FormControl, 
+    // IconButton,
+    Grid, 
+    // InputAdornment, 
+    Typography, FormLabel,
+    OutlinedInput,
+} from '@mui/material';
+import MainCard from "components/MainCard";
+import * as React from "react";
+
+import {useEffect, useState} from "react";
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
+
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+const UserInformationCard = ({userData}) => {
+    const [currentUserData, setCurrentUserData] = React.useState({});
+    // const [locked, setLocked] = useState(false);
+    const [onReady, setOnReady] = useState(false);
+
+    useEffect(() => {
+        //if user data from parent are not null
+        if (Object.keys(userData).length > 0 && userData !== undefined) {
+            setCurrentUserData(userData.data);
+        }
+    }, [userData]);
+
+    useEffect(() => {
+        //if state data are ready and assign to different field
+        if (Object.keys(userData).length > 0 &&currentUserData !== undefined&&currentUserData.id!==undefined) {
+            console.log(currentUserData)
+            // setLocked(currentUserData.locked);
+            setOnReady(true);
+        }
+    }, [currentUserData]);
+
+    return (
+        !onReady ?
+            <LoadingComponent/>
+            :
+            <MainCard elevation={0}
+                      border={false}
+                      content={false}
+            >
+                <Typography variant="h5" sx={{mt: 3, ml: 3, mr: 3, borderBottom: "1px solid black"}}>
+                    Information
+                </Typography>
+
+                <form>
+                    <Grid container>
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3, mt:3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                    sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    <FormLabel required>Username:</FormLabel>
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <FormControl variant="outlined" fullWidth required>
+                                        <OutlinedInput
+                                            required
+                                            fullWidth
+                                            size="small"
+                                            // {...register("username",
+                                            //     {
+                                                //     })}
+                                                id='username'
+                                                disabled={true}
+                                                value={currentUserData.username}
+                                        />
+                                    </FormControl>
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    <FormLabel required >Full Name:</FormLabel>
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <FormControl variant="outlined" fullWidth required>
+                                        <OutlinedInput
+                                            required
+                                            fullWidth
+                                            size="small"
+                                            value= {currentUserData.enName}
+                                            disabled={true}
+                                            // {...register("enName",
+                                            //     {
+                                            //     })}
+                                            id='enName'
+                                        />
+                                    </FormControl>
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    <FormLabel>Post:</FormLabel>
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <FormControl variant="outlined" fullWidth required>
+                                        <OutlinedInput
+                                            fullWidth
+                                            size="small"
+                                            value= {currentUserData.post}
+                                            disabled={true}
+                                            // {...register("post",
+                                            //     {
+                                            //     })}
+                                            id='post'
+                                        />
+                                    </FormControl>
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    <FormLabel required>Email:</FormLabel>
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <FormControl variant="outlined" fullWidth required>
+                                        <OutlinedInput
+                                            fullWidth
+                                            size="small"
+                                            value={currentUserData.emailAddress}
+                                            disabled={true}
+                                            // {...register("emailAddress",
+                                            //     {
+                                            //     })}
+                                            id='emailAddress'
+                                        />
+                                    </FormControl>
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                    </Grid>
+
+                </form>
+            </MainCard>
+    );
+};
+
+export default UserInformationCard;

src/pages/User/GLDUserProfile/index.js

@@ -0,0 +1,153 @@
+// material-ui
+import {
+    Button,
+    Grid,
+    Typography,
+    Stack,
+    Box,
+} from '@mui/material';
+import { useEffect, useState } from "react";
+import * as React from "react";
+import axios from "axios";
+import { useNavigate, 
+    // useParams
+} from "react-router-dom";
+import { GLD_USER_PATH, 
+    // DELETE_USER, 
+    // POST_ADMIN_USER_REGISTER
+} from "utils/ApiPathConst";
+
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const UserInformationCard = Loadable(lazy(() => import('./UserInformationCard')));
+const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
+// const UserGroupCard = Loadable(lazy(() => import('./UserGroupCard')));
+// const UserAuthorityCard = Loadable(lazy(() => import('./UserAuthorityCard')));
+import {
+    // GeneralConfirmWindow,
+    // getDeletedRecordWithRefList,
+    // notifyDeleteSuccess,
+    // notifySaveSuccess,
+} from "utils/CommonFunction";
+import ForwardIcon from '@mui/icons-material/Forward';
+import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
+
+import {
+    getUserId,
+} from "utils/Utils";
+
+const BackgroundHead = {
+    backgroundImage: `url(${titleBackgroundImg})`,
+    width: '100%',
+    height: '100%',
+    backgroundSize: 'contain',
+    backgroundRepeat: 'no-repeat',
+    backgroundColor: '#0C489E',
+    backgroundPosition: 'right'
+}
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+
+const UserMaintainPage = () => {
+    // const params = useParams();
+    const navigate = useNavigate();
+    const [userData, setUserData] = React.useState({});
+    const [onReady, setOnReady] = useState(false);
+    // const [isCollectData, setIsCollectData] = useState(false);
+    // const [editedCustomerData, setEditedCustomerData] = useState({});
+    // const [userConfirm, setUserConfirm] = useState(false);
+    // const [isNewRecord, setIsNewRecord] = useState(false);
+    // const [refUserData, setRefUserData] = React.useState({});
+
+
+    // function updateUserObject(userData) {
+    //     setEditedCustomerData(userData);
+    // }
+
+    // const submitData = () => {
+    //     setUserConfirm(true);
+    //     setIsCollectData(!isCollectData);
+    // }
+
+    // ==============================|| DELETE WINDOW RELATED ||============================== //
+    // const [isWindowOpen, setIsWindowOpen] = useState(false);
+    // const handleClose = () => {
+    //     setIsWindowOpen(false);
+    // };
+
+    // const handleDeleteClick = () => {
+    //     setIsWindowOpen(true);
+    // };
+
+    // function deleteData() {
+    //     axios.delete(`${DELETE_USER}/${params.id}`,
+    //     )
+    //         .then((response) => {
+    //             if (response.status === 204) {
+    //                 notifyDeleteSuccess();
+    //                 setIsWindowOpen(false);
+    //                 navigate('/userSearchview');
+    //             }
+    //         })
+    //         .catch(error => {
+    //             console.log(error);
+    //             return false;
+    //         });
+    // }
+    // ==============================|| DELETE WINDOW RELATED ||============================== //
+
+    useEffect(() => {
+        axios.get(`${GLD_USER_PATH}/${getUserId()}`)
+            .then((response) => {
+                if (response.status === 200) {
+                    setUserData(response.data);
+                }
+            })
+            .catch(error => {
+                console.log(error);
+                return false;
+            });
+    }, []);
+
+    useEffect(() => {
+        if (Object.keys(userData).length > 0 && userData !== undefined) {
+            setOnReady(true);
+        }
+    }, [userData]);
+
+    return (
+        !onReady ?
+            <LoadingComponent />
+            :
+            <Grid container sx={{ backgroundColor: 'backgroundColor.default' }}>
+                <Grid item xs={12}>
+                    <div style={BackgroundHead}>
+                        <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
+                            <Typography ml={15} color='#FFF' variant="h4">User Profile</Typography>
+                        </Stack>
+                    </div>
+                </Grid>
+                <Grid item xs={12}>
+                    <Button title="Back" sx={{ ml: 3.5, mt: 2 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/userSearchview") }}>
+                        <ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
+                    </Button>
+                </Grid>
+                {/*col 1*/}
+                <Grid item xs={12}>
+                    <Grid container>
+                        <Grid item xs={12} md={12} lg={12}>
+                            <Box xs={12} ml={4} mt={3} sx={{ p: 1, borderRadius: '10px', backgroundColor: '#fff' }}>
+                                <UserInformationCard
+                                    userData={userData}
+                                />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Grid>
+                {/*col 2*/}
+
+            </Grid>
+    );
+};
+
+export default UserMaintainPage;

src/routes/GLDUserRoutes.js

@@ -18,6 +18,8 @@ const DemandNote_Create = Loadable(lazy(() => import('pages/DemandNote/Create'))
 const DemandNote_Search = Loadable(lazy(() => import('pages/DemandNote/Search')));
 const DemandNote_Details = Loadable(lazy(() => import('pages/DemandNote/Details')));
 const GFMIS_Search = Loadable(lazy(() => import('pages/GFMIS')));
+const UserMaintainPage = Loadable(lazy(() => import('pages/User/GLDUserProfile')));
+
 // ==============================|| MAIN ROUTING ||============================== //
 
 const GLDUserRoutes = {
@@ -78,7 +80,11 @@ const GLDUserRoutes = {
         {
           path: '/gfmis/search',
           element: <GFMIS_Search/>
-        }
+        },
+        {
+          path: '/user/profile',
+          element: <UserMaintainPage />
+        },
       ]
     },
   ]