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.
307 lines
7.3 KiB
307 lines
7.3 KiB
2 years ago
|
// 可供选择的订单
|
||
|
// 开票列表
|
||
|
<template>
|
||
|
<view class="position-re" @longtap="showMiniBtn=true">
|
||
|
|
||
|
<view class="bg-white margin-tb-sm radius ">
|
||
|
<view class="margin-sm padding-bottom-sm solid-bottom" @tap="onCopy(item.orderId)">
|
||
|
<text>{{item.orderId}}<text class="cuIcon-copy padding-left-sm"></text></text>
|
||
|
<text class="oil-main-color fr">{{item.orderState|statusConduct}}</text>
|
||
|
</view>
|
||
|
<view class="cu-list menu-avatar comment">
|
||
|
<view class="cu-item padding-top-0" @tap="toDetails(item)">
|
||
|
|
||
|
<!-- <view class="cu-avatar text-xl" :style="'background-image:url('+imgUrl+'orders-wjy.png)'"></view> -->
|
||
|
<view class="cu-avatar text-xl round" v-show="item.siteImages!=null"
|
||
|
:style="'background-image:url('+item.siteImages+')'"></view>
|
||
|
<view class="content">
|
||
|
<view class=" text-content text-bold text-df">
|
||
|
{{item.siteName}}
|
||
|
</view>
|
||
|
<view class="text-sm ">
|
||
|
<view class="flex">
|
||
|
<view class="details">
|
||
|
<view class="top1 text-left">
|
||
|
<image class="icon icon-desc " :src="imgUrl+'orders-type.png'" alt />
|
||
|
<text class="padding-left-xs" v-if="item.formats == '1'">加注机 {{item.realLiter?item.realLiter:'0'}}升</text>
|
||
|
<text class="padding-left-xs" v-if="item.formats == '2'">
|
||
|
桶装
|
||
|
<!-- ({{item.oilsCode}}) -->
|
||
|
</text>
|
||
|
</view>
|
||
|
<view class="bottom text-left">
|
||
|
<image class="icon icon-desc " :src="imgUrl+'orders-car.png'" alt />
|
||
|
<text class="padding-left-xs">
|
||
|
{{item.vehicleNo | carF}}
|
||
|
</text>
|
||
|
</view>
|
||
|
<view class="bottom text-left">
|
||
|
<image class="icon icon-desc" :src="imgUrl+'orders-time.png'" alt />
|
||
|
<text class="padding-left-xs">
|
||
|
{{item.createTime}}
|
||
|
</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="action">
|
||
|
<!-- <text class="text-xxl padding-right">$4444</text> -->
|
||
|
<view class="pay-status">
|
||
|
<text class=" text-bold text-xxl">¥{{item.realAmount?item.realAmount:item.oldRealAmount?item.oldRealAmount:'0' }}</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<!-- <xkempty v-else></xkempty> -->
|
||
|
<!-- 评价的弹出层 -->
|
||
|
<view class="flex padding-sm">
|
||
|
<view class="flex-sub" @tap="showMiniBtn=true">
|
||
|
更多
|
||
|
</view>
|
||
|
<view class="nowrap" v-show="!timeout">
|
||
|
<view class="flex-twice" v-show="item.orderStatus=='0'">
|
||
|
<time-down :is-day="false" :is-hour="false" :tip-text="' '" :day-text="' '" :hour-text="':'"
|
||
|
:minute-text="':'" :second-text="' '" :datatime="datatime"></time-down>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="" v-show="timeout">
|
||
|
超时未支付
|
||
|
</view>
|
||
|
<view class="flex-sub text-right" v-show="item.orderState=='1' && !timeout">
|
||
|
<button class="cu-btn nowrap sm bg-main-oil"
|
||
|
@tap="makePay(item.orderSerialNumber)">立即支付</button>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="radius shadow mini-btn bg-white padding flex-wrap position-ab" v-if="showMiniBtn">
|
||
|
<view class="margin-bottom-sm ">
|
||
|
<button class="cu-btn nowrap bg-main-oil" @tap="deleteOrder(item.orderSerialNumber)">删除</button>
|
||
|
</view>
|
||
|
<view class="margin-bottom-sm" v-show="item.orderStatus=='0'">
|
||
|
<button class="cu-btn nowrap bg-brown" @tap="cancelOrder(item.orderSerialNumber)">取消</button>
|
||
|
</view>
|
||
|
<view class=" ">
|
||
|
<button class="cu-btn nowrap " @tap="showMiniBtn=false">收起</button>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import timeDown from '@/components/xw-CountDown'
|
||
|
import Empty from '@/components/Empty'
|
||
|
import orderApi from '@/api/oil-order.js'
|
||
|
export default {
|
||
|
name: 'oilOrders',
|
||
|
components: {
|
||
|
xkempty: Empty,
|
||
|
timeDown
|
||
|
},
|
||
|
props: {
|
||
|
item: {
|
||
|
type: Object,
|
||
|
default () {}
|
||
|
}
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
showMiniBtn: false,
|
||
|
baseURL: this.global.baseURL,
|
||
|
imgUrl: this.global.imgURL,
|
||
|
datatime: '',
|
||
|
timeout: false
|
||
|
}
|
||
|
},
|
||
|
created() {
|
||
|
if (this.item.orderState == '-1') {
|
||
|
this.datatime = this.timF(this.item.createTime)
|
||
|
let now = new Date().getTime() * 0.001
|
||
|
this.timeout = (now - this.datatime) > 0
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
onCopy(id) {
|
||
|
uni.setClipboardData({
|
||
|
data: id,
|
||
|
success: () => {
|
||
|
uni.showToast({
|
||
|
icon: 'none',
|
||
|
title: '订单号复制成功'
|
||
|
})
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
timF(date) {
|
||
|
date = date.substring(0, 19)
|
||
|
date = date.replace(/-/g, '/')
|
||
|
var timestampDeadline = (new Date(date).getTime()) / 1000 + 60 * 10
|
||
|
return timestampDeadline
|
||
|
},
|
||
|
makePay(id) {
|
||
|
this.$emit('makePay', id)
|
||
|
},
|
||
|
deleteOrder(id) {
|
||
|
orderApi.delOrder(id).then(res => {
|
||
|
if (res.code == 20000) {
|
||
|
uni.showToast({
|
||
|
title: res.msg,
|
||
|
icon: 'none',
|
||
|
duration: 1000
|
||
|
})
|
||
|
setTimeout(() => {
|
||
|
this.$emit('refresh')
|
||
|
}, 1000)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
cancelOrder(id) {
|
||
|
orderApi.cancelOrder(id).then(res => {
|
||
|
if (res.code == 20000) {
|
||
|
uni.showToast({
|
||
|
title: res.msg,
|
||
|
icon: 'none',
|
||
|
duration: 1000
|
||
|
})
|
||
|
setTimeout(() => {
|
||
|
this.$emit('refresh')
|
||
|
}, 1000)
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
toDetails(item) {
|
||
|
uni.navigateTo({
|
||
|
url: '/BagStation/orderDetail/orderDetailUrea?data='+ JSON.stringify(item) + '&&type=orderList'
|
||
|
})
|
||
|
},
|
||
|
onSelect(item) {
|
||
|
// console.log('触发', '')
|
||
|
this.$emit('onSelectItem')
|
||
|
}
|
||
|
|
||
|
},
|
||
|
filters: {
|
||
|
carF(value){
|
||
|
if(value){
|
||
|
return value
|
||
|
}else{
|
||
|
return "暂无"
|
||
|
}
|
||
|
},
|
||
|
moneyFormath(value) {
|
||
|
console.log(value)
|
||
|
if (value != 'xxx.x') {
|
||
|
let number = value.toFixed(2)
|
||
|
return number
|
||
|
} else {
|
||
|
return value
|
||
|
}
|
||
|
},
|
||
|
toT(value) {
|
||
|
if (value) {
|
||
|
return value / 1000
|
||
|
}
|
||
|
},
|
||
|
dateFormat(value) {
|
||
|
if (value) {
|
||
|
return value.substring(5, 16)
|
||
|
}
|
||
|
},
|
||
|
numberFilter(value) {
|
||
|
if (value != 'xxx.x') {
|
||
|
console.log('old:',value)
|
||
|
let realAmount =(Math.round(value * 100) / 100).toFixed(2)
|
||
|
console.log('new:',realAmount)
|
||
|
return realAmount
|
||
|
} else {
|
||
|
return value
|
||
|
}
|
||
|
},
|
||
|
statusConduct(value) {
|
||
|
// 备注:订单状态 0:待支付, 1:已支付 ,-1:支付失败 ,2:已取消,3:已退款
|
||
|
if (value) {
|
||
|
// switch value
|
||
|
// case "0"
|
||
|
// return '待支付'
|
||
|
|
||
|
switch (value) {
|
||
|
case '0':
|
||
|
return '新订单'
|
||
|
case '1':
|
||
|
return '支付中'
|
||
|
case '-1':
|
||
|
return '作废'
|
||
|
case '2':
|
||
|
return '结果确认中'
|
||
|
case '3':
|
||
|
return '请求退款'
|
||
|
case '4':
|
||
|
return '退款中'
|
||
|
case '5':
|
||
|
return '已退款'
|
||
|
case '9':
|
||
|
return '支付成功'
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style scoped>
|
||
|
.cu-avatar {
|
||
|
background-color: rgba(255, 255, 255, 0);
|
||
|
}
|
||
|
|
||
|
.icon-car {
|
||
|
height: 41px;
|
||
|
background-size: contain;
|
||
|
float: left;
|
||
|
margin-top: -8px;
|
||
|
margin-left: -6px;
|
||
|
}
|
||
|
|
||
|
.car-position {
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
.bottom {
|
||
|
color: #333;
|
||
|
}
|
||
|
|
||
|
.icon-desc {
|
||
|
display: inline-block;
|
||
|
width: 12px;
|
||
|
height: 12px;
|
||
|
position: relative;
|
||
|
top: 1px;
|
||
|
line-height: 25px;
|
||
|
}
|
||
|
|
||
|
|
||
|
.details {
|
||
|
position: relative;
|
||
|
}
|
||
|
|
||
|
|
||
|
.cu-item {
|
||
|
position: relative;
|
||
|
}
|
||
|
|
||
|
.pay-status {
|
||
|
position: absolute;
|
||
|
z-index: 1;
|
||
|
right: 100upx;
|
||
|
bottom: 50rpx;
|
||
|
width: 120rpx;
|
||
|
height: 120rpx;
|
||
|
}
|
||
|
|
||
|
.mini-btn {
|
||
|
z-index: 1;
|
||
|
bottom: -1rem;
|
||
|
left: 1rem;
|
||
|
}
|
||
|
</style>
|