Commit 58168b2a authored by Trisno's avatar Trisno

update design upgrade premium

parent e3758eea
......@@ -299,7 +299,20 @@ class Auth extends React.Component {
}} />
<Stack.Screen name="Register" component={Register} />
<Stack.Screen name="Email Confirmation" component={EmailConfirmation} />
<Stack.Screen name="Upgrade Premium" component={UpgradePremium} />
<Stack.Screen name="Upgrade Premium" component={UpgradePremium}
options={{
headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center',
headerTintColor: '#fff',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 18,
color: 'white',
textAlign: 'center'
}, title: 'Upgrade Premium'
}} />
<Stack.Screen name="Camera" component={Cameras} />
<Stack.Screen name="Delivery Address" component={DeliveryAddress} options={{
headerStyle: { backgroundColor: '#CFB368' },
......@@ -386,19 +399,19 @@ class Auth extends React.Component {
/>
<Stack.Screen name="Order Detail" component={OrderDetail} options={({ navigation, route }) => ({
headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center',
headerTintColor: '#fff',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 18,
color: 'white',
textAlign: 'center'
},
title: 'Reward History',
headerLeft: props => <HeaderBackButton {...props} onPress={() => navigation.navigate('Home', { screen: 'ORDER' })} />,
headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center',
headerTintColor: '#fff',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 18,
color: 'white',
textAlign: 'center'
},
title: 'Reward History',
headerLeft: props => <HeaderBackButton {...props} onPress={() => navigation.navigate('Home', { screen: 'ORDER' })} />,
})} />
......@@ -487,19 +500,19 @@ class Auth extends React.Component {
{/* <Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> */}
<Stack.Screen name="News Detail" component={NewsDetail} options={{ headerShown: false }} />
<Stack.Screen name="Confirm Your Order" component={MenuConfirmation}
options={{
headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff',
headerTitleAlign: 'center',
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 18,
},
title: 'Confirm Your Order'
}} />
<Stack.Screen name="Confirm Your Order" component={MenuConfirmation}
options={{
headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff',
headerTitleAlign: 'center',
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 18,
},
title: 'Confirm Your Order'
}} />
<Stack.Screen name="Date Time" component={DateTime} />
<Stack.Screen name="New Register" component={NewRegister}
options={{
......
......@@ -44,11 +44,11 @@ class UpgradePremium extends React.Component {
id_type: 'KTP',
id_value: '',
nationality: '',
provinces : [],
provinces: [],
hasPermissions: null,
type: Camera.Constants.Type.back,
uri_id : this.props.URI,
uri_selfie : this.props.URI_IDCARD,
uri_id: this.props.URI,
uri_selfie: this.props.URI_IDCARD,
spinner: false
}
}
......@@ -95,7 +95,7 @@ class UpgradePremium extends React.Component {
})
}
getProvince(){
getProvince() {
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/member/get_province').then(res => {
let dataProv = res.data.data
// console.log('ini res nya prov : ' + JSON.stringify(dataProv))
......@@ -111,7 +111,7 @@ class UpgradePremium extends React.Component {
}
this.setState({
provinces : list_prov
provinces: list_prov
})
// console.log('ini hasilnya : ' + JSON.stringify(this.state.provinces))
})
......@@ -121,8 +121,8 @@ class UpgradePremium extends React.Component {
this.setState({
spinner: true,
})
const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie,{encoding: FileSystem.EncodingType.Base64 });
const URI_IDCARD = await FileSystem.readAsStringAsync(this.state.uri_id,{ encoding: FileSystem.EncodingType.Base64 });
const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie, { encoding: FileSystem.EncodingType.Base64 });
const URI_IDCARD = await FileSystem.readAsStringAsync(this.state.uri_id, { encoding: FileSystem.EncodingType.Base64 });
// const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie,{encoding:'base64'});
let params = {
session_id: this.props.session_id,
......@@ -159,12 +159,12 @@ class UpgradePremium extends React.Component {
navigation.reset({
index: 0,
routes: [
{
name: 'Home',
params: { someParam: 'Param1' },
},
{
name: 'Home',
params: { someParam: 'Param1' },
},
],
})
})
}).catch(error => {
let response = error.response.data;
Alert.alert(
......@@ -177,11 +177,11 @@ class UpgradePremium extends React.Component {
this.props.navigation.reset({
index: 0,
routes: [
{
name: 'Home',
},
{
name: 'Home',
},
],
})
})
})
}
......@@ -194,54 +194,59 @@ class UpgradePremium extends React.Component {
textStyle={styles.spinnerTextStyle}
/>
<ScrollView>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Nama Depan</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Nama Depan</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(nama_depan) => this.setState({ nama_depan })}
value={this.state.nama_depan}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Nama Belakang</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Nama Belakang</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(nama_belakang) => this.setState({ nama_belakang })}
value={this.state.nama_belakang}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Tempat Lahir</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Tempat Lahir</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(tempat_lahir) => this.setState({ tempat_lahir })}
value={this.state.tempat_lahir}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Alamat Permanen</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Alamat Permanen</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 90, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput2}
onChangeText={(alamat_permanent) => this.setState({ alamat_permanent })}
value={this.state.alamat_permanent}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Provinsi</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Provinsi</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(region) => this.setState({ region })}
value={this.state.region}
textAlign='center'
/>
{/* <RNPickerSelect
value={this.state.region}
......@@ -249,14 +254,15 @@ class UpgradePremium extends React.Component {
onValueChange={(value) => this.setState({ region : value})}
items= {this.state.provinces} /> */}
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Kota</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kota</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(city) => this.setState({ city })}
value={this.state.city}
textAlign='center'
/>
{/* <RNPickerSelect
value={this.state.city}
......@@ -264,34 +270,36 @@ class UpgradePremium extends React.Component {
onValueChange={(value) => this.setState({ city : value})}
items= {this.state.provinces} /> */}
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Kecamatan</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kecamatan</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(district) => this.setState({ district })}
value={this.state.district}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Kelurahan</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kelurahan</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(village) => this.setState({ village })}
value={this.state.village}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Pekerjaan</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Pekerjaan</Text>
</View>
<View style={{ margin: 10, borderColor: 'gray', borderWidth: 1 }}>
<View style={{ marginHorizontal: 40, borderColor: 'gray', borderWidth: 1, borderRadius: 10, top: 10 }}>
<Picker
mode="dropdown"
selectedValue={this.state.pekerjaan}
style={{ height: 40 }}
style={{ height: 40, width: '100%' }}
onValueChange={(itemValue, itemIndex) => this.setState({ pekerjaan: itemValue })}>
{jobs.map((itemValue, itemIndex) => {
return (<Picker.Item label={itemValue} value={itemValue} key={itemIndex} />)
......@@ -299,71 +307,79 @@ class UpgradePremium extends React.Component {
</Picker>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>KTP</Text>
<View style={styles.textLabel, { top: 20 }}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>KTP</Text>
</View>
<View style={{ margin: 10 }}>
<View style={{ margin: 10, marginTop: 23 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(id_value) => this.setState({ id_value })}
value={this.state.id_value}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Kebangsaan</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kebangsaan</Text>
</View>
<View style={{ margin: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
style={styles.textInput}
onChangeText={(nationality) => this.setState({ nationality })}
value={this.state.nationality}
textAlign='center'
/>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Upload Foto Diri</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Upload Foto Diri</Text>
</View>
<View style={{ margin: 10 }}>
<TouchableOpacity onPress={() => this.takePictureSelfie()}>
<View style={{ height: 90, borderColor: 'gray', borderWidth: 1 }}>
<View style={{ height: 90, borderColor: 'gray', borderWidth: 1, borderRadius: 10, marginHorizontal: 30 }}>
{
this.props.URI === '' ?(
this.props.URI === '' ? (
null
):(
) : (
<Image
style={{ width: 90, height: 80, alignSelf: 'center', }}
source={{ uri: this.props.URI }}
/>
)
<Image
style={{ width: 90, height: 80, alignSelf: 'center', }}
source={{ uri: this.props.URI }}
/>
)
}
</View>
</TouchableOpacity>
</View>
<View style={{ marginRight: 10, marginLeft: 10 }}>
<Text style={{ top: 5 }}>Upload Foto KTP</Text>
<View style={styles.textLabel}>
<Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Upload Foto KTP</Text>
</View>
<View style={{ margin: 10 }}>
<TouchableOpacity onPress={() => this.takePictureIdcard()}>
<View style={{ height: 90, borderColor: 'gray', borderWidth: 1 }}>
<View style={{ height: 90, borderColor: 'gray', borderWidth: 1, borderRadius: 10, marginHorizontal: 30 }}>
{
this.props.URI_IDCARD === '' ? (
null
):(
<Image
style={{ width: 90, height: 80, alignSelf: 'center', }}
source={{ uri: this.props.URI_IDCARD }}
/>
)
) : (
<Image
style={{ width: 90, height: 80, alignSelf: 'center', }}
source={{ uri: this.props.URI_IDCARD }}
/>
)
}
</View>
</TouchableOpacity>
</View>
<View style={{ marginRight: 10, marginLeft: 10, marginBottom: 15 }}>
<TouchableOpacity onPress={() => this.handlePremium()}>
<View style={styles.button}>
<Text style={{ color: 'white', fontWeight: 'bold', fontSize: 22 }}>Upgrade Premium</Text>
</View>
</TouchableOpacity>
<View style={{height:30}}/>
{/* <View style={{ marginRight: 10, marginLeft: 10, marginBottom: 15 }}>
<Button
title="Upgrade Premium"
onPress={() => this.handlePremium()}
/>
</View>
</View> */}
</ScrollView>
</View>
)
......@@ -375,7 +391,35 @@ const styles = StyleSheet.create({
flex: 1,
backgroundColor: 'white'
}
},
textLabel: {
marginRight: 10,
marginLeft: 10,
top: 5
},
textInput: {
height: 40,
borderColor: 'gray',
borderWidth: 1,
marginHorizontal: 30,
borderRadius: 10
},
textInput2: {
height: 90,
borderColor: 'gray',
borderWidth: 1,
marginHorizontal: 30,
borderRadius: 10
},
button: {
backgroundColor: '#CFB368',
marginTop: 25,
marginHorizontal: 50,
borderRadius: 15,
paddingVertical: 5,
alignItems: 'center',
justifyContent: 'center'
},
})
const mapDispatchToProps = (dispacth) => {
......
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