Commit 699c0721 authored by Trisno's avatar Trisno

design change password

parent 1f4d2915
import React, { Component, PureComponent } from 'react'; import React, { Component, PureComponent } from 'react';
import { StyleSheet, Text, TextInput, View, Button,Alert } from 'react-native'; import { StyleSheet, Text, TextInput, View, Button, Alert, TouchableOpacity } from 'react-native';
import Axios from 'axios'; import Axios from 'axios';
import {BASE_URL_CHANGE_PASSWORD} from '../model/Base_Model'; import { BASE_URL_CHANGE_PASSWORD } from '../model/Base_Model';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
class ChangePassword extends React.Component { class ChangePassword extends React.Component {
...@@ -15,7 +15,7 @@ class ChangePassword extends React.Component { ...@@ -15,7 +15,7 @@ class ChangePassword extends React.Component {
} }
} }
componentDidMount(){ componentDidMount() {
} }
...@@ -29,54 +29,71 @@ class ChangePassword extends React.Component { ...@@ -29,54 +29,71 @@ class ChangePassword extends React.Component {
Axios.post(BASE_URL_CHANGE_PASSWORD, params).then(res => { Axios.post(BASE_URL_CHANGE_PASSWORD, params).then(res => {
this.props.navigation.navigate('Profile'); this.props.navigation.navigate('Profile');
}).catch(error => { }).catch(error => {
let response = error.response.data; console.log(error)
Alert.alert(response.msg); let response = error.response;
Alert.alert('', response.msg);
}) })
} }
render() { render() {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<View style={styles.header}> {/* <View style={styles.header}>
<Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>Change Password</Text> <Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>Change Password</Text>
</View> </View> */}
<View style={styles.form}> <View style={styles.form}>
<View style={styles.field_token}> <View style={styles.field_token}>
<View style={{ width: 55, justifyContent: 'center' }}> <View style={{ marginBottom: 25 }}>
<Text>Current Password</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Current Password</Text>
</View> </View>
<View style={{ flex: 1 }}> <View style={styles.items2}>
<TextInput style={{ height: 50, borderWidth: 1, padding: 5, margin: 10 }} <TextInput style={styles.textInput}
onChangeText={(old_password) => this.setState({ old_password })} onChangeText={(old_password) => this.setState({ old_password })}
value={this.state.old_password } value={this.state.old_password}
secureTextEntry={true}/> secureTextEntry={true}
placeholder='******'
placeholderTextColor='gray'
textAlign='center' />
</View> </View>
</View> </View>
<View style={styles.field_new_password}> <View style={styles.field_token}>
<View style={{ width: 55, justifyContent: 'center' }}> <View style={{ marginBottom: 25 }}>
<Text>New Password</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>New Password</Text>
</View> </View>
<View style={{ flex: 1 }}> <View style={styles.items2}>
<TextInput style={{ height: 50, borderWidth: 1, padding: 5, margin: 10 }} <TextInput style={styles.textInput}
onChangeText={(Password) => this.setState({ Password })} onChangeText={(Password) => this.setState({ Password })}
value={this.state.Password} value={this.state.Password}
secureTextEntry={true}/> secureTextEntry={true}
placeholder='******'
placeholderTextColor='gray'
textAlign='center' />
</View> </View>
</View> </View>
<View style={styles.field_repeat_password}> <View style={styles.field_token}>
<View style={{ width: 55, justifyContent: 'center' }}> <View style={{ marginBottom: 25 }}>
<Text>Repeat Password</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black', color: '#CFB368', textAlign: 'center' }}>Repeat Password</Text>
</View> </View>
<View style={{ flex: 1 }}> <View style={styles.items2}>
<TextInput style={{ height: 50, borderWidth: 1, padding: 5, margin: 10 }} <TextInput style={styles.textInput}
onChangeText={(Password_confirmation) => this.setState({ Password_confirmation })} onChangeText={(Password_confirmation) => this.setState({ Password_confirmation })}
value={this.state.Password_confirmation} value={this.state.Password_confirmation}
secureTextEntry={true}/> secureTextEntry={true}
placeholder='******'
placeholderTextColor='gray'
textAlign='center' />
</View> </View>
</View> </View>
{/* <View style={styles.button}>
<Button title="Change Password" onPress={() => this.changePassword()}></Button>
</View> */}
<TouchableOpacity onPress={() => this.changePassword()}>
<View style={styles.button}> <View style={styles.button}>
<Button title="Change Password" onPress={()=>this.changePassword()}></Button> <Text style={{ color: 'white', fontSize: 12, fontFamily: 'Gotham-Black' }}>Change Password</Text>
</View> </View>
</TouchableOpacity>
</View> </View>
</View> </View>
) )
...@@ -96,13 +113,12 @@ const styles = StyleSheet.create({ ...@@ -96,13 +113,12 @@ const styles = StyleSheet.create({
}, },
form: { form: {
flex: 3, flex: 0.8,
margin: 10, flexDirection: 'column',
marginTop: 0,
}, },
field_token: { field_token: {
flexDirection: 'row' marginTop: 25
}, },
field_new_password: { field_new_password: {
...@@ -113,11 +129,32 @@ const styles = StyleSheet.create({ ...@@ -113,11 +129,32 @@ const styles = StyleSheet.create({
flexDirection: 'row' flexDirection: 'row'
}, },
button: { items2: {
height: 50, flex: 1,
margin: 10, height: 35,
marginHorizontal: 15,
justifyContent: 'center',
alignItems: 'stretch',
},
} textInput: {
height: 40,
borderColor: 'gray',
borderWidth: 1,
padding: 10,
margin: 30,
borderRadius: 10
},
button: {
backgroundColor: '#CFB368',
marginTop: 50,
marginHorizontal: 100,
borderRadius: 15,
padding:10,
alignItems: 'center',
justifyContent: 'center'
},
}); });
......
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