idle fee details devlopment

https://dev.wormwood.com.sg/zentao/task-view-797.html

Strides-APP/app/pages/chargingV2/StepStart.js

@@ -15,6 +15,7 @@ import PagerUtil from '../chargeV2/PagerUtil';
 import utils from '../../utils/utils';
 
 export default StepStart = ({
+  idleFeeConfig,
   connectorInfo={},
   currentPayment,
   onPaymentMethodChanged,
@@ -79,6 +80,28 @@ export default StepStart = ({
         </View>
       </View>
       <EndView/>
+      { (idleFeeConfig && idleFeeConfig.idleFee) &&
+        <View>
+          <TextView style={styles.label}>Idle Fee Detail</TextView>
+          { utils.isNotEmpty(idleFeeConfig.repeatDay) &&
+            <TextView style={styles.idleFeeText}>
+              Effective Days: {utils.join(idleFeeConfig.repeatDay, ", ")}
+            </TextView>
+          }
+          { idleFeeConfig.allDay
+          ? <TextView style={styles.idleFeeText}>Effective Time：All day</TextView>
+          : (utils.isNotEmpty(idleFeeConfig.startTime) && utils.isNotEmpty(idleFeeConfig.endTime)) &&
+            <TextView style={styles.idleFeeText}>Effective Time：{idleFeeConfig.startTime + " - " + idleFeeConfig.endTime}</TextView>
+          }
+          { utils.isNotEmpty(idleFeeConfig.idleGracePeriod) &&
+            <TextView style={styles.idleFeeText}>Grace Period: {idleFeeConfig.idleGracePeriod} min</TextView>
+          }
+          <TextView style={styles.idleFeeText}>Charging Rate: {idleFeeConfig.idleFee}/{idleFeeConfig.idleInterval} min </TextView>
+          { utils.isNotEmpty(idleFeeConfig.idleFeeCap) &&
+            <TextView style={styles.idleFeeText}>Idle Fee Cap: {idleFeeConfig.idleFeeCap}</TextView>
+          }
+        </View>
+      }
       <EndView half/>
       <View style={ui.flexc}>
         <TextView style={[styles.label, ui.flex1]}>{$t('charging.paymentMethod')}</TextView>
@@ -246,5 +269,11 @@ const styles = StyleSheet.create({
     fontSize: 12,
     paddingLeft: 8,
     paddingRight: 16
+  },
+  idleFeeText: {
+    color: textSecondary,
+    fontSize: 12,
+    paddingLeft: 4,
+    paddingBottom: 4
   }
 })