Bläddra i källkod

Merge branch 'Paging_Enhancement' of https://git.2fi-solutions.com/alex/PNSPS-frontend-MaterialUI into Paging_Enhancement

master
Alex Cheung 1 år sedan
förälder
incheckning
4bc5722f93
12 ändrade filer med 878 tillägg och 304 borttagningar
  1. +2
    -2
      src/pages/Proof/Create_FromApp/ProofForm.js
  2. +147
    -192
      src/pages/Proof/Payment/Pay.js
  3. +43
    -84
      src/pages/Proof/Payment/Pay_Creditor.js
  4. +125
    -0
      src/pages/Proof/Payment/Pay_DN.js
  5. +121
    -0
      src/pages/Proof/Payment/Pay_Office.js
  6. +294
    -0
      src/pages/Proof/Payment/Pay_Online.js
  7. +70
    -7
      src/pages/Proof/Payment/index.js
  8. +6
    -6
      src/pages/Proof/Reply_Public/ApplicationDetails.js
  9. +5
    -5
      src/pages/Proof/Reply_Public/ProofForm.js
  10. +21
    -2
      src/translations/en.json
  11. +21
    -3
      src/translations/zh-CN.json
  12. +23
    -3
      src/translations/zh-HK.json

+ 2
- 2
src/pages/Proof/Create_FromApp/ProofForm.js Visa fil

@@ -207,7 +207,7 @@ const FormPanel = ({ formData }) => {
<Grid item xs={12} md={12}>
<Stack direction="row" sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel sx={{ paddingRight: 2, textAlign: "center" }}>
<Typography variant="h5">Deadline for proof with revison:</Typography>
<Typography variant="h5">Deadline for online proof with revison:</Typography>
</FormLabel>
<TextField
fullWidth
@@ -234,7 +234,7 @@ const FormPanel = ({ formData }) => {
<Grid item xs={12} md={12}>
<Stack direction="row" sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel sx={{ paddingRight: 2, textAlign: "center" }}>
<Typography variant="h5">Deadline for confirm proof and payment:</Typography>
<Typography variant="h5">Deadline for online confirm proof:</Typography>
</FormLabel>
<TextField
fullWidth


+ 147
- 192
src/pages/Proof/Payment/Pay.js Visa fil

@@ -7,15 +7,12 @@ import {
Dialog, DialogTitle, DialogContent, DialogActions
} from '@mui/material';
import * as UrlUtils from "utils/ApiPathConst";
import * as React from "react";
import { useState } from "react";
import * as HttpUtils from "utils/HttpUtils";
import { useParams } from "react-router-dom";
import { useNavigate } from "react-router-dom";
import * as DateUtils from "utils/DateUtils"
import * as FormatUtils from "utils/FormatUtils";

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

import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
const BackgroundHead = {
@@ -28,55 +25,20 @@ const BackgroundHead = {
backgroundPosition: 'right'
}

import {
// useEffect,
useState
} from "react";
import { PNSPS_BUTTON_THEME, PNSPS_LONG_BUTTON_THEME } from "../../../themes/buttonConst";
import { ThemeProvider } from "@emotion/react";
import { FormattedMessage, useIntl } from "react-intl";
// ==============================|| DASHBOARD - DEFAULT ||============================== //

const Index = () => {
const params = useParams();
const Index = ({ record }) => {
const navigate = useNavigate()
const [fee, setFee] = useState(0);

const [record, setRecord] = React.useState({});
const [onReady, setOnReady] = React.useState(false);
const [isPopUp, setIsPopUp] = useState(false);
const [paymentHoldedErrText, setPaymentHoldedErrText] = React.useState("");
const [paymentHoldedErr, setPaymentHoldedErr] = React.useState(false);
const [paymentHoldedErrText, setPaymentHoldedErrText] = useState("");
const [paymentHoldedErr, setPaymentHoldedErr] = useState(false);

const intl = useIntl();

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

React.useEffect(() => {
setOnReady(true);
}, [record]);


const loadForm = () => {
if (params.id > 0) {
HttpUtils.get({
url: UrlUtils.GET_PROOF_PAY + "/" + params.id,
onSuccess: (responseData) => {
// if (!responseData.data?.id) {
// navigate("/proof/search");
// }
setRecord(responseData.data);
setFee(responseData.data.fee);
},
onError: () => {

}
});
}
}

function doPayment() {
setIsPopUp(false);
let appIdList = [record?.appId]
@@ -93,23 +55,23 @@ const Index = () => {
const latestData = {};

responseData.forEach(item => {
const { appId, timeDiff } = item;
if (latestData[appId] === undefined || timeDiff < latestData[appId].timeDiff) {
latestData[appId] = item;
}
const { appId, timeDiff } = item;
if (latestData[appId] === undefined || timeDiff < latestData[appId].timeDiff) {
latestData[appId] = item;
}
});
const latestDataObjects = Object.values(latestData);
const filteredData = latestDataObjects.filter(item => item.timeDiff > 20 || item.status !== "APPR");
const filteredAppIds = filteredData.map(item => item.appId);
const appIdsNotInData = appIdList.filter(appId => !latestDataObjects.some(item => item.appId === appId));
const combinedAppIdsArray = [...appIdsNotInData, ...filteredAppIds];
const readyToPayment = appIdList.every(appId => combinedAppIdsArray.includes(appId));
if (readyToPayment){
navigate('/paymentPage', { state: { amount: fee, appIdList: appIdList } });
}else{
if (readyToPayment) {
navigate('/paymentPage', { state: { amount: record.fee, appIdList: appIdList } });
} else {
const appIdsInData = appIdList.filter(appId => !combinedAppIdsArray.some(item => item === appId));
const HoldingApplication = latestDataObjects.filter(item => appIdsInData.includes(item.appId));
const resultString = HoldingApplication.map(item => item.appNo).join(' , ');
@@ -122,156 +84,149 @@ const Index = () => {
};

return (
!onReady ?
<Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px'>
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }}>
<FormattedMessage id="proofRecord" />
</Typography>
</Stack>
</div>
</Grid>
</Grid>
:
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px'>
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }}>
<FormattedMessage id="proofRecord" />
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h3" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="publicNoticePaymentProofDoneAndPaid" />
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h3" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="publicNoticePaymentProofDoneAndPaid" />
</Typography>

<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: 'MSG.payMsg1' }, { appNo: record.appNo }) }} />
<br />
<FormattedMessage id="MSG.payMsg2_1" />
<span style={{ color: "red" }}>
{DateUtils.datetimeStr(record?.proofPaymentDeadline)}
</span>
<FormattedMessage id="MSG.payMsg2_2" />
<br />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage({ id: 'MSG.payMsg3' },
{
issueYear: record?.issueYear,
issueVolume: record?.issueVolume,
issueNo: record?.issueNo,
})
}} />
</Typography>

<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<FormattedMessage id="pleaseClickToPay" />:
</Typography>

<Typography variant="h4" sx={{ ml: 8, textAlign: "left" }}>
<ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{ ml: { md: 4, lg: 4 }, mr: 4 }}
onClick={() => { setIsPopUp(true) }}
>
<FormattedMessage id="payInstantly" />
</Button>
</ThemeProvider>
<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: 'MSG.payMsg1' }, { appNo: record.appNo }) }} />
<br />
<FormattedMessage id="MSG.payMsg2_1" />
<span style={{ color: "red" }}>
{DateUtils.datetimeStr(record?.proofPaymentDeadline)}
</span>
<FormattedMessage id="MSG.payMsg2_2" />
<br />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage({ id: 'MSG.payMsg3' },
{
issueYear: record?.issueYear,
issueVolume: record?.issueVolume,
issueNo: record?.issueNo,
})
}} />
</Typography>

<FormattedMessage id="or" />
<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<FormattedMessage id="pleaseClickToPay" />:
</Typography>

<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{ ml: { sm: 4, md: 4, lg: 4 }, mr: 4, mt: { xs: 2, sm: 2 }, mb: { xs: 2, sm: 2 } }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="payLater" />
</Button>
(<FormattedMessage id="backToNoticePage" />)
</ThemeProvider>
</Typography>
</Grid>
</center>
</Grid>
<Typography variant="h4" sx={{ ml: 8, textAlign: "left" }}>
<ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{ ml: { md: 4, lg: 4 }, mr: 4 }}
onClick={() => { setIsPopUp(true) }}
>
<FormattedMessage id="payInstantly" />
</Button>
</ThemeProvider>

<FormattedMessage id="or" />

