update app/pages/chargeV2/Payment.js

Strides-SPAPP/app/pages/chargeV2/Payment.js

@@ -0,0 +1,62 @@
+import React, { Component, useEffect, useState } from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import BadgeSelectItem from '../../components/BadgeSelectItem';
+import TextView from '../../components/TextView';
+import { getPaymenOptions, PaymentIcon, PAYTYPE } from '../payment/PaymentConfig';
+import { ChargeStyle } from './Charging';
+
+export const PaymentList = ({isSelect=true, payType, onMethodChange}) => {
+  const [options, setOptions] = useState([])
+  useEffect(() => {
+    getPaymenOptions(options => {
+      setOptions(options)
+    })
+  }, [])
+  return (
+    options.map((item, index) => {
+      if (isSelect || payType==item.value) {
+        return (
+          <BadgeSelectItem
+            key={index}
+            style={ChargeStyle.stationInfoView}
+            checked={payType==item.value}
+            onPress={() => {
+              if (onMethodChange) {
+                onMethodChange(item.value);
+              }
+            }}>
+            <PaymentIcon
+              method={item.iconFont}
+              checked={payType==item.value}/>
+            <View style={styles.paymentView}>
+              <TextView style={styles.valueText}>{item.value == PAYTYPE.CREDIT_WALLET ? ("" + userInfo?.creditStr) : item.desc}</TextView>
+              <TextView style={styles.paymentText}>{item.title}</TextView>
+            </View>
+          </BadgeSelectItem>
+        )
+      } else {
+        return null
+      }
+    })
+  )
+}
+
+const styles = StyleSheet.create({
+  paymentView: {
+    flex: 1,
+    alignItems: 'center',
+    flexDirection: 'row-reverse',
+    justifyContent: 'flex-end'
+  },
+  valueText: {
+    color: textPrimary,
+    fontSize: 16,
+    fontWeight: 'bold'
+  },
+  paymentText: {
+    color: textSecondary,
+    fontSize: 12,
+    paddingLeft: 8,
+    paddingRight: 16
+  }
+})