Commit ee6cd993 by Giang Tran

update ui transaction

parent 510ae0bc
...@@ -13,7 +13,6 @@ import Block from '../../components/Block'; ...@@ -13,7 +13,6 @@ import Block from '../../components/Block';
const Item = (props) => { const Item = (props) => {
const {item} = props; const {item} = props;
console.log('noti', item);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Block flex={1} row> <Block flex={1} row>
...@@ -35,7 +34,7 @@ export default Item; ...@@ -35,7 +34,7 @@ export default Item;
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
marginTop: 10, marginTop: 8,
paddingVertical: 10, paddingVertical: 10,
shadowColor: '#000', shadowColor: '#000',
shadowOffset: { shadowOffset: {
...@@ -47,7 +46,7 @@ const styles = StyleSheet.create({ ...@@ -47,7 +46,7 @@ const styles = StyleSheet.create({
elevation: 5, elevation: 5,
marginHorizontal: 10, marginHorizontal: 10,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
marginBottom: 10, marginBottom: 2,
borderRadius: HEIGHTXD(30), borderRadius: HEIGHTXD(30),
}, },
......
...@@ -19,27 +19,37 @@ import I18n from '../../../helper/i18/i18n'; ...@@ -19,27 +19,37 @@ import I18n from '../../../helper/i18/i18n';
const Item = (props) => { const Item = (props) => {
const {item, isEndItem} = props; const {item, isEndItem} = props;
console.log(item) console.log(item);
return ( return (
<View style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}> <View
style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}>
<TouchableOpacity onPress={() => props.onPress(item)}> <TouchableOpacity onPress={() => props.onPress(item)}>
<Block flex={1} row> <Block flex={1} row>
<View style={styles.wrapDate}> <View style={styles.wrapDate}>
<Image source={{uri: item.commoditiy.image_path}} style={styles.imgIcon} /> <Image
source={{uri: item.commoditiy.image_path}}
style={styles.imgIcon}
/>
</View> </View>
<Block padding={[5, 10]} space={'between'} flex={1}> <Block padding={[0, 10]} space={'between'} flex={1}>
<View <View
style={{ style={{
flex: 1, flex: 1,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
}}> }}>
<Text numberOfLines={2} style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]} numberOfLines={1} ellipsizeMode='tail'> <Text
numberOfLines={2}
style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]}
numberOfLines={1}
ellipsizeMode="tail">
{item.contract_name} {item.contract_name}
</Text> </Text>
<Text style={styles.txtMoney}>{item.term}</Text> <Text style={styles.txtMoney}>{item.term}</Text>
</View> </View>
<Text style={styles.txtCode}>{`${I18n.t('ContactCode')}: ${item.contract_code}`}</Text> <Text style={styles.txtCode}>{`${I18n.t('ContactCode')}: ${
item.contract_code
}`}</Text>
<Text style={styles.txt}>{item.open_interest_range}</Text> <Text style={styles.txt}>{item.open_interest_range}</Text>
</Block> </Block>
</Block> </Block>
...@@ -64,7 +74,7 @@ const styles = StyleSheet.create({ ...@@ -64,7 +74,7 @@ const styles = StyleSheet.create({
marginHorizontal: 10, marginHorizontal: 10,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
borderRadius: HEIGHTXD(30), borderRadius: HEIGHTXD(30),
marginVertical: HEIGHTXD(15) marginVertical: HEIGHTXD(15),
}, },
wrapLeft: { wrapLeft: {
...@@ -95,12 +105,12 @@ const styles = StyleSheet.create({ ...@@ -95,12 +105,12 @@ const styles = StyleSheet.create({
alignItems: 'center', alignItems: 'center',
}, },
txtBlack: { txtBlack: {
fontSize: getFontXD(50), fontSize: getFontXD(46),
color: 'black', color: 'black',
}, },
imgIcon: { imgIcon: {
width: WIDTHXD(150), width: WIDTHXD(178),
height: WIDTHXD(150), height: WIDTHXD(178),
resizeMode: 'cover', resizeMode: 'cover',
}, },
txtMoney: { txtMoney: {
......
...@@ -15,29 +15,40 @@ import { ...@@ -15,29 +15,40 @@ import {
} from '../../../Config/Functions'; } from '../../../Config/Functions';
import R from '../../../assets/R'; import R from '../../../assets/R';
import Block from '../../../components/Block'; import Block from '../../../components/Block';
import I18n from '../../../helper/i18/i18n';
const Item = (props) => { const Item = (props) => {
const {item, isEndItem} = props; const {item, isEndItem} = props;
return ( return (
<View style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}> <View
style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}>
<TouchableOpacity onPress={() => props.onPress(item)}> <TouchableOpacity onPress={() => props.onPress(item)}>
<Block flex={1} row> <Block flex={1} row>
<View style={styles.wrapDate}> <View style={styles.wrapDate}>
<Image source={{uri: item.image_path}} style={styles.imgIcon} /> <Image source={{uri: item.image_path}} style={styles.imgIcon} />
</View> </View>
<Block padding={[5, 10]} space={'between'} flex={1}> <Block padding={[0, 10]} flex={1}>
<View <View
style={{ style={{
flex: 1,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
marginBottom: 5,
}}> }}>
<Text numberOfLines={2} style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]} numberOfLines={1} ellipsizeMode='tail'> <Text
numberOfLines={2}
style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]}
numberOfLines={1}
ellipsizeMode="tail">
{item.name} {item.name}
</Text> </Text>
<Text style={styles.txtMoney}>{item.escrow > 0 ? toPriceVnd(item.escrow) : 0}</Text> <Text style={styles.txtMoney}>
{item.escrow > 0 ? toPriceVnd(item.escrow) : 0}
</Text>
</View> </View>
<Text style={styles.txt}>{item.code}</Text> <Text style={styles.txt}>
{' '}
{I18n.t('code')}: {item.code}
</Text>
</Block> </Block>
</Block> </Block>
</TouchableOpacity> </TouchableOpacity>
...@@ -61,7 +72,7 @@ const styles = StyleSheet.create({ ...@@ -61,7 +72,7 @@ const styles = StyleSheet.create({
marginHorizontal: 10, marginHorizontal: 10,
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
borderRadius: HEIGHTXD(30), borderRadius: HEIGHTXD(30),
marginVertical: HEIGHTXD(15) marginVertical: HEIGHTXD(15),
}, },
wrapLeft: { wrapLeft: {
...@@ -87,7 +98,7 @@ const styles = StyleSheet.create({ ...@@ -87,7 +98,7 @@ const styles = StyleSheet.create({
alignItems: 'center', alignItems: 'center',
}, },
txtBlack: { txtBlack: {
fontSize: getFontXD(50), fontSize: getFontXD(46),
color: 'black', color: 'black',
}, },
imgIcon: { imgIcon: {
......
...@@ -15,27 +15,35 @@ import { ...@@ -15,27 +15,35 @@ import {
} from '../../../Config/Functions'; } from '../../../Config/Functions';
import R from '../../../assets/R'; import R from '../../../assets/R';
import Block from '../../../components/Block'; import Block from '../../../components/Block';
import I18n from '../../../helper/i18/i18n';
const Item = (props) => { const Item = (props) => {
const {item, isEndItem} = props; const {item, isEndItem} = props;
console.log('sss', item);
return ( return (
<View style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}> <View
style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}>
<TouchableOpacity onPress={() => props.onPress(item)}> <TouchableOpacity onPress={() => props.onPress(item)}>
<Block flex={1} row> <Block flex={1} row>
<Image source={{uri: item.image_path}} style={styles.imgIcon} /> <Image source={{uri: item.image_path}} style={styles.imgIcon} />
<Block padding={[0, WIDTHXD(40)]} space={'between'} flex={1}> <Block padding={[0, WIDTHXD(40)]} space={'between'} flex={1}>
<View <View
style={{ style={{
flex: 1,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between',
}}> }}>
<Text numberOfLines={2} style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]} numberOfLines={1} ellipsizeMode='tail'> <Text
numberOfLines={2}
style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]}
numberOfLines={1}
ellipsizeMode="tail">
{item.name} {item.name}
</Text> </Text>
<Text style={styles.txtMoney}>{toPriceVnd(item.fee)}</Text> <Text style={styles.txtMoney}>{toPriceVnd(item.fee)}</Text>
</View> </View>
<Text style={styles.txt}>{item.code}</Text> <Text style={styles.txt}>
{I18n.t('code')}: {item.code}
</Text>
<Text style={styles.txt}>{item.category.name}</Text>
</Block> </Block>
</Block> </Block>
</TouchableOpacity> </TouchableOpacity>
...@@ -59,7 +67,7 @@ const styles = StyleSheet.create({ ...@@ -59,7 +67,7 @@ const styles = StyleSheet.create({
backgroundColor: R.colors.white, backgroundColor: R.colors.white,
borderRadius: HEIGHTXD(30), borderRadius: HEIGHTXD(30),
marginVertical: HEIGHTXD(15), marginVertical: HEIGHTXD(15),
marginHorizontal: WIDTHXD(30) marginHorizontal: WIDTHXD(30),
}, },
wrapLeft: { wrapLeft: {
...@@ -82,14 +90,14 @@ const styles = StyleSheet.create({ ...@@ -82,14 +90,14 @@ const styles = StyleSheet.create({
alignItems: 'center', alignItems: 'center',
}, },
txtBlack: { txtBlack: {
fontSize: getFontXD(50), fontSize: getFontXD(46),
color: 'black', color: 'black',
}, },
imgIcon: { imgIcon: {
width: WIDTHXD(150), width: WIDTHXD(178),
height: WIDTHXD(150), height: WIDTHXD(178),
resizeMode: 'cover', resizeMode: 'cover',
marginLeft: WIDTHXD(35) marginLeft: WIDTHXD(35),
}, },
txtMoney: { txtMoney: {
fontSize: getFontXD(42), fontSize: getFontXD(42),
......
import React from 'react'; import React from 'react';
import { import {View, Text, StyleSheet, TouchableOpacity, Image} from 'react-native';
View, import {getFontXD, HEIGHTXD, WIDTHXD} from '../../../Config/Functions';
Text,
StyleSheet,
TouchableOpacity,
Image,
} from 'react-native';
import {
getFontXD,
HEIGHTXD,
WIDTHXD,
} from '../../../Config/Functions';
import R from '../../../assets/R'; import R from '../../../assets/R';
import Block from '../../../components/Block'; import Block from '../../../components/Block';
const Item = (props) => { const Item = (props) => {
const {item, isEndItem} = props; const {item, isEndItem} = props;
return ( return (
<View style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}> <View
<TouchableOpacity onPress={() => props.onPress(item)}> style={[styles.container, isEndItem && {marginBottom: HEIGHTXD(100)}]}>
<Block flex={1} row> <TouchableOpacity onPress={() => props.onPress(item)}>
<View style={styles.wrapDate}> <Block flex={1} row>
<Image source={{uri: item.image_path}} style={styles.imgIcon}/> <View style={styles.wrapDate}>
</View> <Image source={{uri: item.image_path}} style={styles.imgIcon} />
<Block padding={[0, 10]} space={'between'} flex={1}> </View>
<View <Block padding={[0, 10]} flex={1}>
style={{ <View
flex: 1, style={{
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', }}>
}}> <Text
<Text numberOfLines={2} style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]} numberOfLines={2}
numberOfLines={1} ellipsizeMode='tail'> style={[styles.txtBlack, {flexWrap: 'wrap', flex: 1}]}
{item.name} numberOfLines={1}
</Text> ellipsizeMode="tail">
<Text style={styles.txtMoney}>{item.trans_time}</Text> {item.name}
</View> </Text>
{item.trans_session_list.map((sessionItem) => ( <Text style={styles.txtMoney}>{item.trans_time}</Text>
<Text style={[styles.txt, {marginTop: HEIGHTXD(20)}]}>{sessionItem}</Text> </View>
) {item.trans_session_list.map((sessionItem) => (
)} <Text style={[styles.txt, {marginTop: HEIGHTXD(20)}]}>
</Block> {sessionItem}
</Block> </Text>
</TouchableOpacity> ))}
</View> </Block>
); </Block>
</TouchableOpacity>
</View>
);
}; };
export default Item; export default Item;
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
paddingVertical: HEIGHTXD(30), paddingVertical: HEIGHTXD(30),
shadowColor: '#000', shadowColor: '#000',
shadowOffset: { shadowOffset: {
width: 0, width: 0,
height: 2, height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
borderRadius: HEIGHTXD(30),
marginVertical: HEIGHTXD(15),
}, },
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
borderRadius: HEIGHTXD(30),
marginVertical: HEIGHTXD(15),
},
wrapLeft: { wrapLeft: {
width: WIDTHXD(16), width: WIDTHXD(16),
borderTopLeftRadius: HEIGHTXD(30), borderTopLeftRadius: HEIGHTXD(30),
borderBottomStartRadius: HEIGHTXD(30), borderBottomStartRadius: HEIGHTXD(30),
}, },
wrapDate: { wrapDate: {
justifyContent: 'center', justifyContent: 'center',
paddingLeft: 10, paddingLeft: 10,
}, },
txtTitle: { txtTitle: {
fontSize: getFontXD(42), fontSize: getFontXD(42),
color: R.colors.black, color: R.colors.black,
}, },
txt: { txt: {
fontSize: getFontXD(36), fontSize: getFontXD(36),
}, },
rowBet: { rowBet: {
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
alignItems: 'center', alignItems: 'center',
}, },
txtBlack: { txtBlack: {
fontSize: getFontXD(50), fontSize: getFontXD(46),
color: 'black', color: 'black',
}, },
imgIcon: { imgIcon: {
width: WIDTHXD(150), width: WIDTHXD(178),
height: WIDTHXD(150), height: WIDTHXD(178),
resizeMode: 'cover', resizeMode: 'cover',
}, },
txtMoney: { txtMoney: {
fontSize: getFontXD(42), fontSize: getFontXD(42),
color: R.colors.main, color: R.colors.main,
}, },
}); });
...@@ -193,7 +193,7 @@ export default { ...@@ -193,7 +193,7 @@ export default {
NothingChange: 'Nothing change', NothingChange: 'Nothing change',
Tradding: 'Tradding', Tradding: 'Tradding',
ContractDescription: 'Contract description', ContractDescription: 'Contract description',
QualityStandard: 'Quality Standard', QualityStandard: 'Standard',
CommodityTransactions: 'Commodity transactions', CommodityTransactions: 'Commodity transactions',
CommodityCode: 'Commodity code', CommodityCode: 'Commodity code',
Escrow: 'Escrow', Escrow: 'Escrow',
...@@ -272,8 +272,10 @@ export default { ...@@ -272,8 +272,10 @@ export default {
ProfitLoss: 'Profit/Loss', ProfitLoss: 'Profit/Loss',
BUY_IN: 'Buy in', BUY_IN: 'Buy in',
SELL_OUT: 'Sell out', SELL_OUT: 'Sell out',
YouCanNotTransaction: 'You can not trade the above contracts with the current available escrow', YouCanNotTransaction:
YouCanTransaction: 'You can trade the above contracts with the current available escrow', 'You can not trade the above contracts with the current available escrow',
YouCanTransaction:
'You can trade the above contracts with the current available escrow',
EnterContractInfo: 'Enter contract information', EnterContractInfo: 'Enter contract information',
EnterFirstEscrow: 'Enter first escrow', EnterFirstEscrow: 'Enter first escrow',
...@@ -282,5 +284,5 @@ export default { ...@@ -282,5 +284,5 @@ export default {
Count: 'Count', Count: 'Count',
Systemmaintenance: 'The system is maintenance', Systemmaintenance: 'The system is maintenance',
WaitUpdateCQG: 'Waiting Update CQG', WaitUpdateCQG: 'Waiting Update CQG',
code: 'Code',
}; };
...@@ -196,7 +196,7 @@ export default { ...@@ -196,7 +196,7 @@ export default {
NothingChange: 'Không có gì thay đổi', NothingChange: 'Không có gì thay đổi',
Tradding: 'Giao dịch', Tradding: 'Giao dịch',
ContractDescription: 'Đặc tả hợp đồng', ContractDescription: 'Đặc tả hợp đồng',
QualityStandard: 'TIêu chuẩn chất lượng', QualityStandard: 'TIêu chuẩn',
CommodityTransactions: 'Hàng hóa giao dịch', CommodityTransactions: 'Hàng hóa giao dịch',
CommodityCode: 'Mã hàng hóa', CommodityCode: 'Mã hàng hóa',
Escrow: 'Ký quỹ', Escrow: 'Ký quỹ',
...@@ -282,4 +282,5 @@ export default { ...@@ -282,4 +282,5 @@ export default {
WaitUpdateCQG: 'Chờ cập nhật CQG', WaitUpdateCQG: 'Chờ cập nhật CQG',
FirstPriceRange: 'Giới hạn giá ban đầu', FirstPriceRange: 'Giới hạn giá ban đầu',
ExpandPriceRange: 'Giới hạn giá mở rộng', ExpandPriceRange: 'Giới hạn giá mở rộng',
code: 'Mã',
}; };
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