Authored by shixiang

提交登录ui优化

review -叶弯弯
... ... @@ -34,8 +34,8 @@ export default class Login extends Component {
renderUserText() {
return (
<View style={styles.textContainer}>
return (
<View style={styles.textContainer}>
<TextInput
style={styles.username}
placeholder='账号'
... ... @@ -51,46 +51,47 @@ export default class Login extends Component {
}
/>
</TouchableWithoutFeedback>
</View>
</View>
);
}
renderPwdText() {
return (
<View style={styles.textContainer}>
<TextInput
style={styles.pwd}
secureTextEntry={this.props.isDisplayPwd?false:true}
placeholder={'密码'}
underlineColorAndroid='transparent'
onChangeText={this.props.onPwdChange}
value={this.props.pwd}
/>
<TouchableWithoutFeedback
onPress={this.props.onShowPwdPress}>
<Image
style={styles.buttonDelete}
source={require('../images/eyes@2x.png')}
<View style={styles.textContainer}>
<TextInput
style={styles.pwd}
secureTextEntry={this.props.isDisplayPwd?false:true}
placeholder={'密码'}
underlineColorAndroid='transparent'
onChangeText={this.props.onPwdChange}
value={this.props.pwd}
/>
</TouchableWithoutFeedback>
</View>
);
}
<TouchableWithoutFeedback
onPress={this.props.onShowPwdPress}>
<Image
style={styles.buttonDelete}
source={require('../images/eyes@2x.png')}
/>
</TouchableWithoutFeedback>
</View>
);
}
render() {
return (
<View style={styles.container}>
<Image
style={styles.logo}
source={require('../images/logo@2x.png')}
/>
{this.renderUserText()}
{this.renderPwdText()}
<Button style={styles.button}
textStyle={styles.buttonText}
onPress={this.props.onLoginPress}>
<Image style={styles.container} source={require('../images/login@2x.png')} resizeMode={'cover'} >
<Image
style={styles.logo}
source={require('../images/logo@2x.png')}
/>
{this.renderUserText()}
{this.renderPwdText()}
<Button style={styles.button}
textStyle={styles.buttonText}
onPress={this.props.onLoginPress}>
登录
</Button>
</View>
</Image>
);
}
}
... ... @@ -98,6 +99,7 @@ export default class Login extends Component {
let {height, width} = Dimensions.get('window');
let textPaddingTop = height * 7 / 10;
let buttonMargin = (width - 320) / 2;
let inputWidth = width-40;
var styles = StyleSheet.create({
container:{
flex: 1,
... ... @@ -106,45 +108,44 @@ var styles = StyleSheet.create({
justifyContent: 'center',
width: width,
height: height,
backgroundColor: 'gray'
},
textContainer:{
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
marginTop:13,
backgroundColor: '#7fffffff',
width:330,
width:inputWidth,
height:40,
justifyContent: 'center',
borderRadius:5,
backgroundColor: 'gray',
marginBottom: 10,
},
logo: {
width:256,
height:40,
marginBottom: 10,
marginBottom: 40,
},
username: {
flex: 1,
height:40,
paddingLeft:10,
borderColor: 'gray',
borderWidth: 1
},
pwd: {
flex: 1,
paddingLeft:10,
borderColor: 'gray',
borderWidth: 1
},
button: {
marginLeft: buttonMargin,
marginRight: buttonMargin,
marginTop: 40,
backgroundColor: '#7fffffff',
marginLeft: 20,
marginRight: 20,
backgroundColor: '#ffffff',
opacity:0.5,
borderWidth:0,
borderRadius:5,
},
buttonText: {
color: '#ffffff',
color: 'black',
fontSize: 18,
},
buttonDelete: {
... ...
... ... @@ -90,21 +90,20 @@ var styles = StyleSheet.create({
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
backgroundColor: 'white'
backgroundColor: 'white',
},
text:{
flex:1,
marginLeft: buttonMargin,
marginRight: buttonMargin,
color:'black',
marginLeft: 10,
},
button: {
marginLeft: buttonMargin,
marginRight: buttonMargin,
marginLeft: 20,
marginRight: 20,
marginTop: 20,
backgroundColor: '#d0021b',
borderRadius:5,
borderWidth:0,
},
buttonText: {
color: '#ffffff',
... ...
... ... @@ -107,8 +107,7 @@ var styles = StyleSheet.create({
},
text:{
flex:1,
marginLeft: buttonMargin,
marginRight: buttonMargin,
marginLeft: 10,
color:'black',
},
pwd: {
... ... @@ -117,11 +116,12 @@ var styles = StyleSheet.create({
textAlignVertical:'center',
},
button: {
marginLeft: buttonMargin,
marginRight: buttonMargin,
marginLeft: 20,
marginRight: 20,
marginTop: 20,
backgroundColor: '#d0021b',
borderRadius:5,
borderWidth:0,
},
buttonText: {
color: '#ffffff',
... ...
... ... @@ -178,7 +178,7 @@ export default class NavBar extends React.Component {
if (CONFIG.sceneKey.user === sceneKey) {
return (
<View style={styles.userInfoContainer} >
<Text style={styles.userInfoTitle} onPress={() => {console.log('title pressed');}}>vans旗舰店</Text>
<Text style={styles.userInfoTitle} onPress={() => {Actions.Logout();}}>vans旗舰店</Text>
<Image source={require('../images/white.png')} style={styles.whiteArrow}/>
</View>
... ...
... ... @@ -6,8 +6,6 @@
*/
'use strict';
import CONFIG from '../../constants/config';
/**
* ## Imports
*
... ... @@ -21,6 +19,7 @@ const {
import {Actions} from 'react-native-router-flux';
import store from 'react-native-simple-store';
import CONFIG from '../../constants/config';
/**
* ## check guide has displayed or not
... ... @@ -31,14 +30,24 @@ export function getGuideDisplayState() {
return dispatch => {
store.get(CONFIG.storeKey.GUIDE_STATE_KEY)
.then((state) => {
if (state && state.isDisplay) {
Actions.Drawer();
if (state) {
store.get(CONFIG.storeKey.SESSION_TOKEN_KEY)
.then((state) => {
if (state) {
Actions.Drawer();
} else {
Actions.Login();
}
})
.catch(error => {
Actions.Login();
});
} else {
Actions.Guide();
}
})
.catch(error => {
Actions.Drawer();
Actions.Guide();
});
}
}
... ...
... ... @@ -9,6 +9,7 @@
import {Actions} from 'react-native-router-flux';
import AppAuthToken from '../../services/AppAuthToken';
import UserService from '../../services/UserService';
import {Linking} from 'react-native';
const {
... ... @@ -52,14 +53,13 @@ const {
export function userItemsPressed(item) {
switch (item.index) {
case 0:
console.log('index0');
Linking.openURL('tel:025-87781000');
return {
type: PHONE_CALL,
};
case 1:
// Actions.AboutUs();
Actions.Logout();
Actions.AboutUs();
return {
type: ABOUT_US,
};
... ... @@ -133,7 +133,9 @@ export function pwdDisplay(ishow) {
}
export function logout() {
new AppAuthToken().deleteSessionToken();
Actions.pop();
Actions.Login();
return {
type: LOGOUT_REQUEST
};
... ... @@ -177,15 +179,10 @@ export function pwdModifySubmit() {
}
export function login(account, password) {
return dispatch => {
dispatch(loginRequest());
return new UserService().login({
account: account,
password: password
})
return new UserService().login(account,password)
.then(function (json) {
console.log(json);
return saveSessionToken(json)
... ... @@ -195,10 +192,9 @@ export function login(account, password) {
});
})
.catch((error) => {
Actions.Drawer();
console.error(error);
dispatch(loginFailure(error));
//test
Actions.Drawer();
});
};
... ...
... ... @@ -73,7 +73,6 @@ export default class Request {
body: opts.body,
timeout: opts.timeout | 0,
});
let data = await this._parseResponse(response);
return data;
... ... @@ -87,7 +86,6 @@ export default class Request {
let res = JSON.parse(response._bodyInit);
throw(res);
}
let json = await response.json();
if (json.code == 200) {
return json.data;
... ...
... ... @@ -2,7 +2,6 @@
import Request from './Request';
export default class UserService {
constructor () {
... ...