diff --git a/src/assets/images/dashboard/gazette-bar.png b/src/assets/images/dashboard/gazette-bar.png
new file mode 100644
index 0000000..52bf6e5
Binary files /dev/null and b/src/assets/images/dashboard/gazette-bar.png differ
diff --git a/src/assets/style/navbarStyles.css b/src/assets/style/navbarStyles.css
index 28daa43..be5f102 100644
--- a/src/assets/style/navbarStyles.css
+++ b/src/assets/style/navbarStyles.css
@@ -58,14 +58,18 @@
border: 1px solid rgba(0,0,0,.15);
border-radius: 0.25rem;
}
-#navbar div li:hover > ul,
-#navbar div li:focus-within > ul,
+#navbar div li:hover > ul{
+ visibility: visible;
+ opacity: 1;
+ display: block
+ }
+/* #navbar div li:focus-within > ul,
#navbar div li ul:hover,
#navbar div li ul:focus {
visibility: visible;
opacity: 1;
display: block
-}
+} */
#systemTitle{
text-decoration: none;
font-size: 1.3rem;
diff --git a/src/pages/gldApplicationDetailPage/ApplicationDetailCard.js b/src/pages/gldApplicationDetailPage/ApplicationDetailCard.js
new file mode 100644
index 0000000..83e499b
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/ApplicationDetailCard.js
@@ -0,0 +1,365 @@
+// material-ui
+import {
+ FormControl,
+ Button,
+ Grid,
+ // InputAdornment,
+ Typography, FormLabel,
+ OutlinedInput,
+ Stack
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import * as React from "react";
+import {useForm} from "react-hook-form";
+import {
+ // useEffect,
+ useState
+ } from "react";
+// import Checkbox from "@mui/material/Checkbox";
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
+//import {useParams} from "react-router-dom";
+import BorderColorOutlinedIcon from '@mui/icons-material/BorderColorOutlined';
+import DoneIcon from '@mui/icons-material/Done';
+import CloseIcon from '@mui/icons-material/Close';
+import EditNoteIcon from '@mui/icons-material/EditNote';
+import DownloadIcon from '@mui/icons-material/Download';
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+const ApplicationDetailCard = (
+ // {isCollectData, updateUserObject,userData,isNewRecord}
+ ) => {
+ // const params = useParams();
+ const [currentApplicationDetailData, ] = React.useState({});
+ // const [locked, setLocked] = useState(false);
+ const [onReady,] = useState(true);
+ const {register,
+ // getValues
+ } = useForm()
+
+ // useEffect(() => {
+ // //if user data from parent are not null
+ // if (Object.keys(userData).length > 0 && userData !== undefined) {
+ // setCurrentUserData(userData.data);
+ // }
+ // }, []);
+
+ // useEffect(() => {
+ // //if state data are ready and assign to different field
+ // if (Object.keys(userData).length > 0 &¤tApplicationDetailData !== undefined&¤tApplicationDetailData.id!==undefined) {
+ // setLocked(currentApplicationDetailData.locked);
+ // setOnReady(true);
+ // }else if(isNewRecord){
+ // setLocked(false);
+ // setOnReady(true);
+ // }
+ // }, [currentApplicationDetailData]);
+
+ // useEffect(() => {
+ // //upload latest data to parent
+ // const values = getValues();
+ // const objectData ={
+ // ...values,
+ // locked: locked,
+ // }
+ // updateUserObject(objectData);
+ // }, [isCollectData]);
+
+
+ return (
+ !onReady ?
+
+ :
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Application Details
+
+
+
+ );
+};
+
+export default ApplicationDetailCard;
diff --git a/src/pages/gldApplicationDetailPage/ClientDetailCard.js b/src/pages/gldApplicationDetailPage/ClientDetailCard.js
new file mode 100644
index 0000000..903b866
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/ClientDetailCard.js
@@ -0,0 +1,226 @@
+// material-ui
+import {
+ FormControl,
+ Button,
+ Grid,
+ // InputAdornment,
+ Typography, FormLabel,
+ OutlinedInput,
+ Stack
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import * as React from "react";
+import {useForm} from "react-hook-form";
+import {
+ // useEffect,
+ useState
+ } from "react";
+// import Checkbox from "@mui/material/Checkbox";
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
+//import {useParams} from "react-router-dom";
+import ContentPasteSearchIcon from '@mui/icons-material/ContentPasteSearch';
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+const ClientDetailCard = (
+ // {isCollectData, updateUserObject,userData,isNewRecord}
+ ) => {
+ // const params = useParams();
+ const [currentApplicationDetailData, ] = React.useState({});
+ // const [locked, setLocked] = useState(false);
+ const [onReady,] = useState(true);
+ const {register,
+ // getValues
+ } = useForm()
+
+ // useEffect(() => {
+ // //if user data from parent are not null
+ // if (Object.keys(userData).length > 0 && userData !== undefined) {
+ // setCurrentUserData(userData.data);
+ // }
+ // }, []);
+
+ // useEffect(() => {
+ // //if state data are ready and assign to different field
+ // if (Object.keys(userData).length > 0 &¤tApplicationDetailData !== undefined&¤tApplicationDetailData.id!==undefined) {
+ // setLocked(currentApplicationDetailData.locked);
+ // setOnReady(true);
+ // }else if(isNewRecord){
+ // setLocked(false);
+ // setOnReady(true);
+ // }
+ // }, [currentApplicationDetailData]);
+
+ // useEffect(() => {
+ // //upload latest data to parent
+ // const values = getValues();
+ // const objectData ={
+ // ...values,
+ // locked: locked,
+ // }
+ // updateUserObject(objectData);
+ // }, [isCollectData]);
+
+
+ return (
+ !onReady ?
+
+ :
+
+
+
+
+
+
+
+
+
+ Client Details
+
+
+
+ );
+};
+
+export default ClientDetailCard;
diff --git a/src/pages/gldApplicationDetailPage/GazetteDetailCard.js b/src/pages/gldApplicationDetailPage/GazetteDetailCard.js
new file mode 100644
index 0000000..845deb0
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/GazetteDetailCard.js
@@ -0,0 +1,179 @@
+// material-ui
+import {
+ FormControl,
+ // Button,
+ Grid,
+ // InputAdornment,
+ Typography, FormLabel,
+ OutlinedInput,
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import * as React from "react";
+import {useForm} from "react-hook-form";
+import {
+ // useEffect,
+ useState
+ } from "react";
+// import Checkbox from "@mui/material/Checkbox";
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
+//import {useParams} from "react-router-dom";
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+const GazetteDetailCard = (
+ // {isCollectData, updateUserObject,userData,isNewRecord}
+ ) => {
+ // const params = useParams();
+ const [currentApplicationDetailData, ] = React.useState({});
+ // const [locked, setLocked] = useState(false);
+ const [onReady,] = useState(true);
+ const {register,
+ // getValues
+ } = useForm()
+
+ // useEffect(() => {
+ // //if user data from parent are not null
+ // if (Object.keys(userData).length > 0 && userData !== undefined) {
+ // setCurrentUserData(userData.data);
+ // }
+ // }, []);
+
+ // useEffect(() => {
+ // //if state data are ready and assign to different field
+ // if (Object.keys(userData).length > 0 &¤tApplicationDetailData !== undefined&¤tApplicationDetailData.id!==undefined) {
+ // setLocked(currentApplicationDetailData.locked);
+ // setOnReady(true);
+ // }else if(isNewRecord){
+ // setLocked(false);
+ // setOnReady(true);
+ // }
+ // }, [currentApplicationDetailData]);
+
+ // useEffect(() => {
+ // //upload latest data to parent
+ // const values = getValues();
+ // const objectData ={
+ // ...values,
+ // locked: locked,
+ // }
+ // updateUserObject(objectData);
+ // }, [isCollectData]);
+
+
+ return (
+ !onReady ?
+
+ :
+
+
+ Gazette Details
+
+
+
+ );
+};
+
+export default GazetteDetailCard;
diff --git a/src/pages/gldApplicationDetailPage/index.js b/src/pages/gldApplicationDetailPage/index.js
new file mode 100644
index 0000000..af5e5b5
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/index.js
@@ -0,0 +1,99 @@
+// import { useState } from 'react';
+
+// material-ui
+import {
+ Grid,
+ Typography,
+ Stack,
+ Box
+} from '@mui/material';
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+
+import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
+const ApplicationDetailCard = Loadable(lazy(() => import('./ApplicationDetailCard')));
+const GazetteDetailCard = Loadable(lazy(() => import('./GazetteDetailCard')));
+const ClientDetailCard = Loadable(lazy(() => import('./ClientDetailCard')));
+const TabTableDetail = Loadable(lazy(() => import('./tabTableDetail/TabTable')));
+
+// ==============================|| Body - DEFAULT ||============================== //
+
+const DashboardDefault = () => {
+ const BackgroundHead = {
+ backgroundImage: `url(${titleBackgroundImg})`,
+ width: '100%',
+ height: '100%',
+ backgroundSize:'cover'
+ }
+ const appNo = "G2023-343"
+ const gazetteIssue = "2023 Vol 027"
+ const issueNo = "No. 36"
+ const issueDate = "A001"
+
+ return (
+
+
+
+
+ Application
+
+
+
+
+
+ Application / {appNo}, {gazetteIssue}, {issueNo} , {issueDate}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default DashboardDefault;
diff --git a/src/pages/gldApplicationDetailPage/tabTableDetail/BaseGrid.js b/src/pages/gldApplicationDetailPage/tabTableDetail/BaseGrid.js
new file mode 100644
index 0000000..d27e41e
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/tabTableDetail/BaseGrid.js
@@ -0,0 +1,93 @@
+// material-ui
+import * as React from 'react';
+import {
+ DataGrid,
+} from "@mui/x-data-grid";
+import {
+ Button
+} from '@mui/material';
+import * as DateUtils from "utils/DateUtils"
+// import * as StatusUtils from "./PublicNoteStatusUtils";
+// ==============================|| EVENT TABLE ||============================== //
+
+export default function BaseGrid({rows}) {
+ const [rowModesModel] = React.useState({});
+
+ const columns = [
+ {
+ id: 'appNo',
+ field: 'appNo',
+ headerName: '申請編號',
+ flex: 1,
+ },
+ {
+ id: 'created',
+ field: 'created',
+ headerName: '提交日期',
+ flex: 1,
+ valueGetter:(params)=>{
+ return DateUtils.datetimeStr(params?.value);
+ }
+ },
+ {
+ id: 'contactPerson',
+ field: 'contactPerson',
+ headerName: '聯絡人',
+ flex: 2,
+ renderCell: (params) => {
+ let phone = JSON.parse(params.row.contactTelNo);
+ let faxNo = JSON.parse(params.row.contactFaxNo);
+
+ let contact = "";
+ if (phone) {
+ contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber
+ }
+
+ if (faxNo) {
+ if (contact != "")
+ contact = contact + ", "
+ contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber
+ }
+
+ return (<>
+ {params?.value}
+ {contact}
+ >);
+ }
+ },
+ {
+ id: 'remarks',
+ field: 'remarks',
+ headerName: '我的備註',
+ flex: 3,
+ },
+ {
+ field: 'actions',
+ type: 'actions',
+ headerName: '',
+ width: 50,
+ cellClassName: 'actions',
+ renderCell: () => {
+ return ;
+ },
+ }
+ ];
+
+ return (
+
+
+
+ );
+}
diff --git a/src/pages/gldApplicationDetailPage/tabTableDetail/PendingPaymentTab.js b/src/pages/gldApplicationDetailPage/tabTableDetail/PendingPaymentTab.js
new file mode 100644
index 0000000..aadbee7
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/tabTableDetail/PendingPaymentTab.js
@@ -0,0 +1,141 @@
+// material-ui
+import * as React from 'react';
+import {
+ DataGrid,
+} from "@mui/x-data-grid";
+import {
+ Stack,
+ Typography,
+ Button,
+ Dialog, DialogTitle, DialogContent, DialogActions
+} from '@mui/material';
+import * as DateUtils from "utils/DateUtils"
+// import * as StatusUtils from "./PublicNoteStatusUtils";
+// ==============================|| EVENT TABLE ||============================== //
+
+export default function SubmittedTab({ rows }) {
+ const [selectedRowItems, setSelectedRowItems] = React.useState([]);
+ const [isPopUp, setIsPopUp] = React.useState(false);
+
+
+ const columns = [
+ {
+ id: 'appNo',
+ field: 'appNo',
+ headerName: '申請編號',
+ flex: 1,
+ },
+ {
+ id: 'created',
+ field: 'created',
+ headerName: '提交日期',
+ flex: 1,
+ valueGetter: (params) => {
+ return DateUtils.datetimeStr(params.value);
+ }
+ },
+ {
+ id: 'contactPerson',
+ field: 'contactPerson',
+ headerName: '聯絡人',
+ flex: 2,
+ renderCell: (params) => {
+ let phone = JSON.parse(params.row.contactTelNo);
+ let faxNo = JSON.parse(params.row.contactFaxNo);
+
+ let contact = "";
+ if (phone) {
+ contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber
+ }
+
+ if (faxNo) {
+ if (contact != "")
+ contact = contact + ", "
+ contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber
+ }
+
+ return (<>
+ {params?.value}
+ {contact}
+ >);
+ }
+ },
+ {
+ id: 'remarks',
+ field: 'remarks',
+ headerName: '我的備註',
+ flex: 3,
+
+ },
+ {
+ field: 'actions',
+ type: 'actions',
+ headerName: '',
+ width: 50,
+ cellClassName: 'actions',
+ renderCell: () => {
+ return ;
+ },
+ }
+ ];
+
+ const getWindowContent = () => {
+ var content = [];
+ const datas = rows?.filter((row) =>
+ selectedRowItems.includes(row.id)
+ );
+ for (var i = 0; i < datas?.length; i++) {
+ content.push(<>
+ 申請編號: {datas[i].appNo}({DateUtils.datetimeStr(datas[i].created)})
+ 備註: {datas[i].remarks}
+
+ >);
+ }
+ return content;
+ }
+
+ return (
+ <>
+
+ {
+ setSelectedRowItems(newSelection);
+ }}
+ />
+
+
+
+
+
+
+ >
+ );
+
+
+
+}
diff --git a/src/pages/gldApplicationDetailPage/tabTableDetail/TabTable.js b/src/pages/gldApplicationDetailPage/tabTableDetail/TabTable.js
new file mode 100644
index 0000000..3b44b92
--- /dev/null
+++ b/src/pages/gldApplicationDetailPage/tabTableDetail/TabTable.js
@@ -0,0 +1,111 @@
+// material-ui
+import {
+ Grid,
+ // Typography,
+ Tab,
+ Box,
+ // Button
+} from '@mui/material';
+
+import { TabPanel, TabContext, TabList } from '@mui/lab';
+import {
+ // useEffect,
+ useState } from "react";
+// import { useNavigate } from "react-router-dom";
+import * as React from "react";
+// import * as HttpUtils from "../../../utils/HttpUtils";
+// import * as UrlUtils from "../../../utils/ApiPathConst";
+
+import Loadable from 'components/Loadable';
+import { lazy } from 'react';
+const BaseGrid = Loadable(lazy(() => import('./BaseGrid')));
+const PendingPaymentTab = Loadable(lazy(() => import('./PendingPaymentTab')));
+const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
+// const SearchTab = Loadable(lazy(() => import('./SearchPublicNoticeTab')));
+
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+const PublicNotice = () => {
+ const [submittedList, ] = useState([]);
+ const [inProgressList, ] = useState([]);
+ const [pendingPaymentList, ] = useState([]);
+ const [isLoading,] = useState(false);
+ const [selectedTab, setSelectedTab] = useState("1");
+ // const navigate = useNavigate();
+
+
+ // useEffect(() => {
+ // loadData();
+ // }, []);
+
+ const reloadPage = () => {
+ window.location.reload(false);
+ }
+
+ // const loadData = () => {
+ // setLoding(true);
+ // HttpUtils.get({
+ // url: `${UrlUtils.GET_PUBLIC_NOTICE_LIST_ListByStatus}`,
+ // onSuccess: function (response) {
+ // setSubmittedList(response["submitted"]);
+ // setInProgressList(response["inProgress"]);
+ // setPendingPaymentList(response["pendingPayment"]);
+ // setPendingPublishList(response["pendingPublish"]);
+ // }
+ // });
+ // };
+
+ // useEffect(() => {
+ // setLoding(false);
+ // }, [submittedList]);
+
+ const handleChange = (event, newValue) => {
+ setSelectedTab(newValue);
+ }
+
+ // const onBtnClick = () => {
+ // navigate('/publicNotice/apply')
+ // }
+
+ return (
+ isLoading ?
+
+ :
+
+ {/*col 2*/}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+
+export default PublicNotice;
diff --git a/src/pages/gldDashboard/index.js b/src/pages/gldDashboard/index.js
index 0e72665..1e9d81f 100644
--- a/src/pages/gldDashboard/index.js
+++ b/src/pages/gldDashboard/index.js
@@ -6,26 +6,26 @@ import {
Typography,
Stack
} from '@mui/material';
-
+import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const DashboardDefault = () => {
const userData = JSON.parse(localStorage.getItem("userData"));
const BackgroundHead = {
- backgroundColor: '#0d47a1',
+ backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
height: '100%',
backgroundSize:'cover'
}
return (
-
-
-
-
- Morning, {userData.fullenName}
+
+
+
+
+ Morning, {userData.fullenName}
-
-
+
+
);
};
diff --git a/src/pages/pnspsUserDetailPage/index.js b/src/pages/pnspsUserDetailPage/index.js
index fc14732..ab28ad6 100644
--- a/src/pages/pnspsUserDetailPage/index.js
+++ b/src/pages/pnspsUserDetailPage/index.js
@@ -190,7 +190,7 @@ const UserMaintainPage = () => {
!onReady ?
:
-
+
Maintain User
diff --git a/src/pages/pnspsUserSearchPage/index.js b/src/pages/pnspsUserSearchPage/index.js
index 9b1d127..78d50f4 100644
--- a/src/pages/pnspsUserSearchPage/index.js
+++ b/src/pages/pnspsUserSearchPage/index.js
@@ -60,7 +60,7 @@ const UserSettingPage = () => {
!onReady ?
:
-
+
diff --git a/src/pages/publicDashboard/index.js b/src/pages/publicDashboard/index.js
index 502d7d8..e926d27 100644
--- a/src/pages/publicDashboard/index.js
+++ b/src/pages/publicDashboard/index.js
@@ -9,28 +9,28 @@ import {
import {
isORGLoggedIn,
} from "utils/Utils";
-
-
+import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const DashboardDefault = () => {
const userData = JSON.parse(localStorage.getItem("userData"));
const BackgroundHead = {
- backgroundColor: '#0d47a1',
+ // backgroundColor: '#0d47a1',
+ backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
height: '100%',
backgroundSize:'cover'
}
return (
-
-
-
-
+
+
+
+
{/* 我的公共啟事 */}
{isORGLoggedIn() ?userData.fullenName:userData.fullchName}, 午安! 請選擇所需服務。
-
-
+
+
);
};
diff --git a/src/routes/GLDUserRoutes.js b/src/routes/GLDUserRoutes.js
index 3530987..cf9392b 100644
--- a/src/routes/GLDUserRoutes.js
+++ b/src/routes/GLDUserRoutes.js
@@ -7,7 +7,7 @@ const MainLayout = Loadable(lazy(() => import('layout/MainLayout')));
// render - dashboard
const DashboardDefault = Loadable(lazy(() => import('pages/gldDashboard')));
-
+const ApplicationDetail = Loadable(lazy(() => import('pages/gldApplicationDetailPage')));
// ==============================|| MAIN ROUTING ||============================== //
const GLDUserRoutes = {
@@ -24,6 +24,10 @@ const GLDUserRoutes = {
{
path: 'dashboard',
element:
+ },
+ {
+ path: '/application/:id',
+ element:
}
]
},
diff --git a/src/routes/MainRoutes.js b/src/routes/MainRoutes.js
index 22135a0..97ecb24 100644
--- a/src/routes/MainRoutes.js
+++ b/src/routes/MainRoutes.js
@@ -2,7 +2,9 @@ import { lazy } from 'react';
// project import
import Loadable from 'components/Loadable';
-import MainLayout from 'layout/MainLayout';
+// import MainLayout from 'layout/MainLayout';
+const MainLayout = Loadable(lazy(() => import('layout/MainLayout')));
+
// render - dashboard
diff --git a/src/routes/SettingRoutes.js b/src/routes/SettingRoutes.js
index 2e8fbb4..03e1a73 100644
--- a/src/routes/SettingRoutes.js
+++ b/src/routes/SettingRoutes.js
@@ -2,7 +2,9 @@ import { lazy } from 'react';
// project import
import Loadable from 'components/Loadable';
-import MainLayout from "../layout/MainLayout";
+// import MainLayout from "../layout/MainLayout";
+const MainLayout = Loadable(lazy(() => import('layout/MainLayout')));
+// import {Navigate} from "react-router";
// render - login
const SettingPage = Loadable(lazy(() => import('pages/pnspsSettingPage')));