add

Strides-APP/app/i18n/locales/en.js

@@ -463,7 +463,12 @@ export default {
     labelTimeReservation: "Time of Reservation:",
     labelTransactionID: "Transaction ID:",
     receipt: "Receipt",
-    successful: "Successful! "
+    successful: "Successful! ",
+    processTitle: "Oops! \nWe’re still processing your receipt",
+    processMessage1: "We apologize for the inconvenience caused as we are still processing your settlement and unable to generate it as of yet.",
+    processMessage2: "Give us a few minutes and do feel free to check at the ",
+    processMessage3: "Transactions Tab",
+    processMessage4: "Thank you!"
   },
   support: {
     supportHotline: "Support Hotline",

Strides-APP/app/i18n/locales/zh-TW.js

@@ -463,7 +463,12 @@ export default {
     labelTimeReservation: "預訂時間：",
     labelTransactionID: "交易編號：",
     receipt: "發票",
-    successful: "交易成功！"
+    successful: "交易成功！",
+    processTitle: "請稍後…\n我們仍在處理您的收據",
+    processMessage1: "對於給您帶來的不便，我們深表歉意，因爲我們仍在處理您的結算，目前還無法生成收據。",
+    processMessage2: "您可以稍後在此頁面中查看：",
+    processMessage3: "歷史交易",
+    processMessage4: "感謝您的理解與支持！"
   },
   support: {
     supportHotline: "客戶服務",

Strides-APP/app/i18n/locales/zh.js

@@ -463,7 +463,12 @@ export default {
     labelTimeReservation: "预订时间：",
     labelTransactionID: "交易编号：",
     receipt: "发票",
-    successful: "交易成功！"
+    successful: "交易成功！",
+    processTitle: "请稍后…\n我们仍在处理您的收据",
+    processMessage1: "对于给您带来的不便，我们深表歉意，因为我们仍在处理您的结算，目前还无法生成收据。",
+    processMessage2: "您可以稍后在此页面中查看：",
+    processMessage3: "历史交易",
+    processMessage4: "感谢您的理解与支持！"
   },
   support: {
     supportHotline: "客户服务",

Strides-APP/app/pages/chargeV2/SummaryV2.js

@@ -28,8 +28,10 @@ export default class Summary extends Component {
         reservationFee: {},
         payment: {}
       },
-      chargingPk: ""
+      chargingPk: "",
+      isPendding: true
     };
+    this.action = "";
     this.canBack = false;
   }
 
@@ -51,6 +53,9 @@ export default class Summary extends Component {
         }, 3000);
       }
     }
+    if (params.action) {
+      this.action = params.action;
+    }
     this.props.navigation.addListener('focus', e => {
       this.canBack = false;
     });
@@ -70,13 +75,15 @@ export default class Summary extends Component {
       if (res.data) {
         this.setState({
           refreshing: false,
-          summaryInfo: res.data
+          summaryInfo: res.data,
+          isPendding: (res.data.hasSettled != true)
         });
       }
     }).catch((err) => {
       Dialog.dismissLoading();
       toastShort(err);
       this.setState({
+        isPendding: true,
         refreshing: false
       });
     });