<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{ ml: { sm: 4, md: 4, lg: 4 }, mr: 4, mt: { xs: 2, sm: 2 }, mb: { xs: 2, sm: 2 } }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="payLater" />
</Button>
(<FormattedMessage id="backToNoticePage" />)
</ThemeProvider>
</Typography>
</Grid>
</center>
</Grid>
<div>
<Dialog
open={isPopUp}
onClose={() => setIsPopUp(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '30vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '50vh' }
}
}}
>
<DialogTitle>
<Typography variant="h3" >
<FormattedMessage id="payConfirm" />
</Grid>
<div>
<Dialog
open={isPopUp}
onClose={() => setIsPopUp(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '30vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '50vh' }
}
}}
>
<DialogTitle>
<Typography variant="h3" >
<FormattedMessage id="payConfirm" />
</Typography>
</DialogTitle>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<Typography variant="h4">
<FormattedMessage id="totalAmount" /> (HK$): {FormatUtils.currencyFormat(record.fee)}
</Typography>
</DialogTitle>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<Typography variant="h4">
<FormattedMessage id="totalAmount" /> (HK$): {FormatUtils.currencyFormat(fee)}
</Typography>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setIsPopUp(false)}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
<Button onClick={() => doPayment()}><Typography variant="h5">
<FormattedMessage id="confirm" />
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setIsPopUp(false)}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
{/*row 2*/}
<div>
<Dialog
open={paymentHoldedErr}
onClose={() => setPaymentHoldedErr(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '70vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '60vh' }
}
}}
>
<DialogTitle></DialogTitle>
<Typography variant="h4" style={{ paddingLeft: '24px' }}><FormattedMessage id="MSG.actionFail" /></Typography>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<div dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: 'MSG.paymentHolded' }, { appNo: paymentHoldedErrText }) }} />
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setPaymentHoldedErr(false)} aria-label={intl.formatMessage({ id: 'close' })}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
</Grid >
<Button onClick={() => doPayment()}><Typography variant="h5">
<FormattedMessage id="confirm" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
{/*row 2*/}
<div>
<Dialog
open={paymentHoldedErr}
onClose={() => setPaymentHoldedErr(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '70vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '60vh' }
}
}}
>
<DialogTitle></DialogTitle>
<Typography variant="h4" style={{ paddingLeft: '24px' }}><FormattedMessage id="MSG.actionFail" /></Typography>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<div dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: 'MSG.paymentHolded' }, { appNo: paymentHoldedErrText }) }} />
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setPaymentHoldedErr(false)} aria-label={intl.formatMessage({ id: 'close' })}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
</Grid >


)
)


);


+ 43
- 84
src/pages/Proof/Payment/Pay_Creditor.js Visa fil

@@ -5,17 +5,10 @@ import {
Stack,
Button,
} from '@mui/material';
import * as UrlUtils from "utils/ApiPathConst";
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";
import { useParams } from "react-router-dom";
import { useNavigate } from "react-router-dom";

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

import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
import {FormattedMessage} from "react-intl";
import { FormattedMessage } from "react-intl";
const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
@@ -28,101 +21,67 @@ const BackgroundHead = {

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

const Index = () => {
const params = useParams();
const Index = ({ record }) => {
const navigate = useNavigate()

const [record, setRecord] = React.useState();
const [onReady, setOnReady] = React.useState(false);

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

React.useEffect(() => {
setOnReady(true);
}, [record]);


const loadForm = () => {
if (params.id > 0) {
HttpUtils.get({
url: UrlUtils.GET_PROOF_PAY + "/" + params.id,
onSuccess: (responseData) => {
if (!responseData.data?.id) {
navigate("/proof/search");
}
setRecord(responseData.data);
}
});
}
}

return (
!onReady ?
<Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px' >
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }} >
<FormattedMessage id="proofRecord" />
</Typography>
</Stack>
</div>
</Grid>
</Grid>
:
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px' >
<Typography ml={15} color='#FFF' variant="h4" sx={{display: { xs: 'none', sm: 'none', md: 'block' }, pt:2}} >
<FormattedMessage id="proofRecord"/>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h2" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="publicNoticePaymentProofDone" />
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h2" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="publicNoticePaymentProofDone"/>
</Typography>


<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<FormattedMessage
<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<FormattedMessage
id='MSG.pay_credity1'
values={{
appNo: record?.appNo,
year: record?.issueYear,
issueVolume: record?.issueVolume,
issueVolume: record?.issueVolume,
issueNo: record?.issueNo
}}
/>
<br/><br/>
<FormattedMessage id="MSG.pay_credity2"/>
<br /><br />
<FormattedMessage id="MSG.pay_credity2" />
</Typography>

<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
<Button
component="span"
variant="contained"
size="large"
sx={{ m: 4}}
onClick={()=>{
navigate("/publicNotice");
}}
>
<FormattedMessage id="backToNoticePage" />
</Button>
</Typography>
</Grid>
</center>
</Grid>
<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
<Button
component="span"
variant="contained"
size="large"
sx={{ m: 4 }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="backToNoticePage" />
</Button>
</Typography>
</Grid>
</center>
</Grid>
{/*row 2*/}
</Grid >
</Grid>
{/*row 2*/}
</Grid >


)
)


);


