Skip to content

C
clone_excelso
Commit 5944ee5c authored by William Goszal's avatar William Goszal 🚴
Browse files
Options

- benerin grid tombol actions di halaman account 

- hide tombol upgrade premium & transfer balance
parent 414a3c10
Hide whitespace changes
Inline Side-by-side
Showing with 83 additions and 59 deletions
view/Account.js
View file @ 5944ee5c
...@@ -436,7 +436,8 @@ class Account extends React.Component { ...@@ -436,7 +436,8 @@ class Account extends React.Component {
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('topup')}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('topup')}</Text>
</TouchableOpacity> </TouchableOpacity>
<View style={{ padding: 10, height: 250, top: 10, margin: 0 }}> {/* Member Card */}
<View style={{ padding: 10, height: 250, top: 10, marginBottom: 20 }}>
<ImageBackground style={{ width: '100%', height: '100%', padding: 0, margin: 0 }} resizeMode='stretch' source={this.state.img_card ? { uri: this.state.img_card } : null}> <ImageBackground style={{ width: '100%', height: '100%', padding: 0, margin: 0 }} resizeMode='stretch' source={this.state.img_card ? { uri: this.state.img_card } : null}>
<View style={{ justifyContent: 'center' }}> <View style={{ justifyContent: 'center' }}>
<Text style={{ fontFamily: 'Gotham-Black', margin: 15, fontSize: 14, color: '#c9af6d', top: 170 }}> <Text style={{ fontFamily: 'Gotham-Black', margin: 15, fontSize: 14, color: '#c9af6d', top: 170 }}>
...@@ -446,83 +447,72 @@ class Account extends React.Component { ...@@ -446,83 +447,72 @@ class Account extends React.Component {
</ImageBackground> </ImageBackground>
</View> </View>
<View style={{ marginLeft: 10, marginRight: 10, padding: 5 }}> {/* Actions Grid */}
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center', margin: 5 }}> <View style={styles.action_grid_container} >
<TouchableOpacity style={{ marginBottom: 5, margin: 3 }} onPress={() => this.TransferBalance()} >
<Card style={{ height: 120, width: 155 }}> {/* Action Transfer Balance */}
<View style={{ height: 50, alignItems: 'center', padding: 10, flex: 1 }}> <View style={styles.action_grid_col} display="none">
<Image <TouchableOpacity onPress={() => this.TransferBalance()} >
style={{ height: 50, width: 50, justifyContent: 'center' }} <Card style={styles.action_grid_card}>
source={require('../assets/icon/4.png')} <Image style={styles.action_grid_icon} source={require('../assets/icon/4.png')} />
/> <Text style={styles.action_grid_text}>{i18n.t('Transferbalance')}</Text>
<Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', top: 5, fontSize: 14, color: '#838383' }}> {i18n.t('Transferbalance')}</Text>
</View>
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
<View style={{ width: 5 }}></View> </View>
<TouchableOpacity style={{ marginBottom: 5, margin: 3 }} onPress={() => this.handleuseBalance()}>
<Card style={{ height: 120, width: 155 }}> {/* Action Use Balance */}
<View style={{ height: 50, alignItems: 'center', padding: 10, flex: 1 }}> <View style={styles.action_grid_col}>
<Image <TouchableOpacity onPress={() => this.handleuseBalance()}>
style={{ height: 50, width: 50, justifyContent: 'center' }} <Card style={styles.action_grid_card}>
source={require('../assets/icon/2.png')} <Image style={styles.action_grid_icon} source={require('../assets/icon/2.png')} />
/> <Text style={styles.action_grid_text}>{i18n.t('Usebalancepoint')}</Text>
<Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', top: 5, fontSize: 14, color: '#838383' }}> {i18n.t('Usebalancepoint')}</Text>
</View>
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{ flex: 1, flexDirection: 'row', marginBottom: 10, justifyContent: 'center' }}>
{/* Action Transaction History */}
<TouchableOpacity style={{ marginBottom: 5, margin: 4 }} onPress={() => this.props.navigation.navigate('Transaction History')} > <View style={styles.action_grid_col}>
<Card style={{ height: 120, width: 155 }}> <TouchableOpacity onPress={() => this.props.navigation.navigate('Transaction History')} >
<View style={{ height: 50, alignItems: 'center', padding: 10, flex: 1 }}> <Card style={styles.action_grid_card}>
<Image <Image style={styles.action_grid_icon} source={require('../assets/icon/1.png')} />
style={{ height: 50, width: 50, justifyContent: 'center' }} <Text style={styles.action_grid_text}>{i18n.t('Transactionhistory')}</Text>
source={require('../assets/icon/1.png')}
/>
<Text style={{ fontFamily: 'Gotham-Black', flexDirection: 'row', textAlign: 'center', flexWrap: 'wrap', margin: 5, color: '#838383' }}> {i18n.t('Transactionhistory')}</Text>
</View>
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
<View style={{ width: 5 }}></View> </View>
<TouchableOpacity style={{ marginBottom: 5, margin: 4 }} onPress={() => this.props.navigation.navigate('Renewal')}>
<Card style={{ height: 120, width: 155 }}> {/* Action Renewal */}
<View style={styles.action_grid_col}>
<View style={{ height: 50, alignItems: 'center', padding: 10, flex: 1 }}> <TouchableOpacity onPress={() => this.props.navigation.navigate('Renewal')}>
<Image <Card style={styles.action_grid_card}>
style={{ height: 50, width: 50, justifyContent: 'center' }} <Image style={styles.action_grid_icon} source={require('../assets/icon/3.png')} />
source={require('../assets/icon/3.png')} <Text style={styles.action_grid_text}>{i18n.t('Renewal')}</Text>
/>
<Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', top: 5, fontSize: 14, margin: 5, color: '#838383' }}> {i18n.t('Renewal')}</Text>
</View>
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center', display: 'none' }}>
{this.state.premium === false ? ( {/* Action Upgrade Premium */}
<TouchableOpacity onPress={() => this.props.navigation.navigate('Upgrade Premium')} style={{ marginBottom: 20, marginRight: 5, marginLeft: 5 }}> <View style={styles.action_grid_col} display="none">
<Card style={{ width: 200, paddingHorizontal: 10, paddingTop: 20, paddingBottom: 20 }}> <TouchableOpacity onPress={() => this.props.navigation.navigate('Upgrade Premium')} >
<View style={{ flex: 1, alignItems: 'center' }}> <Card style={styles.action_grid_card}>
<MaterialIcons name="autorenew" size={30} color="gray" style={{ marginBottom: 10 }} /> {/* <MaterialIcons name="autorenew" color="gray" size={50} style={styles.action_grid_icon} /> */}
<Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', fontSize: 14, color: '#838383' }}>{i18n.t('upgradePremium')}</Text> <Image style={styles.action_grid_icon} source={require('../assets/icon/3.png')} />
</View> <Text style={styles.action_grid_text}>{i18n.t('upgradePremium')}</Text>
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
) : (
null
)}
</View> </View>
</View> </View>
{/* Actions Grid - end */}
{/* Button Logout */}
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<TouchableOpacity onPress={() => this.logout()}> <TouchableOpacity onPress={() => this.logout()}>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center', marginLeft: 20, marginRight: 20, marginBottom: 20, padding: 5, bottom: 5, top: 1 }}> <View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center', marginLeft: 20, marginRight: 20, marginBottom: 20, padding: 5, bottom: 5, top: 1 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('logout')}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('logout')}</Text>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
) )
} }
...@@ -547,6 +537,40 @@ Account.navigationOptions = { ...@@ -547,6 +537,40 @@ Account.navigationOptions = {
}; };
const styles = StyleSheet.create({ const styles = StyleSheet.create({
action_grid_container: {
flex:1, flexDirection: 'row', flexWrap: 'wrap',
marginLeft: 10,
marginRight: 10
},
action_grid_col: {
flexBasis:'50%',
paddingLeft:10,
paddingRight:10,
marginBottom: 20
},
action_grid_col_full: {
flexBasis:'100%',
paddingLeft:10,
paddingRight:10,
marginBottom: 20
},
action_grid_card:{
height: 120,
width: "100%",
alignItems: 'center',
flex: 1,
flexDirection: 'column',
justifyContent: 'flex-start',
padding: 15,
},
action_grid_icon:{
height: 50, width: 50,
justifyContent: 'center'
},
action_grid_text:{
fontFamily: 'Gotham-Black', textAlign: 'center', top: 5, fontSize: 14, color: '#838383'
},
container: { container: {
flex: 1, flex: 1,
......
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