add public

package-lock.json

@@ -4080,13 +4080,28 @@
         }
       }
     },
-    "node_modules/@material-ui/core/node_modules/@emotion/hash": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
-      "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==",
-      "peer": true
+    "node_modules/@material-ui/pickers": {
+      "version": "3.3.10",
+      "resolved": "https://registry.npmjs.org/@material-ui/pickers/-/pickers-3.3.10.tgz",
+      "integrity": "sha512-hS4pxwn1ZGXVkmgD4tpFpaumUaAg2ZzbTrxltfC5yPw4BJV+mGkfnQOB4VpWEYZw2jv65Z0wLwDE/piQiPPZ3w==",
+      "deprecated": "Material UI Pickers v3 doesn't receive active development since January 2020. See the guide https://mui.com/material-ui/guides/pickers-migration/ to upgrade.",
+      "dependencies": {
+        "@babel/runtime": "^7.6.0",
+        "@date-io/core": "1.x",
+        "@types/styled-jsx": "^2.2.8",
+        "clsx": "^1.0.2",
+        "react-transition-group": "^4.0.0",
+        "rifm": "^0.7.0"
+      },
+      "peerDependencies": {
+        "@date-io/core": "^1.3.6",
+        "@material-ui/core": "^4.0.0",
+        "prop-types": "^15.6.0",
+        "react": "^16.8.0 || ^17.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0"
+      }
     },
-    "node_modules/@material-ui/core/node_modules/@material-ui/styles": {
+    "node_modules/@material-ui/styles": {
       "version": "4.11.5",
       "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz",
       "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==",
@@ -4128,7 +4143,19 @@
         }
       }
     },
-    "node_modules/@material-ui/core/node_modules/@material-ui/system": {
+    "node_modules/@material-ui/styles/node_modules/@emotion/hash": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
+      "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==",
+      "peer": true
+    },
+    "node_modules/@material-ui/styles/node_modules/csstype": {
+      "version": "2.6.21",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.21.tgz",
+      "integrity": "sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w==",
+      "peer": true
+    },
+    "node_modules/@material-ui/system": {
       "version": "4.12.2",
       "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz",
       "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==",
@@ -4157,51 +4184,12 @@
         }
       }
     },
-    "node_modules/@material-ui/core/node_modules/@material-ui/utils": {
-      "version": "4.11.3",
-      "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz",
-      "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/runtime": "^7.4.4",
-        "prop-types": "^15.7.2",
-        "react-is": "^16.8.0 || ^17.0.0"
-      },
-      "engines": {
-        "node": ">=8.0.0"
-      },
-      "peerDependencies": {
-        "react": "^16.8.0 || ^17.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0"
-      }
-    },
-    "node_modules/@material-ui/core/node_modules/csstype": {
+    "node_modules/@material-ui/system/node_modules/csstype": {
       "version": "2.6.21",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.21.tgz",
       "integrity": "sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w==",
       "peer": true
     },
-    "node_modules/@material-ui/pickers": {
-      "version": "3.3.10",
-      "resolved": "https://registry.npmjs.org/@material-ui/pickers/-/pickers-3.3.10.tgz",
-      "integrity": "sha512-hS4pxwn1ZGXVkmgD4tpFpaumUaAg2ZzbTrxltfC5yPw4BJV+mGkfnQOB4VpWEYZw2jv65Z0wLwDE/piQiPPZ3w==",
-      "deprecated": "Material UI Pickers v3 doesn't receive active development since January 2020. See the guide https://mui.com/material-ui/guides/pickers-migration/ to upgrade.",
-      "dependencies": {
-        "@babel/runtime": "^7.6.0",
-        "@date-io/core": "1.x",
-        "@types/styled-jsx": "^2.2.8",
-        "clsx": "^1.0.2",
-        "react-transition-group": "^4.0.0",
-        "rifm": "^0.7.0"
-      },
-      "peerDependencies": {
-        "@date-io/core": "^1.3.6",
-        "@material-ui/core": "^4.0.0",
-        "prop-types": "^15.6.0",
-        "react": "^16.8.0 || ^17.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0"
-      }
-    },
     "node_modules/@material-ui/types": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz",
@@ -4216,6 +4204,24 @@
         }
       }
     },
