Skip to content

C
clone_excelso
Commit e6ff26ce authored by Trisno's avatar Trisno
Browse files
Options

update design, fix minor error

parent 68612dd5
Hide whitespace changes
Inline Side-by-side
Showing with 203 additions and 57 deletions
view/Home.js
View file @ e6ff26ce
......@@ -367,7 +367,7 @@ class Home extends React.Component {
<View style={{ flexDirection: 'row', flex: 1 }}>
<TouchableOpacity
// style={styles.submitUpgradePemium}
activeOpacity={.5} onPress={this.onPress}>
activeOpacity={.5} onPress={() => this.props.navigation.navigate('TopUpInfo')}>
<View style={styles.topUseBalance}>
<Text style={{ textAlign: 'center', bottom: 5, color: 'white', fontFamily: 'Gotham-Black' }}>TOP BALANCE </Text>
</View>
......
view/MenuConfirmation.js
View file @ e6ff26ce
import React from 'react';
import { View, Text, Alert, TextInput, StyleSheet, Button, ScrollView } from 'react-native';
import { View, Text, Alert, TouchableOpacity, StyleSheet, Button, ScrollView } from 'react-native';
import Axios from 'axios'
import { connect } from 'react-redux'
import ActionType from '../redux/globalActionType';
import Spinner from 'react-native-loading-spinner-overlay';
import session from '../function/session';
import moment from 'moment'
import { FontAwesome } from '@expo/vector-icons';
class MenuConfirmation extends React.Component {
constructor(props) {
super(props)
......@@ -29,6 +31,8 @@ class MenuConfirmation extends React.Component {
// console.log("type" +this.props.grabtype)
// console.log("BALANCED" +this.props.balanceUsed)
// console.log("POINT" +this.props.pointsused)
// console.log(this.props.type_pickup)
// console.log('kosong'+this.props.value_voucher)
}
......@@ -37,6 +41,7 @@ class MenuConfirmation extends React.Component {
this.setState({
spinner: true,
})
// console.log(is_pickup)
if (is_pickup) {
this.setState({
type: 'Pick Up'
......@@ -46,6 +51,7 @@ class MenuConfirmation extends React.Component {
type: 'Delivery'
})
}
// console.log(this.state.type)
// console.log(is_pickup)
if (this.props.value_voucher == '') {
......@@ -53,7 +59,7 @@ class MenuConfirmation extends React.Component {
session_id: this.props.session_id,
outlet_id: this.props.outlet_id,
address_id: this.props.addressId,
trans_type: this.state.type,
trans_type: this.props.type_pickup ? 'Pick Up' : 'Delivery',
order_item: this.props.order_item,
delivery_charge: this.props.grabamount,
voucher: [],
......@@ -106,10 +112,11 @@ class MenuConfirmation extends React.Component {
{ cancelable: false }
);
}).catch(error => {
const { navigation } = this.props
let response = error.response.data
session(response, navigation)
Alert.alert(response.msg);
// const { navigation } = this.props
// let response = error.response.data
// session(response, navigation)
console.log(error)
Alert.alert('error', error.response.msg);
this.setState({
spinner: false,
})
......@@ -120,7 +127,7 @@ class MenuConfirmation extends React.Component {
session_id: this.props.session_id,
outlet_id: this.props.outlet_id,
address_id: this.props.addressId,
trans_type: this.state.type,
trans_type: this.props.type_pickup ? 'Pick Up' : 'Delivery',
order_item: this.props.order_item,
delivery_charge: this.props.grabamount,
voucher: [{
......@@ -176,10 +183,10 @@ class MenuConfirmation extends React.Component {
{ cancelable: false }
);
}).catch(error => {
const { navigation } = this.props
let response = error.response.data
session(response, navigation)
Alert.alert(response.msg);
// const { navigation } = this.props
// let response = error.response.data
// session(response, navigation)
Alert.alert(error.response.msg);
this.setState({
spinner: false,
})
......@@ -197,7 +204,7 @@ class MenuConfirmation extends React.Component {
render() {
// console.log(this.props.value_voucher)
console.log(this.props.session_id)
let total = 0
return (
<ScrollView style={styles.container}>
......@@ -206,33 +213,159 @@ class MenuConfirmation extends React.Component {
textContent={'Sedang Proses...'}
textStyle={styles.spinnerTextStyle}
/>
<View style={{ margin: 10, padding: 20, borderBottomWidth: 1 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', textAlign: 'center' }}>{moment().utcOffset('+07:00').format('DD MMMM YYYY HH:mm:ss')}</Text>
</View>
<View style={{ flex: 1, flexDirection: 'row', borderBottomWidth: 1, margin: 10, paddingBottom: 30, padding: 10 }}>
<View style={{ flex: 0.1, justifyContent: 'center' }}>
<FontAwesome name="map-marker" size={24} color="red" />
</View>
{
this.props.type_pickup == true ? (
<View style={{ flex: 0.6, justifyContent: 'center' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.props.name_outlet}</Text>
</View>
) : (
<View style={{ flex: 0.6, justifyContent: 'center' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.props.address}</Text>
</View>
)
}
{
this.props.type_pickup == true ? (
<View style={{ flex: 0.3, justifyContent: 'center' }}>
<Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light' }}>PICKUP</Text>
</View>
) : (
<View style={{ flex: 0.3, justifyContent: 'center' }}>
<Text style={{ textAlign: 'right', fontSize: 12, fontFamily: 'Gotham-Light' }}>DELIVERY</Text>
</View>
)
}
</View>
<View style={{ margin: 10, paddingLeft: 10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Pesanan</Text>
</View>
{
this.props.order_item.map((item, index) => {
total = total + item.quantity * item.price
return (
<View style={{ margin: 10 }} key={index}>
<View style={{ margin: 10 }} key={index} >
<View style={{ flex: 1, margin: 10, flexDirection: 'row', justifyContent: 'space-around' }}>
<View style={{ flex: 0.3, alignItems: 'center' }}>
<Text>{item.quantity}</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{item.quantity}</Text>
</View>
<View style={{ flex: 0.1, alignItems: 'flex-start' }}>
<Text>x</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>x</Text>
</View>
<View style={{ flex: 0.3, alignItems: 'baseline' }}>
<Text>{item.name} </Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{item.name} </Text>
</View>
<View style={{ flex: 0.3, alignItems: 'flex-end' }}>
<Text>{item.quantity * item.price} </Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{item.quantity * item.price} </Text>
</View>
</View>
</View>
)
})
}
<View style={{ alignItems: 'flex-end', borderTopWidth: 1, margin: 10, padding: 10 }}>
<Text>{total}</Text>
{
this.props.value_voucher == '' ? (
null
) : (
<>
<View style={{ borderTopWidth: 1, margin: 10, padding: 10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Voucher</Text>
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', margin: 10, marginTop: -10 }}>
<View style={{ margin: 10, paddingLeft: 10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.props.voucher.reward.title}</Text>
</View>
<TouchableOpacity onPress={() => this.props.navigation.navigate('Reward Detail', { rewardId: this.props.voucher.id })}>
<View style={{ margin: 10, paddingRight: 5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: '#CFB368' }}>View Detail</Text>
</View>
</TouchableOpacity>
</View>
</>
)
}
<View style={{ borderTopWidth: 1, margin: 10, paddingLeft: 10, padding: 20, paddingBottom: -10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Payment</Text>
</View>
<View style={{ flexDirection: 'row', margin: 10, justifyContent: 'space-between' }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', margin: 10, marginTop: -10 }}>
<View style={{ margin: 10, paddingLeft: 10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Balance Used</Text>
</View>
<View style={{ margin: 10, paddingRight: 5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.props.route.params.balanceUsed}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', margin: 10, marginTop: -10 }}>
<View style={{ margin: 10, paddingLeft: 10 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Point Used</Text>
</View>
<View style={{ margin: 10, paddingRight: 5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.props.route.params.pointused}</Text>
</View>
</View>
<View style={{ borderTopWidth: 1, margin: 10, paddingLeft: 10, padding: 20, paddingBottom: -10, flexDirection: 'row', justifyContent: 'space-between', flex: 1, flexDirection: 'row' }}>
<View style={{ flex: 0.6 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Harga</Text>
</View>
<View style={{ flex: 0.4, marginRight: -5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', textAlign: 'right' }}>{total}</Text>
</View>
</View>
{
this.props.value_voucher == '' ? (
null
) : (
<View style={{ margin: 10, marginTop: -10, paddingLeft: 10, padding: 20, paddingBottom: -10, flexDirection: 'row', justifyContent: 'space-between', flex: 1, flexDirection: 'row' }}>
<View style={{ flex: 0.6 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Voucher</Text>
</View>
<View style={{ flex: 0.4, marginRight: -5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', textAlign: 'right' }}>- {this.props.voucher.reward.value}</Text>
</View>
</View>
)
}
{
this.props.type_pickup == true ? (
null
) : (
<View style={{ margin: 10, marginTop: -10, paddingLeft: 10, padding: 20, paddingBottom: -10, flexDirection: 'row', justifyContent: 'space-between', flex: 1, flexDirection: 'row' }}>
<View style={{ flex: 0.6 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Ongkos Kirim</Text>
</View>
<View style={{ flex: 0.4, marginRight: -5 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', textAlign: 'right' }}>{this.props.grabamount}</Text>
</View>
</View>
)
}
<View style={{ margin: 10, marginTop: -10, paddingLeft: 10, padding: 20, paddingBottom: -10, flexDirection: 'row', justifyContent: 'space-between', flex: 1, flexDirection: 'row' }}>
<View style={{ flex: 0.6 }}>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', color: '#CFB368' }}>Total</Text>
</View>
{
this.props.value_voucher == '' ? (
<View style={{ flex: 0.4, marginRight: -5 }}>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', textAlign: 'right', color: '#CFB368' }}>{this.props.order_total + this.props.grabamount}</Text>
</View>
) : (
<View style={{ flex: 0.4, marginRight: -5 }}>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', textAlign: 'right', color: '#CFB368' }}>{Math.max(0, this.props.order_total - this.props.voucher.reward.value + this.props.grabamount)}</Text>
</View>
)
}
</View>
{/* <View style={{ flexDirection: 'row', margin: 10, justifyContent: 'space-between' }}>
<View style={{ margin: 10 }}>
<Text>Voucher Discount</Text>
</View>
......@@ -292,22 +425,7 @@ class MenuConfirmation extends React.Component {
)}
</View>
<View style={{ flexDirection: 'row', margin: 10, justifyContent: 'space-between', borderTopWidth: 1 }}>
<View style={{ margin: 10 }}>
<Text>Balance Used</Text>
</View>
<View style={{ margin: 10 }}>
<Text>{this.props.route.params.balanceUsed}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', margin: 10, justifyContent: 'space-between' }}>
<View style={{ margin: 10 }}>
<Text>Point Used</Text>
</View>
<View style={{ margin: 10 }}>
<Text>{this.props.route.params.pointused}</Text>
</View>
</View>
{this.props.type_pickup == true ? (
null
) : (
......@@ -319,10 +437,16 @@ class MenuConfirmation extends React.Component {
<Text>{this.props.address}</Text>
</View>
</View>
)}
<View style={{ margin: 10 }}>
)} */}
{/* <View style={{ margin: 10 }}>
<Button title='order' onPress={() => this.setOrder(this.props.type_pickup)} />
</View>
</View> */}
<TouchableOpacity onPress={() => this.setOrder(this.props.type_pickup)}>
<View style={styles.button}>
<Text style={{ color: 'white', fontSize: 22, fontFamily: 'Gotham-Black' }}>Proses Pesanan</Text>
</View>
</TouchableOpacity>
<View style={{ height: 30 }} />
</ScrollView>
)
}
......@@ -349,6 +473,15 @@ const styles = StyleSheet.create({
body: {
flex: 3,
},
button: {
backgroundColor: '#CFB368',
marginTop: 25,
marginHorizontal: 30,
borderRadius: 10,
paddingVertical: 5,
alignItems: 'center',
justifyContent: 'center'
},
})
......@@ -387,7 +520,10 @@ const mapStateToProps = (state) => {
grabdestination: state.grabdestination,
balanceUsed: state.balanceUsed,
pointused: state.pointused,
address: state.address,
addressId: state.addressId,
outlet_id: state.outlet_id,
name_outlet: state.name_outlet,
lat: state.lat,
long: state.long
}
......
view/ShoppingCart.js
View file @ e6ff26ce
......@@ -126,6 +126,17 @@ class ShoppingCart extends React.Component {
this.props.navigation.navigate('Reward Select')
}
handleAddVoucher() {
this.setState({
checkedBalance: false,
checkedPoint: false,
checkedBalancePoint: false,
pointsused: 0,
balanceused: 0
})
this.props.navigation.navigate('Reward Select')
}
handleMin(item, index) {
this.setState({
checkedBalance: false,
......@@ -437,7 +448,7 @@ class ShoppingCart extends React.Component {
</Card>
) : (
<Card style={{ margin: 5, padding: 10 }}>
<Text style={{ textAlign: 'center', fontFamily: 'Gotham-Black', fontSize: 12 }}>OUR DRIVER WILL DELIVER YOU ORDER TO</Text>
<Text style={{ textAlign: 'center', fontFamily: 'Gotham-Black', fontSize: 12 }}>OUR DRIVER WILL DELIVER YOUR ORDER TO</Text>
<Text style={{ textAlign: 'center', fontSize: 12, top: 5, fontFamily: 'Gotham-Light' }}>{this.props.address}</Text>
</Card>
)
......@@ -466,7 +477,7 @@ class ShoppingCart extends React.Component {
<View style={styles.voucher}>
{
this.props.value_voucher == '' ? (
<TouchableOpacity onPress={() => this.props.navigation.navigate('Reward Select')}>
<TouchableOpacity onPress={() => this.handleAddVoucher()}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: '#CFB368' }}>+ ADD VOUCHER</Text>
</TouchableOpacity>
) : (
......@@ -611,7 +622,7 @@ class ShoppingCart extends React.Component {
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Your Balance</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Your Points</Text>
</View>
<View style={{ paddingRight: 30, alignItems: 'flex-end' }}>
<View style={{ alignItems: 'flex-end' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.state.kasproBalance}</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>{this.state.kasproPoint}</Text>
</View>
......@@ -621,7 +632,7 @@ class ShoppingCart extends React.Component {
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Your Balance Used</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>Your Points Used</Text>
</View>
<View style={{ paddingRight: 30, marginTop: 5, alignItems: 'flex-end' }}>
<View style={{ marginTop: 5, alignItems: 'flex-end' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>- {this.state.balanceused}</Text>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light' }}>- {this.state.pointsused}</Text>
</View>
......@@ -660,23 +671,22 @@ class ShoppingCart extends React.Component {
</View>)}
<View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}>
<View style={{ paddingLeft: 20, paddingTop: 10, }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: 'gray' }}>Diskon</Text>
</View>
{
this.props.value_voucher == '' ? (
<View style={{ paddingRight: 30, paddingTop: 10, alignItems: 'flex-end' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: 'gray' }}>{this.state.diskon}</Text>
</View>
) : (
{
this.props.value_voucher == '' ? (
null
) : (
<View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}>
<View style={{ paddingLeft: 20, paddingTop: 10, }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: 'gray' }}>Diskon</Text>
</View>
<View style={{ paddingRight: 30, paddingTop: 10, alignItems: 'flex-end' }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', color: 'gray' }}>{this.props.voucher.reward.value}</Text>
</View>
)
}
</View>
)
}
</View>
<View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}>
<View style={{ marginTop: 15, paddingLeft: 20, paddingTop: 10 }}>
<Text style={{ fontSize: 25, color: '#CFB368', fontFamily: 'Gotham-Black', }}>TOTAL</Text>
......
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