alex
/
PNSPS-frontend-MaterialUI
1
0
Vork 0
Code Kwesties 0 Pull-aanvragen 0 Publicaties 0 Wiki Activiteit
Bladeren bron

fix bug

master
Anna Ho 1 jaar geleden
bovenliggende
b8b6a3ac05
commit
d3f863f856
7 gewijzigde bestanden met toevoegingen van 264 en 244 verwijderingen
Zij-aan-zij weergave
Diff opties
Statistieken weergeven Download Patch-bestand Download Diff-bestand
  1. +207
    -213
      src/layout/MainLayout/Header/index.js
  2. +1
    -1
      src/pages/ManageOrgUserPage/index.js
  3. +11
    -3
      src/pages/PublicNotice/ListPanel/BaseGrid.js
  4. +11
    -2
      src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
  5. +1
    -1
      src/pages/PublicNotice/ListPanel/PublicNoteStatusUtils.js
  6. +0
    -1
      src/pages/PublicNoticeSearch_GLD/DataGrid.js
  7. +33
    -23
      src/pages/PublicNoticeSearch_GLD/SearchForm.js

+ 207
- 213
src/layout/MainLayout/Header/index.js Bestand weergeven

@@ -1,13 +1,13 @@
import PropTypes from 'prop-types';
import React
, { useState }
from 'react';
import { useDispatch } from "react-redux";
import { useNavigate } from "react-router-dom";
,{useState}
from 'react';
import {useDispatch} from "react-redux";
import {useNavigate} from "react-router-dom";