@@ -93,10 +100,21 @@ export default class Summary extends Component {
 
   toRating() {
     this.canBack = true;
-    //goBack();
-    //routeUtil.resetToHome(this.props);
-    startPage(PageList.home);
-    //startPage(PageList.rating, this.state.stationInfo);
+    if (this.action == "view") {
+      goBack();
+    } else {
+      //routeUtil.resetToHome(this.props);
+      startPage(PageList.home);
+      //startPage(PageList.rating, this.state.stationInfo);
+    }
+  }
+
+  toTransaction() {
+    if (this.action == "view") {
+      goBack();
+    } else {
+      startPage(PageList.wallet)
+    }
   }
 
   getSummaryText(data) {
@@ -116,215 +134,237 @@ export default class Summary extends Component {
   }
 
   render() {
-    return (
-      <ScrollView
-        style={styles.container}
-        refreshControl={
-          <RefreshControl
-            {...MyRefreshProps()}
-            refreshing={this.state.refreshing}
-            onRefresh={() => this.onRefresh()}
-          />
-        }>
-        { utils.isNotEmpty(this.state.summaryInfo.top) &&
-          <View style={styles.headerView}>
-            { this.state.isActully && <>
-              <Octicons
-                name="check-circle-fill"
-                color={colorAccent}
-                size={56}/>
-              <TextView style={styles.topTitle}>{$t('receipt.successful')}</TextView>
-              <TextView style={styles.topDesc}>{$t('receipt.chargingSessionComplete')}</TextView>
-            </>}
-            { utils.isNotEmpty(this.state.summaryInfo.top.company) &&
+    if (this.state.isPendding) {
+      return (
+        <View style={styles.container}>
+          <View style={styles.processContent}>
+            <TextView style={styles.processTitle}>{$t("receipt.processTitle")}</TextView>
+            <TextView style={styles.processText}>{$t("receipt.processMessage1")}</TextView>
+            <TextView style={styles.processText}>
+              {$t("receipt.processMessage2")}
+              <Text style={[ui.bold, ui.underline]} onPress={() => this.toTransaction()}>{$t("receipt.processMessage3")}</Text>.
+            </TextView>
+            <TextView style={styles.processText}>{$t("receipt.processMessage4")}</TextView>
+          </View>
+          <View style={styles.bottomButton}>
+            <Button
+              text={$t('home.done')}
+              elevation={1.5}
+              onClick={() => this.toRating()}/>
+          </View>
+        </View>
+      )
+    } else {
+      return (
+        <ScrollView
+          style={styles.container}
+          refreshControl={
+            <RefreshControl
+              {...MyRefreshProps()}
+              refreshing={this.state.refreshing}
+              onRefresh={() => this.onRefresh()}
+            />
+          }>
+          { utils.isNotEmpty(this.state.summaryInfo.top) &&
+            <View style={styles.headerView}>
+              { this.state.isActully && <>
+                <Octicons
+                  name="check-circle-fill"
+                  color={colorAccent}
+                  size={56}/>
+                <TextView style={styles.topTitle}>{$t('receipt.successful')}</TextView>
+                <TextView style={styles.topDesc}>{$t('receipt.chargingSessionComplete')}</TextView>
+              </>}
+              { utils.isNotEmpty(this.state.summaryInfo.top.company) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>{$t('sign.labelCompany')}:</TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.top.company}</TextView>
+                </View>
+              }
+              { utils.isNotEmpty(this.state.summaryInfo.top.registrationNo) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>{$t('receipt.labelRegistrationNo')}</TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.top.registrationNo}</TextView>
+                </View>
+              }
               <View style={styles.formRow}>
-                <TextView style={styles.label}>{$t('sign.labelCompany')}:</TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.top.company}</TextView>
+                <TextView style={styles.label}>{$t('receipt.labelTransactionID')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.top.transactionId}</TextView>
               </View>
-            }
-            { utils.isNotEmpty(this.state.summaryInfo.top.registrationNo) &&
               <View style={styles.formRow}>
-                <TextView style={styles.label}>{$t('receipt.labelRegistrationNo')}</TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.top.registrationNo}</TextView>
+                <TextView style={styles.label}>{$t('receipt.labelReferenceID')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.top.referenceId}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelDateTime')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.top.dateTime}</TextView>
               </View>
-            }
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelTransactionID')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.top.transactionId}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelReferenceID')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.top.referenceId}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelDateTime')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.top.dateTime}</TextView>
-            </View>
-          </View>
-        }
-        {/* <View style={styles.sections}>
-          <View style={styles.formRow}>
-            <Text style={styles.label}>{$t('wallet.labelTransactionId')}</Text>
-            <Text style={styles.text}>{this.state.summaryInfo.transactionPk}</Text>
-          </View>
-          <View style={styles.formRow}>
-            <Text style={styles.label}>{$t('wallet.labelReferenceId')}</Text>
-            <Text style={styles.text}>{this.state.summaryInfo.chargingPk}</Text>
-          </View>
-          <View style={styles.formRow}>
-            <Text style={styles.label}>{$t('wallet.labelDateTime')}</Text>
-            <Text style={styles.text}>{this.state.summaryInfo.dateTime}</Text>
-          </View>
-        </View> */}
-        { utils.isNotEmpty(this.state.summaryInfo.station) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('wallet.labelYourStation')}</TextView>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelStationId')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.station.stationId}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelSiteName')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.station.siteName ?? "-"}</TextView>
-            </View>
-          </View>
-        }
-        { utils.isNotEmpty(this.state.summaryInfo.connector) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('wallet.labelYourConnector')}</TextView>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('charging.labelType')}:</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.connector.type}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('charging.labelPower')}:</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.connector.power}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('charging.labelRates')}:</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.connector.rates}</TextView>
-            </View>
-          </View>
-        }
-        { utils.isNotEmpty(this.state.summaryInfo.chargingFee) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('receipt.breakdownChargingFees')}</TextView>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelChargeTime')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.chargeTime ?? "-"}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelChargeDelivered')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.chargeDelivered ?? 0}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelChargTransSubtotal2'))}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.transactionSubtotal}</TextView>
-            </View>
-          </View>
-        }
-        { utils.isNotEmpty(this.state.summaryInfo.idleFee) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('receipt.breakdownIdlesFees')}</TextView>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelIdleStartTime')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.idleFee.startTime}</TextView>
-            </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelIdleDuration')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.idleFee.duration}</TextView>
             </View>
