Skip to content

E
eCartPro-Customer
Commit ea4b50e3 authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

Merge branch 'deni' into 'master' 

Deni

See merge request !10
parents ce69610f 933b415e
Hide whitespace changes
Inline Side-by-side
Showing with 106 additions and 58 deletions
App/Containers/MyAccountScreen.js
View file @ ea4b50e3
import React, { Component } from 'react'
import { ScrollView, Text, KeyboardAvoidingView, BackHandler } from 'react-native'
import { ScrollView, Text, View, BackHandler, Image } from 'react-native'
import { connect } from 'react-redux'
// Add Actions - replace 'Your' with whatever your reducer is called :)
// import YourActions from '../Redux/YourRedux'
// Styles
import styles from './Styles/MyAccountScreenStyle'
import BaseHeader from '../Components/BaseHeader';
import { Images } from '../Themes';
import BaseText from '../Components/BaseText';
class MyAccountScreen extends Component {
constructor(props) {
super(props)
this.state = {
array:[{ nama: "Data Diri", image: Images.icon_datadiri },
{ nama: "Daftar Alamat", image: Images.icon_daftaralamat },
{ nama: "Akun Bank", image: Images.icon_akunbank },
{ nama: "Kata Sandi", image: Images.icon_katasandi },
{ nama: "Keluar", image: Images.icon_keluar }]
}
}
backAction = () => {
this.props.navigation.goBack()
......@@ -22,14 +35,28 @@ class MyAccountScreen extends Component {
componentWillUnmount() {
BackHandler.removeEventListener("hardwareBackPress", this.backAction);
}
render () {
render() {
return (
<ScrollView style={styles.container}>
<KeyboardAvoidingView behavior='position'>
<Text>MyAccountScreen</Text>
</KeyboardAvoidingView>
</ScrollView>
<View style={{ flex: 1, backgroundColor: '#4cc9f0' }}>
<BaseHeader leftText={'Akun Saya'} onBackPress={() => this.props.navigation.goBack()} />
<View style={{ flex: 1, backgroundColor: '#fff', borderTopLeftRadius: 30, borderTopRightRadius: 30, width: '100%' }}>
<View style={{ paddingVertical: 40, paddingHorizontal: 30 }}>
{this.state.array.map((item, index) => {
return (
<View style={{ marginTop: index==0 ? 0 : 30 }} key={index}>
<View style={{ flexDirection: 'row' }}>
<Image source={item.image} style={{ width: 24, height: 24 }} />
<View style={{ justifyContent: 'center', marginLeft: 20 }}>
<BaseText type={"bold"} text={item.nama} style={{ fontSize: 14, color: '#4b4b4b' }} />
</View>
</View>
</View>
)
})}
</View>
</View>
</View>
)
}
}
......
App/Containers/RewardScreen.js
View file @ ea4b50e3
......@@ -12,6 +12,7 @@ import FontAwesome from 'react-native-vector-icons/FontAwesome'
import { Images } from '../Themes';
import Modal from 'react-native-modal';
import { TouchableOpacity, TouchableHighlight } from 'react-native-gesture-handler';
import BaseHeader from '../Components/BaseHeader';
const { StatusBarManager } = NativeModules;
const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 20 : StatusBarManager.HEIGHT;
......@@ -41,54 +42,54 @@ class RewardScreen extends Component {
return true;
};
drawerContent = () => {
return (
<View style={{ flexDirection: 'row', height: '100%', width: '100%', zIndex: 200 }}>
<ScrollView style={{ width: '75%', backgroundColor: 'white', borderTopRightRadius: 10 }}>
<View style={{ flexDirection: 'row', paddingLeft: 25 }}>
<View style={{ width: '50%', paddingTop: 30 }}>
<Image source={Images.logo_eCart} style={{ width: 120, height: 35 }} />
<View style={{ elevation: 5, width: 85, height: 85, borderRadius: 85, borderWidth: 46, borderColor: 'white', marginTop: 25, backgroundColor: 'red', alignItems: 'center', justifyContent: 'center', }}>
<Image source={Images.beautyProduct} style={{ width: 85, height: 85, borderRadius: 85 }} />
</View>
<BaseText type={"bold"} text={'Kang Dadang'} style={{ fontSize: 18, color: '#4b4b4b', marginLeft: 5, marginTop: 10 }} />
</View>
<View style={{ width: '50%', alignItems: 'flex-end' }}>
{/* <Image source={Images.sliceCircleBlue} style={{width: '100%', height: 150}}/> */}
</View>
</View>
<View style={{ marginTop: 20, borderTopWidth: .5, borderTopColor: '#4b4b4b', alignItems: 'center', borderBottomWidth: .5, borderBottomColor: '#4b4b4b', paddingVertical: 10, paddingLeft: 30, flexDirection: 'row' }}>
<View style={{ alignItems: 'center', flexDirection: 'column' }}>
<Image source={Images.icon_pesanansaya} style={{ width: 25, height: 30 }} />
<BaseText type={"regular"} text={'Pesanan Saya'} style={{ fontSize: 9, marginTop: 5 }} />
</View>
<TouchableOpacity style={{ alignItems: 'center', flexDirection: 'column', paddingTop: 5, marginLeft: 25 }} >
<Image source={Images.icon_rewards} style={{ width: 25, height: 25 }} />
<BaseText type={"regular"} text={'Kupon & Rewards'} style={{ fontSize: 9, marginTop: 5 }} />
</TouchableOpacity>
<View style={{ alignItems: 'center', flexDirection: 'column', paddingTop: 9, marginLeft: 25 }}>
<Image source={Images.icon_dompetsaya} style={{ width: 25, height: 20 }} />
<BaseText type={"regular"} text={'Dompet Saya'} style={{ fontSize: 9, marginTop: 5 }} />
</View>
</View>
<View style={{ paddingLeft: 30 }}>
{this.state.statisListDrawer.map((item, index) => {
return (
<TouchableOpacity key={index}>
<BaseText type={"regular"} text={item} style={{ fontSize: 12, marginVertical: 20 }} />
</TouchableOpacity>
)
})}
</View>
</ScrollView>
<View style={{ width: '25%', backgroundColor: 'transparent', alignItems: 'center', }}>
<TouchableOpacity style={{ paddingTop: 30 }} onPress={this.toggleOpen}>
<Image source={Images.icon_backbulat} style={{ width: 50, height: 50 }} />
</TouchableOpacity>
</View>
</View>
);
};
// drawerContent = () => {
// return (
// <View style={{ flexDirection: 'row', height: '100%', width: '100%', zIndex: 200 }}>
// <ScrollView style={{ width: '75%', backgroundColor: 'white', borderTopRightRadius: 10 }}>
// <View style={{ flexDirection: 'row', paddingLeft: 25 }}>
// <View style={{ width: '50%', paddingTop: 30 }}>
// <Image source={Images.logo_eCart} style={{ width: 120, height: 35 }} />
// <View style={{ elevation: 5, width: 85, height: 85, borderRadius: 85, borderWidth: 46, borderColor: 'white', marginTop: 25, backgroundColor: 'red', alignItems: 'center', justifyContent: 'center', }}>
// <Image source={Images.beautyProduct} style={{ width: 85, height: 85, borderRadius: 85 }} />
// </View>
// <BaseText type={"bold"} text={'Kang Dadang'} style={{ fontSize: 18, color: '#4b4b4b', marginLeft: 5, marginTop: 10 }} />
// </View>
// <View style={{ width: '50%', alignItems: 'flex-end' }}>
// {/* <Image source={Images.sliceCircleBlue} style={{width: '100%', height: 150}}/> */}
// </View>
// </View>
// <View style={{ marginTop: 20, borderTopWidth: .5, borderTopColor: '#4b4b4b', alignItems: 'center', borderBottomWidth: .5, borderBottomColor: '#4b4b4b', paddingVertical: 10, paddingLeft: 30, flexDirection: 'row' }}>
// <View style={{ alignItems: 'center', flexDirection: 'column' }}>
// <Image source={Images.icon_pesanansaya} style={{ width: 25, height: 30 }} />
// <BaseText type={"regular"} text={'Pesanan Saya'} style={{ fontSize: 9, marginTop: 5 }} />
// </View>
// <TouchableOpacity style={{ alignItems: 'center', flexDirection: 'column', paddingTop: 5, marginLeft: 25 }} >
// <Image source={Images.icon_rewards} style={{ width: 25, height: 25 }} />
// <BaseText type={"regular"} text={'Kupon & Rewards'} style={{ fontSize: 9, marginTop: 5 }} />
// </TouchableOpacity>
// <View style={{ alignItems: 'center', flexDirection: 'column', paddingTop: 9, marginLeft: 25 }}>
// <Image source={Images.icon_dompetsaya} style={{ width: 25, height: 20 }} />
// <BaseText type={"regular"} text={'Dompet Saya'} style={{ fontSize: 9, marginTop: 5 }} />
// </View>
// </View>
// <View style={{ paddingLeft: 30 }}>
// {this.state.statisListDrawer.map((item, index) => {
// return (
// <TouchableOpacity key={index}>
// <BaseText type={"regular"} text={item} style={{ fontSize: 12, marginVertical: 20 }} />
// </TouchableOpacity>
// )
// })}
// </View>
// </ScrollView>
// <View style={{ width: '25%', backgroundColor: 'transparent', alignItems: 'center', }}>
// <TouchableOpacity style={{ paddingTop: 30 }} onPress={this.toggleOpen}>
// <Image source={Images.icon_backbulat} style={{ width: 50, height: 50 }} />
// </TouchableOpacity>
// </View>
// </View>
// );
// };
toggleOpen = () => {
this.setState({ open: !this.state.open });
......@@ -170,7 +171,22 @@ class RewardScreen extends Component {
</Modal>
<View style={{ backgroundColor: '#4cc9f0' }}>
<MenuDrawer
<BaseHeader leftText={this.state.intent == 'Dompet' ? 'Dompet' : 'Rewards'} onBackPress={() => this.props.navigation.goBack()} />
<View style={{ backgroundColor: '#fff', height: '100%', borderTopRightRadius: 20, borderTopLeftRadius: 20 }}>
<ScrollView style={{ backgroundColor: '#fff', borderTopRightRadius: 20, borderTopLeftRadius: 20 }} onScroll={this.handleScroll} showsVerticalScrollIndicator={false}>
<Image source={this.state.intent == 'Dompet' ? Images.dompet : Images.reward} style={{ width: 100, height: 100, resizeMode: 'contain', marginTop: 50, alignSelf: 'center' }} />
<BaseText type={"bold"} text={this.state.intent == 'Dompet' ? 'Sisa Saldo Dompet Saya' : 'Rewards Point'} style={{ fontSize: 16, textAlign: 'center', marginTop: 10 }} />
<BaseText type={"bold"} text={this.state.intent == 'Dompet' ? 'Rp. 2.500.000' : '0'} style={{ fontSize: 16, textAlign: 'center', marginTop: 10, color: '#4cc9f0' }} />
{this.state.intent == 'Dompet' ?
<TouchableOpacity style={{ backgroundColor: '#4cc9f0', height: 45, borderRadius: 30, width: '80%', alignSelf: 'center', marginTop: 30 }} onPress={() => this.setState({ modalIsiUlang: true })}>
<BaseText type={"regular"} text={'Isi Ulang Saldo'} style={{ fontSize: 16, textAlign: 'center', marginTop: 10, color: 'white' }} />
</TouchableOpacity> :
<TouchableOpacity style={{ backgroundColor: '#4cc9f0', height: 45, borderRadius: 30, width: '80%', alignSelf: 'center', marginTop: 30 }}>
<BaseText type={"regular"} text={'Redeem'} style={{ fontSize: 16, textAlign: 'center', marginTop: 10, color: 'white' }} />
</TouchableOpacity>}
</ScrollView>
</View>
{/* <MenuDrawer
open={this.state.open}
drawerContent={this.drawerContent()}
drawerPercentage={100}
......@@ -200,7 +216,7 @@ class RewardScreen extends Component {
</ScrollView>
</View>
</View>
</MenuDrawer>
</MenuDrawer> */}
</View>
</View>
......
App/Themes/Images.js
View file @ ea4b50e3
......@@ -10,6 +10,11 @@ const images = {
icon_rewards: require('../Images/Icons/icon_rewards.png'),
icon_backbulat: require('../Images/Icons/icon_backbulat.png'),
icon_backwhite: require('../Images/Icons/icon_backwhite.png'),
icon_datadiri: require('../Images/Icons/icon_datadiri.png'),
icon_akunbank: require('../Images/Icons/icon_akunbank.png'),
icon_daftaralamat: require('../Images/Icons/icon_daftaralamat.png'),
icon_katasandi: require('../Images/Icons/icon_katasandi.png'),
icon_keluar: require('../Images/Icons/icon_keluar.png'),
closeBlack: require('../Images/Icons/icon_close_black.png'),
categoryAksesoris: require('../Images/categoryAksesoris.png'),
categoryCelana: require('../Images/categoryCelana.png'),
......
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