+    "node_modules/@material-ui/utils": {
+      "version": "4.11.3",
+      "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz",
+      "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==",
+      "peer": true,
+      "dependencies": {
+        "@babel/runtime": "^7.4.4",
+        "prop-types": "^15.7.2",
+        "react-is": "^16.8.0 || ^17.0.0"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0"
+      }
+    },
     "node_modules/@motionone/animation": {
       "version": "10.15.1",
       "resolved": "https://registry.npmjs.org/@motionone/animation/-/animation-10.15.1.tgz",

src/pages/pnspsUserSearchPage_Public/UserSearchForm_Public.js

@@ -0,0 +1,219 @@
+// material-ui
+import {
+    Button,
+    CardContent, FormControlLabel,
+    Grid, TextField,
+    Typography
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import {useForm} from "react-hook-form";
+
+import {useEffect, useState} from "react";
+import Autocomplete from '@mui/material/Autocomplete';
+import {
+    subDivision1,
+    subDivision2,
+    subDivision3,
+    subDivision4,
+    subDivision5,
+    subDivision6
+} from "pages/pnspsUserSettingPage/DummyComboRecord";
+import Checkbox from "@mui/material/Checkbox";
+import * as React from "react";
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+const subDivisionArray =[
+        ...subDivision1,
+        ...subDivision2,
+        ...subDivision3,
+        ...subDivision4,
+        ...subDivision5,
+        ...subDivision6
+];
+
+const UserSearchForm_Public = ({applySearch}) => {
+
+    const [type, setType] = useState([]);
+    const [division, setDivision] = useState(null);
+    const [subDivision, setSubDivision] = useState(null);
+    const [isLotusNoteUser, setIsLotusNoteUser] = useState(false);
+    const [locked, setLocked] = useState(false);
+
+
+    const { reset, register, handleSubmit } = useForm()
+    const onSubmit = (data) => {
+
+        let typeArray = [];
+
+        for(let i =0; i < type.length; i++){
+            typeArray.push(type[i].label);
+        }
+
+        const temp = {
+            username: data.userName,
+            fullName: data.fullName,
+            subDivision: subDivision,
+            email: data.email,
+            phone: data.phone,
+            isLotusNoteUser: isLotusNoteUser,
+            locked: locked,
+        };
+        applySearch(temp);
+    };
+
+    useEffect(() => {
+        if(division != null){
+            setSubDivision(subDivisionArray[division.type-1][0]);
+        }
+
+    }, [division]);
+
+    function resetForm(){
+        setType([]);
+        setDivision(null);
+        setSubDivision(null);
+        setIsLotusNoteUser(false);
+        setLocked(false);
+        reset();
+    }
+
+    return (
+        <MainCard xs={12} md={12} lg={12}
+                  border={false}
+                  content={false}>
+
+            <form onSubmit={handleSubmit(onSubmit)}>
+                {/*row 1*/}
+                <CardContent sx={{ px: 2.5, pt: 3 }}>
+                    <Grid item justifyContent="space-between" alignItems="center">
+                        Search Form
+                    </Grid>
+                </CardContent>
+
+                {/*row 2*/}
+                <Grid container alignItems={"center"}>
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <TextField
+                            fullWidth
+                            {...register("userName")}
+                            id='userName'
+                            label="Username"
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <TextField
+                            fullWidth
+                            {...register("fullName")}
+                            id="fullName"
+                            label="Full Name"
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <Autocomplete
+                            disablePortal
+                            id="sub-division-combo"
+                            value={subDivision === null? null : subDivision}
+                            options={subDivisionArray}
+                            onChange={(event, newValue) => {
+                                setSubDivision(newValue);
+                            }}
+                            renderInput={(params) => <TextField {...params} label="Sub-Division" />}
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <TextField
+                            fullWidth
+                            {...register("email")}
+                            id="email"
+                            label="Email"
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <TextField
+                            fullWidth
+                            {...register("phone")}
+                            id="phone"
+                            label="Phone"
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <FormControlLabel
+                            control={
+                                <Checkbox
+                                    checked={isLotusNoteUser}
+                                    onChange={(event) => setIsLotusNoteUser(event.target.checked)}
+                                    name="checked"
+                                    color="primary"
+                                    size="small"
+                                />
+                            }
+                            label={<Typography variant="h6">Lotus Notes User</Typography>}
+                        />
+                    </Grid>
+
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
+                        <FormControlLabel
+                            control={
+                                <Checkbox
+                                    checked={locked}
+                                    onChange={(event) => setLocked(event.target.checked)}
+                                    name="checked"
+                                    color="primary"
+                                    size="small"
+                                />
+                            }
+                            label={<Typography variant="h6">Locked</Typography>}
+                        />
+                    </Grid>
+                    {/*<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>*/}
+                    {/*    <TextField*/}
+                    {/*        fullWidth*/}
+                    {/*        {...register("subDivisionId")}*/}
+                    {/*        id="subDivision"*/}
+                    {/*        label="Sub-Division"*/}
+                    {/*    />*/}
+                    {/*</Grid>*/}
+
+                </Grid>
+
+
+                {/*last row*/}
+                <Grid container maxWidth justifyContent="flex-end">
+
+                    <Grid item sx={{ml:3, mr:3, mb:3, mt:3}}>
+                        <Button
+                            size="large"
+                            variant="contained"
+                            onClick={resetForm}
+                            sx={{
+                                textTransform: 'capitalize',
+                                alignItems: 'end'
+                            }}>
+                            Clear
+                        </Button>
+                    </Grid>
+
+                    <Grid item sx={{ml:3, mr:3, mb:3, mt:3}}>
+                        <Button
+                            size="large"
+                            variant="contained"
+                            type="submit"
+                            sx={{
+                                textTransform: 'capitalize',
+                                alignItems: 'end'
+                            }}>
+                            Submit
+                        </Button>
+                    </Grid>
+                </Grid>
+            </form>
+        </MainCard>
+    );
+};
+
+export default UserSearchForm_Public;

src/pages/pnspsUserSearchPage_Public/UserTable_Public.js

@@ -0,0 +1,137 @@
+// material-ui
+import * as React from 'react';
+import {
+    DataGrid,
+    GridActionsCellItem,
+} from "@mui/x-data-grid";
+import EditIcon from '@mui/icons-material/Edit';
+import {useEffect} from "react";
+import {useNavigate} from "react-router-dom";
+import { useTheme } from '@mui/material/styles';
+import Checkbox from '@mui/material/Checkbox';
+// ==============================|| EVENT TABLE ||============================== //
+
+export default function UserTable_Public({recordList}) {
+    const [rows, setRows] = React.useState(recordList);
+    const [rowModesModel] = React.useState({});
+    const theme = useTheme();
+
+    const navigate = useNavigate()
+
+    useEffect(() => {
+        setRows(recordList);
+    }, [recordList]);
+
+    const handleEditClick = (id) => () => {
+        navigate('/user/'+ id);
+    };
+
+    const columns = [
+        {
+            field: 'actions',
+            type: 'actions',
+            headerName: 'Actions',
+            width: 100,
+            cellClassName: 'actions',
+            getActions: ({id}) => {
+                return [
+                    <GridActionsCellItem
+                        key="OutSave"
+                        icon={<EditIcon/>}
+                        label="Edit"
+                        className="textPrimary"
+                        onClick={handleEditClick(id)}
+                        color="primary"
+                    />]
+            },
+        },
+        {
+            id: 'username',
+            field: 'username',
+            headerName: 'User Name',
+            flex: 1,
+        },
+        {
+            id: 'name',
+            field: 'name',
+            headerName: 'Full Name',
+            flex: 1,
+        },
+        {
+            id: 'post',
+            field: 'post',
+            headerName: 'Post',
+            flex: 1,
+        },
+        {
+            id: 'email',
+            field: 'email',
+            headerName: 'Email',
+            flex: 1,
+        },
+        {
+            id: 'subDivisionId',
+            field: 'subDivisionId',
+            //type: 'date',
+            //sortable: false,
+            headerName: 'Sub-Division',
+            flex: 1,
+        },
+        {
+            id: 'lotusNotesUser',
+            field: 'lotusNotesUser',
+            type: 'bool',
+            headerName: 'Lotus Notes User',
+            flex: 1,
+            renderCell: (params) => {
+                return (
+                    <Checkbox
+                        theme={theme}
+                        key="locked"
+                        checked={params.row.lotusNotesUser}
+                        color="primary"
+                        size="small"
+                        //onChange={handleChange}
+                    />
+                );
+            },
+        },
+        {
+            id: 'locked',
+            field: 'locked',
+            type: 'bool',
+            headerName: 'Locked',
+            flex: 1,
+            renderCell: (params) => {
+                return (
+                    <Checkbox
+                        theme={theme}
+                        key="locked"
+                        checked={params.row.locked}
+                        color="primary"
+                        size="small"
+                        //onChange={handleChange}
+                    />
+                );
+            },
+        },
+    ];
+
+    return (
+        <div style={{height: 400, width: '100%'}}>
+            <DataGrid
+                rows={rows}
+                columns={columns}
+                editMode="row"
+                rowModesModel={rowModesModel}
+                initialState={{
+                    pagination: {
+                        paginationModel: {page: 0, pageSize: 5},
+                    },
+                }}
+                pageSizeOptions={[5, 10]}
+                autoHeight
+            />
+        </div>
+    );
+}

src/pages/pnspsUserSearchPage_Public/index.js

@@ -0,0 +1,84 @@
+// material-ui
+import {
+    Grid, Typography
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import SearchForm from "./UserSearchForm_Public";
+import EventTable from "./UserTable_Public";
+import {useEffect, useState} from "react";
+import axios from "axios";
+import {apiPath} from "../../auth/utils";
+import {GET_USER_PATH} from "../../utils/ApiPathConst";
+import * as React from "react";
+import LoadingComponent from "../extra-pages/LoadingComponent";
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+const UserSearchPage_Public = () => {
+
+    const [record,setRecord] = useState([]);
+    const [searchCriteria, setSearchCriteria] = useState({});
+    const [onReady, setOnReady] = useState(false);
+
+    useEffect(() => {
+        getUserList();
+    }, []);
+
+    useEffect(() => {
+        setOnReady(true);
+    }, [record]);
+
+    useEffect(() => {
+        getUserList();
+    }, [searchCriteria]);
+
+    function getUserList(){
+        axios.get(`${apiPath}${GET_USER_PATH}`,
+            {params: searchCriteria}
+        )
+            .then((response) => {
+                if (response.status === 200) {
+                    setRecord(response.data);
+                }
+            })
+            .catch(error => {
+                console.log(error);
+                return false;
+            });
+    }
+
+    function applySearch(input) {
+        setSearchCriteria(input);
+    }
+
+    return (
+        !onReady ?
+            <LoadingComponent/>
+            :
+        <Grid container rowSpacing={4.5} columnSpacing={2.75}>
+            <Grid item xs={12} sx={{mb: -2.25}}>
+                <Typography variant="h5">View User</Typography>
+            </Grid>
+
+            {/*row 1*/}
+            <Grid item xs={12} md={12} lg={12}>
+                <SearchForm applySearch={applySearch}/>
+            </Grid>
+            {/*row 2*/}
+            <Grid item xs={12} md={12} lg={12}>
+                <MainCard elevation={0}
+                          border={false}
+                          content={false}
+                >
+                    <EventTable
+                        recordList={record}
+                    />
+                </MainCard>
+            </Grid>
+
+        </Grid>
+
+    );
+};
+
+export default UserSearchPage_Public;

src/routes/SettingRoutes.js

@@ -9,6 +9,7 @@ const SettingPage = Loadable(lazy(() => import('pages/pnspsSettingPage')));
 const PasswordPolicyPage = Loadable(lazy(()=> import('pages/pnspsPasswordPolicyPage')))
 const UserSettingPage = Loadable(lazy(()=>import ('pages/pnspsUserSettingPage/')));
 const UserSearchPage = Loadable(lazy(()=>import ('pages/pnspsUserSearchPage')));
+const UserSearchPage_Public = Loadable(lazy(()=>import ('pages/pnspsUserSearchPage_Public')));
 const UserMaintainPage = Loadable(lazy(() => import('pages/pnspsUserDetailPage')));
 const UserGroupSearchPage = Loadable(lazy(() => import('pages/pnspsUserGroupSearchPage')));
 const UserGroupDetailPage = Loadable(lazy(() => import('pages/pnspsUserGroupDetailPage')));
@@ -31,6 +32,10 @@ const SettingRoutes = {
             path: 'userSearchview',
             element: <UserSearchPage />
         },
+        {
+            path: 'publicUserSearchview',
+            element: <UserSearchPage_Public />
+        },
         {
             path: '/user/:id',
             element: <UserMaintainPage />