提交 0436220a 编写于 作者: 芊里

登陆界面表单校验

上级 5b57105f
...@@ -353,7 +353,8 @@ ...@@ -353,7 +353,8 @@
this.formData[i] = this._getValue(i, this.value[i]) this.formData[i] = this._getValue(i, this.value[i])
} }
} }
} }
console.log(this.formData, this.formRules);
return this.validateAll(this.formData, 'submit', callback) return this.validateAll(this.formData, 'submit', callback)
}, },
......
...@@ -21,7 +21,8 @@ let mixin = { ...@@ -21,7 +21,8 @@ let mixin = {
formData:{ formData:{
phone:'', phone:'',
code:'', code:'',
pwd:'' pwd:'',
pwd2:''
}, },
rules: { rules: {
phone:{ phone:{
...@@ -56,6 +57,26 @@ let mixin = { ...@@ -56,6 +57,26 @@ let mixin = {
errorMessage: '密码应为6到20位', errorMessage: '密码应为6到20位',
} }
] ]
},
pwd2:{
rules:[{
required: true,
errorMessage: '请确认密码',
},
{
pattern: /^.{6,20}$/,
errorMessage: '密码应为6到20位',
},
{
validateFunction:function(rule,value,data,callback){
console.log(value);
if(value!=data.pwd){
callback('两次输入密码不一致')
};
return true
}
}
]
} }
} }
} }
......
...@@ -16,19 +16,23 @@ ...@@ -16,19 +16,23 @@
<text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text> <text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text>
<!-- </picker> --> <!-- </picker> -->
</template> </template>
</uni-easyinput> </uni-easyinput>
</uni-forms-item>
<uni-forms-item name="pwd">
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false" <uni-easyinput type="password" class="phone-input-box" :inputBorder="false"
v-model="formData.pwd" placeholder="请输入密码"></uni-easyinput> v-model="formData.pwd" placeholder="请输入密码"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<button class="send-btn-box" :disabled="!canLogin" :type="canLogin?'primary':'default'" <button class="send-btn-box" :disabled="!canLogin" :type="canLogin?'primary':'default'"
@click="pwdLogin">登录</button> @click="pwdLogin">登录</button>
</uni-forms> </uni-forms>
<!-- 忘记密码 --> <!-- 忘记密码/注册账号 -->
<view class="auth-box"> <view class="auth-box">
<text class="login-text login-text-sub">忘记了?</text> <view class="auth-box-left">
<text class="login-text" @click="toRetrievePwd">找回密码</text> <text class="login-text login-text-sub">忘记了?</text>
</view> <text class="login-text" @click="toRetrievePwd">找回密码</text>
<button type="primary" class="toRegister" @click="toRegister">注册账号</button> </view>
<text @click="toRegister" class="login-text">注册账号</text>
</view>
</view> </view>
</view> </view>
<uni-quick-login ref="uniQuickLogin"></uni-quick-login> <uni-quick-login ref="uniQuickLogin"></uni-quick-login>
...@@ -131,9 +135,14 @@ ...@@ -131,9 +135,14 @@
.phone-input-box { .phone-input-box {
margin-top: 20rpx; margin-top: 20rpx;
} }
.auth-box { .auth-box {
justify-content: flex-start; flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 20rpx; margin-top: 20rpx;
}
.auth-box-left{
flex-direction: row;
} }
.login-text-sub { .login-text-sub {
color: #8a8f8b; color: #8a8f8b;
......
...@@ -3,22 +3,30 @@ ...@@ -3,22 +3,30 @@
<view class="wrap-content"> <view class="wrap-content">
<view class="content"> <view class="content">
<!-- 顶部文字 --> <!-- 顶部文字 -->
<text class="content-top-title">重置密码</text> <text class="content-top-title">重置密码</text>
<login-ikonw v-show="formData.phone" class="login-iknow" :text="tipText"></login-ikonw> <login-ikonw v-show="isPhone" class="login-iknow" :text="tipText"></login-ikonw>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-forms ref="form" :value="formData" :rules="rules"> <uni-forms ref="form" :value="formData" :rules="rules">
<uni-forms-item name="phone"> <uni-forms-item name="phone">
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false" <uni-easyinput type="number" class="phone-input-box" :inputBorder="false"
v-model="formData.phone" maxlength="11" placeholder="请输入手机号"></uni-easyinput> v-model="formData.phone" maxlength="11" placeholder="请输入手机号"></uni-easyinput>
</uni-forms-item>
<uni-forms-item name="code">
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false" <uni-easyinput type="number" class="phone-input-box" :inputBorder="false"
v-model="formData.code" maxlength="6" placeholder="请输入验证码"> v-model="formData.code" maxlength="6" placeholder="请输入验证码">
<template slot="right"> <template slot="right">
<login-short-code ref="shortCode" :phone="formData.phone"></login-short-code> <login-short-code ref="shortCode" :phone="formData.phone"></login-short-code>
</template> </template>
</uni-easyinput> </uni-easyinput>
</uni-forms-item>
<uni-forms-item name="pwd">
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false" <uni-easyinput type="password" class="phone-input-box" :inputBorder="false"
v-model="formData.pwd" placeholder="请输入新密码"></uni-easyinput> v-model="formData.pwd" placeholder="请输入新密码"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<uni-forms-item name="pwd2">
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false"
v-model="formData.pwd2" placeholder="请确认新密码"></uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'" <button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">完成</button> @click="submit">完成</button>
</uni-forms> </uni-forms>
...@@ -52,7 +60,7 @@ import mixin from '../../common/loginPage.mixin.js'; ...@@ -52,7 +60,7 @@ import mixin from '../../common/loginPage.mixin.js';
}, },
onReady() { onReady() {
if(this.formData.phone){ if(this.formData.phone){
this.$refs.shortCode.start(); // this.$refs.shortCode.start();
} }
}, },
methods: { methods: {
...@@ -60,19 +68,22 @@ import mixin from '../../common/loginPage.mixin.js'; ...@@ -60,19 +68,22 @@ import mixin from '../../common/loginPage.mixin.js';
* 完成并提交 * 完成并提交
*/ */
submit(){ submit(){
this.request('user-center/resetPwdBySmsCode',{ this.$refs.form.submit()
"mobile":this.formData.phone, .then(res=>{
"code":this.formData.code, this.request('user-center/resetPwdBySmsCode',{
"password":this.formData.pwd "mobile":this.formData.phone,
},(data,result)=>{ "code":this.formData.code,
console.log(result); "password":this.formData.pwd
uni.showToast({ },(data,result)=>{
title: result.msg, console.log(result);
icon: 'none' uni.showToast({
}); title: result.msg,
if(result.code === 0){ icon: 'none'
uni.navigateBack() });
} if(result.code === 0){
uni.navigateBack()
}
})
}) })
} }
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册