|
|
<template> <view class="pageBgImg"> <topNavbar title="订单详情"></topNavbar> <view class="pad"> <view class="card"> <view class="consultItem"> <view class="top_row"> <view class="flex"> <view class="tag" :class="{yellow: (info.orderType==1||info.feeType==1)}"> {{orderTypeTxt[info.orderType||info.feeType]}}</view> <view class="schoolName">{{ $u.utils.truncateText(info.schoolName, 12) }}</view> </view> <view class="status"> <view class="text">{{orderStatusTxt[info.orderStatus]}}</view> <!-- <view class="icon"> <u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon> </view> --> </view> </view> <view class="target"> <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_chexing.png" mode=""></image> </view> <view class="lab">学驾车型</view> </view> <view class="name">{{info.trainType}}</view> </view> <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_banxing.png" mode=""></image> </view> <view class="lab">所选班型</view> </view> <view class="name">{{info.className}}</view> </view> <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_jiaxiao.png" mode=""></image> </view> <view class="lab">驾校类型</view> </view> <view class="name">{{ info.appSchoolType }}</view> </view> <!-- <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_xingshi.png" mode=""></image> </view> <view class="lab">支付形式</view> </view> <view class="name">{{info.appPayForm}}</view> </view> --> <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_fangshi.png" mode=""></image> </view> <view class="lab">支付方式</view> </view> <view class="name">{{info.appPayType}}</view> </view> <view class="row"> <view class="leftLab"> <view class="icon"> <image src="@/static/images/car/ic_shijian.png" mode=""></image> </view> <view class="lab">支付时间</view> </view> <view class="name">{{ $u.timeFormat(info.payTime, 'yyyy-mm-dd hh:MM:ss')}}</view> </view> </view> <view class="border_bottom"> <view class="rows"> <view class="label">培训费</view> <view class="value">¥{{$u.utils.priceTo(info.totalAmount)}}</view> </view> </view> <view class="border_bottom"> <!-- <view class="rows"> <view class="label hui">实际支付</view> <view class="value hui">¥{{$u.utils.priceTo(info.payActual)}}</view> </view> <view class="rows" v-if="info.payMent"> <view class="label hui">已支付定金</view> <view class="value blue">¥{{$u.utils.priceTo(info.payMent)}}</view> </view> <view class="rows" v-if="info.payTail"> <view class="label hui">待支付尾款</view> <view class="value blue">¥{{$u.utils.priceTo(info.payTail)}}</view> </view> --> <view class="btn_row"> <view class="" style="min-width: 120rpx;"> <view class="refundBtn" @click="goFund" v-if="refundData.refundStatus==2||!info.refundId">申请退款</view> </view> <view class="rightBtn"> <view class="btnBorder" @click="downloadImage">下载凭证</view> <view class="btnBorder" @click="goVoucher">培训缴费电子凭证</view> </view> </view> </view> </view> </view> <refundInfo :info="refundData" v-if="refundData.id" /> </view> </view> </template>
<script> import refundInfo from './comp/refundInfo.vue' import { downloadImg } from '../comp/download.js' import { applyOrderGet, selectRefundDetail, getStudentVoucher } from '@/config/api.js' export default { components: { refundInfo }, data() { return { value: '', orderId: '', info: {}, refundData: {}, orderTypeTxt: ['', '学费', '理科费', '考场模拟', '额外学时购买'], //1:驾校培训费用,2:理科培训费用,3:考场适应性费用,4:额外学时购买
orderStatusTxt: ['待支付', '已支付', '已取消', '支付失败'], //0:待支付,1:已支付,-1:已取消,2:支付失败
} }, onLoad(options) {
// setTimeout(obj.say, 500)
if (options.orderId) { this.orderId = options.orderId this.applyOrderGetFn() }
}, onPullDownRefresh() { this.applyOrderGetFn()
}, methods: { goVoucher() { this.$goPage('/pages/mineEntry/myOrder/voucher/voucher?orderId='+ this.orderId) }, debounce(func, wait) { this.timeout; let context = this; // this
// let args = arguments; // event
if(this.timeout) clearTimeout(this.timeout) console.log(111) this.timeout = setTimeout(function() { func() }, wait); },
inputFn(val) { console.log('1111111111') }, async applyOrderGetFn() { const { data: res } = await applyOrderGet({ orderId: this.orderId }) this.info = res uni.stopPullDownRefresh() if (res.refundId) { this.selectRefundDetailFn() } }, async selectRefundDetailFn() { const { data: res } = await selectRefundDetail({ id: this.info.refundId }) // console.log(res)
this.refundData = res uni.stopPullDownRefresh() },
goFund() { this.$goPage('/pages/mineEntry/refund/refund?orderId=' + this.orderId) }, async downloadImage() { let obj = { studentId: this.studentId, type: 1 } const {data: imageUrl} = await getStudentVoucher(obj) // 图片链接
downloadImg(imageUrl) } } } </script>
<style lang="scss" scoped> @import '../comp/comp.scss'; .btn_row { display: flex; justify-content: space-between; align-items: center; margin: 24rpx 0 0 0; .rightBtn { display: flex; justify-content: flex-end; .btnBorder { margin-left: 14rpx; padding: 0 16rpx; font-size: 24rpx; height: 72rpx; line-height: 72rpx; border-radius: 8rpx; } } } .feeIcon { width: 28rpx; height: 28rpx; margin-left: 12rpx; }
.card { padding: 20rpx; }
.pad { padding-bottom: 60rpx; }
.refundBtn { width: 200rpx; height: 72rpx; background: #FFFFFF; border-radius: 8rpx; border: 2rpx solid #E8E9EC; line-height: 72rpx; font-size: 28rpx; color: #ADADAD; text-align: center; } </style>
|