From 899deb36a66d4cd320503e64183d7644cc3aaa94 Mon Sep 17 00:00:00 2001
From: "jason.lam" <jason.lam@2fi-solutions.com.hk>
Date: Fri, 12 Jan 2024 17:53:48 +0800
Subject: [PATCH] update locale

---
 src/layout/MainLayout/Header/index.js         |  4 ++-
 .../DemandNote/Search_Public/SearchForm.js    |  2 +-
 src/pages/Payment/Card/index.js               |  2 +-
 .../Payment/Details_Public/PaymentDetails.js  |  4 ++-
 src/pages/Payment/FPS/FPSTest.js              |  2 +-
 src/pages/Payment/Search_Public/DataGrid.js   |  2 +-
 src/pages/Payment/Search_Public/index.js      |  5 ++-
 .../Proof/Reply_Public/ApplicationDetails.js  | 21 ++++++++----
 src/pages/Proof/Search_Public/DataGrid.js     |  8 ++---
 src/pages/Proof/Search_Public/SearchForm.js   |  6 ++--
 .../ApplyForm/PublicNoticeApplyForm.js        |  4 ++-
 .../Details_Public/ApplicationDetailCard.js   | 34 +++++++++++++------
 .../tabTableDetail/PaymentTab.js              |  2 +-
 .../Details_Public/tabTableDetail/ProofTab.js | 11 +++---
 .../Details_Public/tabTableDetail/TabTable.js |  2 +-
 src/translations/en.json                      | 17 ++++++++++
 src/translations/zh-CN.json                   | 17 ++++++++++
 src/translations/zh-HK.json                   | 17 ++++++++++
 18 files changed, 121 insertions(+), 39 deletions(-)

