| @@ -1,69 +1,44 @@ | |||||
| import { Grid, Typography, Stack, } from '@mui/material'; | |||||
| import { useState, useEffect, lazy } from "react"; | |||||
| import { Grid, Typography, Stack } from '@mui/material'; | |||||
| import { useIntl, FormattedMessage } from 'react-intl'; | |||||
| import Loadable from 'components/Loadable'; | |||||
| import { useIntl, FormattedMessage } from "react-intl"; | |||||
| import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'; | |||||
| import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' | |||||
| const BackgroundHead = { | 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'))); | |||||
| const PrivacyPolicy_en = Loadable(lazy(() => import('pages/extra-pages/PrivacyPolicyPage/PrivacyPolicy_en'))); | |||||
| const PrivacyPolicy_zh = Loadable(lazy(() => import('pages/extra-pages/PrivacyPolicyPage/PrivacyPolicy_zh'))); | |||||
| const PrivacyPolicy_cn = Loadable(lazy(() => import('pages/extra-pages/PrivacyPolicyPage/PrivacyPolicy_cn'))); | |||||
| backgroundImage: `url(${titleBackgroundImg})`, | |||||
| width: '100%', | |||||
| height: '100%', | |||||
| backgroundSize: 'contain', | |||||
| backgroundRepeat: 'no-repeat', | |||||
| backgroundColor: '#0C489E', | |||||
| backgroundPosition: 'right' | |||||
| }; | |||||
| const PrivacyPolicy = () => { | const PrivacyPolicy = () => { | ||||
| const intl = useIntl(); | |||||
| const { locale } = intl; | |||||
| const [onReady, setOnReady] = useState(false); | |||||
| const [content, setContent] = useState(""); | |||||
| useEffect(() => { | |||||
| setOnReady(true); | |||||
| if (locale === 'zh-CN') { | |||||
| setContent(<><PrivacyPolicy_cn /></>); | |||||
| } else if (locale === 'zh-HK') { | |||||
| setContent(<><PrivacyPolicy_zh /></>); | |||||
| } else { | |||||
| setContent(<><PrivacyPolicy_en /></>); | |||||
| } | |||||
| }, [locale]); | |||||
| 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 component="h1" ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block', pt: 2 } }}> | |||||
| <FormattedMessage id="privacyPolicy" /> | |||||
| </Typography> | |||||
| </Stack> | |||||
| </div> | |||||
| </Grid> | |||||
| <Grid item xs={10} md={8} lg={6}> | |||||
| {content} | |||||
| </Grid> | |||||
| </Grid> | |||||
| ) | |||||
| ); | |||||
| } | |||||
| export default PrivacyPolicy; | |||||
| const intl = useIntl(); | |||||
| const htmlContent = intl.formatMessage({ id: 'privacyPolicyContent', defaultMessage: '' }); | |||||
| return ( | |||||
| <Grid container justifyContent="center" alignItems="center"> | |||||
| <Grid item xs={12}> | |||||
| <div style={BackgroundHead}> | |||||
| <Stack direction="row" height="70px" justifyContent="flex-start" alignItems="center"> | |||||
| <Typography | |||||
| component="h1" | |||||
| ml={15} | |||||
| color="#FFF" | |||||
| variant="h4" | |||||
| sx={{ display: { xs: 'none', sm: 'none', md: 'block', pt: 2 } }} | |||||
| > | |||||
| <FormattedMessage id="privacyPolicy" /> | |||||
| </Typography> | |||||
| </Stack> | |||||
| </div> | |||||
| </Grid> | |||||
| <Grid item xs={10} md={8} lg={6}> | |||||
| <div style={{ padding: 12 }} dangerouslySetInnerHTML={{ __html: htmlContent }} /> | |||||
| </Grid> | |||||
| </Grid> | |||||
| ); | |||||
| }; | |||||
| export default PrivacyPolicy; | |||||