Skip to content

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

kupon & alamat co

parent cfbc95eb
Hide whitespace changes
Inline Side-by-side
Showing with 108 additions and 58 deletions
App/Containers/ChatScreen.js
View file @ d5fd7f13
......@@ -16,19 +16,7 @@ class ChatScreen extends Component {
this.state = {
chatDummy: [
{
tanggal: "Thursday, 09 July 2020",
data: [
{
chat: [
{ isi: "Apakah produk 88Rising x Guess Hooded Sweatshirt size L ready?", jam: '08:00 AM', status: 'read', sender: 1, produk: {
nama: '88Rising x Guess Hooded Sweatshirt', harga: 'Rp. 2.400.000', image: Images.jaket
} },
{ isi: "Selamat pagi, untuk produk tersebut stock masih tersedia, silahkan melakukan order", jam: '08:02 AM', status: 'read', sender: 0 }
],
}
],
}, {
tanggal: "Today",
data: [
{ isi: "Apakah produk sudah dikirm?", jam: '08:00 AM', status: 'read', sender: 1 },
......@@ -71,7 +59,7 @@ class ChatScreen extends Component {
{item.data.map((i, indexs) => {
return (
<View style={{ width: '80%', alignSelf: i.sender == 0 ? 'flex-start' : 'flex-end', marginTop: 20 }}>
<View style={{ justifyContent: 'center', padding: 15, backgroundColor: i.sender == 0 ? '#e8e8e8' : '#ccf3ff', borderRadius: 100, borderBottomLeftRadius: 0, }}>
<View style={{ justifyContent: 'center', padding: 15, backgroundColor: i.sender == 0 ? '#e8e8e8' : '#ccf3ff', borderRadius: 100, borderBottomLeftRadius: i.sender == 0 ? 0 : null, borderBottomRightRadius: i.sender == 0 ? null : 0, }}>
<BaseText text={i.isi} type={'regular'} style={{ fontSize: 12, color: '#4b4b4b' }} />
</View>
<View style={{ flexDirection: 'row', justifyContent: i.sender == 0 ? 'flex-start' : 'flex-end', marginTop: 5 }}>
......
App/Containers/CheckOutScreen.js
View file @ d5fd7f13
......@@ -29,7 +29,9 @@ class CheckOutScreen extends Component {
totalCheckout: 0,
delivery: null,
diskon: 0,
paymentMethod : null
paymentMethod : null,
coupon: null,
useCoupon: false
}
}
......@@ -73,7 +75,6 @@ class CheckOutScreen extends Component {
}
refreshScreen() {
this.getAddress()
this.getCurrency()
console.log('ini data delivery', this.state.delivery)
}
......@@ -116,8 +117,8 @@ class CheckOutScreen extends Component {
"payment_method": this.state.paymentMethod.payment_method_id,
"delivery_charge": this.state.delivery.rate_value,
"is_wallet": this.state.paymentMethod.payment_method_name == 'Wallet'? 1 : 0,
"coupon_id": null,
"coupon_discount": null,
"coupon_id": this.state.coupon == null ? null : this.state.coupon.coupon_id,
"coupon_discount": this.state.coupon == null ? null : this.state.coupon.cart_value,
"discount": diskon,
"lat": this.state.address.lat,
"long": this.state.address.lng,
......@@ -160,7 +161,7 @@ class CheckOutScreen extends Component {
<BaseText text={`${this.state.address.address}, ${this.state.address.kelurahan_name}, ${this.state.address.kecamatan_name}, ${this.state.address.kabupaten_kota_name}, ${this.state.address.provinsi_name} ${this.state.address.kode_pos}`} type={"regular"} style={{fontSize: 11, color: '#4b4b4b', opacity: 1}}/>
</View>
<View style={{width: '20%', flexGrow: 1}}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('ListAddressScreen')} style={{alignItems: 'center', borderColor: '#4cc9f0', borderWidth: 1, paddingVertical: 5, borderRadius: 5}}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('ListAddressScreen', { intent: 'cart', onSelect: this.onSelect.bind(this), address: this.state.address.address_id, getAddress: this.getAddress.bind(this)})} style={{alignItems: 'center', borderColor: '#4cc9f0', borderWidth: 1, paddingVertical: 5, borderRadius: 5}}>
<BaseText text={'Ganti'} type={'bold'} style={{fontSize: 12, color: '#4cc9f0'}}/>
</TouchableOpacity>
</View>
......@@ -231,13 +232,13 @@ class CheckOutScreen extends Component {
</View>
{/* Kupon and Rewards */}
<View>
<TouchableOpacity style={{flexDirection:'row', justifyContent: 'space-between', padding: 20}} onPress={()=> this.props.navigation.navigate('UseCouponScreen')}>
<TouchableOpacity style={{flexDirection:'row', justifyContent: 'space-between', padding: 20}} onPress={()=> this.props.navigation.navigate('UseCouponScreen', {onSelect: this.onSelect.bind(this)})}>
<View style={{flexDirection: 'row',alignItems: 'center'}}>
<Image source={Images.icon_coupon} style={{width: 30, height: 20, resizeMode: 'stretch'}}/>
<BaseText text={'Gunakan Kupon Belanja'} style={{marginLeft: 10, fontSize: 12}}/>
<BaseText text={this.state.coupon == null ? 'Gunakan Kupon Belanja' : this.state.coupon.coupon_code} style={{marginLeft: 10, fontSize: 12}}/>
</View>
<View style={{flexDirection: 'row', alignItems:'center'}}>
<Image source={Images.icon_check} style={{height: 20, width: 20, marginRight: 15}}/>
{this.state.useCoupon && <Image source={Images.icon_check} style={{height: 20, width: 20, marginRight: 15}}/>}
<FontAwesome name={'angle-right'} size={20}/>
</View>
</TouchableOpacity>
......@@ -286,6 +287,10 @@ class CheckOutScreen extends Component {
<BaseText text={'Subtotal Pengiriman'} type={'regular'} style={{opacity: .5, fontSize: 12}}/>
<BaseText text={formatRp(this.state.currency, this.state.delivery == null? 0 : this.state.delivery.rate_value)} type={'bold'} style={{opacity: .5,fontSize: 12}}/>
</View>
<View style={{flexDirection:'row', justifyContent: 'space-between'}}>
<BaseText text={'Diskon Kupon'} type={'regular'} style={{opacity: .5, fontSize: 12}}/>
<BaseText text={formatRp( this.state.currency, this.state.coupon == null ? 0 : this.state.coupon.cart_value) } type={'bold'} style={{opacity: .5,fontSize: 12}}/>
</View>
<View style={{flexDirection:'row', justifyContent: 'space-between'}}>
<BaseText text={'Total Pembayaran'} type={'regular'} style={{opacity: .9}}/>
<BaseText text={formatRp(this.state.currency, this.state.totalCheckout + (this.state.delivery == null? 0 : this.state.delivery.rate_value))} type={'bold'} style={{color: '#4cc9f0'}}/>
......
App/Containers/ListAddressScreen.js
View file @ d5fd7f13
......@@ -20,18 +20,33 @@ class ListAddressScreen extends Component {
this.state = {
data: [],
addressId: 0,
other: false
other: false,
intent: "",
address: 0
}
}
backAction = () => {
this.props.navigation.goBack()
if (this.state.intent == 'cart') {
this.props.navigation.state.params.getAddress()
this.props.navigation.goBack()
} else {
this.props.navigation.goBack()
}
return true;
};
componentDidMount() {
BackHandler.addEventListener("hardwareBackPress", this.backAction);
this.getAddress()
if (this.props.navigation.state) {
if (this.props.navigation.state.params) {
if (this.props.navigation.state.params.intent == 'cart') {
this.setState({ intent: "cart", address: this.props.navigation.state.params.address })
console.log(JSON.stringify(this.props.navigation.state.params.address))
}
}
}
}
componentWillUnmount() {
......@@ -74,6 +89,14 @@ class ListAddressScreen extends Component {
})
}
backToCart(item) {
this.setState({ address: item.address_id })
this.props.navigation.state.params.onSelect({
address: item
})
this.props.navigation.goBack()
}
render() {
return (
<View style={{ flex: 1, backgroundColor: '#4cc9f0' }}>
......@@ -95,7 +118,7 @@ class ListAddressScreen extends Component {
</Modal>
<ModalBox
backButtonClose={true}
onClosed={() => this.setState({other: false})}
onClosed={() => this.setState({ other: false })}
position="bottom"
isOpen={this.state.other}
style={{ height: 85 }}
......@@ -107,7 +130,7 @@ class ListAddressScreen extends Component {
</View>
</ModalBox>
<NavigationEvents onDidFocus={() => { this.getAddress() }} />
<BaseHeader leftText={'Pilih Alamat'} onBackPress={() => this.props.navigation.goBack()} />
<BaseHeader leftText={'Pilih Alamat'} onBackPress={() => this.backAction()} />
<ScrollView style={[styles.scrollContent]}>
<TouchableOpacity style={{ flexDirection: 'row', marginTop: 20 }} onPress={() => this.props.navigation.navigate('CreateAddressScreen')}>
<View>
......@@ -115,38 +138,64 @@ class ListAddressScreen extends Component {
</View>
<BaseText type={"regular"} text={'Tambah Alamat'} style={{ fontSize: 12, color: 'black', marginLeft: 10, alignSelf: 'center' }} />
</TouchableOpacity>
{this.state.data.map((item, index) => {
return (
<View style={{ borderRadius: 4, padding: 10, marginTop: 20, elevation: 4, backgroundColor: 'white', margin: 5 }} key={index}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<BaseText type={"bold"} text={`${item.receiver_name} (${item.type_address})`} style={{ fontSize: 10, color: 'black' }} />
<TouchableOpacity onPress={() => item.select_status == 1 ? null : this.setState({ other: true, addressId: item.address_id })}>
<Icon name={'dots-three-vertical'} size={16} />
{this.state.intent == "cart" ?
this.state.data.map((item, index) => {
return (
<View style={{ borderRadius: 4, marginTop: 20, elevation: 4, backgroundColor: 'white', margin: 5 }} key={index}>
<TouchableOpacity style={{ flexDirection: 'row' }} onPress={() => this.backToCart(item)}>
<View style={{ width: '90%', padding: 10 }}>
<BaseText type={"bold"} text={`${item.receiver_name} (${item.type_address})`} style={{ fontSize: 10, color: 'black' }} />
<BaseText type={"bold"} text={`${item.receiver_phone}`} style={{ fontSize: 10, color: 'black', marginTop: 5 }} />
<BaseText ellipsizeMode={"tail"} numberOfLines={1} type={"regular"} text={`${item.address}, ${item.kelurahan_name}, ${item.kecamatan_name}, ${item.kabupaten_kota_name}, ${item.provinsi_name} ${item.kode_pos}`} style={{ fontSize: 10, color: '#4b4b4b', marginTop: 5 }} />
</View>
<View style={{ width: '10%', justifyContent: 'center' }}>
{this.state.address == item.address_id ?
<Image source={Images.radioOn} style={{ width: 20, height: 20, }} /> :
<Image source={Images.radioOff} style={{ width: 20, height: 20, }} />
}
</View>
</TouchableOpacity>
<View style={{ borderBottomWidth: 1, borderBottomColor: '#d8d8d8' }} />
<TouchableOpacity style={{ padding: 10, justifyContent: 'center' }} onPress={() => this.props.navigation.navigate('CreateAddressScreen', { item, type: 'edit' })}>
<BaseText type={"bold"} text={'Ubah Alamat'} style={{ fontSize: 10, color: '#d8d8d8', alignSelf: 'center' }} />
</TouchableOpacity>
</View>
<BaseText type={"bold"} text={`${item.receiver_phone}`} style={{ fontSize: 10, color: 'black', marginTop: 5 }} />
<BaseText type={"regular"} text={`${item.address}, ${item.kelurahan_name}, ${item.kecamatan_name}, ${item.kabupaten_kota_name}, ${item.provinsi_name} ${item.kode_pos}`} style={{ fontSize: 10, color: '#4b4b4b', marginTop: 5 }} />
<View style={{ flexDirection: 'row', marginTop: 10, height: 20 }}>
<Image source={Images.map} style={{ height: 16, width: 12 }} />
<BaseText type={"regular"} text={item.lat == "" ? "Belum Pinpoint" : 'Sudah Pinpoint'} style={{ fontSize: 10, color: '#4b4b4b', alignSelf: 'center', marginLeft: 10 }} />
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginTop: 10 }}>
{item.select_status == 0 ? <View /> : <View>
<BaseText type={"bold"} text={'Alamat Utama'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</View>}
<View style={{ flexDirection: 'row', justifyContent: 'flex-end' }}>
<TouchableOpacity style={{ marginRight: 35 }} onPress={() => this.props.navigation.navigate('CreateAddressScreen', { item, type: 'edit' })}>
<BaseText type={"bold"} text={'Ubah'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</TouchableOpacity>
<TouchableOpacity onPress={() => this.setState({ modalDelete: true, addressId: item.address_id })}>
<BaseText type={"bold"} text={'Hapus'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
)
})
:
this.state.data.map((item, index) => {
return (
<View style={{ borderRadius: 4, padding: 10, marginTop: 20, elevation: 4, backgroundColor: 'white', margin: 5 }} key={index}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<BaseText type={"bold"} text={`${item.receiver_name} (${item.type_address})`} style={{ fontSize: 10, color: 'black' }} />
<TouchableOpacity onPress={() => item.select_status == 1 ? null : this.setState({ other: true, addressId: item.address_id })}>
<Icon name={'dots-three-vertical'} size={16} />
</TouchableOpacity>
</View>
<BaseText type={"bold"} text={`${item.receiver_phone}`} style={{ fontSize: 10, color: 'black', marginTop: 5 }} />
<BaseText type={"regular"} text={`${item.address}, ${item.kelurahan_name}, ${item.kecamatan_name}, ${item.kabupaten_kota_name}, ${item.provinsi_name} ${item.kode_pos}`} style={{ fontSize: 10, color: '#4b4b4b', marginTop: 5 }} />
<View style={{ flexDirection: 'row', marginTop: 10, height: 20 }}>
<Image source={Images.map} style={{ height: 16, width: 12 }} />
<BaseText type={"regular"} text={item.lat == "" ? "Belum Pinpoint" : 'Sudah Pinpoint'} style={{ fontSize: 10, color: '#4b4b4b', alignSelf: 'center', marginLeft: 10 }} />
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginTop: 10 }}>
{item.select_status == 0 ? <View /> : <View>
<BaseText type={"bold"} text={'Alamat Utama'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</View>}
<View style={{ flexDirection: 'row', justifyContent: 'flex-end' }}>
<TouchableOpacity style={{ marginRight: 35 }} onPress={() => this.props.navigation.navigate('CreateAddressScreen', { item, type: 'edit' })}>
<BaseText type={"bold"} text={'Ubah'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</TouchableOpacity>
<TouchableOpacity onPress={() => this.setState({ modalDelete: true, addressId: item.address_id })}>
<BaseText type={"bold"} text={'Hapus'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</TouchableOpacity>
</View>
</View>
</View>
</View>
)
)
})}
})
}
</ScrollView>
</View>
......
App/Containers/UseCouponScreen.js
View file @ d5fd7f13
......@@ -19,7 +19,8 @@ class UseCouponScreen extends Component {
this.state = {
listKupon: [],
couponID: "",
diskon: 0
diskon: 0,
coupon: null
}
}
......@@ -38,7 +39,11 @@ class UseCouponScreen extends Component {
}
useKupon() {
null
this.props.navigation.state.params.onSelect({
coupon: this.state.coupon,
useCoupon: true
})
this.backAction()
}
getKupon() {
......@@ -67,11 +72,14 @@ class UseCouponScreen extends Component {
<View style={{ padding: 20 }}>
{this.state.listKupon.map((item, index) => {
return (
<TouchableOpacity activeOpacity={.7} style={{ borderRadius: 15, width: '100%', borderColor: '#4cc9f0', borderWidth: 1, marginTop: index == 0 ? 0 : 20, padding: 10, elevation: 5, backgroundColor: this.state.couponID == item.coupon_id ? '#dbf7ff' : 'white' }} onPress={() => this.setState({ couponID: item.coupon_id, diskon: item.cart_value })}>
<TouchableOpacity activeOpacity={.7} style={{ borderRadius: 15, width: '100%', borderColor: '#4cc9f0', borderWidth: 1, marginTop: index == 0 ? 0 : 20, padding: 10, elevation: 2, backgroundColor: this.state.couponID == item.coupon_id ? '#dbf7ff' : 'white' }} onPress={() => this.setState({ couponID: item.coupon_id, diskon: item.cart_value, coupon: item })}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View>
<BaseText text={`Diskon ${this.number(item.cart_value)}`} type={"bold"} style={{ opacity: .5, fontSize: 12, marginTop: 5 }} />
<BaseText text={`Berakhir pada ${M(item.valid_from).format('DD MMM YYYY')}`} type={"regular"} style={{ opacity: .5, fontSize: 12, marginTop: 5 }} />
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{}}>
<BaseText text={item.coupon_name} type={"bold"} style={{ opacity: .5, fontSize: 14 }} />
<BaseText text={`Berakhir pada ${M(item.valid_from).format('DD MMM YYYY')}`} type={"regular"} style={{ opacity: .5, fontSize: 12 }} />
</View>
<BaseText text={`${this.number(item.cart_value)}`} type={"bold"} style={{ opacity: .5, fontSize: 12, alignSelf: 'center' }} />
</View>
<View style={{ justifyContent: 'center' }}>
{this.state.couponID == item.coupon_id && (
......
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