+ 125
- 0
src/pages/Proof/Payment/Pay_DN.js Visa fil

@@ -0,0 +1,125 @@
// material-ui
import {
Grid,
Typography,
Stack,
Button,
} from '@mui/material';
import { useNavigate } from "react-router-dom";
import * as DateUtils from "utils/DateUtils";


import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
import { FormattedMessage, useIntl } from "react-intl";
const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
height: '100%',
backgroundSize: 'contain',
backgroundRepeat: 'no-repeat',
backgroundColor: '#0C489E',
backgroundPosition: 'right'
}

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

const Index = ({ record }) => {
const navigate = useNavigate()
const intl = useIntl();

return (
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px' >
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }} >
<FormattedMessage id="proofRecord" />
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h2" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="proofPaymentHeader_demandNote" />
</Typography>


<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_demandNote'
},
{
appNo: record?.appNo,
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_demandNote2'
},
{
beforeClosingDate: "{beforeClosingDate}",
email: record?.mail,
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_demandNote3'
},
{
paymentDeadline: DateUtils.dateStr(record?.closingDate),
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_demandNote4'
}
)
}} />


</Typography>

<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
<Button
component="span"
variant="contained"
size="large"
sx={{ m: 4 }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="backToNoticePage" />
</Button>
</Typography>
</Grid>
</center>
</Grid>
</Grid>
{/*row 2*/}
</Grid >


)


);
};

export default Index;

+ 121
- 0
src/pages/Proof/Payment/Pay_Office.js Visa fil

@@ -0,0 +1,121 @@
// material-ui
import {
Grid,
Typography,
Stack,
Button,
} from '@mui/material';
import { useNavigate } from "react-router-dom";
import * as DateUtils from "utils/DateUtils";


import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
import { FormattedMessage, useIntl } from "react-intl";
const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
height: '100%',
backgroundSize: 'contain',
backgroundRepeat: 'no-repeat',
backgroundColor: '#0C489E',
backgroundPosition: 'right'
}

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

const Index = ({ record }) => {
const navigate = useNavigate()
const intl = useIntl();

return (
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px' >
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }} >
<FormattedMessage id="proofRecord" />
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h2" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="proofPaymentHeader_office" />
</Typography>


<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_office'
},
{
appNo: record?.appNo,
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_office2'
},
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_office3'
},
{
paymentDeadline: DateUtils.dateStr(record?.closingDate),
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_office4'
}
)
}} />


</Typography>

<Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
<Button
component="span"
variant="contained"
size="large"
sx={{ m: 4 }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="backToNoticePage" />
</Button>
</Typography>
</Grid>
</center>
</Grid>
</Grid>
{/*row 2*/}
</Grid >


)


);
};

export default Index;

+ 294
- 0
src/pages/Proof/Payment/Pay_Online.js Visa fil

@@ -0,0 +1,294 @@
// material-ui
import {
Grid,
Typography,
Stack,
Button,
Dialog, DialogTitle, DialogContent, DialogActions
} from '@mui/material';
import * as UrlUtils from "utils/ApiPathConst";
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";
import { useParams } from "react-router-dom";
import { useNavigate } from "react-router-dom";
import * as DateUtils from "utils/DateUtils"
import * as FormatUtils from "utils/FormatUtils";

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

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'
}

import {
// useEffect,
useState
} from "react";
import { PNSPS_BUTTON_THEME, PNSPS_LONG_BUTTON_THEME } from "../../../themes/buttonConst";
import { ThemeProvider } from "@emotion/react";
import { FormattedMessage, useIntl } from "react-intl";
// ==============================|| DASHBOARD - DEFAULT ||============================== //

