Skip to content

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

update design upgrade premium

parent e3758eea
Show whitespace changes
Inline Side-by-side
Showing with 157 additions and 100 deletions
view/Auth.js
View file @ 58168b2a
...@@ -299,7 +299,20 @@ class Auth extends React.Component { ...@@ -299,7 +299,20 @@ class Auth extends React.Component {
}} /> }} />
<Stack.Screen name="Register" component={Register} /> <Stack.Screen name="Register" component={Register} />
<Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> <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="Camera" component={Cameras} />
<Stack.Screen name="Delivery Address" component={DeliveryAddress} options={{ <Stack.Screen name="Delivery Address" component={DeliveryAddress} options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
......
view/UpgradePremium.js
View file @ 58168b2a
...@@ -44,11 +44,11 @@ class UpgradePremium extends React.Component { ...@@ -44,11 +44,11 @@ class UpgradePremium extends React.Component {
id_type: 'KTP', id_type: 'KTP',
id_value: '', id_value: '',
nationality: '', nationality: '',
provinces : [], provinces: [],
hasPermissions: null, hasPermissions: null,
type: Camera.Constants.Type.back, type: Camera.Constants.Type.back,
uri_id : this.props.URI, uri_id: this.props.URI,
uri_selfie : this.props.URI_IDCARD, uri_selfie: this.props.URI_IDCARD,
spinner: false spinner: false
} }
} }
...@@ -95,7 +95,7 @@ class UpgradePremium extends React.Component { ...@@ -95,7 +95,7 @@ class UpgradePremium extends React.Component {
}) })
} }
getProvince(){ getProvince() {
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/member/get_province').then(res => { Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/member/get_province').then(res => {
let dataProv = res.data.data let dataProv = res.data.data
// console.log('ini res nya prov : ' + JSON.stringify(dataProv)) // console.log('ini res nya prov : ' + JSON.stringify(dataProv))
...@@ -111,7 +111,7 @@ class UpgradePremium extends React.Component { ...@@ -111,7 +111,7 @@ class UpgradePremium extends React.Component {
} }
this.setState({ this.setState({
provinces : list_prov provinces: list_prov
}) })
// console.log('ini hasilnya : ' + JSON.stringify(this.state.provinces)) // console.log('ini hasilnya : ' + JSON.stringify(this.state.provinces))
}) })
...@@ -121,8 +121,8 @@ class UpgradePremium extends React.Component { ...@@ -121,8 +121,8 @@ class UpgradePremium extends React.Component {
this.setState({ this.setState({
spinner: true, spinner: true,
}) })
const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie,{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_IDCARD = await FileSystem.readAsStringAsync(this.state.uri_id, { encoding: FileSystem.EncodingType.Base64 });
// const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie,{encoding:'base64'}); // const URI = await FileSystem.readAsStringAsync(this.state.uri_selfie,{encoding:'base64'});
let params = { let params = {
session_id: this.props.session_id, session_id: this.props.session_id,
...@@ -194,54 +194,59 @@ class UpgradePremium extends React.Component { ...@@ -194,54 +194,59 @@ class UpgradePremium extends React.Component {
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
<ScrollView> <ScrollView>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Nama Depan</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Nama Depan</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(nama_depan) => this.setState({ nama_depan })} onChangeText={(nama_depan) => this.setState({ nama_depan })}
value={this.state.nama_depan} value={this.state.nama_depan}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Nama Belakang</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Nama Belakang</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(nama_belakang) => this.setState({ nama_belakang })} onChangeText={(nama_belakang) => this.setState({ nama_belakang })}
value={this.state.nama_belakang} value={this.state.nama_belakang}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Tempat Lahir</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Tempat Lahir</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(tempat_lahir) => this.setState({ tempat_lahir })} onChangeText={(tempat_lahir) => this.setState({ tempat_lahir })}
value={this.state.tempat_lahir} value={this.state.tempat_lahir}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Alamat Permanen</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Alamat Permanen</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 90, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput2}
onChangeText={(alamat_permanent) => this.setState({ alamat_permanent })} onChangeText={(alamat_permanent) => this.setState({ alamat_permanent })}
value={this.state.alamat_permanent} value={this.state.alamat_permanent}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Provinsi</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Provinsi</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(region) => this.setState({ region })} onChangeText={(region) => this.setState({ region })}
value={this.state.region} value={this.state.region}
textAlign='center'
/> />
{/* <RNPickerSelect {/* <RNPickerSelect
value={this.state.region} value={this.state.region}
...@@ -249,14 +254,15 @@ class UpgradePremium extends React.Component { ...@@ -249,14 +254,15 @@ class UpgradePremium extends React.Component {
onValueChange={(value) => this.setState({ region : value})} onValueChange={(value) => this.setState({ region : value})}
items= {this.state.provinces} /> */} items= {this.state.provinces} /> */}
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Kota</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kota</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(city) => this.setState({ city })} onChangeText={(city) => this.setState({ city })}
value={this.state.city} value={this.state.city}
textAlign='center'
/> />
{/* <RNPickerSelect {/* <RNPickerSelect
value={this.state.city} value={this.state.city}
...@@ -264,34 +270,36 @@ class UpgradePremium extends React.Component { ...@@ -264,34 +270,36 @@ class UpgradePremium extends React.Component {
onValueChange={(value) => this.setState({ city : value})} onValueChange={(value) => this.setState({ city : value})}
items= {this.state.provinces} /> */} items= {this.state.provinces} /> */}
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Kecamatan</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kecamatan</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(district) => this.setState({ district })} onChangeText={(district) => this.setState({ district })}
value={this.state.district} value={this.state.district}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Kelurahan</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kelurahan</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(village) => this.setState({ village })} onChangeText={(village) => this.setState({ village })}
value={this.state.village} value={this.state.village}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Pekerjaan</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Pekerjaan</Text>
</View> </View>
<View style={{ margin: 10, borderColor: 'gray', borderWidth: 1 }}> <View style={{ marginHorizontal: 40, borderColor: 'gray', borderWidth: 1, borderRadius: 10, top: 10 }}>
<Picker <Picker
mode="dropdown" mode="dropdown"
selectedValue={this.state.pekerjaan} selectedValue={this.state.pekerjaan}
style={{ height: 40 }} style={{ height: 40, width: '100%' }}
onValueChange={(itemValue, itemIndex) => this.setState({ pekerjaan: itemValue })}> onValueChange={(itemValue, itemIndex) => this.setState({ pekerjaan: itemValue })}>
{jobs.map((itemValue, itemIndex) => { {jobs.map((itemValue, itemIndex) => {
return (<Picker.Item label={itemValue} value={itemValue} key={itemIndex} />) return (<Picker.Item label={itemValue} value={itemValue} key={itemIndex} />)
...@@ -299,36 +307,38 @@ class UpgradePremium extends React.Component { ...@@ -299,36 +307,38 @@ class UpgradePremium extends React.Component {
</Picker> </Picker>
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel, { top: 20 }}>
<Text style={{ top: 5 }}>KTP</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>KTP</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10, marginTop: 23 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(id_value) => this.setState({ id_value })} onChangeText={(id_value) => this.setState({ id_value })}
value={this.state.id_value} value={this.state.id_value}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Kebangsaan</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Kebangsaan</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TextInput <TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1 }} style={styles.textInput}
onChangeText={(nationality) => this.setState({ nationality })} onChangeText={(nationality) => this.setState({ nationality })}
value={this.state.nationality} value={this.state.nationality}
textAlign='center'
/> />
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Upload Foto Diri</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Upload Foto Diri</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TouchableOpacity onPress={() => this.takePictureSelfie()}> <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 null
):( ) : (
<Image <Image
style={{ width: 90, height: 80, alignSelf: 'center', }} style={{ width: 90, height: 80, alignSelf: 'center', }}
...@@ -339,16 +349,16 @@ class UpgradePremium extends React.Component { ...@@ -339,16 +349,16 @@ class UpgradePremium extends React.Component {
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{ marginRight: 10, marginLeft: 10 }}> <View style={styles.textLabel}>
<Text style={{ top: 5 }}>Upload Foto KTP</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Upload Foto KTP</Text>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ margin: 10 }}>
<TouchableOpacity onPress={() => this.takePictureIdcard()}> <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 === '' ? ( this.props.URI_IDCARD === '' ? (
null null
):( ) : (
<Image <Image
style={{ width: 90, height: 80, alignSelf: 'center', }} style={{ width: 90, height: 80, alignSelf: 'center', }}
source={{ uri: this.props.URI_IDCARD }} source={{ uri: this.props.URI_IDCARD }}
...@@ -358,12 +368,18 @@ class UpgradePremium extends React.Component { ...@@ -358,12 +368,18 @@ class UpgradePremium extends React.Component {
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </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 <Button
title="Upgrade Premium" title="Upgrade Premium"
onPress={() => this.handlePremium()} onPress={() => this.handlePremium()}
/> />
</View> </View> */}
</ScrollView> </ScrollView>
</View> </View>
) )
...@@ -375,7 +391,35 @@ const styles = StyleSheet.create({ ...@@ -375,7 +391,35 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
backgroundColor: 'white' 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) => { 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