You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

113 lines
2.9 KiB

<template>
<view>
<view class="auth">
<view class="wanl-title">欢迎登陆账号</view>
<form @submit="formSubmit">
<view class="auth-group radius-bock bg-gray wlian-grey-light">
<input
type="text"
placeholder="请输入用户名"
confirm-type="next"
maxlength="16"
placeholder-class="placeholder"
name="account"
:value="account"
></input>
</view>
<view class="auth-group radius-bock bg-gray wlian-grey-light">
<input
type="text"
placeholder="请输入登录密码"
password="true"
confirm-type="done"
maxlength="16"
placeholder-class="placeholder"
name="password"
@input="onKeyInput"
></input>
</view>
<view class="text-right" @tap="retrieve">
忘记密码
</view>
<view class="auth-button flex flex-direction">
<button class="cu-btn bg-orange sl radius-bock" form-type="submit" :disabled="submitDisabled"> </button>
</view>
<view class="text-center" @tap="phone">
短信验证码登录
</view>
</form>
</view>
<view class="auth-foot">
<view class="menu text-grey">
<text @tap="register">注册</text>
<text @tap="help">帮助</text>
</view>
</view>
</view>
</template>
<script>
import graceChecker from '@/common/graceChecker';//来自 graceUI 的表单验证, 使用说明见手册 http://grace.hcoder.net/doc/info/73-3.html
export default {
data() {
return {
submitDisabled: true,
account: '',
pageroute: ''
};
},
onLoad(option){
// 用户名
this.account = option.name;
this.pageroute = option.url;
},
methods: {
onKeyInput: function(e) {
this.submitDisabled = false
},
formSubmit: function(e) {
//定义表单规则
var rule = [
{ name: 'account', checkType: 'notnull', errorMsg: '请输入用户名' },
{ name: 'password', checkType: 'string', checkRule: '6,16', errorMsg: '密码至少6位' }
];
//进行表单检查
var formData = e.detail.value;
var checkRes = graceChecker.check(formData, rule);
if (checkRes) {
this.$api.post({
url: '/wanlshop/user/login',
data: {
account: formData.account,
password: formData.password,
client_id: uni.getStorageSync("wanlshop:chat_client_id")?uni.getStorageSync("wanlshop:chat_client_id") : null
},
success: res => {
this.$store.dispatch('user/login', res);
this.$store.dispatch('cart/login');
this.$store.dispatch('chat/get');
uni.reLaunch({url: decodeURIComponent(this.pageroute)});
}
});
} else {
this.$wanlshop.msg(graceChecker.error);
}
},
retrieve(){
this.$wanlshop.to(`retrieve?url=${this.pageroute}`);
},
phone() {
this.$wanlshop.to(`phone?url=${this.pageroute}`);
},
register() {
this.$wanlshop.to(`register?url=${this.pageroute}`);
},
help() {
this.$wanlshop.to(`/pages/user/help?url=${this.pageroute}`);
}
}
};
</script>
<style>
@import url("auth.css");
</style>