react_native/donutshop/app/components/OrderReceiptCard.tsx

60 lines
No EOL
1.7 KiB
TypeScript

import { Pressable, StyleSheet, Text, View } from 'react-native';
import React from 'react';
import OrderReceiptItem from '../components/OrderReceiptItem';
interface OrderHistoryCardProps {
navigationHandler: any;
CartList: any;
CartListPrice: string;
OrderDate: string;
}
const OrderReceiptCard: React.FC<OrderHistoryCardProps> = ({
navigationHandler,
CartList,
CartListPrice,
OrderDate,
}) => {
return (
<View style={{gap: 10, borderColor: 'gray', borderWidth:1, marginBottom: 10}}>
<View style={{flexDirection: 'row', justifyContent: 'space-between', gap: 20, alignItems: 'center', padding: 10}}>
<View>
<Text>Order Time</Text>
<Text>{OrderDate}</Text>
</View>
<View style={{alignItems: 'flex-end'}}>
<Text>Total Amount</Text>
<Text>$ {CartListPrice}</Text>
</View>
</View>
<View style={{gap: 10}}>
<View style={{borderColor: 'black', borderWidth: 0.5, borderStyle: 'dashed'}}/>
{CartList.map((data: any, index: any) => (
<Pressable key={index.toString() + data.id} onPress={() => {
navigationHandler({
index: data.index,
id: data.id,
type: data.type,
});
}}>
<OrderReceiptItem
type={data.type}
name={data.name}
donutname={data.donutname}
image_item={data.image_item}
prices={data.prices}
ItemPrice={data.ItemPrice}
/>
</Pressable>
))}
</View>
</View>
)
}
export default OrderReceiptCard
const styles = StyleSheet.create({})