diff --git a/src/layout/MainLayout/Header/index.js b/src/layout/MainLayout/Header/index.js
index f3f776b..a1f27a9 100644
--- a/src/layout/MainLayout/Header/index.js
+++ b/src/layout/MainLayout/Header/index.js
@@ -154,7 +154,9 @@ function Header(props) {
           {isCreditorLoggedIn() ?
             <>
               <Link className="paymentRecord">
-                <Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>付款記錄</Typography>
+                <Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>
+                  <FormattedMessage id="paymentHistory"/>
+                </Typography>
                 <KeyboardArrowDownIcon sx={{ fontSize: '1.0rem' }} />
               </Link>
               <ul className='dropdown'>
diff --git a/src/pages/DemandNote/Search_Public/SearchForm.js b/src/pages/DemandNote/Search_Public/SearchForm.js
index 843bf2e..d9e87cb 100644
--- a/src/pages/DemandNote/Search_Public/SearchForm.js
+++ b/src/pages/DemandNote/Search_Public/SearchForm.js
@@ -106,7 +106,7 @@ const SearchDemandNoteForm = ({ applySearch, searchCriteria, issueComboData
                                 }}
                                 renderInput={(params) => (
                                     <TextField {...params}
-                                        label="憲報期數"
+                                        label={intl.formatMessage({id: 'gazetteCount'})}
                                         InputLabelProps={{
                                             shrink: true
                                         }}
diff --git a/src/pages/Payment/Card/index.js b/src/pages/Payment/Card/index.js
index d40a987..d1f8c10 100644
--- a/src/pages/Payment/Card/index.js
+++ b/src/pages/Payment/Card/index.js
@@ -145,7 +145,7 @@ const Index = () => {
                                     <Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
                                         <img src={getIcon()} width="80" height="80" alt={paymentData.type}></img>
                                         <br />
-                                        支付金額
+                                            <FormattedMessage id="payFee"/>
                                         <br />
                                         {"$HK " + paymentData.amount}
                                     </Typography>
diff --git a/src/pages/Payment/Details_Public/PaymentDetails.js b/src/pages/Payment/Details_Public/PaymentDetails.js
index 748f75b..363f456 100644
--- a/src/pages/Payment/Details_Public/PaymentDetails.js
+++ b/src/pages/Payment/Details_Public/PaymentDetails.js
@@ -163,7 +163,9 @@ const PaymentDetails = ({ formData,doPrint }) => {
                                         <Grid xs={6} md={5} sx={{ml:5,textAlign: "left" }}>
                                                 <Button className="printHidden" variant="contained" sx={{ mt:2 }} onClick={doPrint}>
                                                     <DownloadIcon/>
-                                                    <Typography sx={{fontSize: "16px"}}>下載</Typography>
+                                                    <Typography sx={{fontSize: "16px"}}>
+                                                        <FormattedMessage id="download"/>
+                                                    </Typography>
                                                 </Button>
                                         </Grid>
                                     </Grid>
diff --git a/src/pages/Payment/FPS/FPSTest.js b/src/pages/Payment/FPS/FPSTest.js
index c0866a4..531d255 100644
--- a/src/pages/Payment/FPS/FPSTest.js
+++ b/src/pages/Payment/FPS/FPSTest.js
@@ -284,7 +284,7 @@ const Index = () => {
                                     <Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
                                         <img src={FpsIcon} width="80" height="80" alt="FPS"></img>
                                         <br />
-                                        支付金額
+                                            <FormattedMessage id="payFee"/>
                                         <br />
                                         {"$HK " + paymentData.amount}
                                     </Typography>
diff --git a/src/pages/Payment/Search_Public/DataGrid.js b/src/pages/Payment/Search_Public/DataGrid.js
index 61ef146..97a7f39 100644
--- a/src/pages/Payment/Search_Public/DataGrid.js
+++ b/src/pages/Payment/Search_Public/DataGrid.js
@@ -86,7 +86,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
         {
             id: 'payAmount',
             field: 'payAmount',
-            headerName: '費用',
+            headerName: intl.formatMessage({id: 'fee'}),
             width: 150,
             valueGetter: (params) => {
                 return (params?.value) ? "$ " + FormatUtils.currencyFormat(params?.value) : "";
diff --git a/src/pages/Payment/Search_Public/index.js b/src/pages/Payment/Search_Public/index.js
index faf7400..0930897 100644
--- a/src/pages/Payment/Search_Public/index.js
+++ b/src/pages/Payment/Search_Public/index.js
@@ -15,6 +15,7 @@ const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/Loa
 const SearchForm = Loadable(React.lazy(() => import('./SearchForm')));
 const EventTable = Loadable(React.lazy(() => import('./DataGrid')));
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
+import {FormattedMessage} from "react-intl";
 
 const BackgroundHead = {
     backgroundImage: `url(${titleBackgroundImg})`,
@@ -68,7 +69,9 @@ const Index = () => {
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
-                            <Typography ml={15} color='#FFF' variant="h4">付款記錄</Typography>
+                            <Typography ml={15} color='#FFF' variant="h4">
+                                <FormattedMessage id="paymentHistory"/>
+                            </Typography>
                         </Stack>
                     </div>
                 </Grid>
diff --git a/src/pages/Proof/Reply_Public/ApplicationDetails.js b/src/pages/Proof/Reply_Public/ApplicationDetails.js
index e7783d4..63b486a 100644
--- a/src/pages/Proof/Reply_Public/ApplicationDetails.js
+++ b/src/pages/Proof/Reply_Public/ApplicationDetails.js
@@ -17,11 +17,12 @@ import Loadable from 'components/Loadable';
 const MainCard = Loadable(React.lazy(() => import('components/MainCard')));
 import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";
 import FileList from "components/FileList"
-import {FormattedMessage} from "react-intl";
+import {FormattedMessage, useIntl} from "react-intl";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 const ApplicationDetailCard = ({ formData, }) => {
 
     const params = useParams();
+    const intl = useIntl();
 
     const [data, setData] = React.useState({});
     //const [proofId, setProofId] = React.useState();
@@ -91,12 +92,14 @@ const ApplicationDetailCard = ({ formData, }) => {
                                 <Grid container alignItems={"left"}>
                                     <Grid item xs={12} md={3} lg={3}
                                         sx={{ display: 'flex', alignItems: 'center' }}>
-                                        <FormLabel><Typography variant="h5">申請狀態:</Typography></FormLabel>
+                                        <FormLabel><Typography variant="h5">
+                                            <FormattedMessage id="applyStatus"/>:
+                                        </Typography></FormLabel>
                                     </Grid>
 
                                     <Grid item xs={12} md={9} lg={9} sx={{ display: 'flex', alignItems: 'center' }}>
                                         <FormControl variant="outlined">
-                                            {StatusUtils.getStatusByText(data.appStatus)}
+                                            {StatusUtils.getStatusByTextIntl(data.appStatus, false, intl)}
                                         </FormControl>
                                     </Grid>
                                 </Grid>
@@ -108,7 +111,9 @@ const ApplicationDetailCard = ({ formData, }) => {
                                 <Grid container alignItems={"center"}>
                                     <Grid item xs={12} md={3} lg={3}
                                         sx={{ display: 'flex', alignItems: 'center' }}>
-                                        <FormLabel><Typography variant="h5">申請人:</Typography></FormLabel>
+                                        <FormLabel><Typography variant="h5">
+                                            <FormattedMessage id="applyPerson"/>:
+                                        </Typography></FormLabel>
                                     </Grid>
 
                                     <Grid item xs={12} md={9} lg={9}>
@@ -126,7 +131,9 @@ const ApplicationDetailCard = ({ formData, }) => {
                                 <Grid container alignItems={"center"}>
                                     <Grid item xs={12} md={3} lg={3}
                                         sx={{ display: 'flex', alignItems: 'center' }}>
-                                        <FormLabel><Typography variant="h5">憲報期數:</Typography></FormLabel>
+                                        <FormLabel><Typography variant="h5">
+                                            <FormattedMessage id="FgazetteCount"/>:
+                                        </Typography></FormLabel>
                                     </Grid>
 
                                     <Grid item xs={12} md={9} lg={9}>
@@ -225,7 +232,9 @@ const ApplicationDetailCard = ({ formData, }) => {
                                     </Grid>
                                     <Grid item xs={12} sm={3} md={3} lg={3}
                                         sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>
-                                        <Typography variant="h5">應繳費用:</Typography>
+                                        <Typography variant="h5">
+                                            <FormattedMessage id="payFeeFor"/>:
+                                        </Typography>
                                     </Grid>
                                     <Grid item xs={12} sm={9} md={9} lg={9} sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>
                                         <Typography variant="h4" style={{ color: "#0049B8", fontWeight: "bold", }}>{FormatUtils.currencyFormat(data.fee)}</Typography>
diff --git a/src/pages/Proof/Search_Public/DataGrid.js b/src/pages/Proof/Search_Public/DataGrid.js
index 2441f71..47aaf71 100644
--- a/src/pages/Proof/Search_Public/DataGrid.js
+++ b/src/pages/Proof/Search_Public/DataGrid.js
@@ -67,7 +67,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
     const columns = [
         {
             field: 'actions',
-            headerName: '校對編號',
+            headerName: intl.formatMessage({id: 'proofId'}),
             width: isMdOrLg ? 'auto' : 250,
             flex: isMdOrLg ? 1.5 : undefined,
             cellClassName: 'actions',
@@ -96,7 +96,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
         {
             id: 'created',
             field: 'created',
-            headerName: '校對日期',
+            headerName: intl.formatMessage({id: 'proofDate'}),
             width: isMdOrLg ? 'auto' : 250,
             flex: isMdOrLg ? 1.5 : undefined,
             valueGetter: (params) => {
@@ -118,7 +118,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
         {
             id: 'replyDate',
             field: 'replyDate',
-            headerName: '回覆日期',
+            headerName: intl.formatMessage({id: 'replyDate'}),
             width: isMdOrLg ? 'auto' : 250,
             flex: isMdOrLg ? 1.5 : undefined,
             valueGetter: (params) => {
@@ -137,7 +137,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
         {
             id: 'fee',
             field: 'fee',
-            headerName: '費用',
+            headerName: intl.formatMessage({id: 'fee'}),
             width: isMdOrLg ? 'auto' : 250,
             flex: isMdOrLg ? 1.5 : undefined,
             valueGetter: (params) => {
diff --git a/src/pages/Proof/Search_Public/SearchForm.js b/src/pages/Proof/Search_Public/SearchForm.js
index b5a3338..a939936 100644
--- a/src/pages/Proof/Search_Public/SearchForm.js
+++ b/src/pages/Proof/Search_Public/SearchForm.js
@@ -115,7 +115,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData
                             fullWidth
                             {...register("refNo")}
                             id='refNo'
-                            label="校對編號:"
+                            label={intl.formatMessage({id: 'proofId'}) + ":"}
                             defaultValue={searchCriteria.refNo}
                             InputLabelProps={{
                                 shrink: true
@@ -150,7 +150,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData
                             }}
                             renderInput={(params) => (
                                 <TextField {...params}
-                                    label="憲報期數"
+                                    label={intl.formatMessage({id: 'gazetteCount'})}
                                     InputLabelProps={{
                                         shrink: true
                                     }}
@@ -190,7 +190,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData
                                     {...register("dateFrom")}
                                     id="dateFrom"
                                     type="date"
-                                    label="校對日期(從)"
+                                    label={intl.formatMessage({id: 'proofDateFrom'})}
                                     defaultValue={searchCriteria.dateFrom}
                                     InputProps={{ inputProps: { max: maxDate } }}
                                     onChange={(newValue) => {
diff --git a/src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js b/src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
index 5a3e0a7..e3e448a 100644
--- a/src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
+++ b/src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
@@ -208,7 +208,9 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
                                 <Grid container direction="row" justifyContent="flex-start" alignItems="center">
                                     <Grid item xs={12} md={3} lg={3}
                                         sx={{ display: 'flex', alignItems: 'center' }}>
-                                        <Typography variant="h5">稿件檔案 ({"檔案大小應<10MB"}):</Typography>
+                                        <Typography variant="h5">
+                                            <FormattedMessage id="draftFile"/> ({"檔案大小應<10MB"}):
+                                        </Typography>
                                     </Grid>
                                     <Grid item xs={12} md={6} lg={6} sx={{ wordBreak: 'break-word' }}>
                                         <input
diff --git a/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js b/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js
index d533a65..3056e19 100644
--- a/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js
+++ b/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js
@@ -158,7 +158,7 @@ const ApplicationDetailCard = (
                                             || currentApplicationDetailData.creditor}
                                         startIcon={<EditNoteIcon />}
                                     >
-                                        支付
+                                        <FormattedMessage id="payFor"/>
                                     </Button>
                                     : null
                             }
@@ -177,7 +177,7 @@ const ApplicationDetailCard = (
                     </Grid>
                 </Grid>
                 <Typography variant="h4" sx={{ mb: 2, borderBottom: "1px solid black" }}>
-                    公共啟事申請資料
+                    <FormattedMessage id="publicNoticeDetailTitle"/>
                 </Typography>
                 <form>
                     <Grid container direction="column">
@@ -218,12 +218,14 @@ const ApplicationDetailCard = (
                                     <Grid container alignItems={"center"}>
                                         <Grid item xs={12} md={3} lg={3}
                                             sx={{ display: 'flex', alignItems: 'center' }}>
-                                            <FormLabel><Typography variant="h5">申請狀態:</Typography></FormLabel>
+                                            <FormLabel><Typography variant="h5">
+                                                <FormattedMessage id="applyStatus"/>:
+                                            </Typography></FormLabel>
                                         </Grid>
 
                                         <Grid item xs={12} md={4} lg={4}>
                                             <FormControl variant="outlined">
-                                                {StatusUtils.getStatusByText(currentApplicationDetailData.status)}
+                                                {currentApplicationDetailData.status? StatusUtils.getStatusByTextIntl(currentApplicationDetailData.status, false,intl) : ""}
                                             </FormControl>
                                         </Grid>
                                         {
@@ -255,7 +257,9 @@ const ApplicationDetailCard = (
                                     <Grid container alignItems={"center"}>
                                         <Grid item xs={12} md={3} lg={3}
                                             sx={{ display: 'flex', alignItems: 'center' }}>
-                                            <FormLabel><Typography variant="h5">申請人:</Typography></FormLabel>
+                                            <FormLabel><Typography variant="h5">
+                                                <FormattedMessage id="applyPerson"/>:
+                                            </Typography></FormLabel>
                                         </Grid>
 
                                         <Grid item xs={12} md={9} lg={9}>
@@ -300,7 +304,9 @@ const ApplicationDetailCard = (
                                     <Grid container alignItems={"center"}>
                                         <Grid item xs={12} md={3} lg={3}
                                             sx={{ display: 'flex', alignItems: 'center' }}>
-                                            <FormLabel><Typography variant="h5">憲報期數:</Typography></FormLabel>
+                                            <FormLabel><Typography variant="h5">
+                                                <FormattedMessage id="gazetteCount"/>:
+                                            </Typography></FormLabel>
                                         </Grid>
 
                                         <Grid item xs={12} md={9} lg={9}>
@@ -362,7 +368,9 @@ const ApplicationDetailCard = (
                                     <Grid container alignItems={"center"}>
                                         <Grid item xs={12} md={3} lg={3}
                                             sx={{ display: 'flex', alignItems: 'center' }}>
-                                            <FormLabel><Typography variant="h5">發布日期:</Typography></FormLabel>
+                                            <FormLabel><Typography variant="h5">
+                                                <FormattedMessage id="publishDate"/>:
+                                            </Typography></FormLabel>
                                         </Grid>
 
                                         <Grid item xs={12} md={9} lg={9}>
@@ -444,7 +452,9 @@ const ApplicationDetailCard = (
                                             <Grid container alignItems={"center"}>
                                                 <Grid item xs={12} md={3} lg={3}
                                                     sx={{ display: 'flex', alignItems: 'center' }}>
-                                                    <FormLabel><Typography variant="h5">金額(HK$):</Typography></FormLabel>
+                                                    <FormLabel><Typography variant="h5">
+                                                        <FormattedMessage id="currencyPrice"/>(HK$):
+                                                    </Typography></FormLabel>
                                                 </Grid>
 
                                                 <Grid item xs={12} md={9} lg={9}>
@@ -512,7 +522,9 @@ const ApplicationDetailCard = (
                                             <Grid container direction="row">
                                                 <Grid item xs={12} sm={12} md={2.5} lg={1.6}
                                                     sx={{ display: 'flex', alignItems: 'center' }}>
-                                                    <FormLabel><Typography variant="h5">稿件檔案:</Typography></FormLabel>
+                                                    <FormLabel><Typography variant="h5">
+                                                        <FormattedMessage id="draftFile"/>:
+                                                    </Typography></FormLabel>
                                                 </Grid>
                                                 <Grid item xs={12} sm={12} md={9} lg={9} >
                                                     <Grid container direction="row" alignItems="center" justifyContent="flex-start">
@@ -532,11 +544,11 @@ const ApplicationDetailCard = (
                                                             <Button
                                                                 variant="contained"
                                                                 onClick={onDownloadClick()}
-                                                                title="下載"
+                                                                title={intl.formatMessage({id: 'download'})}
                                                                 color="save"
                                                                 startIcon={<DownloadIcon sx={{alignItems:"center"}}/>}
                                                             >
-                                                                下載
+                                                                <FormattedMessage id="download"/>
                                                             </Button>
                                                             </ThemeProvider>
                                                         </Grid>
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js
index cc36abe..f30e650 100644
--- a/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js
+++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js
@@ -58,7 +58,7 @@ export default function SubmittedTab({ rows }) {
         {
             id: 'payAmount',
             field: 'payAmount',
-            headerName: '費用',
+            headerName: intl.formatMessage({id: 'fee'}),
             width: 150,
             valueGetter: (params) => {
                 return (params?.value) ? "$ " + FormatUtils.currencyFormat(params?.value) : "";
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
index 999af82..45e6d6f 100644
--- a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
+++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
@@ -17,6 +17,7 @@ export default function ProofTab({rows}) {
     const navigate = useNavigate()
     const theme = useTheme();
     const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));
+    const { locale } = intl;
 
     const handleEditClick = (params) => () => {
         navigate('/proof/reply/' + params.row.id);
@@ -26,7 +27,7 @@ export default function ProofTab({rows}) {
         {
            
             field: 'actions',
-            headerName: '校對編號',
+            headerName: intl.formatMessage({id: 'proofId'}),
             width: 200,
             cellClassName: 'actions',
             renderCell: (params) => {
@@ -39,13 +40,13 @@ export default function ProofTab({rows}) {
             width: isMdOrLg ? 'auto' : 160,
             flex: isMdOrLg ? 1 : undefined,
             renderCell: (params) => {
-                return ProofStatus.getStatus_Cht(params);
+                return locale === 'en' ? ProofStatus.getStatus_Eng(params) : ProofStatus.getStatus_Cht(params);
             },
         },
         {
             id: 'created',
             field: 'created',
-            headerName: '校對日期',
+            headerName: intl.formatMessage({id: 'proofDate'}),
             width: isMdOrLg ? 'auto' : 160,
             flex: isMdOrLg ? 1 : undefined,
             valueGetter: (params) => {
@@ -55,7 +56,7 @@ export default function ProofTab({rows}) {
         {
             id: 'replyDate',
             field: 'replyDate',
-            headerName: '回覆日期',
+            headerName: intl.formatMessage({id: 'replyDate'}),
             width: isMdOrLg ? 'auto' : 160,
             flex: isMdOrLg ? 1 : undefined,
             valueGetter: (params) => {
@@ -65,7 +66,7 @@ export default function ProofTab({rows}) {
         {
             id: 'fee',
             field: 'fee',
-            headerName: '費用',
+            headerName: intl.formatMessage({id: 'fee'}),
             width: isMdOrLg ? 'auto' : 160,
             flex: isMdOrLg ? 1 : undefined,
             valueGetter: (params) => {
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js
index f511237..5e34b08 100644
--- a/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js
+++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js
@@ -59,7 +59,7 @@ const PublicNotice = ({ proofList, paymentList }) => {
                                 <Tab label={
                                     intl.formatMessage({id: 'proofRecord'}) + "(" + _proofList.length + ") "} value="1"
                                 />
-                                <Tab label={"付款記錄(" + _paymentList.length + ") "} value="2" />
+                                <Tab label={ intl.formatMessage({id: 'paymentHistory'}) +"(" + _paymentList.length + ") "} value="2" />
                                 
                             </TabList>
                         </Box>
diff --git a/src/translations/en.json b/src/translations/en.json
index 087123c..4120eac 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -240,6 +240,23 @@
   "selectedPaymentMethod": "Selected payment method",
   "paymentMethodNotAvailable":"The payment function is currently not available",
 
+  "publicNoticeDetailTitle": "Public Notice Application Information",
+  "applyPerson": "Applicant",
+  "applyStatus": "Application Status",
+  "gazetteCount": "Gazette issues date",
+  "publishDate": "Publish date",
+  "draftFile": "Manuscript file",
+  "download": "Download",
+  "paymentHistory": "Payment History",
+  "proofId": "Proof Code",
+  "proofDate": "Proofing date",
+  "proofDateFrom": "Proofing date (from)",
+  "replyDate": "Reply date",
+  "fee": "Fee",
+  "payFeeFor": "Pay for",
+  "payFor": "Pay",
+  "payFee": "Payment Amount",
+
   "Dashboard": "Dashboard",
   "event": "Event"
 }
\ No newline at end of file
diff --git a/src/translations/zh-CN.json b/src/translations/zh-CN.json
index 1bb747f..8786dfe 100644
--- a/src/translations/zh-CN.json
+++ b/src/translations/zh-CN.json
@@ -240,6 +240,23 @@
   "selectedPaymentMethod": "已選擇付款方法",
   "paymentMethodNotAvailable":"付款功能現在不可用",
 
+  "publicNoticeDetailTitle": "公共启事申请资料",
+  "applyPerson": "申请人",
+  "applyStatus": "申请状态",
+  "gazetteCount": "宪报期数",
+  "publishDate": "发布日期",
+  "draftFile": "稿件档案",
+  "download": "下载",
+  "paymentHistory": "付款记录",
+  "proofId": "校对编号",
+  "proofDate": "校对日期",
+  "proofDateFrom": "校对日期(从)",
+  "replyDate": "回覆日期",
+  "fee": "费用",
+  "payFeeFor": "应缴费用",
+  "payFor": "支付",
+  "payFee": "支付金額",
+
   "Dashboard": "仪表板",
   "event": "活动"
 }
\ No newline at end of file
diff --git a/src/translations/zh-HK.json b/src/translations/zh-HK.json
index 8b656b1..5a6de35 100644
--- a/src/translations/zh-HK.json
+++ b/src/translations/zh-HK.json
@@ -240,6 +240,23 @@
   "selectedPaymentMethod": "已選擇付款方法",
   "paymentMethodNotAvailable":"付款功能現在不可用",
 
+  "publicNoticeDetailTitle": "公共啟事申請資料",
+  "applyPerson": "申請人",
+  "applyStatus": "申請狀態",
+  "gazetteCount": "憲報期數",
+  "publishDate": "發佈日期",
+  "draftFile": "稿件檔案",
+  "download": "下載",
+  "paymentHistory": "付款記錄",
+  "proofId": "校對編號",
+  "proofDate": "校對日期",
+  "proofDateFrom": "校對日期(從)",
+  "replyDate": "回覆日期",
+  "fee": "費用",
+  "payFeeFor": "應繳費用",
+  "payFor": "支付",
+  "payFee": "支付金額",
+
   "Dashboard": "儀表板",
   "event": "活動"
 }
\ No newline at end of file