const Index = () => {
const params = useParams();
const navigate = useNavigate()
const [fee, setFee] = useState(0);

const [record, setRecord] = React.useState({});
const [onReady, setOnReady] = React.useState(false);
const [isPopUp, setIsPopUp] = useState(false);
const [paymentHoldedErrText, setPaymentHoldedErrText] = React.useState("");
const [paymentHoldedErr, setPaymentHoldedErr] = React.useState(false);

const intl = useIntl();

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

React.useEffect(() => {
setOnReady(true);
}, [record]);


const loadForm = () => {
if (params.id > 0) {
HttpUtils.get({
url: UrlUtils.GET_PROOF_PAY + "/" + params.id,
onSuccess: (responseData) => {
// if (!responseData.data?.id) {
// navigate("/proof/search");
// }
setRecord(responseData.data);
setFee(responseData.data.fee);
},
onError: () => {

}
});
}
}

function doPayment() {
setIsPopUp(false);
let appIdList = [record?.appId]
handlePaymentCheck(appIdList)
}

const handlePaymentCheck = (appIdList) => {
HttpUtils.post({
url: UrlUtils.PAYMENT_CHECK,
params: {
appIds: appIdList
},
onSuccess: (responseData) => {
const latestData = {};

responseData.forEach(item => {
const { appId, timeDiff } = item;
if (latestData[appId] === undefined || timeDiff < latestData[appId].timeDiff) {
latestData[appId] = item;
}
});
const latestDataObjects = Object.values(latestData);

const filteredData = latestDataObjects.filter(item => item.timeDiff > 20 || item.status !== "APPR");
const filteredAppIds = filteredData.map(item => item.appId);

const appIdsNotInData = appIdList.filter(appId => !latestDataObjects.some(item => item.appId === appId));
const combinedAppIdsArray = [...appIdsNotInData, ...filteredAppIds];

const readyToPayment = appIdList.every(appId => combinedAppIdsArray.includes(appId));
if (readyToPayment) {
navigate('/paymentPage', { state: { amount: fee, appIdList: appIdList } });
} else {
const appIdsInData = appIdList.filter(appId => !combinedAppIdsArray.some(item => item === appId));
const HoldingApplication = latestDataObjects.filter(item => appIdsInData.includes(item.appId));
const resultString = HoldingApplication.map(item => item.appNo).join(' , ');
setPaymentHoldedErrText(resultString);
// setPaymentHoldedErrText(intl.formatMessage({ id: 'MSG.paymentHolded' }, { appNo: record.appNo }));
setPaymentHoldedErr(true);
}
}
});
};

return (
!onReady ?
<Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
</Grid>
</Grid>
:
(
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%" >
<Stack direction="row" height='70px'>
<Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block' }, pt: 2 }}>
<FormattedMessage id="proofRecord" />
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={8} >
<Typography variant="h3" sx={{ textAlign: "left", ml: 4, mr: 4, mt: 4, borderBottom: "1px solid black" }}>
<FormattedMessage id="proofPaymentHeader_online" />
</Typography>

<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_online'
},
{
appNo: record?.appNo,
}
)
}} />
<br />
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_online2'
},
{
paymentDeadline: DateUtils.dateStr(record?.closingDate),
}
)
}} />
<br />
</Typography>

<Typography variant="h4" sx={{ ml: 8, textAlign: "left" }}>
<ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{mr: 4 }}
onClick={() => { setIsPopUp(true) }}
>
<FormattedMessage id="payInstantly" />
</Button>
</ThemeProvider>

<FormattedMessage id="or" />

<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button
component="span"
variant="contained"
sx={{ ml: { sm: 4, md: 4, lg: 4 }, mr: 4, mt: { xs: 2, sm: 2 }, mb: { xs: 2, sm: 2 } }}
onClick={() => {
navigate("/publicNotice");
}}
>
<FormattedMessage id="payLater" />
</Button>
(<FormattedMessage id="backToNoticePage" />)
</ThemeProvider>
</Typography>

<Typography variant="h4" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}>
<div dangerouslySetInnerHTML={{
__html: intl.formatMessage(
{
id: 'proofPaymentBody_online3'
}
)
}} />
<br />
</Typography>


