【新增】手机加短信登录面板,增加《服务协议》和《隐私协议》的复选框及跳转浏览通道,并且默认不勾选。需要用户主动勾选,防止微信小程序审核失败的问题。

This commit is contained in:
jianweie code
2023-06-05 21:18:46 +08:00
parent a991f309ba
commit 5c3c34bad2
2 changed files with 41 additions and 32 deletions

View File

@@ -1,19 +1,14 @@
.wrap { font-size: 14px;
.content { width: 300px; margin: 40px auto 0;
.title { text-align: left; font-size: 25px; font-weight: 500; margin-bottom: 50px; }
.content { width: 350px; margin: 40px auto 0;
.title { text-align: center; font-size: 25px; font-weight: 500; margin-bottom: 50px; }
input { text-align: left; margin-bottom: 5px; padding-bottom: 3px; }
.tips { color: $u-type-info; margin-bottom: 30px; margin-top: 4px; }
.getCaptcha { background-color: rgb(253, 243, 208); color: $u-tips-color; border: none; font-size: 15px; padding: 6px 0;
&::after { border: none; }
}
.alternative { color: $u-tips-color; display: flex; justify-content: space-between; margin-top: 15px; }
}
.buttom {
.loginType { display: flex; padding: 175px 75px 75px 75px; justify-content: center;
.loginType { display: flex; padding: 75px 75px 15px 75px; justify-content: center;
.item { display: flex; flex-direction: column; align-items: center; color: $u-content-color; font-size: 14px; }
}
@@ -22,8 +17,13 @@
.link { color: $u-type-warning; }
}
}
.getCaptcha { background-color: rgb(253, 243, 208); color: $u-tips-color; border: none; font-size: 15px; padding: 6px 0; width: 100%;
&::after { border: none; }
}
}
.agreement-checked-view { position: relative; padding: 10px 0px 10px 15px; display: flex; align-items: center; margin: 5px 0; font-size: 12px; justify-content: center; }
.wrapkey { padding: 40px 35px; }
.box { margin: 15px 0; font-size: 15px; color: 555; }

View File

@@ -14,31 +14,31 @@
<view class="top"></view>
<view class="content">
<view class="title">欢迎登录{{appTitle}}</view>
<input class="coreshop-solid-bottom" type="number" v-model="mobile" placeholder="请输入手机号" />
<view class="tips">未注册的手机号验证后自动创建平台账号</view>
<button @tap="submit" :style="[inputStyle]" class="getCaptcha">获取短信验证码</button>
<view class="alternative">
<!--<view class="password">密码登录</view>-->
<view class="issue">遇到问题</view>
</view>
<u--input placeholder="请输入手机号"
border="surround"
v-model="mobile"
type="number"
@change="change"></u--input>
<view class="tips coreshop-margin-10">未注册的手机号验证后自动创建平台账号</view>
</view>
<view class="buttom">
<view class="loginType">
<!--#ifdef MP-WEIXIN-->
<view class="wechat item" @tap="goLoginByGetPhoneNumber()">
<view class="icon"><u-icon size="70" name="weixin-fill" color="rgb(83,194,64)"></u-icon></view>
微信手机号绑定
</view>
<!--#endif-->
<button @tap="submit" :style="[inputStyle]" class="getCaptcha">获取短信验证码</button>
</view>
<view class="hint">
登录即代表你同意
<text @click="goUserAgreementPage()">用户协议</text>
<text @click="goUserPrivacyPolicy()">隐私政策</text>
并授权使用您的{{appTitle}}账号信息如昵称头像收获地址以便您统一管理
<!--服务协议-->
<view class="coreshop-margin-top-15 coreshop-margin-bottom-30 agreement-checked-view">
<u-checkbox-group>
<u-checkbox v-model="agreement" :checked="agreement" @change="checkboxChange" size="20" active-color="#19be6b"></u-checkbox>
</u-checkbox-group>
<view class="coreshop-text-black-view">
<text class="coreshop-text-black">同意</text>
<text class="text-blue" @tap="goUserAgreementPage">服务协议</text>
<text class="coreshop-text-black"></text>
<text class="text-blue" @tap="goUserPrivacyPolicy">隐私协议</text>
</view>
</view>
</view>
</view>
<view class="wrapkey" v-if="showCodeBox">
<view class="key-input">
@@ -62,6 +62,7 @@
data() {
return {
agreement: false,
maxMobile: 11,
mobile: '', // 用户手机号
code: '', // 短信验证码
@@ -143,15 +144,23 @@
}
},
methods: {
goLoginByGetPhoneNumber() {
this.$u.route({ type: 'redirectTo', url: '/pages/login/loginByGetPhoneNumber/loginByGetPhoneNumber?sessionAuthId=' + this.sessionAuthId });
checkboxChange(e) {
this.agreement = e;
console.log(this.agreement);
},
change(e) {
console.log('change', e);
},
submit() {
if (this.$u.test.mobile(this.mobile)) {
this.sendCode();
} else {
if (!this.$u.test.mobile(this.mobile)) {
this.$u.toast('请输入合法的手机号码!');
return;
}
if (this.agreement == false) {
this.$u.toast('请先勾选同意《服务协议》与《隐私协议》!');
return;
}
this.sendCode();
},
// 收不到验证码选择时的选择
noCaptcha() {