Skip to content

N
new_excelso
Commit 560b2871 authored by Wahyu Adjie Prasetyo's avatar Wahyu Adjie Prasetyo
Browse files
Options

Merge branch 'master' of ssh://repo.cs.co.id:2222/wahyu/bahanoprek 

# Conflicts:
#	view/ShoppingCart.js
parents c54fc936 3d11b3d8
Hide whitespace changes
Inline Side-by-side
Showing with 237 additions and 167 deletions
redux/globalActionType.js
View file @ 560b2871
...@@ -24,7 +24,8 @@ const ActionType = { ...@@ -24,7 +24,8 @@ const ActionType = {
SET_CHANGE_SHOP:'SET_CHANGE_SHOP', SET_CHANGE_SHOP:'SET_CHANGE_SHOP',
ADD_TO_CHART:'ADD_TO_CHART', ADD_TO_CHART:'ADD_TO_CHART',
REMOVE_FROM_CHART:'REMOVE_FROM_CHART', REMOVE_FROM_CHART:'REMOVE_FROM_CHART',
REDUCE_QUANTITY_ITEM :'REDUCE_QUANTITY_ITEM' REDUCE_QUANTITY_ITEM :'REDUCE_QUANTITY_ITEM',
SET_ADDRESS :'SET_ADDRESS'
} }
......
redux/globalReducer.js
View file @ 560b2871
...@@ -56,7 +56,9 @@ const globalState = { ...@@ -56,7 +56,9 @@ const globalState = {
order_item: [], order_item: [],
order_quantity: 0, order_quantity: 0,
order_total: 0 order_total: 0,
address:''
} }
const rootReducer = (state = globalState, action) => { const rootReducer = (state = globalState, action) => {
...@@ -200,6 +202,13 @@ const rootReducer = (state = globalState, action) => { ...@@ -200,6 +202,13 @@ const rootReducer = (state = globalState, action) => {
...state ...state
} }
} }
case ActionType.SET_ADDRESS:{
return{
...state,
address: action.data.address
}
}
case ActionType.SET_LOGOUT:{ case ActionType.SET_LOGOUT:{
return{ return{
...state, ...state,
......
view/DeliveryAddrees.js
View file @ 560b2871
import React from 'react'; import React from 'react';
import { View, Text, StyleSheet, Button, FlatList } from 'react-native'; import { View, Text, StyleSheet, Button, FlatList, Alert } from 'react-native';
import { ScrollView } from 'react-native-gesture-handler'; import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import Axios from 'axios'; import Axios from 'axios';
import ActionType from '../redux/globalActionType';
class DeliveryAddrees extends React.Component { class DeliveryAddrees extends React.Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
data:[] data: []
} }
} }
componentDidMount() { componentDidMount() {
this.getAddreess() this.getAddreess()
console.log(this.props) console.log(this.props)
} }
onChangeAddress = data => { onChangeAddress = data => {
...@@ -22,7 +23,7 @@ class DeliveryAddrees extends React.Component { ...@@ -22,7 +23,7 @@ class DeliveryAddrees extends React.Component {
this.getAddreess() this.getAddreess()
} }
getAddreess(){ getAddreess() {
let params = { let params = {
session_id: this.props.session_id, session_id: this.props.session_id,
} }
...@@ -50,24 +51,46 @@ class DeliveryAddrees extends React.Component { ...@@ -50,24 +51,46 @@ class DeliveryAddrees extends React.Component {
}) })
} }
addAdreess(){ addAdreess() {
this.props.navigation.navigate('Address Detail', { 'data': 'sample', onChangeAddress: this.onChangeAddress }) this.props.navigation.navigate('Address Detail', { 'data': 'sample', onChangeAddress: this.onChangeAddress })
} }
onSave(address) {
Alert.alert(
'',
'Apakah anda akan memilih alamat untuk pengiriman ?',
[
{text: 'OK', onPress: () => this.props.navigation.navigate('')},
],
{ cancelable: false }
)
let setDataAddress = {
address : address
}
this.props.setAddress(setDataAddress);
}
render() { render() {
function Item({ name,description,address }) { function Item({ name, description, address }) {
return ( return (
<View style={styles.list_addrees}> <View style={styles.list_addrees}>
<View style={{ margin: 5, }}> <TouchableOpacity onPress={()=>this.onSave(address)}>
<Text style={{ fontWeight: 'bold', fontSize: 20 }}>{name}</Text> <View style={{ margin: 5, }}>
</View> <Text style={{ fontWeight: 'bold', fontSize: 20 }}>{name}</Text>
<Text style={{ margin: 5 }}> </View>
{address} <Text style={{ margin: 5 }}>
</Text> {address}
<Text style={{ margin: 5 }}> </Text>
Patokan : {description} <Text style={{ margin: 5 }}>
</Text> Patokan : {description}
</Text>
</TouchableOpacity>
</View> </View>
); );
} }
...@@ -84,7 +107,7 @@ class DeliveryAddrees extends React.Component { ...@@ -84,7 +107,7 @@ class DeliveryAddrees extends React.Component {
<FlatList <FlatList
data={this.state.data} data={this.state.data}
renderItem={({ item }) => <Item name={item.name} description = {item.description} address = {item.address} /> } renderItem={({ item }) => <Item name={item.name} description={item.description} address={item.address} />}
keyExtractor={item => item.id} keyExtractor={item => item.id}
/> />
{/* {/*
...@@ -144,5 +167,18 @@ const mapStateToProps = (state) => { ...@@ -144,5 +167,18 @@ const mapStateToProps = (state) => {
} }
} }
const mapDispatchToProps = (dispacth) => {
return {
setAddress: (setDataAddress) => dispacth({
type: ActionType.SET_ADDRESS,
data: {
address: setDataAddress.address,
}
}),
}
}
export default connect(mapStateToProps)(DeliveryAddrees) export default connect(mapStateToProps)(DeliveryAddrees)
view/MenuSelection.js
View file @ 560b2871
...@@ -131,18 +131,20 @@ class MenuSelection extends React.Component { ...@@ -131,18 +131,20 @@ class MenuSelection extends React.Component {
this.props.reduceQuantityItem(order_item) this.props.reduceQuantityItem(order_item)
const list_order_item = this.props.order_item; const list_order_item = this.props.order_item;
let quantity = 0 let quantity = 0
for (let i = 0; i < list_order_item.length; i++) { if (quantity != 0) {
const row = list_order_item[i]; quantity = quantity - 1
if (row.id == item.id) { for (let i = 0; i < list_order_item.length; i++) {
quantity = row.quantity const row = list_order_item[i];
if (row.id == item.id) {
quantity = row.quantity
}
} }
const listMenu = [...this.state.listMenu]
listMenu[index].qty = quantity
this.setState({
listMenu
})
} }
const listMenu = [...this.state.listMenu]
listMenu[index].qty = quantity
this.setState({
listMenu
})
} }
render() { render() {
...@@ -152,23 +154,12 @@ class MenuSelection extends React.Component { ...@@ -152,23 +154,12 @@ class MenuSelection extends React.Component {
<StatusBar hidden={true} /> <StatusBar hidden={true} />
<View style={{ flex: 0.7, height: 90, flexDirection: 'row', borderWidth: 1, }}> <View style={{ flex: 0.7, height: 90, flexDirection: 'row', borderWidth: 1, }}>
<FlatList horizontal={true} style={{ flexDirection: 'row' }} <FlatList horizontal={true} style={{ flexDirection: 'row' }}
data={this.state.list_category} data={this.state.listCategory}
renderItem={this.renderTabBar} renderItem={this.renderTabBar}
keyExtractor= {(item) => item.id} keyExtractor= {(item) => item.id}
/> />
</View> </View>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
{/* <SafeAreaView style={styles.container}>
<SectionList
sections={this.state.listMenu}
keyExtractor={item => item.id}
renderItem={({ item }) => (item={item})}
renderSectionHeader={({ section }) => (
<Text >{section.category.name}</Text>
)}
/>
</SafeAreaView> */}
<FlatList <FlatList
data={this.state.listMenu} data={this.state.listMenu}
renderItem={({ item, index }) => ( renderItem={({ item, index }) => (
......
view/ShoppingCart.js
View file @ 560b2871
...@@ -9,62 +9,6 @@ import i18n from 'i18n-js'; ...@@ -9,62 +9,6 @@ import i18n from 'i18n-js';
import CurrencyFormat from 'react-currency-format'; import CurrencyFormat from 'react-currency-format';
import Axios from 'axios' import Axios from 'axios'
class Items extends React.Component {
render() {
const { item } = this.props
// console.log('ini props nya item : ' + JSON.stringify(item))
console.log(this.props)
const { description, name, image, price, qty } = item
return (
<View style={{ flex: 1, margin: 10 }}>
<View style={{ flexDirection: 'row' }}>
<View style={{ borderRadius: 20 }}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('Menu Detail', { Foto: image, nama: name, desc: description })}>
<Image style={{ height: 100, width: 100, resizeMode: 'contain' }}
source={{
uri: image
}}
/>
</TouchableOpacity>
</View>
<View>
<View style={{ margin: 5, }}>
<Text style={{ fontWeight: 'bold', fontSize: 20 }}> Nama Menu : {name}</Text>
</View>
<Text style={{ margin: 5 }}>
Description : {description}
</Text>
<View style={{ margin: 5 }}>
<CurrencyFormat value={price} displayType={'text'}
thousandSeparator={true}
prefix={'Rp '}
renderText={value => <Text>{value}</Text>} />
</View>
<View style={{ flexDirection: 'row', margin: 5 }}>
<Text>Quantity : </Text>
<TouchableOpacity onPress={() => this.props.minusQty()}>
<AntDesign name='minuscircleo'
size={20}
color={'blue'}
/>
</TouchableOpacity>
<Text> {qty} </Text>
<TouchableOpacity onPress={() => this.props.plusQty()}>
<AntDesign name='pluscircleo'
size={20}
color={'blue'}
/>
</TouchableOpacity>
</View>
</View>
</View>
</View>
)
}
}
class ShoppingCart extends React.Component { class ShoppingCart extends React.Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -73,7 +17,9 @@ class ShoppingCart extends React.Component { ...@@ -73,7 +17,9 @@ class ShoppingCart extends React.Component {
kasproPoint: '', kasproPoint: '',
checkedBalance: false, checkedBalance: false,
checkedPoint: false, checkedPoint: false,
checkedBalancePoint: false checkedBalancePoint: false,
balanceused: 0,
pointsused: 0,
} }
} }
...@@ -92,9 +38,6 @@ class ShoppingCart extends React.Component { ...@@ -92,9 +38,6 @@ class ShoppingCart extends React.Component {
} }
} }
plusQty(item, index) { plusQty(item, index) {
this.setState({ this.setState({
...@@ -114,19 +57,26 @@ class ShoppingCart extends React.Component { ...@@ -114,19 +57,26 @@ class ShoppingCart extends React.Component {
this.setState({ this.setState({
checkedBalance: true, checkedBalance: true,
checkedPoint: false, checkedPoint: false,
checkedBalancePoint: false checkedBalancePoint: false,
balanceused: this.props.order_total,
pointsused: 0
}) })
} else if (val == 'point') { } else if (val == 'point') {
this.setState({ this.setState({
checkedBalance: false, checkedBalance: false,
checkedPoint: true, checkedPoint: true,
checkedBalancePoint: false checkedBalancePoint: false,
pointsused: this.props.order_total,
balanceused: 0
}) })
} else { } else {
this.setState({ this.setState({
checkedBalance: false, checkedBalance: false,
checkedPoint: false, checkedPoint: false,
checkedBalancePoint: true checkedBalancePoint: true,
pointsused : this.state.kasproPoint,
balanceused : this.props.order_total - this.state.kasproPoint
}) })
} }
} }
...@@ -156,7 +106,6 @@ class ShoppingCart extends React.Component { ...@@ -156,7 +106,6 @@ class ShoppingCart extends React.Component {
} }
render() { render() {
return ( return (
<ScrollView style={styles.container}> <ScrollView style={styles.container}>
<View style={{ flexDirection: 'row', justifyContent: 'center' }}> <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
...@@ -182,9 +131,10 @@ class ShoppingCart extends React.Component { ...@@ -182,9 +131,10 @@ class ShoppingCart extends React.Component {
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={styles.order}> <View style={styles.order}>
{this.props.order_item.map((item,i)=>{
return( {this.props.order_item.map((item, i) => {
<View style={{ flex: 1, margin: 10 }} key={i}> return (
<View style={{ flex: 1, margin: 10 }} key={i}>
<View style={{ flexDirection: 'row' }}> <View style={{ flexDirection: 'row' }}>
<View > <View >
<Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image> <Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image>
...@@ -198,11 +148,11 @@ class ShoppingCart extends React.Component { ...@@ -198,11 +148,11 @@ class ShoppingCart extends React.Component {
<TouchableOpacity onPress={() => this.props.handleMin()}> <TouchableOpacity onPress={() => this.props.handleMin()}>
<Text style={{ fontSize: 20, margin: 2 }}> - </Text> <Text style={{ fontSize: 20, margin: 2 }}> - </Text>
</TouchableOpacity> </TouchableOpacity>
<TextInput <TextInput
style={{ height: 25, padding: 2,textAlign:'center',margin:2 }} style={{ height: 25, padding: 2, textAlign: 'center', margin: 2 }}
autoCapitalize="none"> autoCapitalize="none">
{item.quantity} {item.quantity}
</TextInput> </TextInput>
<TouchableOpacity onPress={() => this.props.handleAdd()}> <TouchableOpacity onPress={() => this.props.handleAdd()}>
<Text style={{ fontSize: 20, margin: 2 }}> + </Text> <Text style={{ fontSize: 20, margin: 2 }}> + </Text>
</TouchableOpacity> </TouchableOpacity>
...@@ -211,70 +161,150 @@ class ShoppingCart extends React.Component { ...@@ -211,70 +161,150 @@ class ShoppingCart extends React.Component {
</View> </View>
</View> </View>
</View> </View>
)
})} )
})}
</View> </View>
<View style={styles.payment}> <View style={styles.payment}>
<Text>PAYMENT METHODS</Text> <Text>PAYMENT METHODS</Text>
</View> </View>
<View style={{ alignItems: 'center' }}> <View style={{ alignItems: 'center' }}>
<Card style={{ margin: 5, padding: 10 }}> {
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}> this.state.kasproBalance < this.props.order_total ? (
<View> <Card style={{ margin: 5, padding: 10, backgroundColor: 'gray' }}>
<Text>EXCELSO BALANCE</Text> <View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<Text style={{ color: 'gray' }}>Your Balance : IDR {this.state.kasproBalance}</Text> <View>
</View> <Text>EXCELSO BALANCE</Text>
<View style={{ paddingRight: 10 }}> </View>
<CheckBox <View style={{ paddingRight: 10 }}>
onClick={() => { <FontAwesome name='circle-o' size={30} color={'#ccb46c'} />
this.checkedSelection('balance') </View>
}} </View>
isChecked={this.state.checkedBalance} </Card>
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />} ) : (
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />} <TouchableOpacity onPress={() => {
/> this.checkedSelection('balance')
</View> }}>
</View> <Card style={{ margin: 5, padding: 10 }}>
</Card> <View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO BALANCE</Text>
</View>
<View style={{ paddingRight: 10 }}>
<CheckBox
onClick={() => {
this.checkedSelection('balance')
}}
isChecked={this.state.checkedBalance}
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />}
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />}
/>
</View>
</View>
</Card>
</TouchableOpacity>
)
}
</View>
<View style={{ alignItems: 'center' }}>
{
this.state.kasproPoint < this.props.order_total ? (
<Card style={{ margin: 5, padding: 10, backgroundColor: 'gray' }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO POINTS</Text>
</View>
<View style={{ paddingRight: 10 }}>
<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />
</View>
</View>
</Card>
) : (
<TouchableOpacity onPress={() => {
this.checkedSelection('point')
}}>
<Card style={{ margin: 5, padding: 10 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO POINTS</Text>
</View>
<View style={{ paddingRight: 10 }}>
<CheckBox
onClick={() => {
this.checkedSelection('point')
}}
isChecked={this.state.checkedPoint}
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />}
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />}
/>
</View>
</View>
</Card>
</TouchableOpacity>
)
}
</View> </View>
<View style={{ alignItems: 'center' }}> <View style={{ alignItems: 'center' }}>
{
this.state.kasproPoint + this.state.kasproBalance >= this.props.order_total && this.state.kasproBalance != 0 ? (
<TouchableOpacity onPress={() => {
this.checkedSelection('balancepoint')
}}>
<Card style={{ margin: 5, padding: 10 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO BALANCE + POINTS</Text>
</View>
<View style={{ paddingRight: 10 }}>
<CheckBox
onClick={() => {
this.checkedSelection('balancepoint')
}}
isChecked={this.state.checkedBalancePoint}
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />}
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />}
/>
</View>
</View>
</Card>
</TouchableOpacity>
) : (
<Card style={{ margin: 5, padding: 10, backgroundColor: 'gray' }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO BALANCE + POINTS</Text>
</View>
<View style={{ paddingRight: 10 }}>
<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />
</View>
</View>
</Card>
)
}
</View>
<View style={{ alignItems: 'center', }}>
<Card style={{ margin: 5, padding: 10 }}> <Card style={{ margin: 5, padding: 10 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}> <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 5 }}>
<View> <View>
<Text>EXCELSO POINTS</Text> <Text>Your Balance</Text>
<Text style={{ color: 'gray' }}>Your Points : IDR {this.state.kasproPoint}</Text> <Text>Your Points</Text>
</View> </View>
<View style={{ paddingRight: 10 }}> <View style={{ paddingRight: 30, alignItems: 'flex-end' }}>
<CheckBox <Text>{this.state.kasproBalance}</Text>
onClick={() => { <Text>{this.state.kasproPoint}</Text>
this.checkedSelection('point')
}}
isChecked={this.state.checkedPoint}
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />}
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />}
/>
</View> </View>
</View> </View>
</Card> <View style={{ flexDirection: 'row', justifyContent: 'space-between', borderTopWidth: 1 }}>
</View> <View style={{ marginTop: 5 }}>
<View style={{ alignItems: 'center' }}> <Text>Your Balance Used</Text>
<Card style={{ margin: 5, padding: 10 }}> <Text>Your Points Used</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text>EXCELSO BALANCE + EXCELSO POINTS</Text>
<Text style={{ color: 'gray' }}>Your Balance : IDR {this.state.kasproBalance}</Text>
<Text style={{ color: 'gray' }}>Your Points : IDR {this.state.kasproPoint}</Text>
</View> </View>
<View style={{ paddingRight: 10 }}> <View style={{ paddingRight: 30, marginTop: 5, alignItems: 'flex-end' }}>
<CheckBox <Text>- {this.state.balanceused}</Text>
onClick={() => { <Text>- {this.state.pointsused}</Text>
this.checkedSelection('balancepoint')
}}
isChecked={this.state.checkedBalancePoint}
checkedImage={<FontAwesome name='check-circle' size={30} color={'#ccb46c'} />}
unCheckedImage={<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />}
/>
</View> </View>
</View> </View>
</Card> </Card>
...@@ -296,7 +326,8 @@ class ShoppingCart extends React.Component { ...@@ -296,7 +326,8 @@ class ShoppingCart extends React.Component {
<Text style={{ paddingLeft: 20, paddingTop: 15, color: 'gray' }}>Harga</Text> <Text style={{ paddingLeft: 20, paddingTop: 15, color: 'gray' }}>Harga</Text>
</View> </View>
<View> <View>
<Text style={{ paddingRight: 150, paddingTop: 15, color: 'gray' }}>{this.props.order_total}</Text>
<Text style={{ paddingRight: 150, paddingTop: 15, color: 'gray' }}>{this.props.order_total}</Text>
</View> </View>
</View> </View>
<View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}> <View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}>
...@@ -320,7 +351,8 @@ class ShoppingCart extends React.Component { ...@@ -320,7 +351,8 @@ class ShoppingCart extends React.Component {
<Text style={{ fontSize: 35, color: '#ccb46c' }}>Total</Text> <Text style={{ fontSize: 35, color: '#ccb46c' }}>Total</Text>
</View> </View>
<View style={{ marginTop: 15, paddingRight: 60, paddingTop: 10 }}> <View style={{ marginTop: 15, paddingRight: 60, paddingTop: 10 }}>
<Text style={{ fontSize: 35, color: '#ccb46c' }}>{this.props.order_total}</Text>
<Text style={{ fontSize: 35, color: '#ccb46c' }}>{this.props.order_total}</Text>
</View> </View>
</View> </View>
<View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}> <View style={{ flexDirection: 'row', marginTop: 10, justifyContent: 'space-between' }}>
...@@ -362,6 +394,7 @@ const styles = StyleSheet.create({ ...@@ -362,6 +394,7 @@ const styles = StyleSheet.create({
order: { order: {
flex: 1, flex: 1,
margin: 10, margin: 10,
backgroundColor: '#fff'
}, },
payment: { payment: {
......
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