</Grid>
</center>
</Grid>
</Grid>
<div>
<Dialog
open={isPopUp}
onClose={() => setIsPopUp(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '30vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '50vh' }
}
}}
>
<DialogTitle>
<Typography variant="h3" >
<FormattedMessage id="payConfirm" />
</Typography>
</DialogTitle>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<Typography variant="h4">
<FormattedMessage id="totalAmount" /> (HK$): {FormatUtils.currencyFormat(fee)}
</Typography>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setIsPopUp(false)}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
<Button onClick={() => doPayment()}><Typography variant="h5">
<FormattedMessage id="confirm" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
{/*row 2*/}
<div>
<Dialog
open={paymentHoldedErr}
onClose={() => setPaymentHoldedErr(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '70vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '60vh' }
}
}}
>
<DialogTitle></DialogTitle>
<Typography variant="h4" style={{ paddingLeft: '24px' }}><FormattedMessage id="MSG.actionFail" /></Typography>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<div dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: 'MSG.paymentHolded' }, { appNo: paymentHoldedErrText }) }} />
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setPaymentHoldedErr(false)} aria-label={intl.formatMessage({ id: 'close' })}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
</Grid >


)


);
};

export default Index;

+ 70
- 7
src/pages/Proof/Payment/index.js Visa fil

@@ -1,16 +1,79 @@
import * as React from "react";
import { Grid, } from '@mui/material';
import { useState, useEffect, lazy } from "react";
import { useNavigate } from "react-router-dom";

import * as HttpUtils from "utils/HttpUtils";
import * as UrlUtils from "utils/ApiPathConst";
import Loadable from 'components/Loadable';
const Pay = Loadable(React.lazy(() => import('./Pay')));
const Pay_Creditor = Loadable(React.lazy(() => import('./Pay_Creditor')));
import { useParams } from "react-router-dom";
//const Pay = Loadable(lazy(() => import('./Pay')));
const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent')));
const Pay_Creditor = Loadable(lazy(() => import('./Pay_Creditor')));
const Pay_Dn = Loadable(lazy(() => import('./Pay_DN')));
const Pay_Office = Loadable(lazy(() => import('./Pay_Office')));
const Pay_Online = Loadable(lazy(() => import('./Pay_Online')));


const Index = () => {
const params = useParams();
const [onReady, setOnReady] = useState(false);
const [record, setRecord] = useState({});
const navigate = useNavigate()

useEffect(() => {
setOnReady(true);
}, [record]);

useEffect(() => {
if (params.id > 0) {
HttpUtils.get({
url: UrlUtils.GET_PROOF_PAY + "/" + params.id,
onSuccess: (responseData) => {
if (!responseData?.data?.id) {
navigate("/proof/search");
}
setRecord(responseData.data);
},
onError: () => {

}
});
}
}, []);


return (
JSON.parse(localStorage.getItem('userData')).creditor?
<Pay_Creditor/>
:
<Pay/>
!onReady ?
<Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
</Grid>
</Grid>
:
(
record.creditor ?
<Pay_Creditor
record={record}
/>
: (
record.paymentMethod == "demandNote" ?
<Pay_Dn
record={record}
/>
: (
record.paymentMethod == "online" ?
<Pay_Online
record={record}
/>
:
<Pay_Office
record={record}
/>
)
)
)
);

}

export default Index;

+ 6
- 6
src/pages/Proof/Reply_Public/ApplicationDetails.js Visa fil