+          }
+          {/* <View style={styles.sections}>
             <View style={styles.formRow}>
-              <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelIdleFeeSubtotal2'))}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.idleFee.subtotal}</TextView>
+              <Text style={styles.label}>{$t('wallet.labelTransactionId')}</Text>
+              <Text style={styles.text}>{this.state.summaryInfo.transactionPk}</Text>
             </View>
-          </View>
-        }
-        { utils.isNotEmpty(this.state.summaryInfo.reservationFee) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('receipt.breakdownReservationFees')}</TextView>
             <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelTimeReservation')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationTime}</TextView>
+              <Text style={styles.label}>{$t('wallet.labelReferenceId')}</Text>
+              <Text style={styles.text}>{this.state.summaryInfo.chargingPk}</Text>
             </View>
             <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('receipt.labelDurationReservation')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationDuration}</TextView>
+              <Text style={styles.label}>{$t('wallet.labelDateTime')}</Text>
+              <Text style={styles.text}>{this.state.summaryInfo.dateTime}</Text>
             </View>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelReservationFeeSubtotal2'))}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationFeeSubtotal}</TextView>
+          </View> */}
+          { utils.isNotEmpty(this.state.summaryInfo.station) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('wallet.labelYourStation')}</TextView>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('wallet.labelStationId')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.station.stationId}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelSiteName')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.station.siteName ?? "-"}</TextView>
+              </View>
             </View>
-          </View>
-        }
-        { utils.isNotEmpty(this.state.summaryInfo.payment) &&
-          <View style={styles.sections}>
-            <TextView style={styles.formTitle}>{$t('receipt.breakdownPayment')}</TextView>
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelPaymentMadeBy')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.payment.paymentMadeBy ?? "-"}</TextView>
+          }
+          { utils.isNotEmpty(this.state.summaryInfo.connector) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('wallet.labelYourConnector')}</TextView>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('charging.labelType')}:</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.connector.type}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('charging.labelPower')}:</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.connector.power}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('charging.labelRates')}:</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.connector.rates}</TextView>
+              </View>
             </View>
-            { utils.isNotEmpty(this.state.summaryInfo.payment.transactionSubtotal) &&
+          }
+          { utils.isNotEmpty(this.state.summaryInfo.chargingFee) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('receipt.breakdownChargingFees')}</TextView>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('wallet.labelChargeTime')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.chargeTime ?? "-"}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('wallet.labelChargeDelivered')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.chargeDelivered ?? 0}</TextView>
+              </View>
               <View style={styles.formRow}>
                 <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelChargTransSubtotal2'))}</TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.payment.transactionSubtotal}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.chargingFee.transactionSubtotal}</TextView>
