工行这里学车报名流程h5
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.
 
 
 
 

223 lines
5.6 KiB

<template>
<view class="main">
<view class="redTps">
请填写报名学员的手机号该手机号作为学员唯一报名手机号一经确定不可更改
</view>
<view class="content">
<view class="logo">
<image src="../../static/images/logo.png" mode=""></image>
</view>
<view class="form">
<view class="form_item">
<input type="number" value="" v-model="params.phone" placeholder="请输入手机号"/>
</view>
<view class="form_item">
<view class="inputBox">
<input type="number" value="" v-model="params.code" placeholder="请输入验证码"/>
</view>
<view class="verificationCode" @click="goSms">{{codeText}}</view>
</view>
</view>
<view class="btn" @click="gologin">确定</view>
<view class="radioWrap">
<view>
<u-checkbox-group :wrap='true'>
<u-checkbox v-model="isCheck" shape="circle" label-size="24rpx">
我已阅读并同意 <text
@click.stop="$goPage('/pages/application/privacyAgreement/privacyAgreement?type=2')">《用户协议》</text>
和 <text
@click.stop="$goPage('/pages/application/privacyAgreement/privacyAgreement?type=1')">隐私协议</text>
</u-checkbox>
</u-checkbox-group>
</view>
</view>
</view>
</view>
</template>
<script>
import indexApi from '@/api/index.js'
export default {
data() {
return {
isCheck: false,
codeText: '获取验证码',
params: {},
showBtnOn: false
}
},
methods: {
//发送短信
async goSms() {
const {
params
} = this
const reg = /^(0|86|17951)?(1[0-9])[0-9]{9}$/;
console.log('666')
// const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
if (!params.phone) return this.$u.toast('请输入手机号');
if (!reg.test(params.phone)) return this.$u.toast('手机号格式有误');
if (this.showBtnOn) return
const [message, data] = await indexApi.getLoginRegistCode({
codeType: 1,
phone: params.phone,
})
console.log(data)
if (data.code != 0) return this.$u.toast(data.message);
// this.data = data
// 获取验证码
var time = 60;
var timer = setInterval(() => {
time--;
this.codeText = time + "秒重发"
this.showBtnOn = true;
if (time == 0) {
clearInterval(timer);
this.codeText = "获取验证码";
this.showBtnOn = false;
}
}, 1000);
},
// 验证码登录
async gologin() {
const {
params
} = this
const reg = /^(0|86|17951)?(1[0-9])[0-9]{9}$/;
if (!params.phone) return uni.$u.toast('请输入手机号');
if (!reg.test(params.phone)) return uni.$u.toast('手机号格式有误');
if (!params.code) return uni.$u.toast('请输入验证码');
if (!this.isCheck) return uni.$u.toast('请勾选用户协议');
const [err, data] = await indexApi.loginSMS({
personnelType: 1,
username: params.phone,
code: params.code,
loginType: 1,
})
if (data.code != 0) return uni.$u.toast(data.message);
uni.setStorageSync('Authorization', data.data.token);
uni.setStorageSync('studentId', data.data.studentId);
await this.getOwnerAccountBase()
this.createTrainingApplySimpleFn()
},
//获取用户信息
async getOwnerAccountBase() {
const [err, data] = await indexApi.getOwnerAccountBase();
if (data.code != 0) return uni.$u.toast(data.message);
uni.setStorageSync('userInfo', data.data);
},
// 第一步先报名
async createTrainingApplySimpleFn() {
let trainingSchoolId = this.$store.state.currentSchool.trainingSchoolId
let trainingClassId = this.$store.state.classChooseItem.trainingClassId
const [nulls, res] = await indexApi.createTrainingApplySimple({trainingSchoolId, trainingClassId})
if(res.code==0) {
this.$goPage('/pages/application/fillRegistInfo?trainingApplyId='+ res.data)
}else if(res.code==502) {
// 已经报名过这个学校了 存在未支付订单
this.$u.toast(res.message)
this.$goPage('/pages/application/fillRegistInfo?trainingApplyId='+ res.data)
}
}
}
}
</script>
<style lang="scss" scoped>
.main {
background: #fff;
height: 100vh;
}
.redTps {
width: 100%;
background: #FCEAEA;
font-size: 28rpx;
color: #E63633;
padding: 24rpx 32rpx;
}
.radioWrap {
display: flex;
justify-content: flex-start;
align-items: center;
/deep/.radio-btn {
margin-right: -9rpx !important;
}
radio {
zoom: .8;
}
view:nth-child(2) {
font-size: 24rpx;
color: #bfbfbf;
}
text {
color: #218DFF;
}
}
.content {
width: 100%;
padding: 16% 32rpx 0 32rpx;
.logo {
width: 100rpx;
height: 100rpx;
margin: 0 auto;
}
.form {
padding: 100rpx 0 40rpx 0;
.form_item {
display: flex;
align-items: center;
justify-content: space-between;
height: 112rpx;
font-size: 32rpx;
line-height: 112rpx;
border-bottom: 1rpx solid #E8E9EC;
input {
display: block;
width: 100%;
height: 100%;
font-size: 32rpx;
color: #333;
}
.verificationCode {
font-size: 28rpx;
color: #1989FA;
position: relative;
padding: 0 0 0 24rpx;
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 2rpx;
height: 40rpx;
background-color: #E8E9EC;
}
}
}
}
.btn {
height: 96rpx;
background: linear-gradient(180deg, #3593FB 0%, #53D3E5 100%);
border-radius: 50rpx;
font-size: 36rpx;
color: #fff;
text-align: center;
line-height: 96rpx;
margin-bottom: 40rpx;
}
}
</style>