add userGuide

src/pages/UserMenu/index.js

@@ -0,0 +1,165 @@
+import { Grid, Typography, Stack, } from '@mui/material';
+import { useState, useEffect, lazy } from "react";
+
+import Loadable from 'components/Loadable';
+import { useIntl, FormattedMessage } from "react-intl";
+
+import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
+const BackgroundHead = {
+    backgroundImage: `url(${titleBackgroundImg})`,
+    width: '100%',
+    height: '100%',
+    backgroundSize: 'contain',
+    backgroundRepeat: 'no-repeat',
+    backgroundColor: '#0C489E',
+    backgroundPosition: 'right'
+}
+
+const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent')));
+
+import DownloadIcon from '@mui/icons-material/Download';
+
+const UserMenu = () => {
+    const intl = useIntl();
+    const { locale } = intl;
+    const [onReady, setOnReady] = useState(false);
+
+    useEffect(() => {
+        setOnReady(true);
+    }, [locale]);
+
+    const tableStyle = {
+        fontFamily: "arial, sans-serif",
+        borderCollapse: "collapse",
+        width: "100%",
+    }
+
+    const cellStyle = {
+        border: "1px solid #dddddd",
+        textAlign: "left",
+        padding: "8px"
+    };
+
+    const getRow = ({ title, en, zh, cn }) => {
+        return <>
+            <tr>
+                <td style={cellStyle}>{title}</td>
+                <td style={cellStyle}><a href={en} target='_brank'><DownloadIcon /></a></td>
+                <td style={cellStyle}><a href={zh} target='_brank'><DownloadIcon /></a></td>
+                <td style={cellStyle}><a href={cn} target='_brank'><DownloadIcon /></a></td>
+            </tr>
+        </>
+            ;
+    }
+
+
+    return (
+        !onReady ?
+            <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
+            :
+            (
+                <Grid container justifyContent="center" alignItems="center" >
+                    <Grid item xs={12}>
+                        <div style={BackgroundHead}>
+                            <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
+                                <Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block', pt: 2 } }}>
+                                    <FormattedMessage id="userMenu" />
+                                </Typography>
+                            </Stack>
+                        </div>
+                    </Grid>
+                    <Grid item xs={10} md={5}>
+                        <p>
+                            <table style={tableStyle}>
+                                <tr>
+                                    <th style={cellStyle} width="70%"> <FormattedMessage id="fileName" /></th>
+                                    <th style={cellStyle} width="10%">English</th>
+                                    <th style={cellStyle} width="10%">繁體中文</th>
+                                    <th style={cellStyle} width="10%">简体中文</th>
+                                </tr>
+
+                                {getRow({
+                                    title: "Account Activation.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/01",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/01c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/01sc"
+                                })}
+
+                                {getRow({
+                                    title: "Login.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/02",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/02c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/02sc"
+                                })}
+
+                                {getRow({
+                                    title: "Application for publishing a Public Notice in the Gazette.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/03",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/03c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/03sc"
+                                })}
+
+                                {getRow({
+                                    title: "Proofreading reply (with correction).pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/04",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/04c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/04sc"
+                                })}
+
+                                {getRow({
+                                    title: "Proofreading reply (pass for printing).pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/05",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/05c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/05sc"
+                                })}
+
+                                {getRow({
+                                    title: "Cancellation of application for publishing a Public Notice in the Gazette.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/06",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/06c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/06sc"
+                                })}
+
+                                {getRow({
+                                    title: "Forgot password.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/07",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/07c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/07sc"
+                                })}
+
+                                {getRow({
+                                    title: "Change password.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/08",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/08c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/08sc"
+                                })}
+
+                                {getRow({
+                                    title: "Language of email notification.pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/09",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/09c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/09sc"
+                                })}
+
+                                {getRow({
+                                    title: "Download General Demand Note for making payment(s).pdf",
+                                    en: "https://pnsps.gld.gov.hk/user-guide/eng/10",
+                                    zh: "https://pnsps.gld.gov.hk/user-guide/cht/10c",
+                                    cn: "https://pnsps.gld.gov.hk/user-guide/chs/10sc"
+                                })}
+
+
+                            </table>
+                        </p>
+                    </Grid>
+                </Grid>
+            )
+    );
+
+}
+
+export default UserMenu;

src/pages/extra-pages/ImportantNotice.js

@@ -23,12 +23,8 @@ const ImportantNotice = () => {
 
     useEffect(() => {
         setOnReady(true);
-
     }, []);
 
-
-
-
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">

src/routes/LoginRoutes.js

@@ -15,6 +15,7 @@ const ErrorPage = Loadable(lazy(() => import('pages/extra-pages/ErrorPage')));
 const PrivacyPolicyPage = Loadable(lazy(() => import('pages/extra-pages/PrivacyPolicy')));
 const ImportantNoticePage = Loadable(lazy(() => import('pages/extra-pages/ImportantNotice')));
 const AboutUsPage = Loadable(lazy(() => import('pages/AboutUs')));
+const UserMenuPage = Loadable(lazy(() => import('pages/UserMenu')));
 
 const ForgotPassword = Loadable(lazy(() => import('pages/authentication/ForgotPassword')));
 const AfterForgotPasswordPage = Loadable(lazy(() => import('pages/authentication/ForgotPassword/AfterForgotPasswordPage')));
@@ -38,6 +39,7 @@ const VerifyPage = Loadable(lazy(() => import('pages/authentication/Verify')));
 const Testfps = Loadable(lazy(() => import('pages/Payment/FPS/FPSTest')));
 const Payment_FPS_CallBack = Loadable(lazy(() => import('pages/Payment/FPS/fpscallback')));
 
+
 // ==============================|| AUTH ROUTING ||============================== //
 
 const LoginRoutes = {
@@ -80,6 +82,10 @@ const LoginRoutes = {
       path: 'aboutUs',
       element: <AboutUsPage/>
     },
+    {
+      path: 'userGuide',
+      element: <UserMenuPage/>
+    },
     {
       path: 'iamsmart/logincallback',
       element: <IAmSmart_DirectLoginCallback/>

src/translations/en.json

@@ -145,6 +145,7 @@
   "welcomeMsg_night": "Good evening! Please select the required service.",
 
   "aboutUs": "About Us",
+  "userMenu": "User Guide",
   "login": "Login",
   "logout": "Logout",
   "iAmSmartLogin": "Continue with iAM Smart",

src/translations/zh-CN.json

@@ -180,6 +180,7 @@
   "welcomeMsg_night": "晚安! 请选择所需服务。",
 
   "aboutUs": "关于我们",
+  "userMenu": "使用手册",
   "login": "登录",
   "logout": "登出",
   "iAmSmartLogin": "以智方便继续",

src/translations/zh-HK.json

@@ -182,6 +182,7 @@
   "welcomeMsg_night": "晚安! 請選擇所需服務。",
 
   "aboutUs": "關於我們",
+  "userMenu": "使用手册",
   "login": "登入",
   "logout": "登出",
   "iAmSmartLogin": "以智方便繼續",