|
|
|
@ -4,6 +4,12 @@ import BackIcon from "../../components/BackIcon";
|
|
|
|
|
import { useNavigation } from "@react-navigation/native"; |
|
|
|
|
import { useState, useEffect } from "react"; |
|
|
|
|
|
|
|
|
|
// 假设的图标组件 - 请替换为您的实际图标
|
|
|
|
|
const AddressIcon = ({ size, color }) => <Text style={{fontSize: size, color: color}}>📍</Text>; // 示例图标
|
|
|
|
|
const AmountIcon = ({ size, color }) => <Text style={{fontSize: size, color: color}}>💰</Text>; // 示例图标
|
|
|
|
|
const ShippingIcon = ({ size, color }) => <Text style={{fontSize: size, color: color}}>🚚</Text>; // 示例图标
|
|
|
|
|
const WhatsAppIcon = ({ size, color }) => <Text style={{fontSize: size, color: color}}>💬</Text>; // 示例图标
|
|
|
|
|
|
|
|
|
|
export const PreviewOrder = () => { |
|
|
|
|
const {orderData, setOrderData} = useCreateOrderStore(); |
|
|
|
|
const navigation = useNavigation(); |
|
|
|
@ -65,19 +71,23 @@ export const PreviewOrder = () => {
|
|
|
|
|
<View style={styles.card}> |
|
|
|
|
<Text style={styles.cardTitle}>支付信息</Text> |
|
|
|
|
<View style={styles.detailRow}> |
|
|
|
|
<AddressIcon size={18} color="#555555" /> |
|
|
|
|
<Text style={styles.detailLabel}>收货地址:</Text> |
|
|
|
|
<Text style={styles.detailValue} numberOfLines={2} ellipsizeMode="tail">{orderData?.address || "请选择地址"}</Text> |
|
|
|
|
</View> |
|
|
|
|
<View style={styles.detailRow}> |
|
|
|
|
<AmountIcon size={18} color="#555555" /> |
|
|
|
|
<Text style={styles.detailLabel}>订单金额:</Text> |
|
|
|
|
<Text style={styles.detailValue}>{orderData?.amount ? `${orderData.currency || ''} ${orderData.amount}` : "N/A"}</Text> |
|
|
|
|
</View> |
|
|
|
|
<View style={styles.detailRow}> |
|
|
|
|
<ShippingIcon size={18} color="#555555" /> |
|
|
|
|
<Text style={styles.detailLabel}>运费:</Text> |
|
|
|
|
<Text style={styles.detailValue}>{orderData?.shipping_fee ? `${orderData.currency || ''} ${orderData.shipping_fee}` : "N/A"}</Text> |
|
|
|
|
</View> |
|
|
|
|
{orderData?.whatsapp_phone && ( |
|
|
|
|
<View style={styles.detailRow}> |
|
|
|
|
<WhatsAppIcon size={18} color="#555555" /> |
|
|
|
|
<Text style={styles.detailLabel}>WhatsApp:</Text> |
|
|
|
|
<Text style={styles.detailValue}>{orderData.whatsapp_phone}</Text> |
|
|
|
|
</View> |
|
|
|
@ -232,9 +242,9 @@ const styles = StyleSheet.create({
|
|
|
|
|
}, |
|
|
|
|
detailRow: { |
|
|
|
|
flexDirection: "row", |
|
|
|
|
justifyContent: "space-between", |
|
|
|
|
alignItems: "flex-start", // Align items to the start for multi-line values
|
|
|
|
|
paddingVertical: 8, // Vertical padding for each row
|
|
|
|
|
// justifyContent: "space-between", // We'll handle spacing differently with icons
|
|
|
|
|
alignItems: "center", // Align items vertically centered
|
|
|
|
|
paddingVertical: 10, // Adjusted vertical padding
|
|
|
|
|
borderBottomWidth: 1, |
|
|
|
|
borderBottomColor: "#f0f0f0", // Lighter separator line
|
|
|
|
|
}, |
|
|
|
@ -243,7 +253,9 @@ const styles = StyleSheet.create({
|
|
|
|
|
color: "#555555", // Slightly lighter label color
|
|
|
|
|
fontFamily: "PingFang SC", |
|
|
|
|
fontWeight: '500', |
|
|
|
|
marginLeft: 8, // Add margin to the left of the label, after the icon
|
|
|
|
|
marginRight: 10, // Space between label and value
|
|
|
|
|
flex: 1, // Allow label to take available space before value
|
|
|
|
|
}, |
|
|
|
|
detailValue: { |
|
|
|
|
fontSize: 15, |
|
|
|
|