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

147 lines
4.1 KiB

1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
  1. <template>
  2. <view class="pageBgImg">
  3. <topNavbar title="订单详情"></topNavbar>
  4. <view class="pad">
  5. <view class="card">
  6. <view class="consultItem">
  7. <view class="top_row">
  8. <view class="flex">
  9. <view class="tag">学费</view>
  10. <view class="schoolName">xx模拟驾驶馆</view>
  11. </view>
  12. <view class="status">
  13. <view class="text">尾款待支付</view>
  14. <view class="icon">
  15. <u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
  16. </view>
  17. </view>
  18. </view>
  19. <view class="target">
  20. <view class="row">
  21. <view class="leftLab">
  22. <view class="icon">
  23. <image src="@/static/images/car/ic_chexing.png" mode=""></image>
  24. </view>
  25. <view class="lab">学驾车型</view>
  26. </view>
  27. <view class="name">C1</view>
  28. </view>
  29. <view class="row">
  30. <view class="leftLab">
  31. <view class="icon">
  32. <image src="@/static/images/car/ic_banxing.png" mode=""></image>
  33. </view>
  34. <view class="lab">所选班型</view>
  35. </view>
  36. <view class="name">C2自动挡一对一VIP班</view>
  37. </view>
  38. <view class="row">
  39. <view class="leftLab">
  40. <view class="icon">
  41. <image src="@/static/images/car/ic_jiaxiao.png" mode=""></image>
  42. </view>
  43. <view class="lab">驾校类型</view>
  44. </view>
  45. <view class="name">合作驾校</view>
  46. </view>
  47. <view class="row">
  48. <view class="leftLab">
  49. <view class="icon">
  50. <image src="@/static/images/car/ic_xingshi.png" mode=""></image>
  51. </view>
  52. <view class="lab">支付形式</view>
  53. </view>
  54. <view class="name">全额支付</view>
  55. </view>
  56. <view class="row">
  57. <view class="leftLab">
  58. <view class="icon">
  59. <image src="@/static/images/car/ic_fangshi.png" mode=""></image>
  60. </view>
  61. <view class="lab">支付方式</view>
  62. </view>
  63. <view class="name">微信支付</view>
  64. </view>
  65. <view class="row">
  66. <view class="leftLab">
  67. <view class="icon">
  68. <image src="@/static/images/car/ic_shijian.png" mode=""></image>
  69. </view>
  70. <view class="lab">支付时间</view>
  71. </view>
  72. <view class="name">2023/08/08 10:00:00</view>
  73. </view>
  74. </view>
  75. <view class="border_bottom">
  76. <view class="rows">
  77. <view class="label">培训费总价</view>
  78. <!-- <view class="value">2000.02</view> -->
  79. </view>
  80. <view class="rows">
  81. <view class="label hui">学驾培训费</view>
  82. <view class="value hui">2000.02</view>
  83. </view>
  84. <view class="rows">
  85. <view class="flex">
  86. <view class="label hui">代收费</view>
  87. <view class="feeIcon">
  88. <image src="@/static/images/car/ic_fangshi.png" mode=""></image>
  89. </view>
  90. </view>
  91. <view class="value hui">2000.02</view>
  92. </view>
  93. </view>
  94. <view class="border_bottom">
  95. <view class="rows">
  96. <view class="label hui">实际支付</view>
  97. <view class="value hui">2000.02</view>
  98. </view>
  99. <view class="rows">
  100. <view class="label hui">已支付定金</view>
  101. <view class="value blue">1000.02</view>
  102. </view>
  103. <view class="rows">
  104. <view class="label hui">待支付尾款</view>
  105. <view class="value blue">2000.02</view>
  106. </view>
  107. <view class="refundBtn">申请退款</view>
  108. </view>
  109. </view>
  110. </view>
  111. <refundInfo/>
  112. </view>
  113. </view>
  114. </template>
  115. <script>
  116. import refundInfo from './comp/refundInfo.vue'
  117. export default {
  118. components: { refundInfo }
  119. }
  120. </script>
  121. <style lang="scss" scoped>
  122. @import '../comp/comp.scss';
  123. .feeIcon {
  124. width: 28rpx;
  125. height: 28rpx;
  126. margin-left: 12rpx;
  127. }
  128. .card {
  129. padding: 20rpx;
  130. }
  131. .pad {
  132. padding-bottom: 60rpx;
  133. }
  134. .refundBtn {
  135. width: 200rpx;
  136. height: 72rpx;
  137. background: #FFFFFF;
  138. border-radius: 8rpx;
  139. border: 2rpx solid #E8E9EC;
  140. line-height: 72rpx;
  141. margin: 24rpx 0 0 0;
  142. font-size: 28rpx;
  143. color: #ADADAD;
  144. text-align: center;
  145. }
  146. </style>