|
|
|
|
@ -1,45 +1,66 @@ |
|
|
|
|
<template> |
|
|
|
|
<view class="login"> |
|
|
|
|
<view class="refund-navbar"> |
|
|
|
|
<u-navbar title="" :border-bottom="false" :background="background"></u-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="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}}</text> |
|
|
|
|
<text v-if="showCountDown">{{ countdown }}</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 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 |
|
|
|
|
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' |
|
|
|
|
export default { |
|
|
|
|
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"; |
|
|
|
|
export default { |
|
|
|
|
components: { |
|
|
|
|
mpWeiXinMobile |
|
|
|
|
mpWeiXinMobile, |
|
|
|
|
}, |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
@ -48,24 +69,24 @@ |
|
|
|
|
currentIndex: 0, |
|
|
|
|
background: { |
|
|
|
|
background: `url(${this.$picUrl}/static/news/login-bg.png) center top no-repeat`, |
|
|
|
|
backgroundSize: '100% auto', |
|
|
|
|
backgroundSize: "100% auto", |
|
|
|
|
}, |
|
|
|
|
phoneNum: '', |
|
|
|
|
semCode: '', |
|
|
|
|
phoneNum: "", |
|
|
|
|
semCode: "", |
|
|
|
|
countdown: 60, |
|
|
|
|
countDownFun: null, |
|
|
|
|
code: '', |
|
|
|
|
refereeId: "" |
|
|
|
|
} |
|
|
|
|
code: "", |
|
|
|
|
refereeId: "", |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
onLoad(o) { |
|
|
|
|
this.refereeId = o.refereeId |
|
|
|
|
this.refereeId = o.refereeId; |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
toTextPage(n) { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: "/pages/news1/text?pageFlag=" + n |
|
|
|
|
}) |
|
|
|
|
url: "/pages/news1/text?pageFlag=" + n, |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
validatePhoneNumber(phone) { |
|
|
|
|
// 定义手机号码的正则表达式 |
|
|
|
|
@ -79,102 +100,119 @@ |
|
|
|
|
}, |
|
|
|
|
getCode() { |
|
|
|
|
// 获取验证码 |
|
|
|
|
const that = this |
|
|
|
|
const that = this; |
|
|
|
|
if (!that.validatePhoneNumber(that.phoneNum)) { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: '请输入正确的手机号' |
|
|
|
|
}) |
|
|
|
|
return |
|
|
|
|
title: "请输入正确的手机号", |
|
|
|
|
}); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
that.showCountDown = !that.showCountDown |
|
|
|
|
that.showCountDown = !that.showCountDown; |
|
|
|
|
that.countDownFun = setInterval(() => { |
|
|
|
|
if (that.countdown >= 1) { |
|
|
|
|
that.countdown = that.countdown - 1 |
|
|
|
|
that.countdown = that.countdown - 1; |
|
|
|
|
} else { |
|
|
|
|
that.showCountDown = false |
|
|
|
|
that.countdown = 60 |
|
|
|
|
clearInterval(that.countDownFun) |
|
|
|
|
that.showCountDown = false; |
|
|
|
|
that.countdown = 60; |
|
|
|
|
clearInterval(that.countDownFun); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}, 1000) |
|
|
|
|
}, 1000); |
|
|
|
|
CaptchaApi.sendSmsCaptcha({ |
|
|
|
|
form: { |
|
|
|
|
mobile: that.phoneNum |
|
|
|
|
} |
|
|
|
|
}).then(res => { |
|
|
|
|
mobile: that.phoneNum, |
|
|
|
|
}, |
|
|
|
|
}).then((res) => { |
|
|
|
|
if (res.status == 200) { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: res.message |
|
|
|
|
}) |
|
|
|
|
title: res.message, |
|
|
|
|
}); |
|
|
|
|
} else { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: res.message |
|
|
|
|
}) |
|
|
|
|
title: res.message, |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
login() { |
|
|
|
|
let that = this; |
|
|
|
|
if(that.isCheckout == false){ |
|
|
|
|
that.$toast('请勾选用户协议') |
|
|
|
|
return ; |
|
|
|
|
if (that.isCheckout == false) { |
|
|
|
|
that.$toast("请勾选用户协议"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
// 登录 |
|
|
|
|
if (!that.validatePhoneNumber(that.phoneNum)) { |
|
|
|
|
that.$toast('请输入正确的手机号') |
|
|
|
|
return |
|
|
|
|
that.$toast("请输入正确的手机号"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (that.semCode == '') { |
|
|
|
|
that.$toast('请输入验证码') |
|
|
|
|
return |
|
|
|
|
if (that.semCode == "") { |
|
|
|
|
that.$toast("请输入验证码"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
uni.login({ |
|
|
|
|
provider: 'weixin', |
|
|
|
|
success: function(res) { |
|
|
|
|
|
|
|
|
|
store.dispatch('Login', { |
|
|
|
|
provider: "weixin", |
|
|
|
|
success: function (res) { |
|
|
|
|
store |
|
|
|
|
.dispatch("Login", { |
|
|
|
|
smsCode: that.semCode, |
|
|
|
|
mobile: that.phoneNum, |
|
|
|
|
refereeId: that.refereeId, |
|
|
|
|
isParty: false, |
|
|
|
|
partyData: {}, |
|
|
|
|
ucode: res.code, |
|
|
|
|
// refereeId: false |
|
|
|
|
}) |
|
|
|
|
.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 |
|
|
|
|
// ucode: res.code, |
|
|
|
|
// refereeId: false |
|
|
|
|
}).then(res => { |
|
|
|
|
uni.setStorageSync('token', res.data.token) |
|
|
|
|
that.$toast(res.message) |
|
|
|
|
that.getUserInfo() |
|
|
|
|
setTimeout(() => that.onNavigateBack(1), 2000) |
|
|
|
|
}) |
|
|
|
|
.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) |
|
|
|
|
}) |
|
|
|
|
UserApi.info().then((result) => { |
|
|
|
|
uni.setStorageSync("userInfo", result.data.userInfo); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
onNavigateBack(delta = 1) { |
|
|
|
|
// 登录成功返回原页面 |
|
|
|
|
const pages = getCurrentPages() |
|
|
|
|
const pages = getCurrentPages(); |
|
|
|
|
if (pages.length > 1) { |
|
|
|
|
uni.navigateBack({ |
|
|
|
|
delta: Number(delta || 1) |
|
|
|
|
}) |
|
|
|
|
delta: Number(delta || 1), |
|
|
|
|
}); |
|
|
|
|
} else { |
|
|
|
|
this.$navTo('pages/index/index') |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
this.$navTo("pages/index/index"); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
.login { |
|
|
|
|
.login { |
|
|
|
|
width: 100%; |
|
|
|
|
background: #fffafb url(https://www.royaum.com.cn/static/news/login-bg.png) center top no-repeat; |
|
|
|
|
background: #fffafb url(https://www.royaum.com.cn/static/news/login-bg.png) |
|
|
|
|
center top no-repeat; |
|
|
|
|
background-size: 100% auto; |
|
|
|
|
min-height: 100vh; |
|
|
|
|
|
|
|
|
|
@ -192,7 +230,7 @@ |
|
|
|
|
.b { |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
font-weight: 400; |
|
|
|
|
color: #5A5A5A; |
|
|
|
|
color: #5a5a5a; |
|
|
|
|
line-height: 50rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -203,7 +241,7 @@ |
|
|
|
|
|
|
|
|
|
.a { |
|
|
|
|
padding: 20rpx 0; |
|
|
|
|
border-bottom: 1px solid #F2F2F2; |
|
|
|
|
border-bottom: 1px solid #f2f2f2; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
font-size: 32rpx; |
|
|
|
|
@ -214,7 +252,7 @@ |
|
|
|
|
flex: 1; |
|
|
|
|
margin-left: 30rpx; |
|
|
|
|
line-height: 50rpx; |
|
|
|
|
border-left: 1px solid #C4C4C4; |
|
|
|
|
border-left: 1px solid #c4c4c4; |
|
|
|
|
padding-left: 30rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #212121; |
|
|
|
|
@ -223,12 +261,12 @@ |
|
|
|
|
|
|
|
|
|
.b { |
|
|
|
|
padding: 30rpx 0; |
|
|
|
|
border-bottom: 1px solid #F2F2F2; |
|
|
|
|
border-bottom: 1px solid #f2f2f2; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
font-weight: 400; |
|
|
|
|
color: #F3202A; |
|
|
|
|
color: #f3202a; |
|
|
|
|
|
|
|
|
|
input { |
|
|
|
|
flex: 1; |
|
|
|
|
@ -243,10 +281,10 @@ |
|
|
|
|
padding: 28rpx 0; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
font-weight: 400; |
|
|
|
|
color: #A0A0A0; |
|
|
|
|
color: #a0a0a0; |
|
|
|
|
|
|
|
|
|
text { |
|
|
|
|
color: #FF343C; |
|
|
|
|
color: #ff343c; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -254,18 +292,18 @@ |
|
|
|
|
&-fd { |
|
|
|
|
width: 680rpx; |
|
|
|
|
line-height: 88rpx; |
|
|
|
|
background: #FFBDBA; |
|
|
|
|
background: #ffbdba; |
|
|
|
|
border-radius: 88rpx; |
|
|
|
|
text-align: center; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 120rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
font-weight: 600; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
color: #ffffff; |
|
|
|
|
|
|
|
|
|
&-on { |
|
|
|
|
background-color: #FF343C; |
|
|
|
|
} |
|
|
|
|
background-color: #ff343c; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
fanfan
11 months ago