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

252 lines
6.7 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
5 months ago
10 months ago
10 months 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" :class="{yellow: (info.orderType==1||info.feeType==1)}">
  10. {{orderTypeTxt[info.orderType||info.feeType]}}</view>
  11. <view class="schoolName">{{ $u.utils.truncateText(info.schoolName, 12) }}</view>
  12. </view>
  13. <view class="status">
  14. <view class="text">{{orderStatusTxt[info.orderStatus]}}</view>
  15. <!-- <view class="icon">
  16. <u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
  17. </view> -->
  18. </view>
  19. </view>
  20. <view class="target">
  21. <view class="row">
  22. <view class="leftLab">
  23. <view class="icon">
  24. <image src="@/static/images/car/ic_chexing.png" mode=""></image>
  25. </view>
  26. <view class="lab">学驾车型</view>
  27. </view>
  28. <view class="name">{{info.trainType}}</view>
  29. </view>
  30. <view class="row">
  31. <view class="leftLab">
  32. <view class="icon">
  33. <image src="@/static/images/car/ic_banxing.png" mode=""></image>
  34. </view>
  35. <view class="lab">所选班型</view>
  36. </view>
  37. <view class="name">{{info.className}}</view>
  38. </view>
  39. <view class="row">
  40. <view class="leftLab">
  41. <view class="icon">
  42. <image src="@/static/images/car/ic_jiaxiao.png" mode=""></image>
  43. </view>
  44. <view class="lab">驾校类型</view>
  45. </view>
  46. <view class="name">{{ info.appSchoolType }}</view>
  47. </view>
  48. <!-- <view class="row">
  49. <view class="leftLab">
  50. <view class="icon">
  51. <image src="@/static/images/car/ic_xingshi.png" mode=""></image>
  52. </view>
  53. <view class="lab">支付形式</view>
  54. </view>
  55. <view class="name">{{info.appPayForm}}</view>
  56. </view> -->
  57. <view class="row">
  58. <view class="leftLab">
  59. <view class="icon">
  60. <image src="@/static/images/car/ic_fangshi.png" mode=""></image>
  61. </view>
  62. <view class="lab">支付方式</view>
  63. </view>
  64. <view class="name">{{info.appPayType}}</view>
  65. </view>
  66. <view class="row">
  67. <view class="leftLab">
  68. <view class="icon">
  69. <image src="@/static/images/car/ic_shijian.png" mode=""></image>
  70. </view>
  71. <view class="lab">支付时间</view>
  72. </view>
  73. <view class="name">{{ $u.timeFormat(info.payTime, 'yyyy-mm-dd hh:MM:ss')}}</view>
  74. </view>
  75. </view>
  76. <view class="border_bottom">
  77. <view class="rows">
  78. <view class="label">培训费</view>
  79. <view class="value">{{$u.utils.priceTo(info.totalAmount)}}</view>
  80. </view>
  81. </view>
  82. <view class="border_bottom">
  83. <!-- <view class="rows">
  84. <view class="label hui">实际支付</view>
  85. <view class="value hui">{{$u.utils.priceTo(info.payActual)}}</view>
  86. </view>
  87. <view class="rows" v-if="info.payMent">
  88. <view class="label hui">已支付定金</view>
  89. <view class="value blue">{{$u.utils.priceTo(info.payMent)}}</view>
  90. </view>
  91. <view class="rows" v-if="info.payTail">
  92. <view class="label hui">待支付尾款</view>
  93. <view class="value blue">{{$u.utils.priceTo(info.payTail)}}</view>
  94. </view> -->
  95. <view class="btn_row">
  96. <view class="" style="min-width: 120rpx;">
  97. <view class="refundBtn" @click="goFund" v-if="refundData.refundStatus==2||!info.refundId">申请退款</view>
  98. </view>
  99. <view class="rightBtn">
  100. <view class="btnBorder" @click="downloadImage">下载凭证</view>
  101. <view class="btnBorder" @click="goVoucher">培训缴费电子凭证</view>
  102. </view>
  103. </view>
  104. </view>
  105. </view>
  106. </view>
  107. <refundInfo :info="refundData" v-if="refundData.id" />
  108. </view>
  109. </view>
  110. </template>
  111. <script>
  112. import refundInfo from './comp/refundInfo.vue'
  113. import { downloadImg } from '../comp/download.js'
  114. import {
  115. applyOrderGet,
  116. selectRefundDetail,
  117. getStudentVoucher
  118. } from '@/config/api.js'
  119. export default {
  120. components: {
  121. refundInfo
  122. },
  123. data() {
  124. return {
  125. value: '',
  126. orderId: '',
  127. info: {},
  128. refundData: {},
  129. orderTypeTxt: ['', '学费', '理科费', '考场模拟', '额外学时购买'], //1:驾校培训费用,2:理科培训费用,3:考场适应性费用,4:额外学时购买
  130. orderStatusTxt: ['待支付', '已支付', '已取消', '支付失败'], //0:待支付,1:已支付,-1:已取消,2:支付失败
  131. }
  132. },
  133. onLoad(options) {
  134. // setTimeout(obj.say, 500)
  135. if (options.orderId) {
  136. this.orderId = options.orderId
  137. this.applyOrderGetFn()
  138. }
  139. },
  140. onPullDownRefresh() {
  141. this.applyOrderGetFn()
  142. },
  143. methods: {
  144. goVoucher() {
  145. this.$goPage('/pages/mineEntry/myOrder/voucher/voucher?orderId='+ this.orderId)
  146. },
  147. debounce(func, wait) {
  148. this.timeout;
  149. let context = this; // this
  150. // let args = arguments; // event
  151. if(this.timeout) clearTimeout(this.timeout)
  152. console.log(111)
  153. this.timeout = setTimeout(function() {
  154. func()
  155. }, wait);
  156. },
  157. inputFn(val) {
  158. console.log('1111111111')
  159. },
  160. async applyOrderGetFn() {
  161. const {
  162. data: res
  163. } = await applyOrderGet({
  164. orderId: this.orderId
  165. })
  166. this.info = res
  167. uni.stopPullDownRefresh()
  168. if (res.refundId) {
  169. this.selectRefundDetailFn()
  170. }
  171. },
  172. async selectRefundDetailFn() {
  173. const {
  174. data: res
  175. } = await selectRefundDetail({
  176. id: this.info.refundId
  177. })
  178. // console.log(res)
  179. this.refundData = res
  180. uni.stopPullDownRefresh()
  181. },
  182. goFund() {
  183. this.$goPage('/pages/mineEntry/refund/refund?orderId=' + this.orderId)
  184. },
  185. async downloadImage() {
  186. let obj = {
  187. studentId: this.studentId,
  188. type: 1
  189. }
  190. const {data: imageUrl} = await getStudentVoucher(obj)
  191. // 图片链接
  192. downloadImg(imageUrl)
  193. }
  194. }
  195. }
  196. </script>
  197. <style lang="scss" scoped>
  198. @import '../comp/comp.scss';
  199. .btn_row {
  200. display: flex;
  201. justify-content: space-between;
  202. align-items: center;
  203. margin: 24rpx 0 0 0;
  204. .rightBtn {
  205. display: flex;
  206. justify-content: flex-end;
  207. .btnBorder {
  208. margin-left: 14rpx;
  209. padding: 0 16rpx;
  210. font-size: 24rpx;
  211. height: 72rpx;
  212. line-height: 72rpx;
  213. border-radius: 8rpx;
  214. }
  215. }
  216. }
  217. .feeIcon {
  218. width: 28rpx;
  219. height: 28rpx;
  220. margin-left: 12rpx;
  221. }
  222. .card {
  223. padding: 20rpx;
  224. }
  225. .pad {
  226. padding-bottom: 60rpx;
  227. }
  228. .refundBtn {
  229. width: 200rpx;
  230. height: 72rpx;
  231. background: #FFFFFF;
  232. border-radius: 8rpx;
  233. border: 2rpx solid #E8E9EC;
  234. line-height: 72rpx;
  235. font-size: 28rpx;
  236. color: #ADADAD;
  237. text-align: center;
  238. }
  239. </style>