From 0e3642bf2aa89abb160815779d668c2b48dbc7ec Mon Sep 17 00:00:00 2001 From: anna Date: Fri, 5 Apr 2024 17:38:08 +0800 Subject: [PATCH] update ui --- .../SearchPage/OrganizationTable.js | 14 +++++--- src/pages/Organization/SearchPage/index.js | 32 +++--------------- src/pages/User/SearchPage/UserTable.js | 2 +- .../UserTable_Individual.js | 18 ++++++---- src/pages/User/SearchPage_Individual/index.js | 33 ++----------------- .../UserTable_Organization.js | 16 +++++---- .../User/SearchPage_Organization/index.js | 28 +--------------- .../UserGroupTable.js | 14 +++++--- src/pages/pnspsUserGroupSearchPage/index.js | 32 ++---------------- src/utils/ApiPathConst.js | 2 +- 10 files changed, 52 insertions(+), 139 deletions(-) diff --git a/src/pages/Organization/SearchPage/OrganizationTable.js b/src/pages/Organization/SearchPage/OrganizationTable.js index e969d1e..6e317ff 100644 --- a/src/pages/Organization/SearchPage/OrganizationTable.js +++ b/src/pages/Organization/SearchPage/OrganizationTable.js @@ -8,15 +8,16 @@ import EditIcon from '@mui/icons-material/Visibility'; import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; import * as DateUtils from "utils/DateUtils"; +import {GET_ORG_PATH} from "utils/ApiPathConst"; // ==============================|| EVENT TABLE ||============================== // -export default function OrganizationTable({ recordList }) { - const [rows, setRows] = React.useState(recordList); +export default function OrganizationTable({ searchCriteria }) { + const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); const navigate = useNavigate() useEffect(() => { - setRows(recordList); - }, [recordList]); + set_searchCriteria(searchCriteria); + }, [searchCriteria]); const handleActionClick = (id) => () => { navigate('/org/' + id); @@ -106,10 +107,13 @@ export default function OrganizationTable({ recordList }) { return (
); diff --git a/src/pages/Organization/SearchPage/index.js b/src/pages/Organization/SearchPage/index.js index 5cfe687..06e2db8 100644 --- a/src/pages/Organization/SearchPage/index.js +++ b/src/pages/Organization/SearchPage/index.js @@ -2,11 +2,8 @@ import { Grid, Typography, Stack } from '@mui/material'; -import MainCard from "../../../components/MainCard"; - +import MainCard from "components/MainCard"; import { useEffect, useState } from "react"; -import * as UrlUtils from "../../../utils/ApiPathConst"; -import * as HttpUtils from "../../../utils/HttpUtils"; import * as React from "react"; @@ -24,7 +21,7 @@ const BackgroundHead = { backgroundImage: `url(${titleBackgroundImg})`, width: '100%', height: '100%', - backgroundSize:'contain', + backgroundSize: 'contain', backgroundRepeat: 'no-repeat', backgroundColor: '#0C489E', backgroundPosition: 'right' @@ -33,32 +30,13 @@ const BackgroundHead = { const OrganizationSearchPage = () => { - const [record, setRecord] = useState([]); const [searchCriteria, setSearchCriteria] = useState({}); const [onReady, setOnReady] = useState(false); - useEffect(() => { - getUserList(); - }, []); - useEffect(() => { setOnReady(true); - }, [record]); - - useEffect(() => { - getUserList(); }, [searchCriteria]); - function getUserList() { - HttpUtils.get({ - url: UrlUtils.GET_ORG_PATH, - params: searchCriteria, - onSuccess: function (responseData) { - setRecord(responseData); - } - }); - } - function applySearch(input) { setSearchCriteria(input); } @@ -71,7 +49,7 @@ const OrganizationSearchPage = () => { : - +
@@ -80,7 +58,7 @@ const OrganizationSearchPage = () => {
{/*row 1*/} - + {/*row 2*/} @@ -90,7 +68,7 @@ const OrganizationSearchPage = () => { content={false} > diff --git a/src/pages/User/SearchPage/UserTable.js b/src/pages/User/SearchPage/UserTable.js index 97e95f8..0fcee0c 100644 --- a/src/pages/User/SearchPage/UserTable.js +++ b/src/pages/User/SearchPage/UserTable.js @@ -5,7 +5,7 @@ import {useEffect} from "react"; import {useNavigate} from "react-router-dom"; import { useTheme } from '@mui/material/styles'; import Checkbox from '@mui/material/Checkbox'; -import * as HttpUtils from '../../../utils/HttpUtils'; +import * as HttpUtils from 'utils/HttpUtils'; import { GLD_USER_PATH, GET_USER_LOCK, GET_USER_UNLOCK } from "utils/ApiPathConst"; import { notifyLockSuccess, notifyUnlockSuccess , clickableLink} from 'utils/CommonFunction'; diff --git a/src/pages/User/SearchPage_Individual/UserTable_Individual.js b/src/pages/User/SearchPage_Individual/UserTable_Individual.js index ddf0442..1116f13 100644 --- a/src/pages/User/SearchPage_Individual/UserTable_Individual.js +++ b/src/pages/User/SearchPage_Individual/UserTable_Individual.js @@ -7,17 +7,18 @@ import HighlightOff from '@mui/icons-material/HighlightOff'; import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline'; import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; -import * as DateUtils from "../../../utils/DateUtils"; +import * as DateUtils from "utils/DateUtils"; +import { GET_IND_USER_PATH } from "utils/ApiPathConst"; // ==============================|| EVENT TABLE ||============================== // -export default function UserTable_Individual({ recordList }) { - const [rows, setRows] = React.useState(recordList); +export default function UserTable_Individual({ searchCriteria }) { + const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); const navigate = useNavigate() useEffect(() => { - setRows(recordList); - }, [recordList]); + set_searchCriteria(searchCriteria); + }, [searchCriteria]); const handleActionClick = (id) => () => { navigate('/indUser/' + id); @@ -145,10 +146,13 @@ export default function UserTable_Individual({ recordList }) { return (
); diff --git a/src/pages/User/SearchPage_Individual/index.js b/src/pages/User/SearchPage_Individual/index.js index ae7b3e3..a43a912 100644 --- a/src/pages/User/SearchPage_Individual/index.js +++ b/src/pages/User/SearchPage_Individual/index.js @@ -2,20 +2,12 @@ import { Grid, Typography, Stack } from '@mui/material'; -import MainCard from "../../../components/MainCard"; +import MainCard from "components/MainCard"; import { useEffect, useState } from "react"; -//import axios from "axios"; -//import {apiPath} from "../../auth/utils"; -import { GET_IND_USER_PATH } from "../../../utils/ApiPathConst"; import * as React from "react"; -import * as HttpUtils from "../../../utils/HttpUtils"; - -//import LoadingComponent from "../extra-pages/LoadingComponent"; -//import SearchForm from "./UserSearchForm_Individual"; -//import EventTable from "./UserTable_Individual"; import Loadable from 'components/Loadable'; import { lazy } from 'react'; -const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent'))); +const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent'))); const SearchForm = Loadable(lazy(() => import('./UserSearchForm_Individual'))); const EventTable = Loadable(lazy(() => import('./UserTable_Individual'))); import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' @@ -33,32 +25,13 @@ const BackgroundHead = { const UserSearchPage_Individual = () => { - const [record, setRecord] = useState([]); const [searchCriteria, setSearchCriteria] = useState({}); const [onReady, setOnReady] = useState(false); - useEffect(() => { - getUserList(); - }, []); - useEffect(() => { setOnReady(true); - }, [record]); - - useEffect(() => { - getUserList(); }, [searchCriteria]); - function getUserList() { - HttpUtils.get({ - url: GET_IND_USER_PATH, - params: searchCriteria, - onSuccess: function (responseData) { - setRecord(responseData); - } - }); - } - function applySearch(input) { setSearchCriteria(input); } @@ -93,7 +66,7 @@ const UserSearchPage_Individual = () => { content={false} > diff --git a/src/pages/User/SearchPage_Organization/UserTable_Organization.js b/src/pages/User/SearchPage_Organization/UserTable_Organization.js index 8172344..361adb6 100644 --- a/src/pages/User/SearchPage_Organization/UserTable_Organization.js +++ b/src/pages/User/SearchPage_Organization/UserTable_Organization.js @@ -10,18 +10,19 @@ import {useEffect} from "react"; import {useNavigate} from "react-router-dom"; import HighlightOff from '@mui/icons-material/HighlightOff'; import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline'; -import * as DateUtils from '../../../utils/DateUtils'; +import * as DateUtils from 'utils/DateUtils'; +import { GET_ORG_USER_PATH } from "utils/ApiPathConst"; // ==============================|| EVENT TABLE ||============================== // -export default function UserTable_Organization({recordList}) { - const [rows, setRows] = React.useState(recordList); +export default function UserTable_Organization({searchCriteria}) { + const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); const navigate = useNavigate() useEffect(() => { - setRows(recordList); - }, [recordList]); + set_searchCriteria(searchCriteria); + }, [searchCriteria]); const handleActionClick = (id) => () => { navigate('/orgUser/'+ id); @@ -140,10 +141,13 @@ export default function UserTable_Organization({recordList}) { return (
); diff --git a/src/pages/User/SearchPage_Organization/index.js b/src/pages/User/SearchPage_Organization/index.js index e1bd268..f41a39b 100644 --- a/src/pages/User/SearchPage_Organization/index.js +++ b/src/pages/User/SearchPage_Organization/index.js @@ -4,15 +4,7 @@ import { } from '@mui/material'; import MainCard from "components/MainCard"; import { useEffect, useState } from "react"; -//import axios from "axios"; -//import {apiPath} from "../../auth/utils"; -import * as UrlUtils from "utils/ApiPathConst"; import * as React from "react"; -import * as HttpUtils from "utils/HttpUtils"; - -//import LoadingComponent from "../extra-pages/LoadingComponent"; -//import SearchForm from "./UserSearchForm_Organization"; -//import EventTable from "./UserTable_Organization"; import Loadable from 'components/Loadable'; import { lazy } from 'react'; const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent'))); @@ -34,32 +26,14 @@ const BackgroundHead = { const UserSearchPage_Organization = () => { - const [record, setRecord] = useState([]); const [searchCriteria, setSearchCriteria] = useState({}); const [onReady, setOnReady] = useState(false); - useEffect(() => { - getUserList(); - }, []); useEffect(() => { setOnReady(true); - }, [record]); - - useEffect(() => { - getUserList(); }, [searchCriteria]); - function getUserList() { - HttpUtils.get({ - url: UrlUtils.GET_ORG_USER_PATH, - params: searchCriteria, - onSuccess: function (responseData) { - setRecord(responseData); - } - }); - } - function applySearch(input) { setSearchCriteria(input); } @@ -91,7 +65,7 @@ const UserSearchPage_Organization = () => { content={false} > diff --git a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js index 86384a3..6dc5358 100644 --- a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js +++ b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js @@ -7,15 +7,16 @@ import {FiDataGrid} from "components/FiDataGrid"; import EditIcon from '@mui/icons-material/Edit'; import {useEffect} from "react"; import {useNavigate} from "react-router-dom"; +import { GET_GROUP_LIST_PATH } from "utils/ApiPathConst"; // ==============================|| EVENT TABLE ||============================== // -export default function UserGroupTable({recordList}) { - const [rows, setRows] = React.useState(recordList); +export default function UserGroupTable({searchCriteria}) { + const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); const navigate = useNavigate() useEffect(() => { - setRows(recordList); - }, [recordList]); + set_searchCriteria(searchCriteria); + }, [searchCriteria]); const handleEditClick = (id) => () => { navigate('/userGroup/'+ id); @@ -61,11 +62,14 @@ export default function UserGroupTable({recordList}) { return (
); diff --git a/src/pages/pnspsUserGroupSearchPage/index.js b/src/pages/pnspsUserGroupSearchPage/index.js index b8ce256..4aeba06 100644 --- a/src/pages/pnspsUserGroupSearchPage/index.js +++ b/src/pages/pnspsUserGroupSearchPage/index.js @@ -5,11 +5,8 @@ import { // Button, Grid, Typography } from '@mui/material'; -import MainCard from "../../components/MainCard"; +import MainCard from "components/MainCard"; import { useEffect, useState } from "react"; -import axios from "axios"; -import { apiPath } from "../../auth/utils"; -import { GET_GROUP_LIST_PATH } from "../../utils/ApiPathConst"; import * as React from "react"; //import LoadingComponent from "../extra-pages/LoadingComponent"; @@ -35,38 +32,13 @@ const BackgroundHead = { // ==============================|| DASHBOARD - DEFAULT ||============================== // const UserGroupSearchPanel = () => { - const [record, setRecord] = useState([]); const [searchCriteria, setSearchCriteria] = useState({}); const [onReady, setOnReady] = useState(false); - // const navigate = useNavigate(); - - useEffect(() => { - getGroupList(); - }, []); useEffect(() => { setOnReady(true); - }, [record]); - - useEffect(() => { - getGroupList(); }, [searchCriteria]); - function getGroupList() { - axios.get(`${apiPath}${GET_GROUP_LIST_PATH}`, - { params: searchCriteria } - ) - .then((response) => { - if (response.status === 200) { - setRecord(response.data.records); - } - }) - .catch(error => { - console.log(error); - return false; - }); - } - function applySearch(input) { setSearchCriteria(input); } @@ -101,7 +73,7 @@ const UserGroupSearchPanel = () => { content={false} > diff --git a/src/utils/ApiPathConst.js b/src/utils/ApiPathConst.js index 0ef48e9..a5670a0 100644 --- a/src/utils/ApiPathConst.js +++ b/src/utils/ApiPathConst.js @@ -7,7 +7,7 @@ export const CHANGE_PASSWORD_PATH = "/user/change-password" export const GET_SYS_PARAMS = apiPath+'/settings'; //Group Config -export const GET_GROUP_LIST_PATH = '/group'; +export const GET_GROUP_LIST_PATH = apiPath+'/group'; export const GET_GROUP_COMBO_PATH = '/group/combo'; export const GET_GROUP_MEMBER_LIST_PATH = '/group/member'; export const GET_GROUP_AUTH_LIST = '/group/auth/combo';