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.
322 lines
7.9 KiB
322 lines
7.9 KiB
<template>
|
|
<view class="login">
|
|
<view class="refund-navbar">
|
|
<u-navbar
|
|
title=""
|
|
:border-bottom="false"
|
|
:background="background"
|
|
></u-navbar>
|
|
</view>
|
|
<view class="login-hd">
|
|
<view class="a">验证码登录</view>
|
|
<view class="b">若该手机号未注册，我们将自动为您注册</view>
|
|
</view>
|
|
<view class="login-bd">
|
|
<view class="a"
|
|
>+86<input v-model="phoneNum" type="tel" placeholder="请输入手机号"
|
|
/></view>
|
|
<view class="b">
|
|
<input v-model="semCode" placeholder="请输入验证码" />
|
|
<text @click="getCode" v-if="!showCountDown">获取验证码</text>
|
|
<text v-if="showCountDown">{{ countdown }}s</text>
|
|
</view>
|
|
<view class="c" style="display: flex; align-items: center">
|
|
<u-checkbox
|
|
active-color="#FF343C"
|
|
v-model="isCheckout"
|
|
style="margin-right: -20rpx"
|
|
></u-checkbox
|
|
>同意<text @click="toTextPage(1)">《用户服务协议》</text>和<text
|
|
@click="toTextPage(2)"
|
|
>《隐私政策》</text
|
|
>
|
|
</view>
|
|
</view>
|
|
<view class="login-fd login-fd-on" @click="login">登录</view>
|
|
<view class="" v-if="isCheckout">
|
|
<mpWeiXinMobile :refereeId="refereeId"></mpWeiXinMobile>
|
|
</view>
|
|
<view
|
|
class=""
|
|
v-else
|
|
style="
|
|
font-size: 28rpx;
|
|
color: #666;
|
|
text-align: center;
|
|
margin-top: 50rpx;
|
|
"
|
|
@click="login"
|
|
>
|
|
手机号快捷登录
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as UserApi from "@/api/user";
|
|
import * as CaptchaApi from "@/api/captcha";
|
|
import mpWeiXinMobile from "./components/mp-weixin-mobile.vue";
|
|
import store from "@/store";
|
|
import { isEmpty } from "@/utils/util";
|
|
import { getSceneData } from '@/core/app'
|
|
export default {
|
|
components: {
|
|
mpWeiXinMobile,
|
|
},
|
|
data() {
|
|
return {
|
|
isCheckout: false,
|
|
showCountDown: false,
|
|
currentIndex: 0,
|
|
background: {
|
|
background: `url(${this.$picUrl}/static/news/login-bg.png) center top no-repeat`,
|
|
backgroundSize: "100% auto",
|
|
},
|
|
phoneNum: "",
|
|
semCode: "",
|
|
countdown: 60,
|
|
countDownFun: null,
|
|
code: "",
|
|
refereeId: "",
|
|
};
|
|
},
|
|
onLoad(o) {
|
|
// 获取二维码场景值
|
|
const scene = getSceneData(o)
|
|
// 记录推荐人ID
|
|
const refereeId = scene.refereeId ? scene.refereeId : (scene.uid?scene.uid:o.refereeId)
|
|
this.refereeId = refereeId;
|
|
console.log(scene)
|
|
console.log(o)
|
|
console.log(scene.refereeId)
|
|
console.log("refereeId",refereeId)
|
|
console.log(this.refereeId)
|
|
},
|
|
methods: {
|
|
toTextPage(n) {
|
|
uni.navigateTo({
|
|
url: "/pages/news1/text?pageFlag=" + n,
|
|
});
|
|
},
|
|
validatePhoneNumber(phone) {
|
|
// 定义手机号码的正则表达式
|
|
var regExp = /^1[3456789]\d{9}$/;
|
|
|
|
if (regExp.test(phone)) {
|
|
return true; // 符合手机号码格式要求
|
|
} else {
|
|
return false; // 不符合手机号码格式要求
|
|
}
|
|
},
|
|
getCode() {
|
|
// 获取验证码
|
|
const that = this;
|
|
if (that.isCheckout == false) {
|
|
that.$toast("请勾选用户协议");
|
|
return;
|
|
}
|
|
if (!that.validatePhoneNumber(that.phoneNum)) {
|
|
uni.showToast({
|
|
title: "请输入正确的手机号",
|
|
});
|
|
return;
|
|
}
|
|
that.showCountDown = !that.showCountDown;
|
|
|
|
CaptchaApi.sendSmsCaptcha({
|
|
mobile: that.phoneNum
|
|
}).then((res) => {
|
|
if (res.status == 200) {
|
|
that.countDownFun = setInterval(() => {
|
|
if (that.countdown >= 1) {
|
|
that.countdown = that.countdown - 1;
|
|
} else {
|
|
that.showCountDown = false;
|
|
that.countdown = 60;
|
|
clearInterval(that.countDownFun);
|
|
}
|
|
}, 1000);
|
|
uni.showToast({
|
|
icon:"none",
|
|
title: res.message,
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
icon:"none",
|
|
title: res.message,
|
|
});
|
|
}
|
|
});
|
|
},
|
|
login() {
|
|
let that = this;
|
|
if (that.isCheckout == false) {
|
|
that.$toast("请勾选用户协议");
|
|
return;
|
|
}
|
|
// 登录
|
|
if (!that.validatePhoneNumber(that.phoneNum)) {
|
|
that.$toast("请输入正确的手机号");
|
|
return;
|
|
}
|
|
if (that.semCode == "") {
|
|
that.$toast("请输入验证码");
|
|
return;
|
|
}
|
|
uni.login({
|
|
provider: "weixin",
|
|
success: function (res) {
|
|
store
|
|
.dispatch("Login", {
|
|
smsCode: that.semCode,
|
|
mobile: that.phoneNum,
|
|
refereeId: that.refereeId,
|
|
isParty: false,
|
|
partyData: {},
|
|
ucode: res.code
|
|
})
|
|
.then((res) => {
|
|
uni.setStorageSync("token", res.data.token);
|
|
that.$toast(res.message);
|
|
that.getUserInfo();
|
|
setTimeout(() => that.onNavigateBack(1), 2000);
|
|
});
|
|
},
|
|
fail:function(){
|
|
store
|
|
.dispatch("Login", {
|
|
smsCode: that.semCode,
|
|
mobile: that.phoneNum,
|
|
refereeId: that.refereeId,
|
|
isParty: false,
|
|
partyData: {},
|
|
// ucode: res.code
|
|
})
|
|
.then((res) => {
|
|
uni.setStorageSync("token", res.data.token);
|
|
that.$toast(res.message);
|
|
that.getUserInfo();
|
|
setTimeout(() => that.onNavigateBack(1), 2000);
|
|
});
|
|
}
|
|
});
|
|
},
|
|
getUserInfo() {
|
|
UserApi.info().then((result) => {
|
|
uni.setStorageSync("userInfo", result.data.userInfo);
|
|
});
|
|
},
|
|
onNavigateBack(delta = 1) {
|
|
// 登录成功返回原页面
|
|
const pages = getCurrentPages();
|
|
if (pages.length > 1) {
|
|
uni.navigateBack({
|
|
delta: Number(delta || 1),
|
|
});
|
|
} else {
|
|
this.$navTo("pages/index/index");
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.login {
|
|
width: 100%;
|
|
background: #fffafb url(https://www.royaum.com.cn/static/news/login-bg.png)
|
|
center top no-repeat;
|
|
background-size: 100% auto;
|
|
min-height: 100vh;
|
|
|
|
&-hd {
|
|
padding: 90rpx 75rpx 75rpx;
|
|
overflow: hidden;
|
|
|
|
.a {
|
|
line-height: 80rpx;
|
|
font-size: 40rpx;
|
|
font-weight: 500;
|
|
color: #000000;
|
|
}
|
|
|
|
.b {
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #5a5a5a;
|
|
line-height: 50rpx;
|
|
}
|
|
}
|
|
|
|
&-bd {
|
|
padding: 0 75rpx;
|
|
overflow: hidden;
|
|
|
|
.a {
|
|
padding: 20rpx 0;
|
|
border-bottom: 1px solid #f2f2f2;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
color: #212121;
|
|
|
|
input {
|
|
flex: 1;
|
|
margin-left: 30rpx;
|
|
line-height: 50rpx;
|
|
border-left: 1px solid #c4c4c4;
|
|
padding-left: 30rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
}
|
|
}
|
|
|
|
.b {
|
|
padding: 30rpx 0;
|
|
border-bottom: 1px solid #f2f2f2;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #f3202a;
|
|
|
|
input {
|
|
flex: 1;
|
|
margin-right: 30rpx;
|
|
line-height: 50rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
}
|
|
}
|
|
|
|
.c {
|
|
padding: 28rpx 0;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #a0a0a0;
|
|
|
|
text {
|
|
color: #ff343c;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-fd {
|
|
width: 680rpx;
|
|
line-height: 88rpx;
|
|
background: #ffbdba;
|
|
border-radius: 88rpx;
|
|
text-align: center;
|
|
margin: 0 auto;
|
|
margin-top: 120rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 600;
|
|
color: #ffffff;
|
|
|
|
&-on {
|
|
background-color: #ff343c;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|