Skip to content

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

update use balance

parent 729e7c9a
Hide whitespace changes
Inline Side-by-side
Showing with 379 additions and 52 deletions
view/Auth.js
View file @ 26b1db78
...@@ -437,7 +437,7 @@ class Auth extends React.Component { ...@@ -437,7 +437,7 @@ class Auth extends React.Component {
}, title: 'RATING ORDER' }, title: 'RATING ORDER'
}} }}
/> />
<Stack.Screen name="UseBalance" component={UseBalance} <Stack.Screen name="UseBalance" component={UseBalance}
options={{ options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' }, headerTitleContainerStyle: { alignContent: 'center' },
...@@ -452,7 +452,7 @@ class Auth extends React.Component { ...@@ -452,7 +452,7 @@ class Auth extends React.Component {
}, title: 'USE BALANCE' }, title: 'USE BALANCE'
}} }}
/> />
<Stack.Screen name="PaymentCode" component={PaymentCode} <Stack.Screen name="PaymentCode" component={PaymentCode}
options={{ options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' }, headerTitleContainerStyle: { alignContent: 'center' },
...@@ -523,7 +523,19 @@ class Auth extends React.Component { ...@@ -523,7 +523,19 @@ class Auth extends React.Component {
{/* <Stack.Screen name="Card Activation" component={CardActivation} /> */} {/* <Stack.Screen name="Card Activation" component={CardActivation} /> */}
<Stack.Screen name="Confirm Mobile" component={ConfirmMobile} /> <Stack.Screen name="Confirm Mobile" component={ConfirmMobile} />
<Stack.Screen name="Balance" component={Balance} /> <Stack.Screen name="Balance" component={Balance} />
<Stack.Screen name="Redeem Code" component={RedeemCode} /> <Stack.Screen name="Redeem Code" component={RedeemCode}
options={{
headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff',
headerTitleAlign: 'center',
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 20,
},
title: 'REDEEM CODE'
}} />
<Stack.Screen name="Transaction History" component={TransactionHistory} <Stack.Screen name="Transaction History" component={TransactionHistory}
options={{ options={{
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
......
view/RedeemCode.js
View file @ 26b1db78
import React from 'react'; import React from 'react';
import { View, Text, TextInput, StyleSheet, Button } from 'react-native'; import { View, Text, TextInput, StyleSheet, Button, TouchableOpacity, Alert, } from 'react-native';
import { connect } from 'react-redux';
import Axios from 'axios';
class RedeemCode extends React.Component {
constructor(props) {
super(props);
this.state = {
}
}
cancel() {
let params = {
session_id: this.props.session_id,
}
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/refund', params).then(res => {
console.log(res.data)
Alert.alert('', 'Berhasil dibatalkan')
this.props.navigation.navigate('Home', { screen: 'HOME' });
}).catch(error => {
let response = error.response.data
if (response.code === "EMPTY_PIN") {
Alert.alert('Error', response.msg)
} else {
let response = error.response.data;
Alert.alert('', response.msg);
}
})
}
export default class RedeemCode extends React.Component {
render() { render() {
console.log(this.props)
return ( return (
<View style={styles.container}> <View style={styles.container}>
<View style={styles.header}> {/* <View style={styles.header}>
<Text style={{ textAlign: 'center', fontSize: 25 }}>Payment Code</Text> <Text style={{ textAlign: 'center', fontSize: 25 }}>Payment Code</Text>
</View> </View> */}
<View> <View style={{ marginTop: 50 }}>
<Text style={{ fontSize: 25, textAlign: 'center' }}>XY2313</Text> <Text style={{ fontFamily: 'Gotham-Black', color: '#838383', fontSize: 26, textAlign: 'center' }}>{this.props.route.params.redeemCode}</Text>
<View style={{ borderWidth: 1, marginRight: 20, marginLeft: 20 }}></View> <View style={{ borderWidth: 1, marginRight: 20, marginLeft: 20, borderColor: '#838383' }}></View>
</View> </View>
<View style={styles.body}> <View style={styles.body}>
<View style={styles.current_balance}> <View style={styles.current_balance}>
<View style={{ flex: 1, margin: 10 }}> <View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20 }} >Current Balance</Text> <Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', color: '#838383' }} >Balance</Text>
</View> </View>
<View style={{ flex: 1, margin: 10 }}> <View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20 }}>xxxxxxxxxxx</Text> <Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', color: '#838383' }}>{this.props.route.params.balanceUsed}</Text>
</View> </View>
</View> </View>
<View style={styles.redeem}> <View style={styles.current_balance}>
<View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', color: '#838383' }} >Points</Text>
</View>
<View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Black', color: '#838383' }}>{this.props.route.params.pointUsed}</Text>
</View>
</View>
{/* <View style={styles.redeem}>
<View style={{ flex: 1, margin: 10 }}> <View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20 }} >Time</Text> <Text style={{ fontSize: 20 }} >Time</Text>
</View> </View>
<View style={{ flex: 1, margin: 10 }}> <View style={{ flex: 1, margin: 10 }}>
<Text style={{ fontSize: 20 }}>0:30</Text> <Text style={{ fontSize: 20 }}>0:30</Text>
</View> </View>
</View> </View> */}
<View style={styles.button}> <TouchableOpacity onPress={() => this.cancel()}>
<Button title="Cancel Payment" color="red" /> <View style={styles.button}>
</View> <Text style={{ color: 'white', fontSize: 16, fontFamily: 'Gotham-Black' }}>Cancel Payment</Text>
</View>
</TouchableOpacity>
</View> </View>
</View> </View>
) )
...@@ -69,9 +112,22 @@ const styles = StyleSheet.create({ ...@@ -69,9 +112,22 @@ const styles = StyleSheet.create({
button: { button: {
height: 50, backgroundColor: '#d34343',
margin: 10, height: 40,
marginTop: 25,
marginHorizontal: 20,
borderRadius: 10,
paddingVertical: 5,
alignItems: 'center',
justifyContent: 'center'
},
})
const mapStateToProps = (state) => {
return {
session_id: state.session_id,
} }
}
}) export default connect(mapStateToProps)(RedeemCode);
\ No newline at end of file \ No newline at end of file
view/UseBalance.js
View file @ 26b1db78
...@@ -2,6 +2,9 @@ import React from 'react'; ...@@ -2,6 +2,9 @@ import React from 'react';
import { View, Text, TextInput, StyleSheet, Button, Alert, TouchableOpacity, Image, Modal } from 'react-native'; import { View, Text, TextInput, StyleSheet, Button, Alert, TouchableOpacity, Image, Modal } from 'react-native';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import Axios from 'axios'; import Axios from 'axios';
import { Card } from 'react-native-shadow-cards'
import CheckBox from 'react-native-check-box'
import { Entypo, Ionicons, MaterialCommunityIcons, MaterialIcons, AntDesign, FontAwesome } from '@expo/vector-icons'
import ActionType from '../redux/globalActionType'; import ActionType from '../redux/globalActionType';
import Spinner from 'react-native-loading-spinner-overlay'; import Spinner from 'react-native-loading-spinner-overlay';
import PinRequest from './PinRequest' import PinRequest from './PinRequest'
...@@ -11,12 +14,21 @@ class UseBalance extends React.Component { ...@@ -11,12 +14,21 @@ class UseBalance extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
kasproBalance: 0,
kasproPoint: 0,
current_balance: 0, current_balance: 0,
kaspro_point: 0, kaspro_point: 0,
input_redeem: 0,
redeem_balance: 0, redeem_balance: 0,
redeem_point: 0, redeem_point: 0,
modalVisible: false, modalVisible: false,
pin: '' pin: '',
checkedBalance: false,
checkedPoint: false,
checkedBalancePoint: false,
balanceused: 0,
pointsused: 0,
} }
} }
...@@ -30,7 +42,7 @@ class UseBalance extends React.Component { ...@@ -30,7 +42,7 @@ class UseBalance extends React.Component {
} }
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/member/get_profile', params).then(res => { Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/member/get_profile', params).then(res => {
console.log('ini res ' + JSON.stringify(res.data)) // console.log('ini res ' + JSON.stringify(res.data))
const dataCard = res.data const dataCard = res.data
...@@ -41,16 +53,42 @@ class UseBalance extends React.Component { ...@@ -41,16 +53,42 @@ class UseBalance extends React.Component {
this.setState({ this.setState({
current_balance: balances, current_balance: dataCard.kaspro_balance,
kaspro_point: points kaspro_point: dataCard.kaspro_point,
kasproBalance: dataCard.kaspro_balance.replace(/,/g, ''),
kasproPoint: dataCard.kaspro_point.replace(/,/g, '')
}) })
// console.log(this.state.kasproBalance)
// console.log(this.state.kasproPoint)
}).catch(error => { }).catch(error => {
// console.log('ini error ' + error) // console.log('ini error ' + error)
}) })
} }
checkedSelection(val) {
// console.log(val)
if (val == 'balance') {
this.setState({
checkedBalance: true,
checkedPoint: false,
checkedBalancePoint: false,
})
} else if (val == 'point') {
this.setState({
checkedBalance: false,
checkedPoint: true,
checkedBalancePoint: false,
})
} else {
this.setState({
checkedBalance: false,
checkedPoint: false,
checkedBalancePoint: true,
})
}
}
handleBack() { handleBack() {
this.setState({ this.setState({
modalVisible: false modalVisible: false
...@@ -71,34 +109,126 @@ class UseBalance extends React.Component { ...@@ -71,34 +109,126 @@ class UseBalance extends React.Component {
} }
redeem() { redeem() {
if (this.state.redeem_balance > this.state.current_balance) {
Alert.alert('', 'Maaf Balance tidak cukup') if (this.state.checkedBalance == false && this.state.checkedPoint == false && this.state.checkedBalancePoint == false) {
} else if (this.state.redeem_point > this.state.kaspro_point) { Alert.alert('Error', 'Silahkan pilih metode pembayaran')
Alert.alert('', 'Maaf Point tidak cukup')
} else { } else {
let params = { if (this.state.checkedBalance) {
session_id: this.props.session_id, if (parseInt(this.state.input_redeem) > parseInt(this.state.kasproBalance)) {
pin: this.state.pin, Alert.alert('', 'Maaf Balance tidak cukup')
balance: this.state.redeem_balance, } else {
point: this.state.redeem_point let params = {
} session_id: this.props.session_id,
pin: this.state.pin,
balance: this.state.input_redeem,
point: 0
}
// console.log(params)
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/redeem', params).then(res => {
// console.log(res.data)
let respon = res.data
Alert.alert('', 'Sukses Redeem')
this.props.navigation.navigate('Redeem Code', {redeemCode : respon.redeem_code,
balanceUsed : respon.use_balance,
pointUsed : respon.use_point})
}).catch(error => {
let response = error.response.data
if (response.code === "EMPTY_PIN") {
Alert.alert('Error', response.msg)
} else {
let response = error.response.data;
Alert.alert('', response.msg);
}
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/redeem', params).then(res => { })
Alert.alert('', 'Sukses Redeem') }
}).catch(error => { } else if (this.state.checkedPoint) {
let response = error.response.data if (parseInt(this.state.input_redeem) > parseInt(this.state.kasproPoint)) {
if (response.code === "EMPTY_PIN") { Alert.alert('', 'Maaf Point tidak cukup')
this.modal()
} else { } else {
let response = error.response.data; let params = {
Alert.alert('', response.msg); session_id: this.props.session_id,
pin: this.state.pin,
balance: 0,
point: this.state.input_redeem
}
console.log(params)
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/redeem', params).then(res => {
Alert.alert('', 'Sukses Redeem')
}).catch(error => {
let response = error.response.data
if (response.code === "EMPTY_PIN") {
Alert.alert('Error', response.msg)
} else {
let response = error.response.data;
Alert.alert('', response.msg);
}
})
} }
} else {
if (parseInt(this.state.input_redeem) > parseInt(parseInt(this.state.kasproPoint) + parseInt(this.state.kasproBalance))) {
Alert.alert('', 'Maaf Balance dan Point tidak cukup')
} else {
let params = {
session_id: this.props.session_id,
pin: this.state.pin,
balance: 0,
point: this.state.kasproPoint
}
console.log(params)
}) Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/redeem', params).then(res => {
Alert.alert('', 'Sukses Redeem')
}).catch(error => {
let response = error.response.data
if (response.code === "EMPTY_PIN") {
Alert.alert('Error', response.msg)
} else {
let response = error.response.data;
Alert.alert('', response.msg);
}
})
}
}
// if (parseInt(this.state.input_redeem) > parseInt(this.state.kasproBalance)) {
// Alert.alert('', 'Maaf Balance tidak cukup')
// } else if (parseInt(this.state.input_redeem) > parseInt(this.state.kasproPoint)) {
// Alert.alert('', 'Maaf Point tidak cukup')
// } else {
// let params = {
// session_id: this.props.session_id,
// pin: this.state.pin,
// balance: this.state.input_redeem,
// point: 0
// }
// console.log(params)
// Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/point/redeem', params).then(res => {
// Alert.alert('', 'Sukses Redeem')
// }).catch(error => {
// let response = error.response.data
// if (response.code === "EMPTY_PIN") {
// Alert.alert('Error', response.msg)
// } else {
// let response = error.response.data;
// Alert.alert('', response.msg);
// }
// })
// }
} }
} }
render() { render() {
// console.log(parseInt(this.state.input_redeem) > parseInt(parseInt(this.state.kasproPoint) + parseInt(this.state.kasproBalance)))
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Modal animationType="slide" <Modal animationType="slide"
...@@ -143,15 +273,144 @@ class UseBalance extends React.Component { ...@@ -143,15 +273,144 @@ class UseBalance extends React.Component {
</Modal> </Modal>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<View style={{ flex: 1, marginRight: 30, marginLeft: 30, top: 50 }}> <View style={{ flex: 1, marginRight: 30, marginLeft: 30, top: 50 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3 }}>Current Balance</Text> <Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3 }}>Balance</Text>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10, borderRadius: 10, borderColor: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', color: 'grey', fontWeight: 'bold', fontSize: 20 }}
<Text style={{ fontFamily: 'Gotham-Black', color: '#838383', fontSize: 18, textAlign: 'center', margin: 1 }}>IDR {this.state.current_balance}</Text>
<Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3, marginTop: 10 }}>Points</Text>
<Text style={{ fontFamily: 'Gotham-Black', color: '#838383', fontSize: 18, textAlign: 'center', margin: 1 }}>IDR {this.state.kaspro_point}</Text>
{/* <TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10, borderRadius: 10, borderColor: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', color: 'grey', fontWeight: 'bold', fontSize: 20 }}
onChangeText={(redeem_balance) => this.setState({ redeem_balance })} onChangeText={(redeem_balance) => this.setState({ redeem_balance })}
keyboardType='numeric'>{this.state.current_balance}</TextInput> keyboardType='numeric'>{this.state.current_balance}</TextInput> */}
<Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3 }}>Redeem</Text>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10, borderRadius: 10, borderColor: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', color: 'grey', fontWeight: 'bold', fontSize: 20 }} <Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3, marginTop: 10 }}>Redeem</Text>
onChangeText={(redeem_point) => this.setState({ redeem_point })} <TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 3, marginBottom: 20, borderRadius: 10, borderColor: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', color: 'grey', fontWeight: 'bold', fontSize: 20 }}
onChangeText={(input_redeem) => this.setState({ input_redeem })}
placeholder='0'
placeholderTextColor='#838383'
autoCapitalize="none" autoCapitalize="none"
keyboardType='numeric'>{this.state.kaspro_point}</TextInput> keyboardType='numeric' />
<View style={{ alignItems: 'center' }}>
{
this.state.input_redeem == 0 ? (
<Card style={{ margin: 5, padding: 10, backgroundColor: 'gray' }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'white' }}>EXCELSO BALANCE</Text>
</View>
<View>
<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />
</View>
</View>
</Card>
) : (
<TouchableOpacity onPress={() => {
this.checkedSelection('balance')
}}>
<Card style={{ margin: 5, padding: 10 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'grey' }}>EXCELSO BALANCE</Text>
</View>
<View>
<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.input_redeem == 0 ? (
<Card style={{ margin: 5, padding: 10, backgroundColor: 'gray' }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'white' }}>EXCELSO POINTS</Text>
</View>
<View>
<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 style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'grey' }}>EXCELSO POINTS</Text>
</View>
<View>
<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 style={{ alignItems: 'center' }}>
{
this.state.input_redeem != 0 ? (
<TouchableOpacity onPress={() => {
this.checkedSelection('balancepoint')
}}>
<Card style={{ margin: 5, padding: 10 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<View>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'grey' }}>EXCELSO BALANCE + POINTS</Text>
</View>
<View>
<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 style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: 'white' }}>EXCELSO BALANCE + POINTS</Text>
</View>
<View>
<FontAwesome name='circle-o' size={30} color={'#ccb46c'} />
</View>
</View>
</Card>
)
}
</View>
<TouchableOpacity style={{ height: 100 }} onPress={() => this.redeem()}> <TouchableOpacity style={{ height: 100 }} onPress={() => this.redeem()}>
<View style={{ backgroundColor: '#CFB368', height: 40, top: 20, borderRadius: 10, marginRight: 50, marginLeft: 50 }}> <View style={{ backgroundColor: '#CFB368', height: 40, top: 20, borderRadius: 10, marginRight: 50, marginLeft: 50 }}>
<Text style={{ alignSelf: 'center', top: 10, color: 'white', fontFamily: 'Gotham-Black', fontSize: 20 }}>REDEEM</Text> <Text style={{ alignSelf: 'center', top: 10, color: 'white', fontFamily: 'Gotham-Black', fontSize: 20 }}>REDEEM</Text>
...@@ -159,7 +418,7 @@ class UseBalance extends React.Component { ...@@ -159,7 +418,7 @@ class UseBalance extends React.Component {
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
</View> </View >
) )
} }
} }
......
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