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.
251 lines
6.0 KiB
251 lines
6.0 KiB
4 months ago
|
<template>
|
||
|
|
<view class="content">
|
||
|
|
<view class="cu-card article">
|
||
|
|
<view class="cu-item shadow">
|
||
|
|
<view class="padding-sm justify-between">
|
||
|
|
<!-- <view
|
||
|
|
:class="{'refunded' : detail.list.status== 1 ,'non-payment' : detail.list.status== 0,'payState': detail.list.status== 2}">
|
||
|
|
{{['--', '预约成功','预约取消','预约失败','换电成功','换电失败','换电中','预约过期'][detail.list.status==null?'':detail.list.status]}}
|
||
|
|
</view> -->
|
||
|
|
<view class="refunded_2" v-if="detail.list.status == 1">
|
||
|
|
预约成功
|
||
|
|
</view>
|
||
|
|
<view class="refunded_5" v-if="detail.list.status == 2">
|
||
|
|
预约取消
|
||
|
|
</view>
|
||
|
|
<view class="refunded_3" v-if="detail.list.status == 3">
|
||
|
|
预约失败
|
||
|
|
</view>
|
||
|
|
<view class="refunded_2" v-if="detail.list.status == 4">
|
||
|
|
换电成功
|
||
|
|
</view>
|
||
|
|
<view class="refunded_3" v-if="detail.list.status == 5">
|
||
|
|
换电失败
|
||
|
|
</view>
|
||
|
|
<view class="refunded_0" v-if="detail.list.status == 6">
|
||
|
|
换电中
|
||
|
|
</view>
|
||
|
|
<view class="refunded_6" v-if="detail.list.status == 7">
|
||
|
|
预约过期
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-card article">
|
||
|
|
<view class="cu-item shadow">
|
||
|
|
<view class="flex justify-between flex-wrap padding-sm">
|
||
|
|
<view class="name">{{detail.list.stationName==null?'--':detail.list.stationName}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex padding-lr-sm justify-between flex-wrap list-view">
|
||
|
|
<view class="staName">场站编码 </view>
|
||
|
|
<view class="staNum">{{detail.list.stationNo==null?'--':detail.list.stationNo}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex justify-between flex-wrap list-view">
|
||
|
|
<view class="staName">预约订单号 </view>
|
||
|
|
<view class="staNum">{{detail.list.orderNo==null?'--':detail.list.orderNo}}</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="flex justify-between list-view">
|
||
|
|
<view class="staName">车牌号 </view>
|
||
|
|
<view class="staNum">{{detail.list.vehicleNo==null?'--':detail.list.vehicleNo}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex padding-lr-sm justify-between list-view">
|
||
|
|
<view class="staName">车辆vin</view>
|
||
|
|
<view class="staNum">{{detail.list.vehicleVin==null?'--':detail.list.vehicleVin}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex padding-lr-sm justify-between flex-wrap list-view">
|
||
|
|
<view class="staName">预约时间</view>
|
||
|
|
<view class="staNum">{{detail.list.startTime==null?'--':detail.list.startTime}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex justify-between list-view">
|
||
|
|
<view class="staName">预约到期时间</view>
|
||
|
|
<view class="staNum">{{detail.list.endTime==null?'--':detail.list.endTime}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex padding-lr-sm justify-between list-view">
|
||
|
|
<view class="staName">预约电池锁仓仓号 </view>
|
||
|
|
<view class="staNum">{{detail.list.binNos==null?'--':detail.list.binNos}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex justify-between list-view">
|
||
|
|
<view class="staName">预约数量</view>
|
||
|
|
<view class="staNum">{{detail.list.batnum==null?'0':detail.list.batnum}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex justify-between list-view">
|
||
|
|
<view class="staName">换电完成时间</view>
|
||
|
|
<view class="staNum">{{detail.list.swapFinishTime==null?'--':detail.list.swapFinishTime}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex padding-lr-sm justify-between list-view">
|
||
|
|
<view class="staName">换电订单编号</view>
|
||
|
|
<view class="staNum">{{detail.list.swapOrderNo==null?'--':detail.list.swapOrderNo}}</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="btn_pay" v-if="detail.list.status == 1">
|
||
|
|
<button style="font-size: 14px;" type="primary" @click="cancel_order">取消预约</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import config from '@/common/config/config.js';
|
||
|
|
import {
|
||
|
|
reactive,
|
||
|
|
ref,
|
||
|
|
} from "vue";
|
||
|
|
import {
|
||
|
|
onLoad,
|
||
|
|
onShow,
|
||
|
|
} from "@dcloudio/uni-app";
|
||
|
|
|
||
|
|
import {
|
||
|
|
useCounterStore
|
||
|
|
} from '@/stores/counter.js';
|
||
|
|
const isDetail = useCounterStore()
|
||
|
|
|
||
|
|
|
||
|
|
const detail = reactive({
|
||
|
|
list: {}
|
||
|
|
})
|
||
|
|
|
||
|
|
onLoad((options) => {
|
||
|
|
var station = JSON.parse(options.details);
|
||
|
|
detail.list = station
|
||
|
|
// console.log(detail.list, '订单详情');
|
||
|
|
})
|
||
|
|
onShow(() => {
|
||
|
|
isDetail.value = true
|
||
|
|
})
|
||
|
|
const cancel_order = async () => {
|
||
|
|
await uni.$request({
|
||
|
|
url: config.baseUrl + 'app-api/cloud/amt-order/cancel/' + detail.list.id,
|
||
|
|
method: 'GET'
|
||
|
|
}).then(res => {
|
||
|
|
// console.log(res, '==========>');
|
||
|
|
if (res.data.code == 0) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '取消成功',
|
||
|
|
duration: 2000,
|
||
|
|
icon: 'success'
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
uni.showToast({
|
||
|
|
title: res.data.msg,
|
||
|
|
duration: 2000,
|
||
|
|
icon: 'error'
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}).catch((err) => {
|
||
|
|
uni.showToast({
|
||
|
|
title: '取消失败',
|
||
|
|
duration: 2000,
|
||
|
|
icon: 'error'
|
||
|
|
});
|
||
|
|
})
|
||
|
|
setTimeout(function() {
|
||
|
|
uni.navigateBack({
|
||
|
|
delta: 1,
|
||
|
|
});
|
||
|
|
}, 1000)
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.content {
|
||
|
|
height: 100vh;
|
||
|
|
background: #F7F8FA;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cu-card.article>.cu-item {
|
||
|
|
padding-bottom: 0rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.payState {
|
||
|
|
color: #4C91FF;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.non-payment {
|
||
|
|
color: #FF7B0E;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.refunded_0 {
|
||
|
|
color: #06efef;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_1 {
|
||
|
|
color: #00aaff;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_2 {
|
||
|
|
color: #00aa00;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_3 {
|
||
|
|
color: #aa0000;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_4 {
|
||
|
|
color: #ffff00;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_5 {
|
||
|
|
color: #55557f;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.refunded_6 {
|
||
|
|
color: #aaaa7f;
|
||
|
|
font-size: 39rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.name {
|
||
|
|
color: #333;
|
||
|
|
font-size: 39rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.titleName {
|
||
|
|
color: #808080;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.staName {
|
||
|
|
color: #808080;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.staNum {
|
||
|
|
color: #333333;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.money {
|
||
|
|
color: #4C91FF;
|
||
|
|
font-size: 32rpx;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
.list-view {
|
||
|
|
padding: 0rpx 20rpx 20rpx 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btn_pay {
|
||
|
|
// width: 100%;
|
||
|
|
position: absolute;
|
||
|
|
bottom: 20rpx;
|
||
|
|
right: 0;
|
||
|
|
padding: 0 30rpx;
|
||
|
|
}
|
||
|
|
</style>
|