<template>
|
<view class="login">
|
<image src="@/static/login/banner.png" class="background"></image>
|
<view class="inputBox">
|
<view class="phone">
|
<image src="@/static/login/phone.png" mode="加载错误"></image>
|
<input type="text" placeholder="请输入手机号" v-model="formData.username" />
|
</view>
|
<view class="password">
|
<image src="@/static/login/lock.png" mode="加载错误" />
|
<input type="password" placeholder="请输入密码" v-model="formData.password" />
|
</view>
|
<view class="loginBtn"><button type="default" @click="loginSubmit">登录</button></view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { setAccessToken,setTokenType,setRefreshToken,setClientId,setScope,redirectHome,redirectLogin } from '@/utils/status.js'
|
export default {
|
name: 'login',
|
data() {
|
return {
|
formData:{
|
username:'fyy',
|
password:'123456!@#'
|
}
|
};
|
},
|
methods:{
|
loginSubmit(){
|
// console.log('login');
|
uni.showLoading({
|
title:'登录中...'
|
});
|
this.apiLogin(this.formData).then(this.saveUserInfo).catch(this.loginFail);
|
},
|
saveUserInfo(response){
|
uni.hideLoading();
|
if(response.statusCode === 200){
|
// console.log('res',response);
|
const { data } = response;
|
const { access_token,refresh_token,token_type,scope } = data;
|
try {
|
setAccessToken(access_token);
|
setTokenType(token_type);
|
setRefreshToken(refresh_token);
|
setScope(scope);
|
this.$store.dispatch('menus')
|
redirectHome();
|
uni.hideLoading();
|
} catch (e) {
|
// error
|
console.log(e);
|
}
|
} else{
|
uni.showToast({
|
title:response.data.msg,
|
icon:'error',
|
duration:2000
|
})
|
}
|
}
|
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.login {
|
.background {
|
width: 100%;
|
height: vww(289);
|
}
|
.inputBox {
|
width: vww(280);
|
margin: vww(40) auto;
|
input {
|
width: vww(240);
|
margin-left: vww(8);
|
}
|
.phone {
|
width: vww(280);
|
height: vww(36);
|
display: flex;
|
align-items: center;
|
border-bottom: vww(1) solid #cccccc;
|
image {
|
width: vww(20);
|
height: vww(20);
|
}
|
}
|
.password {
|
width: vww(280);
|
height: vww(36);
|
display: flex;
|
align-items: center;
|
margin-top: vww(40);
|
border-bottom: vww(1) solid #cccccc;
|
image {
|
width: vww(20);
|
height: vww(20);
|
}
|
}
|
.loginBtn {
|
margin-top: vww(80);
|
|
button {
|
background-color: #007aff;
|
color: #ffffff;
|
font-size: vww(16);
|
border-radius: vww(22);
|
}
|
}
|
}
|
}
|
</style>
|
