|
|
|
<template>
|
|
|
|
<view>
|
|
|
|
<cu-custom class="main-totextbar bg-main-oil" :isPay='true' :isBack="true" bgColor="bg-main-oil">
|
|
|
|
<block slot="backText">返回</block>
|
|
|
|
<block slot="content">订单支付结果</block>
|
|
|
|
</cu-custom>
|
|
|
|
<!-- <view class="bg-main-oil padding-bottom">
|
|
|
|
<view class="text-center text-bold text-xl padding-xl">
|
|
|
|
{{order.orderState|statusConduct}}
|
|
|
|
</view>
|
|
|
|
</view> -->
|
|
|
|
<view class="qr-container margin move-tops padding-bottom-xs text-centers my-shadow" v-if="showQr">
|
|
|
|
<view class="qr-container ">
|
|
|
|
<view class="qrimg">
|
|
|
|
<view class="qrimg" @tap="newQrString">
|
|
|
|
<tki-qrcode ref="qrcode" cid="2" loadMake :val="val" :size="250" unit="upx"
|
|
|
|
background="#fff" foreground="#000" pdground="#000" :icon="iconUrl" iconSize="40" onval
|
|
|
|
:usingComponents="usingComponents" showLoading />
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="text-center text-sm justify-center align-center flex">
|
|
|
|
<image src="../static/img/YDJY.png" mode="" style="width: 60upx;height:60upx;" class="margin-right-sm"></image>
|
|
|
|
<text>壳牌 {{test}} {{tsets}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="text-center padding-top text-sm margin-bottom">
|
|
|
|
提示:该二维码每隔3分钟自动刷新一次
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="move-top bg-white radius my-shadow solid-top margin margin-top-0">
|
|
|
|
<!-- <view class=" text-center padding-sm margin-bottom-sm" v-if="status=='success'">
|
|
|
|
请提醒加油员使用
|
|
|
|
<text class="oil-main-color">“星油云站”</text>
|
|
|
|
进行订单核实
|
|
|
|
</view> -->
|
|
|
|
|
|
|
|
<view class="padding">
|
|
|
|
<view class="text-center text-xl padding-xl">
|
|
|
|
{{order.orderState|statusConduct}}
|
|
|
|
</view>
|
|
|
|
<view class="text-center text-xl padding-xl text-red" style="padding-top: 10rpx;">
|
|
|
|
¥{{order.realAmount?order.realAmount:order.oldRealAmount?order.oldRealAmount:'0'}}
|
|
|
|
</view>
|
|
|
|
<view class="text-center text-xl padding-xl dashed-bottom" style="display: flex;align-items: center;justify-content: space-around;padding-bottom: 45rpx;" v-if="order.haveRefund == '1'">
|
|
|
|
<view class="text-center-balance">
|
|
|
|
<text>原金额</text>
|
|
|
|
</br>
|
|
|
|
<text>{{order.oldRealAmount}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="">
|
|
|
|
-
|
|
|
|
</view>
|
|
|
|
<view class="text-center-balance">
|
|
|
|
<text>退款金额</text>
|
|
|
|
</br>
|
|
|
|
<text>{{order.refundAmount}}</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
|
|
<view class="padding-tb-xs text-left padding-top" style="margin-top: 10px;">
|
|
|
|
站点/商家:
|
|
|
|
<text class="fr nowrap">
|
|
|
|
{{order.siteName}} </text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
站点类型:
|
|
|
|
<text class="fr">{{order.formats == '1'?'加注机':'桶装'}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="" v-if="dataList.formats == '1'">
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
加注量:
|
|
|
|
<text class="fr">{{order.oldRealLiter}}升</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
实际加注量:
|
|
|
|
<text class="fr">{{order.realLiter?order.realLiter:'0'}}升</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
单价:
|
|
|
|
<text class="fr">¥{{order.realPrice?order.realPrice:'0'}}/L</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="" v-if="order.xoilUreaOrderRelations != ''">
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
加注明细
|
|
|
|
</view>
|
|
|
|
<view class="formats_box">
|
|
|
|
<view class="formats_box_list" v-for="(list,index) in order.xoilUreaOrderRelations" :key='index'>
|
|
|
|
<view class="formats_box_list_left w30">
|
|
|
|
{{list.brandName}}
|
|
|
|
</view>
|
|
|
|
<view class="formats_box_list_main w30">{{list.options}}/桶<text style="color: red;">X{{list.goodsQuantity}}</text> </view>
|
|
|
|
<view class="formats_box_list_right w30">¥{{list.totalPrice}}</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
支付金额:
|
|
|
|
<text
|
|
|
|
class=" fr">¥{{order.oldRealAmount?order.oldRealAmount:'0'}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
实际金额支付:
|
|
|
|
<text class="text-red fr">¥{{order.realAmount?order.realAmount:'0'}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
支付方式:
|
|
|
|
<text
|
|
|
|
class="text-red fr">{{order.payStyle|payStyleList}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
司机信息:
|
|
|
|
<text class=" fr">{{order.driverName}}-{{order.driverPhone}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left" v-if='order.formats != "2"'>
|
|
|
|
加油车牌:
|
|
|
|
<text class=" fr">{{order.vehicleNo}}</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
油卡类型:
|
|
|
|
<text class=" fr">{{order.oilCardNature |oilCardNatureName }}</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="move-top bg-white radius my-shadow solid-top margin margin-top-0">
|
|
|
|
<view class="padding">
|
|
|
|
<view class="">
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
交易订单:
|
|
|
|
<text class=" fr">{{order.orderId}}</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="padding-tb-xs text-left">
|
|
|
|
交易时间:
|
|
|
|
<text class=" fr">{{order.createTime}}</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="padding bg-white ">
|
|
|
|
|
|
|
|
<!-- <view class="flex margin-bottom" v-if="order.orderStatus==0">
|
|
|
|
<button class="cu-btn block flex-sub lg bg-main-oil "
|
|
|
|
@tap="makePay">立即支付</button>
|
|
|
|
<button class="cu-btn block flex-sub lg margin-left"
|
|
|
|
@tap="cancelOrder">取消订单</button>
|
|
|
|
</view> -->
|
|
|
|
<view class="cu-btn bg-white oil-main-color block flex-sub lg" @click="makeCall">
|
|
|
|
<text class="cuIcon-service padding-right-sm">联系客服</text>
|
|
|
|
</view>
|
|
|
|
<view class="padding ">
|
|
|
|
<view class=" margin-bottom" v-if="order.orderState == '0'">
|
|
|
|
<button class="cu-btn block flex-sub margin-bottom-sm lg bg-main-oil "
|
|
|
|
@tap="makePay">立即支付</button>
|
|
|
|
<button class="cu-btn block flex-sub lg "
|
|
|
|
@tap="cancelOrder">取消订单</button>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- <button class=" cu-btn bg-white oil-main-color block flex-sub lg " open-type="contact"><text class="cuIcon-service padding-right-sm"></text> 在线客服</button> -->
|
|
|
|
<!-- <button class="cu-btn block lg margin-top " @tap="delOrder">删除订单</button> -->
|
|
|
|
</view>
|
|
|
|
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import orderApi from '@/api/oil-order.js'
|
|
|
|
import tkiQrcode from "../pages/components/tki-qrcode/tki-qrcode.vue" //二维码生成器
|
|
|
|
import oilSiteApi from '@/api/oil-site.js'
|
|
|
|
import ureaFinanceApi from '../../api/urea_finance.js'
|
|
|
|
export default {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
showQr:false,
|
|
|
|
val:'',
|
|
|
|
id: '',
|
|
|
|
test:null,
|
|
|
|
tsets:'',
|
|
|
|
order:{} ,
|
|
|
|
dataList:{}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
onShareAppMessage(res) {
|
|
|
|
return {
|
|
|
|
title: '订单' + this.order.orderSerialNumber,
|
|
|
|
path: `/BagStation/orderDetail/orderDetail?id=${this.order.orderSerialNumber}`,
|
|
|
|
imageUrl: 'https://publicxingyou.oss-cn-hangzhou.aliyuncs.com/mp-oil/login-bg.png',
|
|
|
|
desc: '加油超便宜',
|
|
|
|
content: 'this.share.content',
|
|
|
|
success(res) {
|
|
|
|
uni.showToast({
|
|
|
|
title: '分享成功'
|
|
|
|
})
|
|
|
|
},
|
|
|
|
fail(res) {
|
|
|
|
uni.showToast({
|
|
|
|
title: '分享失败',
|
|
|
|
icon: 'none'
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
components:{
|
|
|
|
tkiQrcode
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
// 拨打电话
|
|
|
|
makeCall() {
|
|
|
|
uni.makePhoneCall({
|
|
|
|
phoneNumber: '4008-56-5355' //仅为示例
|
|
|
|
})
|
|
|
|
},
|
|
|
|
// newQrString() {
|
|
|
|
// this.getOrderQrCode()
|
|
|
|
// },
|
|
|
|
// getOrderQrCode(){
|
|
|
|
// oilSiteApi.getOrderQrCode(this.order.orderSerialNumber).then( (res)=>{
|
|
|
|
// console.log(res)
|
|
|
|
// this.val = res.data
|
|
|
|
// if(res.code == 40000){
|
|
|
|
// this.showQr = false
|
|
|
|
// }else if(res.code == 20000){
|
|
|
|
// this.showQr = true
|
|
|
|
// this.val =res.data.codeStr
|
|
|
|
// }
|
|
|
|
// } )
|
|
|
|
// },
|
|
|
|
onCopy(id) {
|
|
|
|
uni.setClipboardData({
|
|
|
|
data: id,
|
|
|
|
success: () => {
|
|
|
|
uni.showToast({
|
|
|
|
icon: 'none',
|
|
|
|
title: '订单号复制成功'
|
|
|
|
})
|
|
|
|
}
|
|
|
|
})
|
|
|
|
},
|
|
|
|
getOrderInfo(info) {
|
|
|
|
console.log(info)
|
|
|
|
if(info =='1'){
|
|
|
|
orderApi.findOneByOrderId(this.orderId).then(res => {
|
|
|
|
console.log(res)
|
|
|
|
if (res.code == 20000) {
|
|
|
|
// uni.setStorageSync('oilItem', res.data)
|
|
|
|
this.dataList = res.data
|
|
|
|
this.order = res.data
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}else if(info == '2'){
|
|
|
|
console.log(this.dataList.orderId,'this.dataList.orderId')
|
|
|
|
orderApi.queryBarrelOrderDetails(this.orderId).then(res => {
|
|
|
|
if (res.code == 20000) {
|
|
|
|
// uni.setStorageSync('oilItem', res.data)
|
|
|
|
this.order = res.data
|
|
|
|
console.log(res.data)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
},
|
|
|
|
cancelOrder() {
|
|
|
|
ureaFinanceApi.cancelTheOrder(this.dataList.orderId).then(res => {
|
|
|
|
console.log(res)
|
|
|
|
if (res.code == 20000) {
|
|
|
|
uni.showToast({
|
|
|
|
title: res.msg,
|
|
|
|
icon: 'none',
|
|
|
|
duration: 1000
|
|
|
|
})
|
|
|
|
setTimeout(() => {
|
|
|
|
uni.navigateBack()
|
|
|
|
}, 1000)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
},
|
|
|
|
makePay() {
|
|
|
|
uni.setStorageSync('ureaOrderMade',this.order)
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '/BagStation/pages/makeOrder/orderPaying?type=urea'
|
|
|
|
})
|
|
|
|
},
|
|
|
|
delOrder() {
|
|
|
|
orderApi.delOrder(this.id).then(res => {
|
|
|
|
if (res.code == 20000) {
|
|
|
|
uni.showToast({
|
|
|
|
title: res.msg,
|
|
|
|
icon: 'none',
|
|
|
|
duration: 1000
|
|
|
|
})
|
|
|
|
setTimeout(() => {
|
|
|
|
uni.switchTab({
|
|
|
|
url: '/pages/tabbar/home/home'
|
|
|
|
})
|
|
|
|
}, 1000)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
onLoad(option) {
|
|
|
|
// console.log(JSON.parse(option.data))
|
|
|
|
let options =option
|
|
|
|
console.log(options)
|
|
|
|
if(options){
|
|
|
|
if(options.type == 'orderList'){
|
|
|
|
this.dataList= JSON.parse(option.data)
|
|
|
|
let options = JSON.parse(option.data)
|
|
|
|
this.test = options.id
|
|
|
|
this.orderId = options.orderId
|
|
|
|
this.tsets = options.name
|
|
|
|
this.typeFor = options.formats
|
|
|
|
this.getOrderInfo( options.formats)
|
|
|
|
} else if(options.type == 'orderPay'){
|
|
|
|
let info = uni.getStorageSync('ureaOrderMade')
|
|
|
|
this.test = info.id
|
|
|
|
this.orderId = info.orderId
|
|
|
|
this.tsets = info.name
|
|
|
|
this.getOrderInfo(info.formats)
|
|
|
|
} else{
|
|
|
|
this.dataList= JSON.parse(option.data)
|
|
|
|
let options = JSON.parse(option.data)
|
|
|
|
console.log('++++++++++++++++++',options.data,this.dataList)
|
|
|
|
this.test = options.id
|
|
|
|
this.orderId = options.orderId
|
|
|
|
this.tsets = options.name
|
|
|
|
this.typeFor = options.formats
|
|
|
|
this.getOrderInfo( options.formats)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
filters: {
|
|
|
|
payStyleList(value){
|
|
|
|
if(value){
|
|
|
|
switch (value) {
|
|
|
|
case '0':
|
|
|
|
return '个人微信支付'
|
|
|
|
case '1':
|
|
|
|
return '个人支付宝支付'
|
|
|
|
case '2':
|
|
|
|
return '个人余额支付'
|
|
|
|
case '3':
|
|
|
|
return '企业余额支付'
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
statusConduct(value) {
|
|
|
|
// 备注:订单状态 0:待支付, 1:已支付 ,-1:支付失败 ,2:已取消,3:已退款
|
|
|
|
// switch value
|
|
|
|
// case "0"
|
|
|
|
// return '待支付'
|
|
|
|
console.log(value,'打印value')
|
|
|
|
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 '支付成功'
|
|
|
|
}
|
|
|
|
},
|
|
|
|
oilCardNatureF(value) {
|
|
|
|
// 备注 油卡性质 1:个人 2:企业 3:外请
|
|
|
|
// switch value
|
|
|
|
// case "0"
|
|
|
|
// return '待支付'
|
|
|
|
switch (value + '') {
|
|
|
|
case '1':
|
|
|
|
return '个人'
|
|
|
|
|
|
|
|
case '2':
|
|
|
|
return '企业'
|
|
|
|
case '3':
|
|
|
|
return '外请'
|
|
|
|
}
|
|
|
|
},
|
|
|
|
oilCardNatureName(value){
|
|
|
|
if(value == '0' ){
|
|
|
|
return '外请'
|
|
|
|
}else if(value == '1' ){
|
|
|
|
return '自营'
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
channelCodeFamt(value) {
|
|
|
|
if (value) {
|
|
|
|
// 渠道编码 ( XOIL:星油 WJY:万金油 LV:老吕(找油网) TY:团油 YDJY:一点加油(壳牌))
|
|
|
|
switch (value) {
|
|
|
|
case 'XOIL':
|
|
|
|
return '星油'
|
|
|
|
case 'WJY':
|
|
|
|
return '万金油'
|
|
|
|
case 'LV':
|
|
|
|
return '其他'
|
|
|
|
case 'TY':
|
|
|
|
return '团油'
|
|
|
|
case 'YDJY':
|
|
|
|
return '一点加油(壳牌)'
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>.move-tops{
|
|
|
|
transform: translateY(-17px);
|
|
|
|
}
|
|
|
|
.w30{
|
|
|
|
width: 30%;
|
|
|
|
flex: 0 0 auto;
|
|
|
|
text-align: center;
|
|
|
|
font-weight: 700;
|
|
|
|
font-size: 28rpx;
|
|
|
|
}
|
|
|
|
.formats_box{
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
align-items: center;
|
|
|
|
padding: 2%;
|
|
|
|
box-sizing: border-box;
|
|
|
|
flex-direction: column;
|
|
|
|
}
|
|
|
|
.formats_box_list{
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-around;
|
|
|
|
align-items: center;
|
|
|
|
margin-bottom: 3%;
|
|
|
|
font-size: 30rpx;
|
|
|
|
color: #333;
|
|
|
|
align-items: center;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
.bg-red{
|
|
|
|
background-color: #FF6700;
|
|
|
|
}
|
|
|
|
.text-centers {
|
|
|
|
text-align: center;
|
|
|
|
width: 90%;
|
|
|
|
margin: 0 auto;
|
|
|
|
border-radius: 7px;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.move-top {
|
|
|
|
margin-top: 1rem;
|
|
|
|
}
|
|
|
|
.padding-xl{
|
|
|
|
padding: 20rpx 0 0;
|
|
|
|
}
|
|
|
|
.text-center-balance{
|
|
|
|
width: 150rpx;
|
|
|
|
}
|
|
|
|
.text-center-balance text:last-child{
|
|
|
|
color: #000000;
|
|
|
|
margin-top: 10px;
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.formats2{
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
margin: 10px 0;
|
|
|
|
padding-left: 50px;
|
|
|
|
}
|
|
|
|
</style>
|