@@ -10,7 +10,7 @@ import {

import { useFormik } from 'formik';
import * as React from "react";
//import * as DateUtils from "utils/DateUtils"
import * as DateUtils from "utils/DateUtils"
import * as FormatUtils from "utils/FormatUtils"
import { useParams } from "react-router-dom";
import Loadable from 'components/Loadable';
@@ -23,7 +23,7 @@ const ApplicationDetailCard = ({ formData, }) => {

const params = useParams();
const intl = useIntl();
//const { locale } = intl;
const { locale } = intl;

const [data, setData] = React.useState({});
//const [proofId, setProofId] = React.useState();
@@ -228,7 +228,7 @@ const ApplicationDetailCard = ({ formData, }) => {

<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, }}>
<Grid container alignItems={"center"}>
{/* <Grid item xs={12} md={12} lg={12}
<Grid item xs={12} md={12} lg={12}
sx={{ display: 'flex', alignItems: 'center' }}>
<Typography variant="h5" display="inline">
@@ -243,8 +243,8 @@ const ApplicationDetailCard = ({ formData, }) => {
`${DateUtils.datetimeStr_Cht(data.reviseDeadline)} ${intl.formatMessage({ id: 'before' })}`
}
</Typography>
</Grid> */}
{/*
</Grid>
<Grid item xs={12} md={12} lg={12}
sx={{ display: 'flex', alignItems: 'center' }}>
<Typography variant="h5" display="inline">
@@ -259,7 +259,7 @@ const ApplicationDetailCard = ({ formData, }) => {
`${DateUtils.datetimeStr_Cht(data.proofPaymentDeadline)} ${intl.formatMessage({ id: 'before' })}`
}
</Typography>
</Grid> */}
</Grid>

<Grid item xs={12} sm={3} md={3} lg={3}
sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>


+ 5
- 5
src/pages/Proof/Reply_Public/ProofForm.js Visa fil

@@ -283,7 +283,7 @@ const FormPanel = ({ formData }) => {


{
actionValue ?
actionValue && formData.creditor==false ?
<Grid item xs={12} sx={{ mb: 1, }}>
<table style={tabelStyle}>
<tr style={tabelStyle}>
@@ -319,9 +319,9 @@ const FormPanel = ({ formData }) => {
<tr>
<td style={tabelStyle}>
<Checkbox
checked={paymentMethod == "dn"}
checked={paymentMethod == "demandNote"}
onChange={() => {
set_paymentMethod("dn")
set_paymentMethod("demandNote")
}}
/>
</td>
@@ -353,9 +353,9 @@ const FormPanel = ({ formData }) => {
<tr>
<td style={tabelStyle}>
<Checkbox
checked={paymentMethod == "npgo"}
checked={paymentMethod == "office"}
onChange={() => {
set_paymentMethod("npgo")
set_paymentMethod("office")
}}
/>
</td>


+ 21
- 2
src/translations/en.json Visa fil

@@ -105,6 +105,25 @@
"publicNoticePaymentProofDoneAndPaid": "Public Notice: Proofreading Completed and Payment",
"publicNoticePaymentProofComment": "Public Notice: Proofreading Reply",
"publicNoticePaymentProofInfo": "Public Notice: Proofreading Information",

"proofPaymentHeader_demandNote": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_demandNote": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}<br/><br/>You have selected to make payment by General Demand Note.",
"proofPaymentBody_demandNote2": "The General Demand Note will be sent to the following email address within one working day, but not later than {beforeClosingDate} 9:00 p.m. : <br/>{email}",
"proofPaymentBody_demandNote3": "Please make payment and return the payment proof (e.g. ATM receipt, internet banking record) to [email protected] by {paymentDeadline}.",
"proofPaymentBody_demandNote4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_office": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_office": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_office2": "You have selected to make payment at North Point Government Offices Collection Office:<center><br/>Collection Office at Accounts Section<br/>10/F North Point Government Offices<br/>333 Java Road North Point</center>",
"proofPaymentBody_office3": "Please print out this page or present your application details on screen at our Collection Office, and complete the payment by {paymentDeadline}.",
"proofPaymentBody_office4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_online": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_online": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_online2": "Please select either to complete the payment now or make payment by {paymentDeadline}.",
"proofPaymentBody_online3": "We will process the publication after receiving payment confirmation.",


"proofRecord": "Proof Records",
"onlinePaymentHistory": "Online Payment History",
"setting": "Settings",
@@ -384,8 +403,8 @@
"applicationPublishDate": "Publish Date",
"pleaseCheckReminder": "Please download the following printed manuscript file and proofread it carefully",
"payAnd": "Pay and ",
"commentDeadline": "Deadline for proof with revison",
"paymentDeadline": "Deadline for confirm proof and payment",
"commentDeadline": "Deadline for online proof with revison",
"paymentDeadline": "Deadline for online confirm proof",
"confirmingDealine": "Deadline for Confirming Proof",
"PaymentCoonpletDealine": "Deadline for Payment Completeion",
"payOnline":"Pay online via this system PNSPS",


+ 21
- 3
src/translations/zh-CN.json Visa fil

@@ -38,7 +38,7 @@
"applyTickStr":"我确认上述提到的截止日期。",
"confirmingDealine": "确认校对的截止日期",
"PaymentCoonpletDealine": "付款截止日期",
"payOnline":"透过此系统 GPNSPS 线上支付",
"payOnline":"透过此系统 GPNSPS 上支付",
"payDn":"透过发出一般缴款单付款",
"payNPGO":"在 NPGO 收款办公室付款",
"paymentMeans":"付款方式",
@@ -126,6 +126,24 @@
"publicNoticePaymentProofDoneAndPaid": "公共启事:校对完成及付款",
"publicNoticePaymentProofComment": "公共启事:校对回复",
"publicNoticePaymentProofInfo": "公共启事:校对资料",

"proofPaymentHeader_demandNote": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_demandNote": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}<br/><br/>You have selected to make payment by General Demand Note.",
"proofPaymentBody_demandNote2": "The General Demand Note will be sent to the following email address within one working day, but not later than {beforeClosingDate} 9:00 p.m. : <br/>{email}",
"proofPaymentBody_demandNote3": "Please make payment and return the payment proof (e.g. ATM receipt, internet banking record) to [email protected] by {paymentDeadline}.",
"proofPaymentBody_demandNote4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_office": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_office": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_office2": "You have selected to make payment at North Point Government Offices Collection Office:<center><br/>Collection Office at Accounts Section<br/>10/F North Point Government Offices<br/>333 Java Road North Point</center>",
"proofPaymentBody_office3": "Please print out this page or present your application details on screen at our Collection Office, and complete the payment by {paymentDeadline}.",
"proofPaymentBody_office4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_online": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_online": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_online2": "Please select either to complete the payment now or make payment by {paymentDeadline}.",
"proofPaymentBody_online3": "We will process the publication after receiving payment confirmation.",

"proofRecord": "校对记录",
"onlinePaymentHistory": "网上付款记录",
"setting": "设置",
@@ -398,8 +416,8 @@
"applicationPublishDate": "刊出日期",
"pleaseCheckReminder": "请下载下列印刷稿档案,并仔细校对",
"payAnd": "缴费及",
"commentDeadline": "返稿最后限期",
"paymentDeadline": "确定付印及缴费最后限期",
"commentDeadline": "网上返稿最后限期",
"paymentDeadline": "网上确定付印最后限期",
"before": "前",
"page": "页",
"proofReplyDate": "校对回复日期",


+ 23
- 3
src/translations/zh-HK.json Visa fil

@@ -38,7 +38,7 @@
"applyTickStr":"我確認上述提到的日期。",
"confirmingDealine": "確認校對的截止日期",
"PaymentCoonpletDealine": "付款截止日期",
"payOnline":"透過此系統 GPNSPS 上支付",
"payOnline":"透過此系統 GPNSPS 上支付",
"payDn":"透過發出一般繳款單付款",
"payNPGO":"在 NPGO 收款辦公室付款",
"paymentMeans":"付款方式",
@@ -126,6 +126,26 @@
"publicNoticePaymentProofDoneAndPaid": "公共啟事:校對完成及付款",
"publicNoticePaymentProofComment": "公共啟事:校對回覆",
"publicNoticePaymentProofInfo": "公共啟事:校對資料",

"proofPaymentHeader_demandNote": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_demandNote": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}<br/><br/>You have selected to make payment by General Demand Note.",
"proofPaymentBody_demandNote2": "The General Demand Note will be sent to the following email address within one working day, but not later than {beforeClosingDate} 9:00 p.m. : <br/>{email}",
"proofPaymentBody_demandNote3": "Please make payment and return the payment proof (e.g. ATM receipt, internet banking record) to [email protected] by {paymentDeadline}.",
"proofPaymentBody_demandNote4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_office": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_office": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_office2": "You have selected to make payment at North Point Government Offices Collection Office:<center><br/>Collection Office at Accounts Section<br/>10/F North Point Government Offices<br/>333 Java Road North Point</center>",
"proofPaymentBody_office3": "Please print out this page or present your application details on screen at our Collection Office, and complete the payment by {paymentDeadline}.",
"proofPaymentBody_office4": "We will process the publication after receiving payment confirmation.",

"proofPaymentHeader_online": "Public Notice: Proofreading Completed and Payment Means Selected",
"proofPaymentBody_online": "We have received the manuscript proofreading confirmation and printing instructions for application number: {appNo}",
"proofPaymentBody_online2": "Please select either to complete the payment now or make payment by {paymentDeadline}.",
"proofPaymentBody_online3": "We will process the publication after receiving payment confirmation.",



"proofRecord": "校對記錄",
"onlinePaymentHistory": "網上付款記錄",
"setting": "設定",
@@ -401,8 +421,8 @@
"applicationPublishDate": "刊出日期",
"pleaseCheckReminder": "請下載下列印刷稿檔案,並仔細校對",
"payAnd": "繳費及",
"commentDeadline": "返稿最後限期",
"paymentDeadline": "確定付印及繳費最後限期",
"commentDeadline": "網上返稿最後限期",
"paymentDeadline": "網上確定付印最後限期",
"before": "前",
"page": "頁",
"proofReplyDate": "校對回覆日期",


Laddar…
Avbryt
Spara