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

219 lines
5.7 KiB

<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 class="rows">
<view class="label hui">学驾培训费</view>
<view class="value hui">{{$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">
<view class="label hui">已支付定金</view>
<view class="value blue">没字段</view>
</view>
<view class="rows">
<view class="label hui">待支付尾款</view>
<view class="value blue">没字段</view>
</view>
<view class="refundBtn" @click="goFund" v-if="!info.refundId">申请退款</view>
</view>
</view>
</view>
<refundInfo :info="refundData" v-if="refundData.id" />
</view>
</view>
</template>
<script>
import refundInfo from './comp/refundInfo.vue'
import {
applyOrderGet,
selectRefundDetail
} 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: {
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)
},
}
}
</script>
<style lang="scss" scoped>
@import '../comp/comp.scss';
.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;
margin: 24rpx 0 0 0;
font-size: 28rpx;
color: #ADADAD;
text-align: center;
}
</style>