alex
/
PNSPS-frontend-MaterialUI
1
0
Разклонения 0
Код Задачи 0 Заявки за сливане 0 Версии 0 Уики Activity
Преглед на файлове

update dashboard loading

CR003
Alex Cheung преди 1 година
родител
37a6b1f9e9
ревизия
cbc8eb2c90
променени са 4 файла, в които са добавени 201 реда и са изтрити 101 реда
Разделен изглед
Diff Options
Показване на статистика Download Patch File Download Diff File
  1. +25
    -0
      src/pages/User/GLDUserProfile/UserInformationCard.js
  2. +13
    -27
      src/pages/dashboard/Public/Message.js
  3. +6
    -9
      src/pages/dashboard/Public/Notice.js
  4. +157
    -65
      src/pages/dashboard/Public/index.js

+ 25
- 0
src/pages/User/GLDUserProfile/UserInformationCard.js Целия файл

@@ -13,6 +13,7 @@ import * as React from "react";
import {useEffect, useState} from "react";
import Loadable from 'components/Loadable';
import { lazy } from 'react';
import { dateStr } from 'utils/DateUtils';
const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));


@@ -149,6 +150,30 @@ const UserInformationCard = ({userData}) => {
</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>Password Expiry Date:</FormLabel>
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<FormControl variant="outlined" fullWidth>
<OutlinedInput
fullWidth
size="small"
value={dateStr(currentUserData.passwordExpiryDate)}
disabled={true}
// {...register("emailAddress",
// {
// })}
id='passwordExpiryDate'
/>
</FormControl>
</Grid>
</Grid>
</Grid>

</Grid>



+ 13
- 27
src/pages/dashboard/Public/Message.js Целия файл

@@ -1,49 +1,35 @@
// material-ui
import {
Stack,
Typography,
Button
// Typography,
// Button
} from '@mui/material';
import MainCard from "components/MainCard";
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";
import * as UrlUtils from "utils/ApiPathConst";
import * as DateUtils from "utils/DateUtils";
// import * as HttpUtils from "utils/HttpUtils";
// import * as UrlUtils from "utils/ApiPathConst";
// import * as DateUtils from "utils/DateUtils";

import { useNavigate } from "react-router-dom";
// import { useNavigate } from "react-router-dom";

// ==============================|| DASHBOARD - DEFAULT ||============================== //


const SearchDemandNoteForm = () => {
const navigate = useNavigate()
const SearchDemandNoteForm = (props) => {
// const navigate = useNavigate()
const [itemList, setItemList] = React.useState([]);

React.useEffect(() => {
loadData();
// props.setMessageOnReady(true);
}, []);

const loadData = () => {
if(props.itemList.length > 0){
setItemList(props.itemList)
}
// props.setMessageOnReady(true);

HttpUtils.get({
url: UrlUtils.GET_MSG_DASHBOARD,
onSuccess: function (response) {
let list = []
response.map((item) => {
list.push(
<Button onClick={()=>{navigate("/msg/details/"+item.id);}} color={item.readTime?"gray":"black"} style={{justifyContent: "flex-start"}} sx={{p:2}}>
<Stack direction="column" >
<Typography variant='h4' align="justify"><b>{item.subject}</b></Typography>
<Typography align="justify">{DateUtils.datetimeStr(item.sentDate)}</Typography>
</Stack>
</Button>
)
});

setItemList(list);

}
});
};




+ 6
- 9
src/pages/dashboard/Public/Notice.js Целия файл

@@ -6,15 +6,15 @@ import {
} from '@mui/material';
import MainCard from "components/MainCard";
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";
import * as UrlUtils from "utils/ApiPathConst";
// import * as HttpUtils from "utils/HttpUtils";
// import * as UrlUtils from "utils/ApiPathConst";
import * as DateUtils from "utils/DateUtils";
import { useIntl} from "react-intl";

// ==============================|| DASHBOARD - DEFAULT ||============================== //


const SearchDemandNoteForm = () => {
const SearchDemandNoteForm = (props) => {

const [itemList, setItemList] = React.useState([]);
const [listData, setListData] = React.useState([]);
@@ -44,12 +44,9 @@ const SearchDemandNoteForm = () => {

const loadData = () => {

HttpUtils.get({
url: UrlUtils.GET_ANNOUNCE_DASHBOARD,
onSuccess: function (response) {
setListData(response);
}
});
if(props.listData.length > 0){
setListData(props.listData)
}
};




+ 157
- 65
src/pages/dashboard/Public/index.js Целия файл

@@ -1,4 +1,4 @@
// import { useState } from 'react';
import { useState } from 'react';

// material-ui
import {
@@ -14,8 +14,15 @@ import { FormattedMessage, useIntl } from "react-intl";
import AdsClickRoundedIcon from '@mui/icons-material/AdsClickRounded';
import * as React from "react";
import Loadable from 'components/Loadable';
import * as HttpUtils from "utils/HttpUtils";
import * as UrlUtils from "utils/ApiPathConst";
import * as DateUtils from "utils/DateUtils";

const Message = Loadable(React.lazy(() => import('./Message')));
const Notice = Loadable(React.lazy(() => import('./Notice')));
// import { lazy } from 'react';

const LoadingComponent = Loadable(React.lazy(() => import('../../extra-pages/LoadingComponent')));

import { useNavigate } from "react-router-dom";

@@ -37,8 +44,19 @@ const DashboardDefault = () => {
}

const { locale } = intl;
const [messageOnReady, setMessageOnReady] = useState(false);
const [onNoticeReady, setNoticeOnReady] = useState(false);
const [isLoading, setLoding] = useState(true);
const [itemList, setItemList] = React.useState([]);
const [listData, setListData] = React.useState([]);

React.useEffect(() => {
loadMessageData()
loadNoticeData()
}, []);

const getWelcomeMsg=()=>{
var current = new Date()
var curHr = current.getHours()

@@ -51,77 +69,151 @@ const DashboardDefault = () => {
}
}

React.useEffect(() => {
// console.log(messageOnReady)
// console.log(onNoticeReady)
if(messageOnReady&&onNoticeReady){
setLoding(false)
// console.log(123)
}
}, [messageOnReady,onNoticeReady]);

const loadMessageData = () => {
HttpUtils.get({
url: UrlUtils.GET_MSG_DASHBOARD,
onSuccess: function (response) {
let list = []
response.map((item) => {
list.push(
<Button onClick={()=>{navigate("/msg/details/"+item.id);}} color={item.readTime?"gray":"black"} style={{justifyContent: "flex-start"}} sx={{p:2}}>
<Stack direction="column" >
<Typography variant='h4' align="justify"><b>{item.subject}</b></Typography>
<Typography align="justify">{DateUtils.datetimeStr(item.sentDate)}</Typography>
</Stack>
</Button>
)
});

setItemList(list);
setMessageOnReady(true);
// console.log('123')
},
onError: function (){
// console.log('123')
setMessageOnReady(true);
}
});
// props.setMessageOnReady(true);

};

const loadNoticeData = () => {
HttpUtils.get({
url: UrlUtils.GET_ANNOUNCE_DASHBOARD,
onSuccess: function (response) {
setListData(response);
setNoticeOnReady(true)
},
onError: function () {
setNoticeOnReady(true)
}
});
};

return (
<Grid container sx={{ minHeight: '87vh' }} direction="column">
<Grid item xs={12} >
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
{/* <Typography variant="h5">我的公共啟事</Typography> */}
<Typography color='#FFF' variant="h5" sx={{ ml: 10, display: { xs: 'none', sm: 'none', md: 'block' } }}>
{isORGLoggedIn() ? userData.fullenName: (locale === 'en' ?userData.fullenName: userData.fullchName)}, {getWelcomeMsg()}
</Typography>
</Stack>
</div>
</Grid>
<Grid item xs={12} md={12} sx={{ textAlign: "center" }}>
<Grid container justifyContent="center" spacing={2} sx={{ pt: 2 }} alignitems="stretch" >
<Grid item xs={12} lg={5} sx={{ pt: 2 }} style={{ height: '100%' }}>
<Button
xs={12} onClick={() => { navigate("/publicNotice/apply"); }}
style={{ justifyContent: "flex-start" }}
aria-label={intl.formatMessage({ id: 'submitApplication' })}
sx={{ width: "100%", p: 4, border: '3px solid #e1edfc', borderRadius: '10px', backgroundColor: "#e1edfc" }}
>
<Stack direction="row" spacing={2}>
<AdsClickRoundedIcon />
<Stack direction="column" alignItems="start">
<Typography variant="h4" >
<FormattedMessage id="submitApplication" />
</Typography>
<Typography >
<FormattedMessage id="applicationSubheading" />
isLoading ?
<Grid container sx={{ minHeight: '87vh' }} direction="column">
<Grid item xs={12} >
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
{/* <Typography variant="h5">我的公共啟事</Typography> */}
<Typography color='#FFF' variant="h5" sx={{ ml: 10, display: { xs: 'none', sm: 'none', md: 'block' } }}>
{isORGLoggedIn() ? userData.fullenName: (locale === 'en' ?userData.fullenName: userData.fullchName)}, {getWelcomeMsg()}
</Typography>
</Stack>
</div>
</Grid>
<Grid item xs={12} md={12} sx={{ textAlign: "center" }}>
<Grid container sx={{ minHeight: '75vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
</Grid>
</Grid>
</Grid>
</Grid>
:
<Grid container sx={{ minHeight: '87vh' }} direction="column">
<Grid item xs={12} >
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
{/* <Typography variant="h5">我的公共啟事</Typography> */}
<Typography color='#FFF' variant="h5" sx={{ ml: 10, display: { xs: 'none', sm: 'none', md: 'block' } }}>
{isORGLoggedIn() ? userData.fullenName: (locale === 'en' ?userData.fullenName: userData.fullchName)}, {getWelcomeMsg()}
</Typography>
</Stack>
</Button>
<Stack direction="row" justifyContent="space-between" sx={{ pl: 2, pr: 2, pt: 2 }} >
<Typography variant="h4">
<FormattedMessage id="announcement" />
</Typography>
<Button
color="gray"
aria-label={intl.formatMessage({ id: 'viewAllAnnouncement' })}
onClick={()=>{navigate("/announcement/search")}}
><u>
<FormattedMessage id="viewAllAnnouncement" />
</u></Button>
</Stack>
<Box xs={12} md={12} sx={{ p: 1, border: '3px solid #eee', borderRadius: '10px' }} >
<Notice
/>
</Box>
</div>
</Grid>
<Grid item xs={12} lg={5} sx={{ pt: 2 }} style={{ height: '100%' }}>
<Stack direction="row" justifyContent="space-between" sx={{ pl: 2, pr: 2, pt: 2 }} >
<Typography variant="h4">
<FormattedMessage id="systemMessage" />
</Typography>
<Button
aria-label={intl.formatMessage({ id: 'viewAllSystemMessage' })}
onClick={() => { navigate("/msg/search"); }}
color="gray"
><u>
<FormattedMessage id="viewAllSystemMessage" />
</u></Button>
</Stack>
<Box xs={12} md={12} sx={{ p: 1, border: '3px solid #eee', borderRadius: '10px' }} >
<Message
/>
</Box>
<Grid item xs={12} md={12} sx={{ textAlign: "center" }}>
<Grid container justifyContent="center" spacing={2} sx={{ pt: 2 }} alignitems="stretch" >
<Grid item xs={12} lg={5} sx={{ pt: 2 }} style={{ height: '100%' }}>
<Button
xs={12} onClick={() => { navigate("/publicNotice/apply"); }}
style={{ justifyContent: "flex-start" }}
aria-label={intl.formatMessage({ id: 'submitApplication' })}
sx={{ width: "100%", p: 4, border: '3px solid #e1edfc', borderRadius: '10px', backgroundColor: "#e1edfc" }}
>
<Stack direction="row" spacing={2}>
<AdsClickRoundedIcon />
<Stack direction="column" alignItems="start">
<Typography variant="h4" >
<FormattedMessage id="submitApplication" />
</Typography>
<Typography >
<FormattedMessage id="applicationSubheading" />
</Typography>
</Stack>
</Stack>
</Button>
<Stack direction="row" justifyContent="space-between" sx={{ pl: 2, pr: 2, pt: 2 }} >
<Typography variant="h4">
<FormattedMessage id="announcement" />
</Typography>
<Button
color="gray"
aria-label={intl.formatMessage({ id: 'viewAllAnnouncement' })}
onClick={()=>{navigate("/announcement/search")}}
><u>
<FormattedMessage id="viewAllAnnouncement" />
</u></Button>
</Stack>
<Box xs={12} md={12} sx={{ p: 1, border: '3px solid #eee', borderRadius: '10px' }} >
<Notice
listData = {listData}
/>
</Box>
</Grid>
<Grid item xs={12} lg={5} sx={{ pt: 2 }} style={{ height: '100%' }}>
<Stack direction="row" justifyContent="space-between" sx={{ pl: 2, pr: 2, pt: 2 }} >
<Typography variant="h4">
<FormattedMessage id="systemMessage" />
</Typography>
<Button
aria-label={intl.formatMessage({ id: 'viewAllSystemMessage' })}
onClick={() => { navigate("/msg/search"); }}
color="gray"
><u>
<FormattedMessage id="viewAllSystemMessage" />
</u></Button>
</Stack>
<Box xs={12} md={12} sx={{ p: 1, border: '3px solid #eee', borderRadius: '10px' }} >
<Message
itemList = {itemList}
/>
</Box>
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
);
};



Пиши Преглед
Зареждане…
Отказ
Запис