// component/chargingPage/chargingFinishPageComponent.tsx import { View, Text, ScrollView, Image, StyleSheet, Pressable } from 'react-native'; import React from 'react'; import { SafeAreaView } from 'react-native-safe-area-context'; import Svg, { Path, Rect } from 'react-native-svg'; import NormalButton from '../global/normal_button'; import SlideInImage from '../global/slideInImage'; import { router, useLocalSearchParams } from 'expo-router'; import { useTranslation } from '../../util/hooks/useTranslation'; const BatteryLogoSvg = () => ( ); const DownArrowSvg = () => ( ); const UpArrowSvg = () => ( ); const TimeClockLogoSvg = () => ( ); const TickLogoSvg = () => ( ); const BatteryIconSvg = () => ( ); const LightingLogoSvg = () => ( ); const TemperatureIconSvg = () => ( ); const ChargingFinishPageComponent = ({ data }: { data: any }) => { const { t } = useTranslation(); const chargingData = Array.isArray(data) ? data[0] : data; const [isMoreInfoButtonPressed, setIsMoreInfoButtonPressed] = React.useState(true); function calculateDurationInMinutes(startTimeString: string, endTimeString: string): number { const startTime = new Date(startTimeString); const endTime = new Date(endTimeString); // Calculate the difference in milliseconds const durationMs = endTime.getTime() - startTime.getTime(); // Convert milliseconds to minutes const durationMinutes = Math.round(durationMs / (1000 * 60)); return durationMinutes; } const durationInMinutes = calculateDurationInMinutes(chargingData.actual_start_time, chargingData.actual_end_time); return ( {t('charging_finish.charging_completed')} {t('charging_finish.charged')} {`${chargingData.Soc}%`} {/* actualEnd_time - actual start time */} {t('charging_finish.charging_duration')} {/* 39 */} {durationInMinutes} {t('charging_finish.minutes')} {t('charging_finish.fee_summary')} {t('charging_finish.charging_fee')} HK$ {chargingData.total_fee} {chargingData.total_power === null ? t('charging_finish.full_charge') : `${t('charging_finish.settled_per_kwh')}${Math.floor(chargingData.total_power)} kWh`} {chargingData.withdraw_fee === 0 ? ( '' ) : ( {t('charging_finish.refund_deposit')} HK$ ${chargingData.withdraw} )} {t('charging_finish.total')} HK$ ${chargingData.total_fee - chargingData.withdraw_fee} {t('charging_finish.payment_info')} {t('charging_finish.order_number')} CXZ-16336958 {t('charging_finish.payment_method')} {t('charging_finish.prepaid_wallet')} {t('charging_finish.return_home')}} onPress={() => { router.push('mainPage'); }} /> ); }; export default ChargingFinishPageComponent; const styles = StyleSheet.create({ grayColor: { color: '#888888' }, greenColor: { color: '#02677D' } });