洛阳学员端
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.

127 lines
2.6 KiB

10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
  1. <template>
  2. <view class="pageBg">
  3. <view class="pad">
  4. <view class="card">
  5. <view class="h1"><text class="active">现学驾信息</text></view>
  6. <view class="row">
  7. <view class="lab">学驾车型</view>
  8. <view class="val">C1</view>
  9. </view>
  10. <view class="row">
  11. <view class="lab">学车班型</view>
  12. <view class="val">C1手动挡一对一VIP班</view>
  13. </view>
  14. <view class="row">
  15. <view class="lab">学驾培训费</view>
  16. <view class="val blue">3000</view>
  17. </view>
  18. </view>
  19. <view class="card">
  20. <view class="h1"><text class="active">变更学驾信息</text></view>
  21. <view class="row">
  22. <view class="lab">学驾车型</view>
  23. <view class="val" @click="showModel=true">
  24. <input type="text" placeholder="请选择" disabled="">
  25. </view>
  26. <view class="arrow" @click="showModel=true">
  27. <u-icon name="arrow-right"></u-icon>
  28. </view>
  29. </view>
  30. <view class="row">
  31. <view class="lab">学车班型</view>
  32. <view class="val">
  33. <input type="text" placeholder="请选择" disabled="">
  34. </view>
  35. <view class="arrow">
  36. <u-icon name="arrow-right"></u-icon>
  37. </view>
  38. </view>
  39. <view class="row">
  40. <view class="lab">学驾培训费</view>
  41. <view class="val hui">-</view>
  42. </view>
  43. </view>
  44. <view class="card">
  45. <view class="row">
  46. <view class="lab">补交金额</view>
  47. <view class="val hui">-</view>
  48. </view>
  49. </view>
  50. <view class="footerBtn">
  51. <view class="btnBg">下一步</view>
  52. </view>
  53. </view>
  54. <u-picker :show="showModel" :columns="modelArr" keyName="lab" @confirm="confirmModel" @cancel="showModel=false"></u-picker>
  55. </view>
  56. </template>
  57. <script>
  58. export default {
  59. data() {
  60. return {
  61. showModel: false,
  62. modelArr: [
  63. [
  64. {lab: 'C1',id: 1},
  65. {lab: 'C2',id: 2},
  66. ]
  67. ]
  68. }
  69. },
  70. methods: {
  71. confirmModel(val) {
  72. let item = val.value[0]
  73. this.showModel = false
  74. }
  75. }
  76. }
  77. </script>
  78. <style lang="scss" scoped>
  79. .h1 {
  80. margin-bottom: 10rpx;
  81. }
  82. .card {
  83. margin-bottom: 20rpx;
  84. padding: 20rpx 20rpx 10rpx 20rpx;
  85. .row {
  86. height: 88rpx;
  87. line-height: 88rpx;
  88. display: flex;
  89. align-items: center;
  90. border-bottom: 1rpx solid #F6F7FA;
  91. &:last-child {
  92. border-bottom: none;
  93. }
  94. .lab {
  95. font-size: 28rpx;
  96. color: #333;
  97. width: 160rpx;
  98. }
  99. .val {
  100. flex: 1;
  101. height: 100%;
  102. input {
  103. display: block;
  104. height: 100%;
  105. font-size: 28rpx;
  106. }
  107. &.blue {
  108. color: $themC;
  109. font-weight: 600;
  110. }
  111. &.hui {
  112. color: #ADADAD;
  113. font-weight: 400;
  114. }
  115. }
  116. .arrow {
  117. u-icon {
  118. }
  119. }
  120. }
  121. }
  122. </style>