2023-09-22 13:41:31 +08:00

166 lines
3.4 KiB
Vue

<template>
<view class="login_content">
<view class="login_content_bg" />
<u-navbar :autoBack="true" bgColor="transparent" :safeAreaInsetTop="true" :placeholder="true" />
<view class="login_content_body">
<view class="login_title">手机验证码登录</view>
<view class="login_tips">未注册的手机验证后自动创建账户</view>
<view class="login_mobile">
<u-input v-model="mobileCode" type="number" placeholder="请输入手机验证码" border="node" clearable
fontSize="44rpx">
<template #prefix>
<text class="login_mobile_tips"></text>
</template>
</u-input>
</view>
<view class="login_mobile_Code" @tap="confirmLogin">
<text>确认登录</text>
</view>
</view>
</view>
</template>
<script>
import {
mySetStorage
} from '@/utils/storage/index.js'
export default {
data() {
return {
mobileCode: '',
bookTitle: '',
bookSid: '',
chapterorder: '',
bookId: ''
}
},
onLoad(options) {
this.phone = options.phone;
// this.bookTitle = options.t;
this.bookSid = options.sid;
this.chapterorder = options.c;
this.bookId = options.i;
this.toPath = options.to;
},
methods: {
confirmLogin() {
const bookSid = this.bookSid;
const chapterorder = this.chapterorder;
const bookId = this.bookId;
const toPath = this.toPath;
let toPathUrl = ''
const toPathObj = {
'1': `/pages/novelReading/novelReading?sid=${bookSid}&id=${bookId}&c=${chapterorder}`,
'2':`/pages/myInfo/myInfo/index`
}
if (toPathObj[toPath]) {
toPathUrl = `${toPathObj[toPath]}`
} else {
toPathUrl = `/pages/bookCity/bookCity/index`
}
const data = {
phone: this.phone,
code: this.mobileCode
}
uni.showLoading({
title: '加载中...'
});
uni.$u.http.post('/Login', data).then((res) => {
uni.hideLoading();
const {
token,
uid
} = res.data;
if (res.status == 1) {
mySetStorage('token', token);
mySetStorage('uid', uid);
uni.reLaunch({
url: toPathUrl
})
}
}).catch((err) => {
uni.hideLoading();
console.log(err, "========")
})
}
}
}
</script>
<style lang="scss" scoped>
/deep/.u-input__content {
height: 116rpx;
background-color: #fff;
border-radius: 58rpx;
}
// ::v-deep
/deep/.u-input--square {
padding: 0 !important;
}
.login_content {
width: 100%;
height: 100%;
.login_content_bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 1056rpx;
background: url('/static/images/login_bg.png') no-repeat;
background-size: 100% 100%;
}
.login_content_body {
position: relative;
z-index: 2;
width: 100%;
padding: 40rpx 32rpx;
box-sizing: border-box;
.login_title {
font-size: 56rpx;
color: #1D242C;
line-height: 1;
}
.login_tips {
font-size: 28rpx;
color: #524E5C;
line-height: 1;
margin-top: 32rpx;
}
.login_mobile {
margin-top: 90rpx;
.login_mobile_tips {
margin: 0 32rpx;
font-size: 44rpx;
color: #1D242C;
}
}
.login_mobile_Code {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 116rpx;
line-height: 1;
background: linear-gradient(to left, #F27E49, #F25A14);
color: #fff;
font-size: 40rpx;
margin-top: 64rpx;
border-radius: 58rpx;
}
.login_mobile_Code.active {
background-color: #999999;
}
}
}
</style>