fps callback

src/pages/Payment/FPS/AckPage.js

@@ -9,11 +9,13 @@ import {
 } from '@mui/material';
 import * as React from "react";
 import * as HttpUtils from "utils/HttpUtils";
+import * as UrlUtils from "utils/ApiPathConst";
 // import { useNavigate } from "react-router-dom";
 // import FpsIcon from "assets/images/icons/fps.svg";
-import { useLocation } from 'react-router-dom';
+// import { useLocation } from 'react-router-dom';
 import {paymentPath} from "auth/utils";
 // import {poll} from "utils/Utils";
+import * as DateUtils from "utils/DateUtils"
 
 import Loadable from 'components/Loadable';
 const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
@@ -35,12 +37,13 @@ const BackgroundHead = {
 
 const AckPage = () => {
     // const navigate = useNavigate()
-    const location = useLocation();
+    // const location = useLocation();
 
-    const [locationData, setLocationData] = React.useState({});
+    // const [locationData, setLocationData] = React.useState({});
     const [paymentData, setPaymentData] = React.useState({});
     const [responeData, setResponeDataData] = React.useState({});
-
+    const [itemList, setItemList] = React.useState([]);
+    
     const [transactionData, setTransactionData] = React.useState({});
     // const [transactionDate, setTransactionDate] = React.useState("");
     // const [transactionTime, setTransactionTime] = React.useState("");
@@ -49,28 +52,9 @@ const AckPage = () => {
 
 
     React.useEffect(() => {
-        console.log (location.state)
-        if(Object.keys(location.state).length > 0){
-            console.log (location.state)
-            setLocationData(location.state)
-        }
+        loadForm();
     }, []);
 
-    React.useEffect(() => {
-        console.log (locationData)
-        if (Object.keys(locationData).length > 0){
-            setPaymentData(locationData)
-            // loadForm();
-        }
-    }, [locationData]);
-
-    React.useEffect(() => {
-        console.log (paymentData)
-        if (Object.keys(paymentData).length > 0){
-            loadForm();
-        }
-    }, [paymentData]);
-
     React.useEffect(() => {
         console.log(responeData)
         if(Object.keys(responeData).length > 0){
@@ -79,7 +63,7 @@ const AckPage = () => {
     }, [responeData]);
 
     React.useEffect(() => {
-        console.log(paymentData)
+        // console.log(paymentData)
         console.log(transactionData)
         if(Object.keys(transactionData).length > 0 ){
             setOnReady(true);
@@ -112,7 +96,7 @@ const AckPage = () => {
                     url: UrlUtils.PAYMENT_SAVE,
                     params: {
                         id: localStorage.getItem("paymentId"),
-                        transNo: transactionData.transicationId,
+                        transNo: responseData.transactionid,
                         transDateTime: responseData.paymentdetail.time.replace("[UTC]", ""),
                         egisRefNo: responseData.paymentdetail.paymentid,
                         status: responseData.paymentdetail.result.paymentstatuscode,

src/pages/Payment/FPS/FPS.js

@@ -17,7 +17,6 @@ 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 { object } from 'prop-types';
 const BackgroundHead = {
     backgroundImage: `url(${titleBackgroundImg})`,
     width: '100%',
@@ -108,7 +107,7 @@ const Index = () => {
         localStorage.removeItem("webtoken")
         localStorage.setItem("transactionid", paymentData.transactionid)
         localStorage.setItem("webtoken", paymentData.webtoken)
-        
+
         HttpUtils.post({
             url: paymentPath+loadPaymentUrl,
             params:{
@@ -158,7 +157,7 @@ const Index = () => {
     }
 
     const getPaymentStatus = () => {
-        if(object.keys(paymentData).length > 0){
+        if(Object.keys(paymentData).length > 0){
             HttpUtils.post({
                 url: paymentPath+paymentStatusApi+paymentData.transactionid,
                 params:{
@@ -169,11 +168,11 @@ const Index = () => {
                     const paymentstatuscode = responseData.paymentdetail.result.paymentstatuscode;
                     if (paymentstatuscode != "" && paymentstatuscode != "INPR" ){
                         if (paymentstatuscode === 'APPR') {
-                            const timestamp = Date.now();
-                            navigate('/paymentPage/fps/ackpage', {state:{transactionDateTime:timestamp,transactionid:paymentData.transactionid} });
+                            // const timestamp = Date.now();
+                            navigate('/paymentPage/fps/ackpage');
                         } else if (paymentstatuscode === 'CANC') {
-                            const timestamp = Date.now();
-                            navigate('/paymentPage/fps/ackpage', {state:{transactionDateTime:timestamp,transactionid:paymentData.transactionid} });
+                            // const timestamp = Date.now();
+                            navigate('/paymentPage/fps/ackpage');
                         } else {
                             // window.top.location.href = paymentPath + payment.config.errPagePath;
                             alert("ERROR")
@@ -192,7 +191,7 @@ const Index = () => {
         const timeOutDate = new Date(fpsmerchanttimeoutdatetime);
         const currentTime = new Date;
         const timedowncount = Math.round((timeOutDate.getTime() - currentTime.getTime()) / 1000);
-        setTimeDownCount(timedowncount)
+        setTimeDownCount(timedowncount);
         // console.log(time)
         // console.log(timeOutDate)
         // console.log(currentTime)
@@ -206,7 +205,7 @@ const Index = () => {
     },[time])
 
     const cancelPayment = ()=>{
-        if (object.keys(paymentData).length>0){
+        if (Object.keys(paymentData).length>0){
             HttpUtils.post({
                 url: paymentPath+cancelPaymentUrl,
                 params:{
@@ -215,8 +214,7 @@ const Index = () => {
                     "paymentid": fpsTransctionData.paymentid
                 },
                 onSuccess: function(){
-                    const timestamp = Date.now();
-                            navigate('/paymentPage/fps/ackpage', {state:{transactionDateTime:timestamp,transactionid:paymentData.transactionid} });
+                    navigate('/paymentPage/fps/ackpage');
                 }
             });       
         }

src/pages/Payment/MultiPaymentWindow.js

@@ -110,7 +110,7 @@ const MultiPaymentWindow = (props) => {
               </Grid>
               <Grid item>
                 <FormLabel sx={{ fontSize: "16px", color: "#000000", textAlign: "center" }}>
-                  {transactionData.transicationId}
+                  {transactionData.transactionid}
                 </FormLabel>
               </Grid>
             </Grid>

src/pages/Payment/PaymentCallback.js

@@ -12,6 +12,7 @@ import * as HttpUtils from "utils/HttpUtils";
 import * as UrlUtils from "utils/ApiPathConst";
 //import { useNavigate } from 'react-router-dom';
 import { paymentPath } from "auth/utils";
+import * as DateUtils from "utils/DateUtils"
 
 import Loadable from 'components/Loadable';
 const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
@@ -118,7 +119,7 @@ const Index = () => {
                             url: UrlUtils.PAYMENT_SAVE,
                             params: {
                                 id: localStorage.getItem("paymentId"),
-                                transNo: transactionData.transicationId,
+                                transNo: responseData.transactionid,
                                 transDateTime: responseData.paymentdetail.time.replace("[UTC]", ""),
                                 egisRefNo: responseData.paymentdetail.paymentid,
                                 status: responseData.paymentdetail.result.paymentstatuscode,

src/pages/Payment/index.js

@@ -19,6 +19,14 @@ import {
     Box
 } from '@mui/material';
 
+//icon
+import VisaIcon from "assets/images/icons/visacard.svg";
+import MasterIcon from "assets/images/icons/mastercard.svg";
+import JcbIcon from "assets/images/icons/jcb.svg";
+import UnionPayIcon from "assets/images/icons/unionpay.svg";
+import PpsIcon from "assets/images/icons/ppshk.svg";
+import FpsIcon from "assets/images/icons/fps.svg";
+
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
 const BackgroundHead = {
     backgroundImage: `url(${titleBackgroundImg})`,
@@ -124,7 +132,7 @@ const Index = () => {
                 HttpUtils.post({
                     url: UrlUtils.PAYMENT_CREATE,
                     params: {
-                        transNo: transactionData.transicationId,
+                        transNo: transactionData.transactionid,
                         payMethod: paymentMethod,
                         payAmount: totalAmount,
                         appIdList: location.state?.appIdList ?? []
@@ -420,14 +428,14 @@ const Index = () => {
                                         </Grid>
                                         </Grid>
                                     </Grid>
-                                    {availableMethodData.length > 0?
+                                    {availableMethods.length > 0?
                                         !onReady ?
                                         <LoadingComponent />:
                                             <Grid item xs={12} md={12}>
                                                 <Grid container spacing={1} direction="row" justifyContent="flex-start" alignItems="center">
                                                     <Grid item>
                                                         <Typography variant="h5" sx={{  textAlign: "left" }}>
-                                                        付款方式:
+                                                        請選擇付款方式:
                                                         </Typography>
                                                     </Grid>
                                                     <Grid item>