@@ -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> | |||
); | |||
} |
@@ -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> | |||
@@ -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%", | |||
@@ -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> | |||
); | |||
@@ -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> | |||
@@ -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" /> : | |||
{ | |||
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" /> : | |||
<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 | |||
@@ -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> | |||
) | |||
}, | |||
@@ -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> | |||
) | |||
}, | |||
@@ -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> | |||
@@ -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> | |||
@@ -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{ | |||