diff --git a/src/pages/Payment/Details_Public/DataGrid.js b/src/pages/Payment/Details_Public/DataGrid.js
index b05ccb2..7549c85 100644
--- a/src/pages/Payment/Details_Public/DataGrid.js
+++ b/src/pages/Payment/Details_Public/DataGrid.js
@@ -11,6 +11,7 @@ import { FiDataGrid } from "components/FiDataGrid";
 import * as DateUtils from "utils/DateUtils"
 import {useTheme} from "@emotion/react";
 import {FormattedMessage, useIntl} from "react-intl";
+import { Grid } from '../../../../node_modules/@mui/material/index';
 // import * as Utils from "utils/Utils"
 // ==============================|| EVENT TABLE ||============================== //
 
@@ -23,6 +24,22 @@ export default function SearchPublicNoticeTable({ recordList }) {
     const { locale } = intl;
     //const intl = useIntl();
 
+    const _sx = {
+        padding: "4 2 4 2",
+        boxShadow: 1,
+        border: 1,
+        borderColor: '#DDD',
+        '& .MuiDataGrid-cell': {
+            borderTop: 1,
+            borderBottom: 1,
+            borderColor: "#EEE"
+        },
+        '& .MuiDataGrid-footerContainer': {
+            border: 1,
+            borderColor: "#EEE"
+        }
+    }
+
     React.useEffect(() => {
         const indexedData = recordList.map((obj, index) => ({ index_number: index + 1, ...obj }));
         setRows(indexedData);
@@ -76,17 +93,22 @@ export default function SearchPublicNoticeTable({ recordList }) {
         <div style={{ minHeight:400, width: '100%' }}>
 
             <FiDataGrid
+                sx={_sx}
                 rowHeight={150}
                 rows={rows}
                 columns={columns}
                 customPageSize={5}
             />
-            <Typography align="right" variant="h4" sx={{mr:2}}>
-                <FormattedMessage id="payTotal"/>:
-                <span style={{ color: "blue", fontWeight: "bold", }}>
-                    (HK$) {FormatUtils.currencyFormat(total)}
-                </span>
-            </Typography>
+            <Grid container direction="row"  justifyContent="flex-end" sx={{backgroundColor: '#fff' }}>
+                <Grid item>
+                    <Typography align="right" variant="h4" sx={{mr:2,mt:1}}>
+                        <FormattedMessage id="payTotal"/>:
+                        <span style={{ color: "blue", fontWeight: "bold", }}>
+                            (HK$) {FormatUtils.currencyFormat(total)}
+                        </span>
+                    </Typography>
+                </Grid>
+            </Grid>
         </div>
     );
 }
diff --git a/src/pages/Payment/Details_Public/PaymentDetails.js b/src/pages/Payment/Details_Public/PaymentDetails.js
index b7e6037..8de776c 100644
--- a/src/pages/Payment/Details_Public/PaymentDetails.js
+++ b/src/pages/Payment/Details_Public/PaymentDetails.js
@@ -15,7 +15,7 @@ const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/Loa
 import DownloadIcon from '@mui/icons-material/Download';
 import {FormattedMessage, useIntl} from "react-intl";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const PaymentDetails = ({ formData,doPrint }) => {
+const PaymentDetails = ({ formData,doPrint,onDownload }) => {
 
     const intl = useIntl();
     const { locale } = intl;
@@ -168,12 +168,16 @@ const PaymentDetails = ({ formData,doPrint }) => {
                                             </FormLabel>
                                         </Grid>
                                         <Grid xs={6} md={5} sx={{ml:5,textAlign: "left" }}>
+                                            {onDownload?
+                                                <LoadingComponent disableText={true} alignItems="flex-start"/>
+                                            :
                                                 <Button className="printHidden" variant="contained" sx={{ mt:2 }} onClick={doPrint}>
                                                     <DownloadIcon/>
                                                     <Typography sx={{fontSize: "16px"}}>
                                                         <FormattedMessage id="download"/>
                                                     </Typography>
                                                 </Button>
+                                            }
                                         </Grid>
                                     </Grid>
                                 </Grid>
diff --git a/src/pages/Payment/Details_Public/index.js b/src/pages/Payment/Details_Public/index.js
index cb69dc7..ca4d4b6 100644
--- a/src/pages/Payment/Details_Public/index.js
+++ b/src/pages/Payment/Details_Public/index.js
@@ -40,6 +40,7 @@ const Index = () => {
     const [record, setRecord] = React.useState();
     const [itemList, setItemList] = React.useState([]);
     const [onReady, setOnReady] = React.useState(false);
+    const [onDownload, setOnDownload] = React.useState(false);
     // const [detailsOrder, setDetailsOrder] = React.useState(2);
 
     React.useEffect(() => {
@@ -58,8 +59,15 @@ const Index = () => {
 
     const doPrint = () => {
         // window.print();
+        setOnDownload(true)
         HttpUtils.fileDownload({
             url: UrlUtils.GEN_PAYMENT_RECEIPT+"/"+params.id,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     };
 
@@ -122,6 +130,7 @@ const Index = () => {
                                         <PaymentDetails
                                             formData={record}
                                             doPrint={doPrint}
+                                            onDownload={onDownload}
                                             style={{
                                                 display: "flex",
                                                 height: "100%",
diff --git a/src/pages/Payment/Search_Public/DataGrid.js b/src/pages/Payment/Search_Public/DataGrid.js
index b662f17..fa58b16 100644
--- a/src/pages/Payment/Search_Public/DataGrid.js
+++ b/src/pages/Payment/Search_Public/DataGrid.js
@@ -44,6 +44,10 @@ export default function SearchPublicNoticeTable({ recordList }) {
         navigate('/paymentPage/details/' + params.row.id);
     };
 
+    const handleEditDoubleClick = (params) =>{
+        navigate('/paymentPage/details/' + params.row.id);
+    };
+
     const columns = [
         {
             field: 'actions',
@@ -100,14 +104,13 @@ export default function SearchPublicNoticeTable({ recordList }) {
 
     return (
         <div style={{ minHeight: 400, width: '100%' }}>
-
             <FiDataGrid
                 sx={_sx}
                 rowHeight={80}
                 rows={rows}
                 columns={columns}
                 customPageSize={5}
-                onRowDoubleClick={handleEditClick}
+                onRowDoubleClick={handleEditDoubleClick}
             />
         </div>
     );
diff --git a/src/pages/Payment/Search_Public/SearchForm.js b/src/pages/Payment/Search_Public/SearchForm.js
index a7b5c65..1cd0fc7 100644
--- a/src/pages/Payment/Search_Public/SearchForm.js
+++ b/src/pages/Payment/Search_Public/SearchForm.js
@@ -44,7 +44,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
     const onSubmit = (data) => {
         const temp = {
             code: data.code,
-            tarnsNo: data.tarnsNo,
+            transNo: data.transNo,
             dateFrom: data.dateFrom,
             dateTo: data.dateTo,
             status : (status?.type && status?.type != 'all') ? status?.type : "",
@@ -134,19 +134,6 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                         </Grid>
                     </Grid>
 
-                    <Grid item xs={12} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
-                        <TextField
-                            fullWidth
-                            {...register("tarnsNo")}
-                            id='tarnsNo'
-                            label={intl.formatMessage({id: 'payId'})+":"}
-                            defaultValue={searchCriteria.tarnsNo}
-                            InputLabelProps={{
-                                shrink: true
-                            }}
-                        />
-                    </Grid>
-
                     <Grid item xs={12} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
                         <Autocomplete
                             {...register("status")}
@@ -174,6 +161,19 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                         />
                     </Grid>
 
+                    <Grid item xs={12} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
+                        <TextField
+                            fullWidth
+                            {...register("transNo")}
+                            id='transNo'
+                            label={intl.formatMessage({id: 'payId'})+":"}
+                            defaultValue={searchCriteria.transNo}
+                            InputLabelProps={{
+                                shrink: true
+                            }}
+                        />
+                    </Grid>
+                    
                 </Grid>
 
 
diff --git a/src/pages/Proof/Reply_Public/ProofForm.js b/src/pages/Proof/Reply_Public/ProofForm.js
index 15b2735..76530f5 100644
--- a/src/pages/Proof/Reply_Public/ProofForm.js
+++ b/src/pages/Proof/Reply_Public/ProofForm.js
@@ -22,10 +22,11 @@ import { useNavigate } from "react-router-dom";
 import * as DateUtils from "utils/DateUtils"
 import Loadable from 'components/Loadable';
 import { notifyActionSuccess } from 'utils/CommonFunction';
-import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
+import {PNSPS_BUTTON_THEME} from "themes/buttonConst";
 import {ThemeProvider} from "@emotion/react";
 import {FormattedMessage, useIntl} from "react-intl";
 const UploadFileTable = Loadable(React.lazy(() => import('./UploadFileTable')));
+import * as ProofStatus from "utils/statusUtils/ProofStatus";
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
@@ -154,7 +155,7 @@ const FormPanel = ({ formData }) => {
                         <Grid container direction="column" sx={{ paddingLeft: 0, paddingRight: 0 }}>
                             <Grid item xs={12} sm={12} md={12} lg={8} textAlign="left">
                                 <Typography variant="h5">
-                                    <FormattedMessage id="proofReplyDate" />:
+                                    <FormattedMessage id="proofReplyDate" /> :&nbsp;
                                     {
                                         locale === 'en' ?
                                             DateUtils.dateStr(formik.values.replyDate)
@@ -165,7 +166,7 @@ const FormPanel = ({ formData }) => {
                             </Grid>
                             <Grid item xs={12} md={12} textAlign="left">
                                 <Typography variant="h5">
-                                    <FormattedMessage id="proofReply" />: {formik.values.action ?
+                                    <FormattedMessage id="proofReply" /> : {formik.values.action ?
                                     (<span style={{ color: 'green' }}>
                                         <FormattedMessage id="proofErrorFree" />
                                     </span>)
@@ -175,6 +176,19 @@ const FormPanel = ({ formData }) => {
                                     </span>)}
                                 </Typography>
                             </Grid>
+                            <Grid item xs={12} md={12} textAlign="left">
+                                <Typography variant="h5">
+                                    <FormattedMessage id="proofReply" /> :&nbsp;
+                                    <span style={{ color: 'green' }}>
+                                        {
+                                        locale === 'en' ? 
+                                            ProofStatus.getStatusText_Eng(formik.values).text
+                                            : 
+                                            ProofStatus.getStatusText_Cht(formik.values).text
+                                        }
+                                    </span>
+                                </Typography>
+                            </Grid>
                             {
                                 formik.values.action ?
                                     null
diff --git a/src/pages/PublicNotice/ListPanel/BaseGrid.js b/src/pages/PublicNotice/ListPanel/BaseGrid.js
index 8789cc2..6607aea 100644
--- a/src/pages/PublicNotice/ListPanel/BaseGrid.js
+++ b/src/pages/PublicNotice/ListPanel/BaseGrid.js
@@ -3,7 +3,8 @@ import * as React from 'react';
 import {FiDataGrid} from "components/FiDataGrid";
 import {
     Button,
-    Typography, useMediaQuery
+    // Typography, 
+    useMediaQuery
 } from '@mui/material';
 import * as DateUtils from "utils/DateUtils"
 import {useNavigate} from "react-router-dom";
@@ -80,13 +81,13 @@ export default function BaseGrid({rows}) {
             renderCell: (params) => (
                 isORGLoggedIn()? 
                 <div>
-                  <Typography variant="pnspsNormalText">Care Of: {params.row.careOf}</Typography>
-                  <Typography>
-                      <FormattedMessage variant="pnspsNormalText" id="myRemarks"/>: {params.row.remarks}
-                  </Typography>
+                    Care Of: {params.row.careOf} <br/>
+                    <FormattedMessage variant="pnspsNormalText" id="myRemarks"/>: {params.row.remarks}
+    
                 </div>:
                 <div>
-                    <Typography variant="pnspsNormalText">{params.row.remarks}</Typography>
+                    {params.row.remarks}
+                    {/* <Typography variant="pnspsNormalText">{params.row.remarks}</Typography> */}
                 </div>
               )
         },
diff --git a/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js b/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
index 44b8765..0fae35a 100644
--- a/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
+++ b/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
@@ -166,12 +166,13 @@ export default function SubmittedTab({ rows }) {
             renderCell: (params) => (
                 isORGLoggedIn() ?
                     <div>
-                        <Typography variant="pnspsNormalText">Care Of: {params.row.careOf}</Typography>
-                        <Typography variant="pnspsNormalText">
-                            <FormattedMessage id="myRemarks"/>: {params.row.remarks}</Typography>
+                        Care Of: {params.row.careOf}<br/>
+                        <FormattedMessage id="myRemarks"/>: {params.row.remarks}
                     </div> :
                     <div>
-                        <Typography variant="pnspsNormalText">{params.row.remarks}</Typography>
+                        {/* <Typography variant="pnspsNormalText"> */}
+                            {params.row.remarks}
+                            {/* </Typography> */}
                     </div>
             )
         },
diff --git a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
index c0e001d..7c84c05 100644
--- a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
+++ b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
@@ -83,10 +83,8 @@ export default function SearchPublicNoticeTable({ recordList }) {
             renderCell: (params) => (
                 isORGLoggedIn()? 
                 <div>
-                  <Typography variant="pnspsNormalText">Care Of: {params.row.careOf}</Typography>
-                  <Typography variant="pnspsNormalText">
-                      <FormattedMessage id="myRemarks"/>: {params.row.remarks}
-                  </Typography>
+                    Care Of: {params.row.careOf} <br/>
+                    <FormattedMessage id="myRemarks"/>: {params.row.remarks}
                 </div>:
                 <div>
                      <Typography variant="pnspsNormalText">{params.row.remarks}</Typography>
diff --git a/src/pages/extra-pages/LoadingComponent.js b/src/pages/extra-pages/LoadingComponent.js
index 4152295..4cd396b 100644
--- a/src/pages/extra-pages/LoadingComponent.js
+++ b/src/pages/extra-pages/LoadingComponent.js
@@ -1,7 +1,7 @@
 import {Box, CircularProgress, Grid, Typography} from "@mui/material";
 import {FormattedMessage} from "react-intl";
 
-const LoadingComponent = () => {
+const LoadingComponent = ({disableText,alignItems}) => {
     return (
         <Grid item xs={12} md={12} lg={12} justifyContent="space-between" alignItems="center">
             <Box
@@ -10,11 +10,15 @@ const LoadingComponent = () => {
                 alignItems="center"
                 // autoHeight={true}
             >
-                <Grid container direction="column" alignItems="center">
+                <Grid container direction="column" alignItems={alignItems?alignItems:"center"}>
                     <CircularProgress/>
-                    <Typography variant="h5">
-                        <FormattedMessage id="loading" />
-                    </Typography>
+                    {disableText?
+                        null
+                    :
+                        <Typography variant="h5">
+                            <FormattedMessage id="loading" />
+                        </Typography>
+                    }
                 </Grid>
 
             </Box>
diff --git a/src/utils/statusUtils/ProofStatus.js b/src/utils/statusUtils/ProofStatus.js
index 05a8fef..fdf6b39 100644
--- a/src/utils/statusUtils/ProofStatus.js
+++ b/src/utils/statusUtils/ProofStatus.js
@@ -17,14 +17,26 @@ export function getStatus_Eng(params) {
     return getStatusTag({color: status.color, textColor:status.textColor, text:status.eng })
 }
 
+export function getStatusText_Cht(params) {
+    let status = getStatus(params);
+    return {text:status.cht,status:status.eng}
+}
+
+export function getStatusText_Eng(params) {
+    let status = getStatus(params);
+    return {text:status.eng,status:status.eng}
+}
+
 function getStatus(params) {
+    // console.log(params)
     let replyDate = params.row?params.row.replyDate:params.replyDate;
     let action = params.row?params.row.action:params.action;
     let returnBeforeDate = params.row?params.row.returnBeforeDate:params.returnBeforeDate;
     let isCancelled = params.row?params.row.cancelled:params.cancelled;
-
+    
     if(isCancelled) return cancel;
-
+    
+    console.log(replyDate)
     if(replyDate){
         return action?confirm:unable;
     }else{