fix add user group

src/pages/pnspsUserGroupSearchPage/UserGroupSearchForm.js

@@ -7,9 +7,13 @@ import {
 import MainCard from "../../components/MainCard";
 import {useForm} from "react-hook-form";
 import * as React from "react";
+import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline';
+import {useNavigate} from "react-router";
+
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
 const UserGroupSearchForm = ({applySearch}) => {
+    const navigate = useNavigate();
 
     const { reset, register, handleSubmit } = useForm()
     const onSubmit = (data) => {
@@ -20,6 +24,11 @@ const UserGroupSearchForm = ({applySearch}) => {
         reset();
     }
 
+    const handleNewGroupClick = (id) => {
+        // console.log(id)
+        navigate('/userGroup/'+ id);
+    };
+
     return (
         <MainCard xs={12} md={12} lg={12}
                   border={false}
@@ -56,32 +65,51 @@ const UserGroupSearchForm = ({applySearch}) => {
 
 
                 {/*last row*/}
-                <Grid container maxWidth justifyContent="flex-end">
-
-                    <Grid item sx={{ml:3, mr:3, mb:3, mt:3}}>
+                <Grid container direction="row"
+                    justifyContent="space-between"
+                    alignItems="center">
+                       
+                    <Grid item xs={3} md={3} sx={{ml:1, mr:1, mb:3, mt:3}}>
                         <Button
                             size="large"
                             variant="contained"
-                            onClick={resetForm}
+                            onClick={handleNewGroupClick}
                             sx={{
                                 textTransform: 'capitalize',
                                 alignItems: 'end'
                             }}>
-                            Clear
+                            <AddCircleOutlineIcon/>
+                            New Group
                         </Button>
                     </Grid>
+                    <Grid item xs={8} md={8} sx={{ml:3, mr:3, mb:3, mt:3}}>
+                        <Grid container >
+                            <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 item sx={{ml:3, mr:3, mb:3, mt:3}}>
+                                <Button
+                                    size="large"
+                                    variant="contained"
+                                    type="submit"
+                                    sx={{
+                                        textTransform: 'capitalize',
+                                        alignItems: 'end'
+                                    }}>
+                                    Search
+                                </Button>
+                            </Grid>
+                        </Grid>
                     </Grid>
                 </Grid>
             </form>

src/pages/pnspsUserGroupSearchPage/index.js

@@ -20,14 +20,15 @@ import { lazy } from 'react';
 const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
 const UserGroupSearchForm = Loadable(lazy(() => import('./UserGroupSearchForm')));
 const UserGroupTable = Loadable(lazy(() => import('./UserGroupTable')));
+// import {useNavigate} from "react-router";
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
 const UserGroupSearchPanel = () => {
-
     const [record, setRecord] = useState([]);
     const [searchCriteria, setSearchCriteria] = useState({});
     const [onReady, setOnReady] = useState(false);
+    // const navigate = useNavigate();
 
     useEffect(() => {
         getGroupList();
@@ -66,21 +67,12 @@ const UserGroupSearchPanel = () => {
             :
             <Grid container sx={{minHeight: '90vh', paddingTop: '53px'}}>
                 <Grid item xs={12} md={12} lg={12}>
-                    <Grid container justifyContent="flex-start" alignItems="center">
-                        <Grid item xs={12} height='50px'>
-                            <Stack direction="row" height='100%' justifyContent="flex-start" alignItems="center">
-                                <Typography ml={2} align="center" variant="h5">View User Group</Typography>
+                    <Grid direction="row" container justifyContent="flex-start" alignItems="center" ml={2}>
+                        <Grid item xs={2} height='50px'>
+                            <Stack direction="row" height='100%' justifyContent="space-between" alignItems="center">
+                                <Typography align="center" variant="h5">View User Group</Typography>
                             </Stack>
                         </Grid>
-                        {/* <Grid item xs={1} sx={{ml: 3, mr: 3}}>
-                            <Button
-                                size="large"
-                                variant="contained"
-                                type="submit"
-                            >
-                                Create
-                            </Button>
-                        </Grid> */}
                     </Grid>
                 </Grid>
 

src/pages/pnspsUserSearchPage/DummyComboRecord.js

@@ -1,77 +0,0 @@
-export const eventType = [
-    {label: '同心', type: 1},
-    {label: '創新', type: 2},
-    {label: '惠民', type: 3},
-    {label: '傳承', type: 3},
-];
-
-export const divisionType = [
-    {key: 1, label: 'Railways Branch', type: 1},
-    {key: 2, label: 'Electricity and Energy Efficiency Branch ', type: 2},
-    {key: 3, label: 'Gas and General Legislation Branch', type: 3},
-    {key: 4, label: 'Engineering Services Branch 1', type: 4},
-    {key: 5, label: 'Engineering Services Branch 2', type: 5},
-    {key: 6, label: 'Engineering Services Branch 3', type: 6},
-];
-
-export const subDivision1 = [
-    {key: 1, label: 'Sub Division 1 of Railways Branch', type: 1},
-    {key: 2, label: 'Sub Division 2 of Railways Branch', type: 2},
-    {key: 3, label: 'Sub Division 3 of Railways Branch', type: 3},
-    {key: 4, label: 'Sub Division 4 of Railways Branch', type: 4},
-];
-
-export const subDivision2 = [
-    {key: 1, label: 'Sub Division 1 of Electricity and Energy Efficiency Branch', type: 1},
-    {key: 2, label: 'Sub Division 2 of Electricity and Energy Efficiency Branch', type: 2},
-    {key: 3, label: 'Sub Division 3 of Electricity and Energy Efficiency Branch', type: 3},
-];
-
-export const subDivision3 = [
-    {key: 1, label: 'Sub Division 1 of Gas and General Legislation Branch', type: 1},
-    {key: 2, label: 'Sub Division 2 of Gas and General Legislation Branch', type: 2},
-    {key: 3, label: 'Sub Division 3 of Gas and General Legislation Branch', type: 3},
-];
-
-export const subDivision4 = [
-    {key: 1, label: 'Sub Division 1 of Engineering Services Branch 1', type: 1},
-    {key: 2, label: 'Sub Division 2 of Engineering Services Branch 1', type: 2},
-    {key: 3, label: 'Sub Division 3 of Engineering Services Branch 1', type: 3},
-    {key: 4, label: 'Sub Division 4 of Engineering Services Branch 1', type: 4},
-];
-
-export const subDivision5 = [
-    {key: 1, label: 'Sub Division 1 of Engineering Services Branch 2', type: 1},
-    {key: 2, label: 'Sub Division 2 of Engineering Services Branch 2', type: 2},
-    {key: 3, label: 'Sub Division 3 of Engineering Services Branch 2', type: 3},
-];
-
-export const subDivision6 = [
-    {key: 1, label: 'Sub Division 1 of Engineering Services Branch 3', type: 1},
-    {key: 2, label: 'Sub Division 2 of Engineering Services Branch 3', type: 2},
-    {key: 3, label: 'Sub Division 3 of Engineering Services Branch 3', type: 3},
-];
-
-export const tableRecord = [
-    {trackingNo: 84564564, name: 'Camera', fat: 40, carbs: 2, protein: 4057},
-    {trackingNo: 98764564, name: 'Laptop', fat: 300, carbs: 0, protein: 180139},
-    {trackingNo: 98756325, name: 'Mobile', fat: 355, carbs: 1, protein: 90989},
-    {trackingNo: 98652366, name: 'Handset', fat: 50, carbs: 1, protein: 10239},
-    {trackingNo: 13286564, name: 'Computer', fat: 100, carbs: 1, protein: 8334},
-    {trackingNo: 86739658, name: 'TV', fat: 99, carbs: 0, protein: 410780},
-    {trackingNo: 13256498, name: 'Keyboard', fat: 125, carbs: 2, protein: 70999},
-    {trackingNo: 98753263, name: 'Mouse', fat: 89, carbs: 2, protein: 10570},
-    {trackingNo: 98753275, name: 'Desktop', fat: 185, carbs: 1, protein: 98063},
-    {trackingNo: 98753291, name: 'Chair', fat: 100, carbs: 0, protein: 14001},
-];
-
-export const tableRecordTemp = [
-    {id:1 ,eventNo: 84564564, eventDate:"2022-03-20" , category: '同心', hrmPlan: 'Visionary Leadership', name: 'HKMA Best Annual Reports Awards - The Electrical and Mechanical Services Department Annual Report 2020/21 - Certificate of Excellence'},
-    {id:2 ,eventNo: 98764564, eventDate:"2022-05-12" , category: '同心', hrmPlan: 'Visionary Leadership', name: 'HKMA Best Annual Reports Awards - The Electrical and Mechanical Services Department Annual Report 2020/21- Best New Entry'},
-    {id:3 ,eventNo: 98756325, eventDate:"2022-06-04" , category: '創新', hrmPlan: 'Visionary Leadership', name: '19th Hong Kong Occupational Safety and Health Award - Gold Award - The Virtual Reality-based Lift Maintenance training programme'},
-    {id:4 ,eventNo: 98652366, eventDate:"2022-08-16" , category: '創新', hrmPlan: 'Visionary Leadership', name: 'BIM Achievement 2022 - BIM Organisations 2022'},
-    {id:5 ,eventNo: 13286564, eventDate:"2022-09-30" , category: '惠民', hrmPlan: 'Visionary Leadership', name: 'Civil Service Outstanding Service Award Scheme 2022 - Excellence in Team Collaboration (Internal Service) - Innovation Facilitator'},
-    {id:6 ,eventNo: 86739658, eventDate:"2022-10-25" , category: '惠民', hrmPlan: 'Visionary Leadership', name: 'Civil Service Outstanding Service Award Scheme 2022 - Excellence in Team Collaboration (Management of Crisis) - E&M 100 - CHT Rescue Team'},
-    {id:7 ,eventNo: 13256498, eventDate:"2022-11-21" , category: '傳承', hrmPlan: 'Visionary Leadership', name: '11th Guangzhou/Hong Kong/Macao/Chengdu Youth Skills Competition - Three TTs from the EMSD got the top three prizes in the Electrical Installations trade of the Hong Kong Region qualifying competition'},
-    {id:8 ,eventNo: 98753263, eventDate:"2022-12-31" , category: '傳承', hrmPlan: 'Visionary Leadership', name: 'VTC 2021 Outstanding Apprentices Scheme - Outstanding Apprentice - Mr. LEE King (TTII)'},
-];