+              </View>
+            </View>
+          }
+          { utils.isNotEmpty(this.state.summaryInfo.idleFee) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('receipt.breakdownIdlesFees')}</TextView>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelIdleStartTime')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.idleFee.startTime}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelIdleDuration')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.idleFee.duration}</TextView>
               </View>
-            }
-            { utils.isNotEmpty(this.state.summaryInfo.payment.idleFeeSubtotal) &&
               <View style={styles.formRow}>
                 <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelIdleFeeSubtotal2'))}</TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.payment.idleFeeSubtotal}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.idleFee.subtotal}</TextView>
+              </View>
+            </View>
+          }
+          { utils.isNotEmpty(this.state.summaryInfo.reservationFee) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('receipt.breakdownReservationFees')}</TextView>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelTimeReservation')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationTime}</TextView>
+              </View>
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('receipt.labelDurationReservation')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationDuration}</TextView>
               </View>
-            }
-            { utils.isNotEmpty(this.state.summaryInfo.payment.reservationFeeSubtotal) &&
               <View style={styles.formRow}>
                 <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelReservationFeeSubtotal2'))}</TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.payment.reservationFeeSubtotal}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.reservationFee.reservationFeeSubtotal}</TextView>
               </View>
-            }
-            { utils.isNotEmpty(this.state.summaryInfo.payment.finalPayment) &&
+            </View>
+          }
+          { utils.isNotEmpty(this.state.summaryInfo.payment) &&
+            <View style={styles.sections}>
+              <TextView style={styles.formTitle}>{$t('receipt.breakdownPayment')}</TextView>
               <View style={styles.formRow}>
-                <TextView style={styles.label}>
-                  { utils.isNotEmpty(this.state.summaryInfo.payment.discountCredit)
-                  ? $t('receipt.labelAfterDiscount')
-                  : $t('receipt.labelFinalPaymentAmount')
-                  }
-                </TextView>
-                <TextView style={styles.text}>{this.state.summaryInfo.payment.finalPayment ?? "-"}</TextView>
+                <TextView style={styles.label}>{$t('wallet.labelPaymentMadeBy')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.payment.paymentMadeBy ?? "-"}</TextView>
+              </View>
+              { utils.isNotEmpty(this.state.summaryInfo.payment.transactionSubtotal) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelChargTransSubtotal2'))}</TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.payment.transactionSubtotal}</TextView>
+                </View>
+              }
+              { utils.isNotEmpty(this.state.summaryInfo.payment.idleFeeSubtotal) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelIdleFeeSubtotal2'))}</TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.payment.idleFeeSubtotal}</TextView>
+                </View>
+              }
+              { utils.isNotEmpty(this.state.summaryInfo.payment.reservationFeeSubtotal) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>{this.getTaxTitle($t('receipt.labelReservationFeeSubtotal2'))}</TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.payment.reservationFeeSubtotal}</TextView>
+                </View>
+              }
+              { utils.isNotEmpty(this.state.summaryInfo.payment.finalPayment) &&
+                <View style={styles.formRow}>
+                  <TextView style={styles.label}>
+                    { utils.isNotEmpty(this.state.summaryInfo.payment.discountCredit)
+                    ? $t('receipt.labelAfterDiscount')
+                    : $t('receipt.labelFinalPaymentAmount')
+                    }
+                  </TextView>
+                  <TextView style={styles.text}>{this.state.summaryInfo.payment.finalPayment ?? "-"}</TextView>
+                </View>
+              }
+              {/* <View style={styles.formRow}>
+                <Text style={styles.label}>{$t('wallet.labelChargeRates')}</Text>
+                <Text style={styles.text}>{currency}{this.state.summaryInfo.chargeRates ?? '0.0'}</Text>
+              </View> */}
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('wallet.labelExchangeRate')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.payment.exchangeRate ?? "-"}</TextView>
+              </View>
+              {/* <View style={styles.formRow}>
+                <Text style={styles.label}>{$t('wallet.labelPreviousBalance')}</Text>
+                <Text style={styles.text}>{this.getSummaryText(this.state.summaryInfo.previousBalance)}</Text>
+              </View> */}
+              <View style={styles.formRow}>
+                <TextView style={styles.label}>{$t('wallet.labelResultingBalance')}</TextView>
+                <TextView style={styles.text}>{this.state.summaryInfo.payment.resultingBalance ?? "-"}</TextView>
               </View>
