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.
126 lines
2.5 KiB
126 lines
2.5 KiB
<template>
|
|
<view class="pageBgImg">
|
|
<topNavbar title="个人中心"></topNavbar>
|
|
<view class="pad">
|
|
<view class="card">
|
|
<view class="h2">现学驾信息</view>
|
|
<view class="row">
|
|
<view class="lab">学驾车型</view>
|
|
<view class="val">C1</view>
|
|
</view>
|
|
<view class="row">
|
|
<view class="lab">学车班型</view>
|
|
<view class="val">C1手动挡一对一VIP班</view>
|
|
</view>
|
|
<view class="row">
|
|
<view class="lab">学驾培训费</view>
|
|
<view class="val blue">￥3000</view>
|
|
</view>
|
|
</view>
|
|
<view class="card">
|
|
<view class="h2">变更学驾信息</view>
|
|
<view class="row">
|
|
<view class="lab">学驾车型</view>
|
|
<view class="val" @click="showModel=true">
|
|
<input type="text" placeholder="请选择" disabled="">
|
|
</view>
|
|
<view class="arrow" @click="showModel=true">
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="row">
|
|
<view class="lab">学车班型</view>
|
|
<view class="val">
|
|
<input type="text" placeholder="请选择" disabled="">
|
|
</view>
|
|
<view class="arrow">
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="row">
|
|
<view class="lab">学驾培训费</view>
|
|
<view class="val hui">￥-</view>
|
|
</view>
|
|
</view>
|
|
<view class="btnBg">下一步</view>
|
|
</view>
|
|
<u-picker :show="showModel" :columns="modelArr" keyName="lab" @confirm="confirmModel" @cancel="showModel=false"></u-picker>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
showModel: false,
|
|
modelArr: [
|
|
[
|
|
{lab: 'C1',id: 1},
|
|
{lab: 'C2',id: 2},
|
|
]
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
confirmModel(val) {
|
|
let item = val.value[0]
|
|
this.showModel = false
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.card {
|
|
margin-bottom: 24rpx;
|
|
padding: 16rpx 28rpx;
|
|
.h2 {
|
|
color: $themC;
|
|
font-weight: 600;
|
|
margin: 10rpx 0 20rpx 0;
|
|
}
|
|
|
|
.row {
|
|
height: 92rpx;
|
|
line-height: 92rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
.lab {
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
font-weight: 600;
|
|
width: 160rpx;
|
|
}
|
|
|
|
.val {
|
|
flex: 1;
|
|
height: 100%;
|
|
input {
|
|
display: block;
|
|
height: 100%;
|
|
font-size: 28rpx;
|
|
}
|
|
&.blue {
|
|
color: $themC;
|
|
font-weight: 600;
|
|
}
|
|
&.hui {
|
|
color: #ADADAD;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
.arrow {
|
|
u-icon {
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.btnBg {
|
|
width: 396rpx;
|
|
margin: 72rpx auto;
|
|
|
|
}
|
|
</style>
|