116 lines
3.7 KiB
Vue
116 lines
3.7 KiB
Vue
<template>
|
||
<view class="page">
|
||
<nav-bar title="Log in" bgColor="#fff"></nav-bar>
|
||
<view style="width: 92%; margin: 10px auto; padding: 15px 10px;">
|
||
<view>
|
||
<image src="/static/images/109.png" style="width: 25px; height: 25px; float: left;" fit="cover"></image>
|
||
<span style="font-size: 20px; font-weight: 700; float: left; color: #3d3d3d; margin-left: 10px;">Marsh Questionnaire</span>
|
||
<view style="clear: both;"></view>
|
||
</view>
|
||
<view style="font-size: 32px; color: #333; font-weight: 700; margin-top: 20px;">Sign in to your Account</view>
|
||
<view style="color: #6C7278; font-weight: 500; font-size: 14px; margin-bottom: 20px;">Enter your email and password to log in </view>
|
||
<uni-forms label-position="top" label-width="80px" :model="loginModel" :rules="rules" ref="loginModel">
|
||
<uni-forms-item label="Email" name="username">
|
||
<uni-easyinput type="text" v-model="loginModel.username" placeholder="Please enter your email address"></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="Password" name="password">
|
||
<uni-easyinput type="password" :passwordIcon="true" v-model="loginModel.password" placeholder="Please enter your Password" />
|
||
</uni-forms-item>
|
||
</uni-forms>
|
||
<view style="font-size: 12px; color:#4D81E7; font-weight: 500; text-align: right; margin-bottom: 30px;" @click="onPageJump('/pages/mine/forgotpassword')">Forgot Password ?</view>
|
||
<button type="primary" round style="width: 100%;" @click="login()">log in</button>
|
||
</view>
|
||
<view style="bottom: 0px; position: absolute; width:100vw; height: 50px;">
|
||
<view style="font-size: 12px; color: #6C7278; font-weight: 500; text-align: center;">
|
||
Don’t have an account?
|
||
<span style="color: #4D81E7; margin-left: 10px;" @click="onPageJump('/pages/mine/signup')">Sign Up</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState,
|
||
mapMutations
|
||
} from 'vuex';
|
||
export default {
|
||
data() {
|
||
return {
|
||
loginModel: {
|
||
username: '',
|
||
password: ''
|
||
},
|
||
rules: {
|
||
username: {rules:[{required: true,errorMessage: 'Please enter your email address'}]},
|
||
password: {rules:[{required: true,errorMessage: 'Please input a password'}]},
|
||
}
|
||
};
|
||
},
|
||
computed: {
|
||
...mapState(['userInfo'])
|
||
},
|
||
//第一次加载
|
||
onLoad(e) {
|
||
|
||
},
|
||
//页面显示
|
||
onShow() {},
|
||
//方法
|
||
methods: {
|
||
...mapMutations(['setUserInfo']),
|
||
onPageJump(url) {
|
||
uni.navigateTo({
|
||
url: url
|
||
});
|
||
},
|
||
login(){
|
||
this.$refs.loginModel.validate().then(res=>{
|
||
if (!this.$base.mailRegular.test(this.loginModel.username)) {
|
||
uni.showToast({title: 'Email address error', icon:'error'});
|
||
return;
|
||
}
|
||
this.$http.post('/api/common/login', this.loginModel).then(res => {
|
||
if(res.code == 0){
|
||
this.setUserInfo(res.data);
|
||
setTimeout(() => {
|
||
uni.switchTab({
|
||
url: '/pages/mine/index'
|
||
});
|
||
}, 1000);
|
||
}
|
||
});
|
||
});
|
||
}
|
||
},
|
||
//页面隐藏
|
||
onHide() {},
|
||
//页面卸载
|
||
onUnload() {},
|
||
//页面下来刷新
|
||
onPullDownRefresh() {},
|
||
//页面上拉触底
|
||
onReachBottom() {},
|
||
//用户点击分享
|
||
onShareAppMessage(e) {
|
||
return this.wxShare();
|
||
}
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
@import '@/style/mixin.scss';
|
||
body{background-color: #fff;}
|
||
.page{min-height: 100vh;position: relative;}
|
||
.rechargeTitle{
|
||
font-weight: 400;font-size: 16px;color: #999999;line-height: 23px; text-align: center; margin-top: 30px;
|
||
}
|
||
.rechargeNet{
|
||
font-weight: 600;font-size: 20px;color: #333;line-height: 23px; text-align: center; margin-top: 20px;
|
||
}
|
||
.txt{
|
||
font-size: 14px; color:#999; font-weight: 500;
|
||
}
|
||
.cell_right{
|
||
font-size: 14px; color:#333; font-weight: 500;
|
||
}
|
||
</style> |