学员端小程序
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.
 
 
 

497 lines
12 KiB

<template>
<view class="pageBgImg">
<topNavbar title="报名信息确认"></topNavbar>
<view class="pad">
<!-- #ifndef H5 -->
<view class="card">
<view class="row">
<view class="lab">扫描教练二维码</view>
<view class="rightCon">
<view class="scan" @click="scanCodeFn">扫一扫</view>
</view>
</view>
</view>
<!-- #endif -->
<view class="card">
<view class="row" >
<view class="lab">选择驾校</view>
<view class="rightCon">
<view class="row" @click="showSchool=true">
<view class="val">
<mySelect :value="form.school"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">选择车型</view>
<view class="rightCon">
<view class="row" @click="showCar=true">
<view class="val">
<mySelect :value="form.car"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">选择班型</view>
<view class="rightCon">
<view class="row" @click="showClassModel=true">
<view class="val">
<mySelect :value="form.classModel"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">选择教练</view>
<view class="rightCon">
<view class="row" @click="$goPage('/pages/indexEntry/enroll/registInfo/chooseCoach/chooseCoach')">
<view class="val">
<mySelect :value="form.coach"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">业务类型</view>
<view class="rightCon">
<u-radio-group
v-model="form.radiovalue1"
>
<u-radio
:customStyle="{marginRight: '24rpx'}"
v-for="(item, index) in radiolist1"
:key="index"
:label="item.name"
:name="item.id"
>
</u-radio>
</u-radio-group>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">是否异地转入</view>
<view class="rightCon" style="margin-left: 40rpx;">
<u-radio-group
v-model="form.radiovalue2"
@change="changeVal"
>
<u-radio
:customStyle="{marginRight: '24rpx'}"
v-for="(item, index) in radiolist2"
:key="item.id"
:label="item.name"
:name="item.id"
>
</u-radio>
</u-radio-group>
</view>
</view>
</view>
<view class="card" v-if="form.radiovalue1==2">
<view class="row">
<view class="lab long">原驾驶证号</view>
<view class="rightCon">
<view class="row">
<view class="val">{{ form.certificateCodeShow }}</view>
</view>
</view>
</view>
<view class="row">
<view class="lab long">驾驶证初领日期</view>
<view class="rightCon">
<view class="row" @click="showFirstLicenceTime=true" >
<view class="val">
<mySelect :value="form.firstLicenceTime"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab long">原准驾车型</view>
<view class="rightCon">
<view class="row" @click="showOldDriveModel=true" >
<view class="val">
<mySelect :value="form.oldDriveModel"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
</view>
<view class="card" v-if="form.radiovalue2==1">
<view class="row">
<view class="lab">来源城市</view>
<view class="rightCon">
<view class="row">
<view class="val">
<mySelect :value="form.classModel"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab ">已过科目</view>
<view class="rightCon">
<view class="row" @click="showSubjectPass=true">
<view class="val">
<mySelect :value="form.subjectPass"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">待学科目</view>
<view class="rightCon">
<view class="row" @click="showSubjectTreat=true">
<view class="val">
<mySelect :value="form.subjectTreat"/>
</view>
<view class="arrow">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">学费</view>
<view class="rightCon">
<view class="row">
<view class="val">¥100</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">代收费</view>
<view class="rightCon">
<view class="row">
<view class="val">¥100</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">合计</view>
<view class="rightCon">
<view class="row">
<view class="val blue">¥100</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">支付形式</view>
<view class="rightCon">
<u-radio-group
v-model="form.radiovalue3"
>
<u-radio
:customStyle="{marginRight: '24rpx'}"
v-for="(item, index) in radiolist3"
:key="index"
:label="item.name"
:name="item.name"
>
</u-radio>
</u-radio-group>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">优惠券</view>
<view class="rightCon">
<view class="row">
<view class="val red">-¥1000</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="row">
<view class="lab">待支付金额</view>
<view class="rightCon">
<view class="row">
<view class="val blue">¥100</view>
</view>
</view>
</view>
</view>
<view class="btnBg" @click="confirmClick">确认</view>
</view>
<u-popup :show="showPopup" mode="center" :round="8" >
<comfigPopup @comfigClick="comfigClick"/>
</u-popup>
<u-popup :show="showSchool" mode="bottom" :round="8" @close="showSchool=false">
<searchSchool @chooseSchool="chooseSchool"/>
</u-popup>
<!-- 选择班型 -->
<u-picker :show="showClassModel" :columns="columnsClassModel" keyName="label" @confirm="confirmClassModel"></u-picker>
<!-- 选择车型 -->
<u-picker :show="showCar" :columns="columnsCar" keyName="label" @confirm="confirmCar"></u-picker>
<!-- 原驾驶证初领日期 -->
<u-datetime-picker :show="showFirstLicenceTime" mode="date" @confirm="confirmFirstLicenceTime"></u-datetime-picker>
<!-- 原驾驶证学驾车型 -->
<u-popup :show="showOldDriveModel" mode="bottom" :round="8" @close="showOldDriveModel=false">
<oldDrive @pickerOldDrive="pickerOldDrive"/>
</u-popup>
<!-- 已过科目 -->
<u-picker :show="showSubjectPass" :columns="columnsSubject" keyName="label" @confirm="confirmSubjectPass"></u-picker>
<!-- 待科目 -->
<u-picker :show="showSubjectTreat" :columns="columnsSubject" keyName="label" @confirm="confirmTreat"></u-picker>
</view>
</template>
<script>
import comfigPopup from './comp/comfigPopup'
import searchSchool from './comp/searchSchool'
import oldDrive from './comp/oldDrive'
export default {
components: { comfigPopup, searchSchool, oldDrive },
data() {
return {
showPopup: false,
showClassModel: false,
showCar: false,
showFirstLicenceTime: false,
showOldDriveModel: false,
showSubjectPass: false,
showSubjectTreat: false,
columnsClassModel: [
[
{
label: '普通班型',
id: 1
},
{
label: 'vip班型',
id: 2
}
]
],
columnsSubject: [
[
{label: '科目一', id: 1},
{label: '科目二', id: 2},
{label: '科目三', id: 3},
]
],
columnsCar: [
[
{
label: 'C1',
id: 1
},
{
label: 'C2',
id: 2
}
]
],
form: {
school: '',
classModel: '',
car: '',
coach: '',
certificateCodeShow: '原驾驶证号xxx',
firstLicenceTime: '',
oldDriveModel: '',
subjectPass: '',
subjectTreat: '',
radiovalue2: 1,
radiovalue1: 1,
},
showSchool: false,
radiolist1: [ {name: '初领', id: 1}, {name: '增驾', id: 2}],
radiolist2: [ {name: '是', id: 1}, {name: '否', id: 2}],
radiolist3: [ {name: '全款', id: 1}, {name: '预付款', id: 2}]
}
},
onLoad() {
this.$on('upDateCoachItem',(item)=>{
console.log(item)
this.form.coach = item.coachName
})
},
methods: {
// 选择驾校
chooseSchool(item) {
this.form.school = item.schoolName
console.log(item)
this.showSchool = false
},
// 选择班型
confirmClassModel(val) {
let item = val.value[0]
console.log(item)
this.showClassModel = false
this.form.classModel = item.label
},
// 选择车型
confirmCar(val) {
let item = val.value[0]
console.log(item)
this.showCar = false
this.form.car = item.label
},
// 选择原驾驶证初领日期
confirmFirstLicenceTime(val) {
console.log(val)
this.form.firstLicenceTime = uni.$u.timeFormat(val.value, 'yyyy-mm-dd');
this.showFirstLicenceTime = false
},
// 选择原准驾车型
pickerOldDrive(val) {
this.form.oldDriveModel = val
this.showOldDriveModel = false
console.log(val)
},
// 选择已过科目
confirmSubjectPass(val) {
let item = val.value[0]
this.form.subjectPass = item.label
this.showSubjectPass = false
},
// 选择已过科目
confirmTreat(val) {
let item = val.value[0]
this.form.subjectTreat = item.label
this.showSubjectTreat = false
},
// 扫码
scanCodeFn() {
let _this = this
uni.scanCode({
success: function(res) {
console.log('条码类型:' + res.scanType);
console.log('条码内容:' + res.result);
}
});
},
changeVal(val) {
console.log(val)
},
// 点击确认
confirmClick() {
this.showPopup = true
},
comfigClick(val) {
console.log(val)
this.showPopup = false
if(val) {
this.$goPage('/pages/indexEntry/enroll/signContract/signContract')
}
}
}
}
</script>
<style lang="scss" scoped>
.pad {
padding-bottom: 66rpx;
}
.card {
padding: 10rpx 40rpx 10rpx 32rpx;
margin-bottom: 20rpx;
.row {
height: 100rpx;
display: flex;
align-items: center;
width: 100%;
.lab {
width: 152rpx;
line-height: 100rpx;
white-space: nowrap;
&.long {
width: 230rpx;
}
}
.scan {
margin-left: auto;
width: 130rpx;
height: 60rpx;
background: rgba(25,137,250,0.1);
border-radius: 8rpx;
border: 2rpx solid #1989FA;
background: #E8F3FE;
text-align: center;
line-height: 60rpx;
color: $themC;
}
.rightCon {
flex: 1;
width: 0;
display: flex;
.val {
flex: 1;
width: 0;
input {
font-size: 28rpx;
}
&.blue {
color: $themC;
}
&.red {
color: #FF6A2A;
}
}
.icon {
width: 30rpx;
height: 30rpx;
u-icon {
}
}
}
}
}
.btnBg {
width: 396rpx;
margin: 100rpx auto 0 auto;
}
</style>