Skip to content

I
InvestCustomer
Commit 9c2fced6 by Giang Tran
Options

edit ui

parent 87e84ba1
Showing with 124 additions and 129 deletions
src/Screens/Action/History/HistoryView.js
...@@ -41,23 +41,25 @@ const HistoryView = (props) => { ...@@ -41,23 +41,25 @@ const HistoryView = (props) => {
<HeaderBack isWhite={true} title={'LỊCH SỬ'} /> <HeaderBack isWhite={true} title={'LỊCH SỬ'} />
<View style={{flex: 1}}> <View style={{flex: 1}}>
<View style={styles.headerContainer}> <View style={styles.headerContainer}>
{Fillters.map((e) => ( <ScrollView horizontal showsHorizontalScrollIndicator={false}>
<TouchableOpacity {Fillters.map((e) => (
key={e.value} <TouchableOpacity
onPress={() => setSelected(e.value)} key={e.value}
style={[ onPress={() => setSelected(e.value)}
styles.itemFillter,
selected == e.value ? {borderColor: '#1473E6'} : null,
]}>
<Text
style={[ style={[
styles.txtFillter, styles.itemFillter,
selected == e.value ? {color: '#1473E6'} : {}, selected == e.value ? {borderColor: '#1473E6'} : null,
]}> ]}>
{e.name} <Text
</Text> style={[
</TouchableOpacity> styles.txtFillter,
))} selected == e.value ? {color: '#1473E6'} : {},
]}>
{e.name}
</Text>
</TouchableOpacity>
))}
</ScrollView>
</View> </View>
{data.length == 0 ? ( {data.length == 0 ? (
...@@ -80,7 +82,7 @@ const HistoryView = (props) => { ...@@ -80,7 +82,7 @@ const HistoryView = (props) => {
onEndReached={(info) => { onEndReached={(info) => {
onLoadMore(); onLoadMore();
}} }}
keyExtractor={(item) => item.id} keyExtractor={(item) => item.id + 'a'}
data={data} data={data}
renderItem={({item}) => <Item item={item} />} renderItem={({item}) => <Item item={item} />}
/> />
...@@ -106,6 +108,7 @@ const styles = StyleSheet.create({ ...@@ -106,6 +108,7 @@ const styles = StyleSheet.create({
borderWidth: 1, borderWidth: 1,
borderColor: '#929292', borderColor: '#929292',
minWidth: 70, minWidth: 70,
marginRight: 10,
}, },
txtFillter: { txtFillter: {
fontSize: getFontXD(36), fontSize: getFontXD(36),
......
src/Screens/Action/Wallet/Tab/Item.js
...@@ -16,42 +16,38 @@ const Item = (props) => { ...@@ -16,42 +16,38 @@ const Item = (props) => {
const {item} = props; const {item} = props;
const navigate = useNavigation(); const navigate = useNavigation();
return ( return (
<TouchableOpacity onPress={() => console.log('hello')}> <View style={styles.container}>
<View style={styles.container}> <Block flex={1} row>
<Block flex={1} row> {/* <View style={[styles.wrapLeft, {backgroundColor: item.color}]} />
{/* <View style={[styles.wrapLeft, {backgroundColor: item.color}]} />
<View style={styles.wrapDate}> <View style={styles.wrapDate}>
<Text style={styles.txt}>T{item.month}</Text> <Text style={styles.txt}>T{item.month}</Text>
<Text style={styles.txtTitle}>{item.day}</Text> <Text style={styles.txtTitle}>{item.day}</Text>
</View> */} </View> */}
<Block <Block
style={styles.wrapRight} style={styles.wrapRight}
padding={[10, 10]} padding={[10, 10]}
space={'between'} space={'between'}
flex={1}> flex={1}>
<View style={styles.rowBet}> <View style={styles.rowBet}>
<Text style={styles.txtTitle}> <Text style={styles.txtTitle}>
{converType(item.transection_category)} {converType(item.transection_category)}
</Text>
<Text
style={{
fontSize: getFontXD(42),
fontWeight: 'bold',
color: '#FFB721',
}}>
{toPriceVnd(item.amount)}
</Text>
</View>
<Text numberOfLines={2} style={styles.txt}>
{item.comments}
</Text> </Text>
<Text style={styles.txtDate}> <Text
{item.transection_date_timestamp} style={{
fontSize: getFontXD(42),
fontWeight: 'bold',
color: '#FFB721',
}}>
{toPriceVnd(item.amount)}
</Text> </Text>
</Block> </View>
<Text numberOfLines={2} style={styles.txt}>
{item.comments}
</Text>
<Text style={styles.txtDate}>{item.transection_date_timestamp}</Text>
</Block> </Block>
</View> </Block>
</TouchableOpacity> </View>
); );
}; };
...@@ -88,7 +84,7 @@ const styles = StyleSheet.create({ ...@@ -88,7 +84,7 @@ const styles = StyleSheet.create({
paddingHorizontal: 10, paddingHorizontal: 10,
}, },
txtTitle: { txtTitle: {
fontSize: getFontXD(48), fontSize: getFontXD(42),
color: R.colors.black, color: R.colors.black,
fontWeight: '700', fontWeight: '700',
}, },
......
src/Screens/Home/HomeView.js
...@@ -13,57 +13,51 @@ import R from '../../assets/R'; ...@@ -13,57 +13,51 @@ import R from '../../assets/R';
const HomeView = (props) => { const HomeView = (props) => {
const {total_deposit, total_withdraw} = props.data; const {total_deposit, total_withdraw} = props.data;
return ( return (
<View style={{flex: 1}}> <ImageBackground
<HeaderHome /> source={R.images.bgHome}
<View style={styles.body}> resizeMode={'stretch'}
<ScrollView style={{width: '100%', height: '100%'}}>
showsVerticalScrollIndicator={false} <ScrollView showsVerticalScrollIndicator={false}>
style={styles.containerBody}> <HeaderHome />
<View style={{height: 10}} /> <View style={styles.containerMenu}>
<View style={styles.containerMenu}> <View style={styles.row}>
<View style={styles.row}>
<View style={styles.row}>
<View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Nạp tiền</Text>
<Text style={styles.txtMoney}>
{' '}
{total_deposit == 0 ? 0 : toPriceVnd(total_deposit)} Đ{' '}
</Text>
</View>
<View
style={{width: 0.5, backgroundColor: R.colors.borderGray}}
/>
<View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Rút tiền</Text>
<Text style={styles.txtMoney}>
{' '}
{total_withdraw == 0
? 0
: toPriceVnd(total_withdraw)} Đ{' '}
</Text>
</View>
</View>
</View>
<View style={{height: 0.5, backgroundColor: R.colors.borderGray}} />
<View style={styles.row}> <View style={styles.row}>
<View style={styles.itemMenu}> <View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Hoa hồng</Text> <Text style={styles.txtTitle}>Nạp tiền</Text>
<Text style={styles.txtMoney1}>+ 0 Đ </Text> <Text style={styles.txtMoney}>
{' '}
{total_deposit == 0 ? 0 : toPriceVnd(total_deposit)} Đ{' '}
</Text>
</View> </View>
<View <View
style={{width: 0.5, backgroundColor: R.colors.borderGray}} style={{width: 0.5, backgroundColor: R.colors.borderGray}}
/> />
<View style={styles.itemMenu}> <View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Lợi nhuận</Text> <Text style={styles.txtTitle}>Rút tiền</Text>
<Text style={styles.txtMoney1}>0 Đ</Text> <Text style={styles.txtMoney}>
{' '}
{total_withdraw == 0 ? 0 : toPriceVnd(total_withdraw)} Đ{' '}
</Text>
</View> </View>
</View> </View>
</View> </View>
<View style={{height: 0.5, backgroundColor: R.colors.borderGray}} />
<View style={styles.row}>
<View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Hoa hồng</Text>
<Text style={styles.txtMoney1}>+ 0 Đ </Text>
</View>
<View style={{width: 0.5, backgroundColor: R.colors.borderGray}} />
<View style={styles.itemMenu}>
<Text style={styles.txtTitle}>Lợi nhuận</Text>
<Text style={styles.txtMoney1}>0 Đ</Text>
</View>
</View>
</View>
<Footer /> <Footer />
</ScrollView> </ScrollView>
</View> </ImageBackground>
</View>
); );
}; };
...@@ -82,7 +76,8 @@ const styles = StyleSheet.create({ ...@@ -82,7 +76,8 @@ const styles = StyleSheet.create({
containerMenu: { containerMenu: {
height: 160, height: 160,
backgroundColor: 'white', backgroundColor: 'white',
marginVertical: 10, marginTop: 20,
marginBottom: 10,
marginHorizontal: 20, marginHorizontal: 20,
borderRadius: 10, borderRadius: 10,
shadowColor: '#000', shadowColor: '#000',
......
src/Screens/Notification/NotificaitonView.js
import React, {useState} from 'react'; import React, {useState} from 'react';
import {View, Text, FlatList, StyleSheet, TouchableOpacity} from 'react-native'; import {
View,
Text,
FlatList,
StyleSheet,
TouchableOpacity,
ScrollView,
} from 'react-native';
import HeaderDrawer from '../../components/Header/HeaderDrawer'; import HeaderDrawer from '../../components/Header/HeaderDrawer';
import Item from './Item'; import Item from './Item';
...@@ -34,25 +41,29 @@ const NotificaitonView = (props) => { ...@@ -34,25 +41,29 @@ const NotificaitonView = (props) => {
return ( return (
<View style={{flex: 1}}> <View style={{flex: 1}}>
<HeaderDrawer isWhite={true} title={'Thông báo'} /> <HeaderDrawer isWhite={true} title={'Thông báo'} />
<View style={styles.headerContainer}> <View style={styles.headerContainer}>
{Fillters.map((e) => ( <ScrollView horizontal showsHorizontalScrollIndicator={false}>
<TouchableOpacity {Fillters.map((e) => (
key={e.value} <TouchableOpacity
onPress={() => setFillters(e.value)} key={e.value}
style={[ onPress={() => setFillters(e.value)}
styles.itemFillter,
fillter == e.value ? {borderColor: '#1473E6'} : null,
]}>
<Text
style={[ style={[
styles.txtFillter, styles.itemFillter,
fillter == e.value ? {color: '#1473E6'} : {}, fillter == e.value ? {borderColor: '#1473E6'} : null,
]}> ]}>
{e.name} <Text
</Text> style={[
</TouchableOpacity> styles.txtFillter,
))} fillter == e.value ? {color: '#1473E6'} : {},
]}>
{e.name}
</Text>
</TouchableOpacity>
))}
</ScrollView>
</View> </View>
{data.length == 0 ? ( {data.length == 0 ? (
<View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}> <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
<Text <Text
...@@ -85,7 +96,6 @@ const styles = StyleSheet.create({ ...@@ -85,7 +96,6 @@ const styles = StyleSheet.create({
paddingVertical: 10, paddingVertical: 10,
backgroundColor: 'white', backgroundColor: 'white',
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-around',
alignItems: 'center', alignItems: 'center',
paddingHorizontal: 10, paddingHorizontal: 10,
}, },
...@@ -95,9 +105,9 @@ const styles = StyleSheet.create({ ...@@ -95,9 +105,9 @@ const styles = StyleSheet.create({
paddingHorizontal: 10, paddingHorizontal: 10,
borderWidth: 1, borderWidth: 1,
borderColor: '#929292', borderColor: '#929292',
minWidth: 80,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center', alignItems: 'center',
marginRight: 10,
}, },
txtFillter: { txtFillter: {
fontSize: getFontXD(36), fontSize: getFontXD(36),
......
src/assets/images.js
...@@ -12,8 +12,9 @@ const images = { ...@@ -12,8 +12,9 @@ const images = {
moneyinvest: require('./images/moneyinvest.png'), moneyinvest: require('./images/moneyinvest.png'),
moneysupport: require('./images/moneysupport.png'), moneysupport: require('./images/moneysupport.png'),
moneyteam: require('./images/moneyteam.png'), moneyteam: require('./images/moneyteam.png'),
bgHeader: require('./images/bgHeader1.png'), bgHeader: require('./images/bgheader5.png'),
iconMenu: require('./images/iconmenu.png'), iconMenu: require('./images/iconmenu.png'),
bgHome: require('./images/bgHome5.png'),
iconUser: require('./images/iconUser1.png'), iconUser: require('./images/iconUser1.png'),
iconUserAccuracy: require('./images/iconUserAccuracy.png'), iconUserAccuracy: require('./images/iconUserAccuracy.png'),
......
src/components/Header/HeaderBack.js
...@@ -48,15 +48,12 @@ export default connect(mapStateToProps, {})(HeaderHome); ...@@ -48,15 +48,12 @@ export default connect(mapStateToProps, {})(HeaderHome);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
img: { img: {
height: 110, height: 95,
width: '100%', width: '100%',
paddingTop: 30,
justifyContent: 'center',
alignItems: 'center',
}, },
headerContainer: { headerContainer: {
height: 55, height: 40,
paddingTop: 10,
width: '100%', width: '100%',
alignItems: 'center', alignItems: 'center',
flexDirection: 'row', flexDirection: 'row',
......
src/components/Header/HeaderDrawer.js
...@@ -77,11 +77,10 @@ export default connect(mapStateToProps, {})(HeaderDrawer); ...@@ -77,11 +77,10 @@ export default connect(mapStateToProps, {})(HeaderDrawer);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
img: { img: {
height: 110, height: 95,
width: '100%', width: '100%',
justifyContent: 'center', paddingTop: 30,
alignItems: 'center',
}, },
headerContainer: { headerContainer: {
height: 55, height: 55,
......
src/components/Header/HeaderHome.js
...@@ -117,9 +117,7 @@ const HeaderHome = (props) => { ...@@ -117,9 +117,7 @@ const HeaderHome = (props) => {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground style={styles.img} source={R.images.headerHome}> <StatusBar backgroundColor="transparent" translucent={true} />
<StatusBar backgroundColor="transparent" translucent={true} />
</ImageBackground>
<View <View
style={{ style={{
justifyContent: 'center', justifyContent: 'center',
...@@ -230,7 +228,7 @@ const styles = StyleSheet.create({ ...@@ -230,7 +228,7 @@ const styles = StyleSheet.create({
shadowOpacity: 0.25, shadowOpacity: 0.25,
shadowRadius: 2.84, shadowRadius: 2.84,
elevation: 3, elevation: 3,
marginTop: -180, marginTop: HEIGHTXD(150),
}, },
containerMenu: { containerMenu: {
justifyContent: 'space-between', justifyContent: 'space-between',
......
src/components/Header/HeaderNewFeed.js
...@@ -74,11 +74,10 @@ export default connect(mapStateToProps, {})(HeaderHome); ...@@ -74,11 +74,10 @@ export default connect(mapStateToProps, {})(HeaderHome);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
img: { img: {
height: 110, height: 95,
width: '100%', width: '100%',
justifyContent: 'center', paddingTop: 30,
alignItems: 'center',
}, },
headerContainer: { headerContainer: {
height: 55, height: 55,
......
src/components/Header/HeaderSB.js
...@@ -75,11 +75,10 @@ export default connect(mapStateToProps, {})(HeaderSearch); ...@@ -75,11 +75,10 @@ export default connect(mapStateToProps, {})(HeaderSearch);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
img: { img: {
height: 110, height: 95,
width: '100%', width: '100%',
justifyContent: 'center', paddingTop: 30,
alignItems: 'center',
}, },
headerContainer: { headerContainer: {
height: 55, height: 55,
......
src/components/Header/HeaderSearch.js
...@@ -100,11 +100,9 @@ export default connect(mapStateToProps, {})(HeaderSearch); ...@@ -100,11 +100,9 @@ export default connect(mapStateToProps, {})(HeaderSearch);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
img: { img: {
height: 110, height: 95,
width: '100%', width: '100%',
paddingTop: 30,
justifyContent: 'center',
alignItems: 'center',
}, },
headerContainer: { headerContainer: {
height: 55, height: 55,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment