react_native/donutshop/app/components/OrderReceiptItem.tsx

53 lines
No EOL
1.6 KiB
TypeScript

import { Image, ImageProps, StyleSheet, Text, View } from 'react-native'
import React from 'react'
interface OrderReceiptItemProps{
type: string;
name: string;
donutname: string;
image_item: ImageProps;
prices: any;
ItemPrice: string;
}
const OrderReceiptItem: React.FC<OrderReceiptItemProps> = ({
type,
name,
donutname,
image_item,
prices,
ItemPrice,
}) => {
return (
<View style={{paddingHorizontal: 10, marginBottom: 10}}>
<View style={{flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center'}}>
<View style={{flexDirection: 'row', gap: 10, alignItems: 'center'}}>
<Image source={image_item} style={{width: 50, height: 50}} />
{prices.map((item: any, index: any) => (
<View key={index.toString()}>
<Text style={{width: 200}}>{name || donutname} <Text style={{}}>{item.size}</Text></Text>
</View>
))}
</View>
<View>
<Text>${ItemPrice}</Text>
</View>
</View>
{prices.map((data: any, index: any) => (
<View key={index.toString()} style={{flex: 1, alignItems: 'center', flexDirection: 'row', justifyContent: 'space-between', marginTop: 10}}>
<View style={{flex:1, flexDirection: 'row', gap: 10}}>
<Text>${data.price}</Text>
<Text>X {data.quantity}</Text>
</View>
<Text>${(data.quantity * data.price).toFixed(2).toString()}</Text>
</View>
))}
</View>
)
}
export default OrderReceiptItem
const styles = StyleSheet.create({})