// material-ui
// import { useTheme } from '@mui/material/styles';
import {
import {
AppBar,
// Container,
Typography,
@@ -29,7 +29,7 @@ import {
IconButton,
Drawer,
// useMediaQuery
} from '@mui/material';
} from '@mui/material';
import MenuIcon from '@mui/icons-material/Menu';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';

@@ -41,7 +41,7 @@ import AdminLogo from 'components/AdminLogo';
import MobileLogo from 'components/MobileLogo';
import Profile from './HeaderContent/Profile';
import "assets/style/navbarStyles.css";
import { isUserLoggedIn, isGLDLoggedIn, isPrimaryLoggedIn } from "utils/Utils";
import {isUserLoggedIn,isGLDLoggedIn, isPrimaryLoggedIn} from "utils/Utils";
import { handleLogoutFunction } from 'auth/index';

// assets
@@ -69,83 +69,77 @@ function Header(props) {
//await handleLogoutFunction();
navigate('/login');
};
const loginContent = (
isGLDLoggedIn() ?
<div id="adminContent">
<li>
<Link className="dashboard" to='/dashboard'>Dashboard</Link>
</li>
<li>
<Link className="application" to='/dashboard'>Application</Link>
<ul className='dropdown'>
<li>
<Link className="applicationSearch" to='application/search'>Search Application</Link>
</li>

</ul>
</li>
<li>
<Link className="proof" to='/dashboard'>Proof</Link>
</li>
<li>
<Link className="payment" to='/dashboard'>Payment</Link>
</li>
<li>
<Link className="client" >Client<KeyboardArrowDownIcon /></Link>
<ul className='dropdown'>
<li>
<Link className="userSearchview" to='/userSearchview'>Users (GLD)</Link>
</li>
<li>
<Link className="indUser" to='/indUser'>Users (Individual)</Link>
</li>
<li>
<Link className="orgUser" to='/orgUser'>Users (Organization)</Link>
</li>
<li>
<Link className="org" to='/org'>Organization</Link>
</li>
<li>
<Link className="usergroupSearchview" to='/usergroupSearchview'>User Group</Link>
</li>
</ul>
</li>
<li>
<Link className="logout" onClick={handleLogout}>Logout</Link>
</li>
</div>
:
<div id="individualUserContent">
<li>
<Link className="dashboard" to='/dashboard'>主頁</Link>
</li>
<li>
<Link className="myDocumet" to='/publicNotice'>我的公共啟事</Link>
</li>
<li>
<Link className="documentRecord" to='/dashboard'>校對記錄</Link>
</li>
<li>
<Link className="paymentRecord" to='/dashboard'>付款記錄</Link>
</li>
<li>
<Link className="userSetting" to='/dashboard'>設定<KeyboardArrowDownIcon /></Link>
<ul className='dropdown'>
{isPrimaryLoggedIn() ?
<li>
<Link className="manageOrgUser" to='setting/manageUser'>公司/機構用戶記錄</Link>
</li>
:
<></>
}

</ul>
</li>
<li>
<Link className="logout" onClick={handleLogout}>登出</Link>
</li>
</div>
<div id="adminContent">
<li>
<Link className="dashboard" to='/dashboard'>Dashboard</Link>
</li>
<li>
<Link className="application" to='/dashboard'>Application</Link>
</li>
<li>
<Link className="proof" to='/dashboard'>Proof</Link>
</li>
<li>
<Link className="payment" to='/dashboard'>Payment</Link>
</li>
<li>
<Link className="client" >Client<KeyboardArrowDownIcon/></Link>
<ul className='dropdown'>
<li>
<Link className="userSearchview" to='/userSearchview'>Users (GLD)</Link>
</li>
<li>
<Link className="indUser" to='/indUser'>Users (Individual)</Link>
</li>
<li>
<Link className="orgUser" to='/orgUser'>Users (Organization)</Link>
</li>
<li>
<Link className="org" to='/org'>Organization</Link>
</li>
<li>
<Link className="usergroupSearchview" to='/usergroupSearchview'>User Group</Link>
</li>
</ul>
</li>
<li>
<Link className="logout" onClick={handleLogout}>Logout</Link>
</li>
</div>
:
<div id="individualUserContent">
<li>
<Link className="dashboard" to='/dashboard'>主頁</Link>
</li>
<li>
<Link className="myDocumet" to='/publicNotice'>我的公共啟事</Link>
</li>
<li>
<Link className="documentRecord" to='/dashboard'>校對記錄</Link>
</li>
<li>
<Link className="paymentRecord" to='/dashboard'>付款記錄</Link>
</li>
<li>
<Link className="userSetting" to='/dashboard'>設定<KeyboardArrowDownIcon/></Link>
<ul className='dropdown'>
{ isPrimaryLoggedIn()?
<li>
<Link className="manageOrgUser" to='setting/manageUser'>公司/機構用戶記錄</Link>
</li>
:
<></>
}
</ul>
</li>
<li>
<Link className="logout" onClick={handleLogout}>登出</Link>
</li>
</div>
);

const logoutContent = (
@@ -160,7 +154,7 @@ function Header(props) {
);

const drawer = (
isUserLoggedIn() ?
isUserLoggedIn()?
<Stack id="sidebar" direction="column" justifyContent="center" alignItems="center" onClick={handleDrawerToggle} sx={{ textAlign: 'center' }}>
<Typography variant="h6" sx={{ my: 2 }}>
PNSPS
@@ -176,7 +170,7 @@ function Header(props) {
</li>
</ul>
</Stack>
:
:
<Stack id="sidebar" direction="column" justifyContent="center" alignItems="center" onClick={handleDrawerToggle} sx={{ textAlign: 'center' }}>
<Typography variant="h6" sx={{ my: 2 }}>
PNSPS
@@ -191,165 +185,165 @@ function Header(props) {

const container = window !== undefined ? () => window().document.body : undefined;
return (
isUserLoggedIn() ?
// User Login success
<Box>
<AppBar component="nav">
<Toolbar id="nav" width="100%">
{isGLDLoggedIn()
? <Stack
direction="row"
justifyContent="flex-start"
alignItems="center"
spacing={0}
>
<Box sx={{ display: { xs: 'none', sm: 'block' } }}>
<AdminLogo />
</Box>
<IconButton
isUserLoggedIn() ?
// User Login success
<Box>
<AppBar component="nav">
<Toolbar id ="nav" width="100%">
{isGLDLoggedIn()
?<Stack
direction="row"
justifyContent="flex-start"
alignItems="center"
spacing={0}
>
<Box sx={{display: { xs: 'none', sm: 'block' } }}>
<AdminLogo/>
</Box>
<IconButton
color="inherit"
aria-label="open drawer"
edge="start"
onClick={handleDrawerToggle}
sx={{ mr: 2, display: { sm: 'none' } }}
>
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{ mr: 2, display: { sm: 'none' } }}>
<MobileLogo />
<span id="mobileTitle" >PNSPS</span>
</Box>
</Stack> :
<Stack
direction="row"
justifyContent="flex-start"
alignItems="center"
spacing={0}
>
<Box sx={{ width: '260px', flexGrow: 1, display: { xs: 'none', sm: 'block' } }}>
<Stack direction="row" justifyContent="flex-start" alignItems="center">
<Logo />
<Stack justifyContent="flex-start" alignItems="center">
<span id="systemTitle">公共啟事提交</span>
<span id="systemTitle">及繳費系統</span>
</Stack>
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{mr: 2, display: { sm: 'none' } }}>
<MobileLogo/>
<span id="mobileTitle" >PNSPS</span>
</Box>
</Stack>:
<Stack
direction="row"
justifyContent="flex-start"
alignItems="center"
spacing={0}
>
<Box sx={{width:'260px', flexGrow: 1,display: { xs: 'none', sm: 'block' } }}>
<Stack direction="row" justifyContent="flex-start" alignItems="center">
<Logo/>
<Stack justifyContent="flex-start" alignItems="center">
<span id="systemTitle">公共啟事提交</span>
<span id="systemTitle">及繳費系統</span>
</Stack>
</Box>
<IconButton
</Stack>
</Box>
<IconButton
color="inherit"
aria-label="open drawer"
edge="start"
onClick={handleDrawerToggle}
sx={{ mr: 2, display: { sm: 'none' } }}
>
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{ mr: 2, display: { sm: 'none' } }}>
<Stack direction="row" justifyContent="flex-start" alignItems="center">
<MobileLogo />
<span id="mobileTitle" >公共啟事提交及繳費系統</span>
</Stack>
</Box>
</Stack>
}

<Box sx={{ display: { xs: 'none', sm: 'block' }, width: "100%" }}>
<Stack
direction="row"
justifyContent="space-between"
alignItems="center"
spacing={1}
>
<ul id="navbar" width="100%" >
{loginContent}
</ul>
<Profile />
</Stack>
</Box>
</Toolbar>
</AppBar>
<Box component="nav">
<Drawer
container={container}
variant="temporary"
open={mobileOpen}
onClose={handleDrawerToggle}
ModalProps={{
keepMounted: true, // Better open performance on mobile.
}}
sx={{
display: { xs: 'block', sm: 'none' },
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
}}
>
{drawer}
</Drawer>
</Box>
</Box> :
<Box>
<AppBar component="nav">
<Toolbar id="nav" width="100%">
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{mr: 2, display: { sm: 'none' } }}>
<Stack direction="row" justifyContent="flex-start" alignItems="center">
<MobileLogo/>
<span id="mobileTitle" >公共啟事提交及繳費系統</span>
</Stack>
</Box>
</Stack>
}
<Box sx={{display: { xs: 'none', sm: 'block' } ,width:"100%"}}>
<Stack
direction="row"
justifyContent="flex-start"
justifyContent="space-between"
alignItems="center"
spacing={0}
spacing={1}
>
<Box sx={{ flexGrow: 1, display: { xs: 'none', sm: 'block' } }}>
<ul id="navbar" width="100%" >
{loginContent}
</ul>
<Profile />
</Stack>
</Box>
</Toolbar>
</AppBar>
<Box component="nav">
<Drawer
container={container}
variant="temporary"
open={mobileOpen}
onClose={handleDrawerToggle}
ModalProps={{
keepMounted: true, // Better open performance on mobile.
}}
sx={{
display: { xs: 'block', sm: 'none' },
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
}}
>
{drawer}
</Drawer>
</Box>
</Box>:
<Box>
<AppBar component="nav">
<Toolbar id ="nav" width="100%">
<Stack
direction="row"
justifyContent="flex-start"
alignItems="center"
spacing={0}
>
<Box sx={{flexGrow: 1,display: { xs: 'none', sm: 'block' } }}>
<Stack direction="row" justifyContent="flex-start" alignItems="center">
<Logo />
<Stack justifyContent="flex-start" alignItems="center">
<Logo/>
<Stack justifyContent="flex-start" alignItems="center">
<span id="systemTitle">公共啟事提交及繳費系統</span>
</Stack>
</Stack>
</Box>
<IconButton
<IconButton
color="inherit"
aria-label="open drawer"
edge="start"
onClick={handleDrawerToggle}
sx={{ mr: 2, display: { sm: 'none' } }}
>
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{ mr: 2, display: { sm: 'none' } }}>
<MobileLogo />
<span id="mobileTitle" >公共啟事提交及繳費系統</span>
</Box>
<MenuIcon style={{ color: '#0C489E' }} />
</IconButton>
<Box sx={{mr: 2, display: { sm: 'none' } }}>
<MobileLogo/>
<span id="mobileTitle" >公共啟事提交及繳費系統</span>
</Box>
</Stack>
<Box sx={{display: { xs: 'none', sm: 'block' } ,width:"75%"}}>
<Stack
direction="row"
justifyContent="space-between"
alignItems="center"
spacing={1}
>
<ul id="navbar" width="100%" >
{logoutContent}
</ul>
{/* <Profile /> */}
</Stack>
<Box sx={{ display: { xs: 'none', sm: 'block' }, width: "75%" }}>
<Stack
direction="row"
justifyContent="space-between"
alignItems="center"
spacing={1}
>
<ul id="navbar" width="100%" >
{logoutContent}
</ul>
{/* <Profile /> */}
</Stack>
</Box>
</Toolbar>
</AppBar>
<Box component="nav">
<Drawer
container={container}
variant="temporary"
open={mobileOpen}
onClose={handleDrawerToggle}
ModalProps={{
keepMounted: true, // Better open performance on mobile.
}}
sx={{
display: { xs: 'block', sm: 'none' },
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
}}
>
{drawer}
</Drawer>
</Box>
</Box>
</Toolbar>
</AppBar>
<Box component="nav">
<Drawer
container={container}
variant="temporary"
open={mobileOpen}
onClose={handleDrawerToggle}
ModalProps={{
keepMounted: true, // Better open performance on mobile.
}}
sx={{
display: { xs: 'block', sm: 'none' },
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: drawerWidth },
}}
>
{drawer}
</Drawer>
</Box>
</Box>
);
}
Header.propTypes = {


+ 1
- 1
src/pages/ManageOrgUserPage/index.js Bestand weergeven

@@ -73,7 +73,7 @@ const ManageOrgUserPage = () => {

function getStatusTag({color="#000", textColor="#FFF",text=""}){
return (
<div style={{"border-radius":"25px" ,"background": color, "color":textColor, "padding":"5px 10px 5px 10px"}}><b>{text}</b></div>
<div style={{borderRadius:"25px" ,"background": color, "color":textColor, "padding":"5px 10px 5px 10px"}}><b>{text}</b></div>
)
}



+ 11
- 3
src/pages/PublicNotice/ListPanel/BaseGrid.js Bestand weergeven

@@ -72,9 +72,8 @@ export default function BaseGrid({rows}) {
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 50,
width: 80,
cellClassName: 'actions',
renderCell: () => {
return <Button onClick={()=>{}}>查看詳細</Button>;
@@ -83,7 +82,7 @@ export default function BaseGrid({rows}) {
];

return (
<div style={{height: 400, width: '100%'}}>
<div style={{height: 400, width: '100%', padding: 4}}>
<DataGrid
rows={rows}
columns={columns}
@@ -96,6 +95,15 @@ export default function BaseGrid({rows}) {
}}
pageSizeOptions={[5, 10]}
autoHeight = {true}
sx={{
padding: "4 2 4 2",
boxShadow: 1,
border: 1,
borderColor: '#DDD',
'& .super-app-theme--header': {
backgroundColor: '#EEE',
},
}}
/>
</div>
);


+ 11
- 2
src/pages/PublicNotice/ListPanel/PendingPaymentTab.js Bestand weergeven

@@ -80,7 +80,7 @@ export default function SubmittedTab({ rows }) {
field: 'actions',
type: 'actions',
headerName: '',
width: 50,
width: 100,
cellClassName: 'actions',
renderCell: () => {
return <Button onClick={() => { }}>查看詳細</Button>;
@@ -105,7 +105,7 @@ export default function SubmittedTab({ rows }) {

return (
<>
<div style={{ height: 400, width: '100%' }}>
<div style={{ height: 400, width: '100%', padding: 4 }}>
<DataGrid
checkboxSelection
disableRowSelectionOnClick
@@ -123,6 +123,15 @@ export default function SubmittedTab({ rows }) {
onRowSelectionModelChange={(newSelection) => {
setSelectedRowItems(newSelection);
}}
sx={{
margin: "4 2 4 2",
boxShadow: 1,
border: 1,
borderColor: '#DDD',
'& .super-app-theme--header': {
backgroundColor: '#EEE',
},
}}
/>
<Button variant="contained" onClick={() => { setIsPopUp(true) }}>付款</Button>
</div>


+ 1
- 1
src/pages/PublicNotice/ListPanel/PublicNoteStatusUtils.js Bestand weergeven

@@ -48,6 +48,6 @@ export function getStatusEng(params) {

export function getStatusTag({ color = "#000", textColor = "#FFF", text = "" }) {
return (
<div style={{ "border-radius": "25px", "background": color, "color": textColor, "padding": "5px 10px 5px 10px" }}><b>{text}</b></div>
<div style={{ borderRadius: "25px", "background": color, "color": textColor, "padding": "5px 10px 5px 10px" }}><b>{text}</b></div>
)
}

+ 0
- 1
src/pages/PublicNoticeSearch_GLD/DataGrid.js Bestand weergeven

@@ -77,7 +77,6 @@ export default function SearchPublicNoticeTable({ recordList }) {
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 100,
cellClassName: 'actions',


+ 33
- 23
src/pages/PublicNoticeSearch_GLD/SearchForm.js Bestand weergeven

@@ -16,6 +16,7 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => {

const [type, setType] = React.useState([]);
const [status, setStatus] = React.useState();
const [orgLabel, setOrgLabel] = React.useState();
const [orgId, setOrgId] = React.useState();
const [orgCombo, setOrgCombo] = React.useState();

@@ -35,21 +36,23 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => {
dateTo: data.dateTo,
contact: data.contact,
status: status?.type,
orgId:orgId?.key,
orgId: orgId?.key,
};
applySearch(temp);
};

React.useEffect(()=>{
if(orgComboData && orgComboData.length>0){
React.useEffect(() => {
if (orgComboData && orgComboData.length > 0) {
setOrgCombo(orgComboData);
}
},[orgComboData]);
}, [orgComboData]);

function resetForm() {
setType([]);
setStatus();
setOrgId();
setOrgLabel("");
//orgComboRef.current.clearValue();
reset();
}

@@ -132,26 +135,33 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => {
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<Autocomplete
{...register("orgId")}
disablePortal
id="orgId"
options={orgCombo}
value={orgId}
getOptionLabel={(option) => option.label || ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setOrgId(newValue);
}
}}
renderInput={(params) => (
<TextField {...params}
label="Organization"
{
orgCombo ?
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<Autocomplete
{...register("orgId")}
disablePortal
id="orgId"
options={orgCombo}
inputValue={orgLabel}
onChange={(event, newValue) => {
if (newValue !== null) {
setOrgId(newValue);
setOrgLabel(newValue.label);
} else {
setOrgLabel("");
}
}}
renderInput={(params) => (
<TextField {...params}
label="Organization"
/>
)}
/>
)}
/>
</Grid>
</Grid>
: <></>
}


</Grid>



Schrijf Voorbeeld
Laden…
Annuleren
Opslaan