diff --git a/screens/AccountHome.tsx b/screens/AccountHome.tsx index 6ba791e..43cf32f 100644 --- a/screens/AccountHome.tsx +++ b/screens/AccountHome.tsx @@ -46,9 +46,17 @@ export default function AccountHome() { + + + + + + + + @@ -131,7 +139,7 @@ const CustommerInfoChange = () => { const [checked, setChecked] = React.useState('male'); return ( - Cập nhật thông tin cá nhân + Cập nhật thông tin cá nhân Họ tên @@ -285,6 +293,187 @@ const ProductFavorite = () => { ) } +const ChangePassword = () => { + return ( + + Thay đổi mật khẩu + + + Mật khẩu hiện tại + + + + + + Mật khẩu mới + + + + + + Nhập lại mật khẩu mới + + + + + + + Thay đổi + + + + + ) +} + +const ListOrder = () => { + return ( + + Danh Sách đơn hàng + + + Số đơn hàng + Giá trị + Thời gian + Thông tin + + + + #123456 + + Xem chi tiết + + + 100.000.000 đ + 13-03-2021 + Đã hoàn thành + + + + #123457 + + Xem chi tiết + + + 100.000.000 đ + 13-03-2021 + Hủy bỏ + + + + ) +} + +const OrderDetail = () => { + return ( + + Đơn hàng số #123456 + Thời gian đặt mua: 13-3-2021, 5:00 pm + + Thông tin người mua + + Họ và tên: + Hurasoft Test + + + Email: + test@mail.com + + + Số điện thoại: + 0912345678 + + + Địa chỉ: + 30 Nguyên Hồng - Láng Hạ - Đống Đa - HN + + + + + + + STT + + + 1 + + + + + Ảnh + + + + + + + + + + Tên Sản phẩm + + + + Bàn Game K-Deck ( Khung Kim Loại , Mặt Gỗ Tự Nhiên Phủ PU Bóng ) + + + + + + Giá bán + + + 30.000.000 đ + + + + + Số lượng + + + 1 + + + + + Tổng + + + 30.000.000 đ + + + + + + + Giá trị + + + 30.000.000 đ + + + + + Phí vận chuyển + + + 30.000 đ + + + + + Tổng giá trị đơn hàng + + + 30.030.000 đ + + + + + + ) +} + const winWidth = Dimensions.get('window').width; //full width const winHeight = Dimensions.get('window').height; //full height const winWidthP10 = winWidth - 20; @@ -421,7 +610,7 @@ const styles = StyleSheet.create({ borderWidth: 1, borderRadius: 5, }, - boxCustommerInfoChangeTitle: { + titleBoxInAccount: { fontSize: 16, fontWeight: 'bold', marginBottom: 10, @@ -494,4 +683,179 @@ const styles = StyleSheet.create({ marginBottom: 15, }, listProductSave: {}, + ListOrder: {}, + ListOrderList: { + width: '100%', + borderColor: '#e1e1e1', + borderWidth: 1, + borderRadius: 5, + padding: 5 + }, + ListOrderListHeader: { + flexDirection: 'row', + alignItems: 'center', + borderBottomColor: '#e1e1e1', + borderBottomWidth: 1, + height: 40, + }, + ListOrderListHeaderSt: { + fontWeight: 'bold', + width: winWidthP10 - 260, + fontSize: 12, + }, + ListOrderListHeaderNd: { + fontWeight: 'bold', + width: 90, + fontSize: 12, + }, + ListOrderListHeaderRd: { + fontWeight: 'bold', + width: 75, + fontSize: 12, + }, + ListOrderListHeaderInfo: { + fontWeight: 'bold', + width: 90, + fontSize: 12, + }, + ListOrderItem: { + flexDirection: 'row', + alignItems: 'center', + borderBottomColor: '#e1e1e1', + borderBottomWidth: 1, + paddingVertical: 10, + }, + ListOrderItemLast: { + borderBottomWidth: 0, + }, + ListOrderItemSt: { + width: winWidthP10 - 260, + flexDirection: 'row', + flexWrap: 'wrap', + alignItems: 'center', + }, + ListOrderItemStText: { + fontSize: 12, + marginRight: 6, + }, + ListOrderItemStButton: {}, + ListOrderItemStButtonText: { + fontSize: 12, + color: '#f78d1c' + }, + ListOrderItemNd: { + width: 90, + fontSize: 12, + }, + ListOrderItemRd: { + width: 75, + fontSize: 12, + }, + ListOrderItemInfo: { + width: 90, + fontSize: 12, + }, + boxOrderDetail: {}, + boxOrderDetailNum: { + width: '100%', + marginBottom: 15, + fontSize: 21, + fontWeight: 'bold', + textAlign: 'center' + }, + boxOrderDetailTime: { + marginBottom: 15, + }, + boxOrderDetailInfo: { + borderWidth: 1, + borderRadius: 5, + borderColor: '#e1e1e1', + marginBottom: 20, + padding: 8, + }, + boxOrderDetailInfoTitle: { + fontWeight: 'bold', + color: '#f60', + marginBottom: 10, + }, + boxOrderDetailInfoItem: { + flexDirection: 'row', + alignItems: 'center', + marginBottom: 10, + }, + boxOrderDetailInfoItemTextSt: { + width: 100, + }, + boxOrderDetailInfoItemTextNd: { + width: winWidthP10 - 120, + }, + boxOrderDetailList: { + borderWidth: 1, + borderRadius: 5, + borderColor: '#e1e1e1', + width: '100%', + flexDirection: 'column', + }, + bold: { + fontWeight: 'bold', + }, + boxOrderDetailListItem: { + width: '100%', + flexDirection: 'column', + }, + boxOrderDetailListItemLine: { + flexDirection: 'row', + borderBottomWidth: 1, + borderBottomColor: '#e1e1e1', + width: '100%', + }, + boxOrderDetailListItemLineTotal: { + width: '100%', + flexDirection: 'row', + borderBottomWidth: 1, + borderBottomColor: '#e1e1e1', + alignItems: 'center', + }, + boxOrderDetailListItemLeft: { + width: 100, + padding: 10, + }, + boxOrderDetailListItemText: {}, + boxOrderDetailListItemRight: { + width: winWidthP10 - 120, + borderLeftColor: '#e1e1e1', + borderLeftWidth: 1, + padding: 10, + }, + boxOrderDetailListItemImage: { + width: 75, + height: 75, + position: 'relative', + }, + boxOrderDetailListItemImageCt: { + width: '100%', + position: 'absolute', + left: 0, + right: 0, + top: 0, + bottom: 0, + }, + boxOrderTotalItemLeft: { + width: '50%', + flexDirection: 'row', + justifyContent: 'flex-end', + padding: 10, + }, + boxOrderTotalItemRight: { + width: '50%', + flexDirection: 'row', + justifyContent: 'flex-start', + borderLeftColor: '#e1e1e1', + borderLeftWidth: 1, + padding: 10, + }, + boxOrderDetailTotal: { + width: '100%', + flexDirection: 'column', + } }) \ No newline at end of file diff --git a/screens/CartSend.tsx b/screens/CartSend.tsx new file mode 100644 index 0000000..c6e261f --- /dev/null +++ b/screens/CartSend.tsx @@ -0,0 +1,96 @@ +import 'react-native-gesture-handler'; +import * as React from 'react'; +import { useState } from 'react'; +import { Alert, Button, Image, StyleSheet, Dimensions, SafeAreaView, ScrollView, TouchableOpacity, Modal, Pressable, Share } from 'react-native'; +import Constants from 'expo-constants'; +import { Ionicons, FontAwesome } from '@expo/vector-icons'; +import { LinearGradient } from 'expo-linear-gradient'; +import { PolicyFooter, Social, ShowroomList, FooterInfo } from '../components/footer/footerMain'; + +import EditScreenInfo from '../components/EditScreenInfo'; +import { Text, View, } from '../components/Themed'; +import useColorScheme from '../hooks/useColorScheme'; +import { TextInput } from 'react-native-gesture-handler'; +import { RadioButton, Checkbox } from 'react-native-paper'; +import { Picker } from '@react-native-picker/picker'; +import { ArticleItem } from '../components/article/ArticleItem'; + +export default function ForgetPassword() { + return ( + + + + Trang chủ + + Đặt hàng thành công + + + + Đặt hàng thành công + Cảm ơn quý khách đã đặt hàng + Đơn hàng của quý khách đã được gửi thành công. Bộ phận chăm sóc khách hàng của website sẽ liên hệ lại với quý khách thông qua đơn hàng để có hướng dẫn thêm. + Cảm ơn quý khách ! + + + + + + + + + + + + ) +} + +const winWidth = Dimensions.get('window').width; //full width +const winHeight = Dimensions.get('window').height; //full height +const winWidthP10 = winWidth - 20; +const halfWinWidth = winWidth / 2; +const ratio = winWidthP10 / 850; //541 is actual image width + +const styles = StyleSheet.create({ + container: { + flex: 1, + alignItems: 'center', + justifyContent: 'center', + backgroundColor: '#fff', + }, + brecrumb: { + display: 'flex', + width: winWidth, + paddingLeft: 10, + paddingRight: 10, + flexDirection: 'row', + height: 18, + alignItems: 'center', + marginTop: 10, + marginBottom: 10, + }, + brecrumbText: { + fontSize: 13, + color: '#222', + }, + brecrumbTextLast: { + fontSize: 13, + color: '#b7b7b7', + }, + brecrumbIcon: { + fontSize: 13, + color: '#222', + marginLeft: 6, + marginRight: 6 + }, + boxCartSend: {}, + boxCartSendTitle: { + marginBottom: 20, + fontSize: 24, + fontWeight: 'bold', + color: '#243a76', + }, + boxCartSendNote: { + marginBottom: 10, + }, + boxCartSendThank: {}, +}) \ No newline at end of file