-            }
-            {/* <View style={styles.formRow}>
-              <Text style={styles.label}>{$t('wallet.labelChargeRates')}</Text>
-              <Text style={styles.text}>{currency}{this.state.summaryInfo.chargeRates ?? '0.0'}</Text>
-            </View> */}
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelExchangeRate')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.payment.exchangeRate ?? "-"}</TextView>
             </View>
-            {/* <View style={styles.formRow}>
-              <Text style={styles.label}>{$t('wallet.labelPreviousBalance')}</Text>
-              <Text style={styles.text}>{this.getSummaryText(this.state.summaryInfo.previousBalance)}</Text>
-            </View> */}
-            <View style={styles.formRow}>
-              <TextView style={styles.label}>{$t('wallet.labelResultingBalance')}</TextView>
-              <TextView style={styles.text}>{this.state.summaryInfo.payment.resultingBalance ?? "-"}</TextView>
+          }
+          { (this.state.isActully && utils.isNotEmpty(this.state.summaryInfo.top)) &&
+            <View style={styles.bottomButton}>
+              <TextView
+                style={styles.feedback}
+                onPress={() => startPage(PageList.feedback)}>{$t('wallet.linkSubmitFeedback')}</TextView>
+              {/* <Text style={styles.tipText}>{$t('wallet.tipsReceipt')}</Text> */}
+              <Button
+                text={$t('home.done')}
+                elevation={1.5}
+                onClick={() => this.toRating()}/>
             </View>
-          </View>
-        }
-        { (this.state.isActully && utils.isNotEmpty(this.state.summaryInfo.top)) &&
-          <View style={styles.bottomButton}>
-            <TextView
-              style={styles.feedback}
-              onPress={() => startPage(PageList.feedback)}>{$t('wallet.linkSubmitFeedback')}</TextView>
-            {/* <Text style={styles.tipText}>{$t('wallet.tipsReceipt')}</Text> */}
-            <Button
-              text={$t('home.done')}
-              elevation={1.5}
-              onClick={() => this.toRating()}/>
-          </View>
-        }
-      </ScrollView>
-    );
+          }
+        </ScrollView>
+      );
+    }
   }
 }
 
@@ -427,5 +467,21 @@ const styles = StyleSheet.create({
     fontSize: 12,
     textAlign: 'center',
     marginBottom: 8
+  },
+  processContent: {
+    flex: 1,
+    justifyContent: 'center'
+  },
+  processTitle: {
+    color: textTitle,
+    fontSize: 24,
+    fontWeight: 'bold',
+    textAlign: 'center'
+  },
+  processText: {
+    color: textPrimary,
+    fontSize: 14,
+    textAlign: 'center',
+    paddingTop: 16
   }
 });

Strides-APP/app/pages/wallet/History.js

@@ -110,7 +110,7 @@ export default class History extends Component {
                 </Pressable>
               );
             })
-          : <Text style={styles.noResult} allowFontScaling={false}>{$t('wallet.noHistoryData')}</Text>
+          : <Text style={styles.noResult}>{$t('wallet.noHistoryData')}</Text>
         }
         </View>
       </View>

Strides-APP/app/utils/themes.js

@@ -21,6 +21,7 @@ global.textCancel = "#999999";
 global.textDark = "#000000";
 global.textLight = "#FFFFFF";
 global.textPlacehoder = "#999999";
+global.textTitle = "#00638C";
 global.rippleColor = "rgba(0,0,0,.2)"
 
 global.darkMode = false;