| @@ -0,0 +1,327 @@ | |||
| // material-ui | |||
| import { | |||
| Grid, | |||
| Typography, | |||
| Stack, | |||
| // Button, | |||
| FormLabel, | |||
| } from '@mui/material'; | |||
| import * as React from "react"; | |||
| import * as HttpUtils from "utils/HttpUtils"; | |||
| //import { useNavigate } from 'react-router-dom'; | |||
| import { paymentPath } from "auth/utils"; | |||
| 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' | |||
| } | |||
| // ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
| const Index = () => { | |||
| //const navigate = useNavigate() | |||
| const [responeData, setResponeDataData] = React.useState({}); | |||
| const [transactionData, setTransactionData] = React.useState({}); | |||
| const [transactionDate, setTransactionDate] = React.useState(""); | |||
| const [transactionTime, setTransactionTime] = React.useState(""); | |||
| const [onReady, setOnReady] = React.useState(false); | |||
| const updatePaymentApi = "/api/payment/updatepayment"; | |||
| //const paymentStatusApi = "/api/payment/status/"; | |||
| React.useEffect(() => { | |||
| console.log("webtoken: " + localStorage.getItem("webtoken")); | |||
| if (localStorage.getItem("webtoken") != null && localStorage.getItem("webtoken") != "") { | |||
| loadForm(); | |||
| } | |||
| // else{ | |||
| // navigate("/dashboard"); | |||
| // } | |||
| }, []); | |||
| React.useEffect(() => { | |||
| console.log(responeData) | |||
| if (Object.keys(responeData).length > 0) { | |||
| setTransactionData(responeData) | |||
| } | |||
| }, [responeData]); | |||
| React.useEffect(() => { | |||
| console.log(transactionData) | |||
| if (Object.keys(transactionData).length > 0) { | |||
| setOnReady(true); | |||
| } | |||
| }, [transactionData]); | |||
| const loadForm = () => { | |||
| const date = new Date(); | |||
| const trnDate = date.getDate() + "/" + date.getMonth() + "/" + date.getFullYear(); | |||
| const trnTime = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds(); | |||
| setTransactionDate(trnDate) | |||
| setTransactionTime(trnTime) | |||
| const params = new URLSearchParams(window.location.search); | |||
| let transactionid = params.get("TRANSACTION_ID") | |||
| let receipt_token = params.get("RECEIPT_TOKEN").replace("%3D", "=") | |||
| HttpUtils.post({ | |||
| url: paymentPath + updatePaymentApi, | |||
| params: { | |||
| "transactionid": transactionid, | |||
| "receipttoken": receipt_token, | |||
| }, | |||
| onSuccess: function () { | |||
| // { | |||
| // "amount": 999.99, | |||
| // "currencycode": "HKD", | |||
| // "paymentdetail": { | |||
| // "attemptno": 1, | |||
| // "channel": "MobileWallet", | |||
| // "paymentid": "C202310268000681", | |||
| // "paymentmethod": "04", | |||
| // "result": { | |||
| // "canretry": "Y", | |||
| // "description": "CANC - Cancelled by user or Payment Server.", | |||
| // "paymentstatuscode": "CANC", | |||
| // "rejectreasoncode": "Payment Cancelled. [PAY-E-9022]" | |||
| // }, | |||
| // "subtype": "FPS", | |||
| // "time": "2023-10-26T09:02:17Z[UTC]" | |||
| // }, | |||
| // "transactionid": "20231026170103921" | |||
| // } | |||
| // ) | |||
| HttpUtils.post({ | |||
| url: paymentPath + paymentStatusApi + transactionid, | |||
| params: { | |||
| "apprefid": transactionid, | |||
| "webtoken": localStorage.getItem("webtoken"), | |||
| }, | |||
| onSuccess: function (responseData) { | |||
| setResponeDataData(responseData) | |||
| if (responseData.paymentdetail?.result?.paymentstatuscode === "APPR") { | |||
| localStorage.removeItem("webtoken"); | |||
| localStorage.removeItem("transactionid"); | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| }); | |||
| } | |||
| return ( | |||
| !onReady ? | |||
| <LoadingComponent /> | |||
| : | |||
| transactionData.paymentdetail?.result?.paymentstatuscode === "APPR" ? | |||
| ( | |||
| <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={{ pt: 2 }}>公共啟事:付款成功</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={12} > | |||
| <Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}> | |||
| 您的申請和付款已收到 | |||
| </Typography> | |||
| <Grid container> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易參考號: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {"P" + transactionData.transactionid} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易日期: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionDate + " (DD/MM/YYYY)"} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易時間: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionTime + " (HH:MI:SS)"} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| EGIS 參考號: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionData.transactionid} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 支付金額 | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {"HK$ " + transactionData.amount} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 付款方式: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionData.paymentdetail.subtype ?? (transactionData.paymentdetail.paymentmethod === "01" ? "PPS" : "")} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </Grid > | |||
| ) : | |||
| (transactionData.paymentdetail?.result?.paymentstatuscode === "CANC" ? | |||
| <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={{ pt: 2 }}>公共啟事:付款取消</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="h5" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}> | |||
| 付款取消訊息: | |||
| <br /><br /> | |||
| 您的付款已被取消。我們收到了您的付款請求,但由於某些原因,付款無法完成。請注意以下事項: | |||
| <br /><br /> | |||
| 如果您主動取消了支付,請確認並確保取消是您的意願。 | |||
| <br /> | |||
| 如果付款被取消是由於系統問題或其他原因,請您嘗試以下解決方法: | |||
| <br /><br /> | |||
| 檢查您的支付帳戶是否有任何異常或限制。 | |||
| <br /> | |||
| 確保您的付款資訊準確無誤。 | |||
| <br /> | |||
| 檢查您的網路連線是否正常。 | |||
| <br /><br /> | |||
| 如果您需要進一步的協助或有任何疑問,請隨時與我們聯繫,我們將盡快解決您的付款問題。謝謝! | |||
| </Typography> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </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={{ pt: 2 }}>公共啟事:付款失敗</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="h5" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}> | |||
| 付款失敗訊息: | |||
| <br /><br /> | |||
| 親愛的用戶,很遺憾地告訴您,您的付款操作未成功。我們在處理您的付款時遇到了問題。請您仔細檢查以下事項: | |||
| <br /><br /> | |||
| 您的支付帳戶餘額是否足夠。 | |||
| <br /> | |||
| 您提供的付款資訊是否準確無誤。 | |||
| <br /> | |||
| 請檢查您的網路連線是否正常。 | |||
| <br /><br /> | |||
| 如果您已確認以上問題無誤,但付款失敗,請您嘗試以下解決方法: | |||
| <br /><br /> | |||
| 嘗試使用其他付款方式進行付款。 | |||
| <br /> | |||
| 檢查您的支付帳戶是否有異常或限制。 | |||
| <br /> | |||
| 聯絡我們的客服人員尋求協助。 | |||
| <br /><br /> | |||
| 如果您需要進一步的協助或有任何疑問,請隨時與我們聯繫。非常抱歉給您帶來不便,我們將盡快解決您的付款問題。謝謝! | |||
| </Typography> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </Grid > | |||
| ) | |||
| ); | |||
| }; | |||
| export default Index; | |||
| @@ -1,330 +0,0 @@ | |||
| // material-ui | |||
| import { | |||
| Grid, | |||
| Typography, | |||
| Stack, | |||
| // Button, | |||
| FormLabel, | |||
| } from '@mui/material'; | |||
| import * as React from "react"; | |||
| import * as HttpUtils from "utils/HttpUtils"; | |||
| //import { useNavigate } from 'react-router-dom'; | |||
| import { paymentPath } from "auth/utils"; | |||
| 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' | |||
| } | |||
| // ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
| const Index = () => { | |||
| //const navigate = useNavigate() | |||
| const [responeData, setResponeDataData] = React.useState({}); | |||
| const [transactionData, setTransactionData] = React.useState({}); | |||
| const [transactionDate, setTransactionDate] = React.useState(""); | |||
| const [transactionTime, setTransactionTime] = React.useState(""); | |||
| const [onReady, setOnReady] = React.useState(false); | |||
| const updatePaymentApi = "/api/payment/updatepayment"; | |||
| //const paymentStatusApi = "/api/payment/status/"; | |||
| React.useEffect(() => { | |||
| console.log("webtoken: " + localStorage.getItem("webtoken")); | |||
| if (localStorage.getItem("webtoken") != null && localStorage.getItem("webtoken") != "") { | |||
| loadForm(); | |||
| } | |||
| // else{ | |||
| // navigate("/dashboard"); | |||
| // } | |||
| }, []); | |||
| React.useEffect(() => { | |||
| console.log(responeData) | |||
| if (Object.keys(responeData).length > 0) { | |||
| setTransactionData(responeData) | |||
| } | |||
| }, [responeData]); | |||
| React.useEffect(() => { | |||
| console.log(transactionData) | |||
| if (Object.keys(transactionData).length > 0) { | |||
| setOnReady(true); | |||
| } | |||
| }, [transactionData]); | |||
| const loadForm = () => { | |||
| const date = new Date(); | |||
| const trnDate = date.getDate() + "/" + date.getMonth() + "/" + date.getFullYear(); | |||
| const trnTime = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds(); | |||
| setTransactionDate(trnDate) | |||
| setTransactionTime(trnTime) | |||
| const params = new URLSearchParams(window.location.search); | |||
| let transactionid = params.get("TRANSACTION_ID") | |||
| let receipt_token = params.get("RECEIPT_TOKEN").replace("%3D", "=") | |||
| HttpUtils.post({ | |||
| url: paymentPath + updatePaymentApi, | |||
| params: { | |||
| "transactionid": transactionid, | |||
| "receipttoken": receipt_token, | |||
| }, | |||
| onSuccess: function (responseData) { | |||
| // { | |||
| // "transactionid": "<transactionid>", | |||
| // "currencycode":"<currencycode>", | |||
| // "amount":<amount>, | |||
| // "paymentdetail":{ | |||
| // "paymentid": "<paymentid>", | |||
| // "paymentmethod": "<paymentmethod>", | |||
| // "time": "<time>", | |||
| // "brandname": "<brandname>", | |||
| // "channel": "<channeltype>", | |||
| // "subtype": "<subtype>", | |||
| // "attemptno": "<attemptno>", | |||
| // "result": { | |||
| // "code": "<code>", | |||
| // "paymentstatuscode": | |||
| // "<paymentstatuscode>" | |||
| // "description": "<description>", | |||
| // "rejectreasoncode": | |||
| // "<rejectreasoncode>", | |||
| // "canretry": "<retry>" | |||
| // } | |||
| // } | |||
| //} | |||
| setResponeDataData(responseData) | |||
| if (responseData.paymentdetail?.result?.paymentstatuscode === "APPR") { | |||
| localStorage.removeItem("webtoken"); | |||
| localStorage.removeItem("transactionid"); | |||
| } | |||
| // HttpUtils.post({ | |||
| // url: paymentPath + paymentStatusApi + transactionid, | |||
| // params: { | |||
| // "apprefid": transactionid, | |||
| // "webtoken": localStorage.getItem("webtoken"), | |||
| // }, | |||
| // onSuccess: function (responseData) { | |||
| // } | |||
| // }); | |||
| } | |||
| }); | |||
| } | |||
| return ( | |||
| !onReady ? | |||
| <LoadingComponent /> | |||
| : | |||
| transactionData.paymentdetail?.result?.paymentstatuscode === "APPR" ? | |||
| ( | |||
| <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={{ pt: 2 }}>公共啟事:付款成功</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={12} > | |||
| <Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}> | |||
| 您的申請和付款已收到 | |||
| </Typography> | |||
| <Grid container> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易參考號: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {"P"+transactionData.transactionid} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易日期: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionDate + " (DD/MM/YYYY)"} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 交易時間: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionTime + " (HH:MI:SS)"} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| EGIS 參考號: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionData.transactionid} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 支付金額 | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {"HK$ " + transactionData.amount} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| <Grid item xs={12} md={12}> | |||
| <Grid container > | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| 付款方式: | |||
| </FormLabel> | |||
| </Grid> | |||
| <Grid item> | |||
| <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}> | |||
| {transactionData.paymentdetail.brandname??(transactionData.paymentdetail.paymentmethod==="01"?"PPS":"")} | |||
| </FormLabel> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </Grid > | |||
| ) : | |||
| (transactionData.paymentdetail?.result?.paymentstatuscode === "CANC" ? | |||
| <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={{ pt: 2 }}>公共啟事:付款取消</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="h5" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}> | |||
| 付款取消訊息: | |||
| <br /><br /> | |||
| 您的付款已被取消。我們收到了您的付款請求,但由於某些原因,付款無法完成。請注意以下事項: | |||
| <br /><br /> | |||
| 如果您主動取消了支付,請確認並確保取消是您的意願。 | |||
| <br /> | |||
| 如果付款被取消是由於系統問題或其他原因,請您嘗試以下解決方法: | |||
| <br /><br /> | |||
| 檢查您的支付帳戶是否有任何異常或限制。 | |||
| <br /> | |||
| 確保您的付款資訊準確無誤。 | |||
| <br /> | |||
| 檢查您的網路連線是否正常。 | |||
| <br /><br /> | |||
| 如果您需要進一步的協助或有任何疑問,請隨時與我們聯繫,我們將盡快解決您的付款問題。謝謝! | |||
| </Typography> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </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={{ pt: 2 }}>公共啟事:付款失敗</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="h5" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "left" }}> | |||
| 付款失敗訊息: | |||
| <br /><br /> | |||
| 親愛的用戶,很遺憾地告訴您,您的付款操作未成功。我們在處理您的付款時遇到了問題。請您仔細檢查以下事項: | |||
| <br /><br /> | |||
| 您的支付帳戶餘額是否足夠。 | |||
| <br /> | |||
| 您提供的付款資訊是否準確無誤。 | |||
| <br /> | |||
| 請檢查您的網路連線是否正常。 | |||
| <br /><br /> | |||
| 如果您已確認以上問題無誤,但付款失敗,請您嘗試以下解決方法: | |||
| <br /><br /> | |||
| 嘗試使用其他付款方式進行付款。 | |||
| <br /> | |||
| 檢查您的支付帳戶是否有異常或限制。 | |||
| <br /> | |||
| 聯絡我們的客服人員尋求協助。 | |||
| <br /><br /> | |||
| 如果您需要進一步的協助或有任何疑問,請隨時與我們聯繫。非常抱歉給您帶來不便,我們將盡快解決您的付款問題。謝謝! | |||
| </Typography> | |||
| </Grid> | |||
| </center> | |||
| </Grid> | |||
| </Grid> | |||
| {/*row 2*/} | |||
| </Grid > | |||
| ) | |||
| ); | |||
| }; | |||
| export default Index; | |||
| @@ -118,9 +118,21 @@ const FormPanel = ({ formData }) => { | |||
| noOfPages: values.noOfPages, | |||
| }, | |||
| files: attachments, | |||
| onSuccess: function () { | |||
| notifySaveSuccess() | |||
| navigate("/proof/search"); | |||
| onSuccess: function (responeData) { | |||
| if(responeData.success == true){ | |||
| notifySaveSuccess() | |||
| navigate("/proof/search"); | |||
| }else{ | |||
| let msg = responeData.msg; | |||
| if(msg ==="haveActiveProof"){ | |||
| msg = "Action Failed: There is already a pending payment and proofreading record for client review." | |||
| }else if(msg === "haveProofed"){ | |||
| msg = "Action Failed: Already proofed." | |||
| } | |||
| setWarningText(msg); | |||
| setIsWarningPopUp(true); | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| @@ -20,6 +20,7 @@ import Loadable from 'components/Loadable'; | |||
| import { lazy } from 'react'; | |||
| const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent'))); | |||
| import * as HttpUtils from "utils/HttpUtils" | |||
| import * as UrlUtils from "utils/ApiPathConst" | |||
| import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils"; | |||
| import DoneIcon from '@mui/icons-material/Done'; | |||
| @@ -101,8 +102,25 @@ const ApplicationDetailCard = ( | |||
| const onProofClick = () => { | |||
| if (applicationDetailData.data.groupNo) { | |||
| window.open("/proof/create/" + currentApplicationDetailData.id, "_blank", "noreferrer"); | |||
| window.addEventListener("focus", onFocus) | |||
| HttpUtils.get({ | |||
| url: UrlUtils.CHECK_CREATE_PROOF+"/"+currentApplicationDetailData.id, | |||
| onSuccess:function(responeData){ | |||
| if(responeData.success == true){ | |||
| window.open("/proof/create/" + currentApplicationDetailData.id, "_blank", "noreferrer"); | |||
| window.addEventListener("focus", onFocus) | |||
| }else{ | |||
| let msg = responeData.msg; | |||
| if(msg === "haveActiveProof"){ | |||
| msg = "Action Failed: There is already a pending payment and proofreading record for client review." | |||
| }else if(msg === "haveProofed"){ | |||
| msg = "Action Failed: Already proofed." | |||
| } | |||
| setWarningText(msg); | |||
| setIsWarningPopUp(true); | |||
| } | |||
| } | |||
| }); | |||
| }else{ | |||
| setWarningText("Please generate Gazette Code before Create Proof."); | |||
| setIsWarningPopUp(true); | |||
| @@ -19,7 +19,7 @@ const Payment_FPS = Loadable(lazy(() => import('pages/Payment/FPS'))); | |||
| const Payment_FPS_CallBack = Loadable(lazy(() => import('pages/Payment/FPS/fpscallback'))); | |||
| const Payment_FPS_Ackpage = Loadable(lazy(() => import('pages/Payment/FPS/AckPage'))); | |||
| const Payment_Card = Loadable(lazy(() => import('pages/Payment/Card'))); | |||
| const Payment_Success = Loadable(lazy(() => import('pages/Payment/PaymentSuccess'))); | |||
| const Payment_Callback = Loadable(lazy(() => import('pages/Payment/PaymentCallback'))); | |||
| // ==============================|| MAIN ROUTING ||============================== // | |||
| @@ -80,7 +80,7 @@ const PublicDashboard = { | |||
| }, | |||
| { | |||
| path: 'paymentPage/callback', | |||
| element: <Payment_Success/> | |||
| element: <Payment_Callback/> | |||
| }, | |||
| { | |||
| path: 'paymentPage/fps/fpscallback', | |||
| @@ -71,6 +71,7 @@ export const UPDATE_PUBLIC_NOTICE_APPLY_DETAIL = apiPath+'/application/save'; | |||
| export const GET_ISSUE_COMBO = apiPath+'/gazette-issue/combo'; | |||
| export const CHECK_CREATE_PROOF = apiPath+'/proof/check-create';//GET | |||
| export const LIST_PROOF = apiPath+'/proof/list';//GET | |||
| export const GET_PROOF_APP = apiPath+'/proof/create-from-app';//GLD | |||
| export const CREATE_PROOF = apiPath+'/proof/create';//POST | |||