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.
 
 
 
 
 
high-mini-manage/pages/home/oderDetails/oderDetails.vue

191 lines
6.2 KiB

<template>
<view>
<image class="headimg" src="../../../static/img/odrdes.png"></image>
<view class="headsearch">
<view class="heads">
<view class="ordslef">已支付订单</view>
<view class="ordsrig">{{oilorderdetails.payTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}</view>
</view>
<view class="heads">
<view class="prices">实际支付: <text style="font-size: 16px;margin-left: 5px;">
¥{{oilorderdetails.payRealPrice}}</text></view>
</view>
<view class="line1con"></view>
<view style="padding-top: 15px;">
<view class="prices">优惠立减: <text style="font-size: 16px;margin-left: 5px;">
¥{{oilorderdetails.deductionPrice}}</text></view>
</view>
</view>
<view class="width92 height20 titles fcor333 font15 mart15 fontwig6">
加油订单
</view>
<view class="width92 line1 mart10"></view>
<view class="width92 height20 fcor333 font15 mart20">
商家/订单信息
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">交易单号</view>
<view class="width80p fotrt">{{oilorderdetails.orderNo}}</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">下单时间</view>
<view class="width80p fotrt">{{oilorderdetails.createTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">油站名称</view>
<view class="width80p fotrt">{{oilorderdetails.gasName}}</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">地址</view>
<view class="width80p fotrt">{{oilorderdetails.gasAddress}}</view>
</view>
<view class="width92 line1 mart15"></view>
<view class="width92 height20 fcor333 font15 mart20">
商品信息
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">油号/油枪</view>
<view class="width80p fotrt">{{oilorderdetails.gasOilNo}}#/{{oilorderdetails.gasGunNo}}号枪</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">油站价</view>
<view class="width80p fotrt">¥{{oilorderdetails.gasPriceGun}}</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width80p">加油升数<text class="fcor999 font13">实际升数以油站加油机为准</text></view>
<view class="width20 fotrt">{{oilorderdetails.gasOilLiters}}</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">加油金额</view>
<view class="width80p fotrt">¥{{oilorderdetails.totalPrice}}</view>
</view>
<view class="width92 line1 mart15"></view>
<view class="width92 height20 fcor333 font15 mart20">
优惠信息
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">加油折扣</view>
<view class="width80p fotrt" v-if="oilorderdetails.gasDiscount">¥{{oilorderdetails.gasDiscount}}</view>
<view class="width80p fotrt" v-else>0折</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">加油补贴</view>
<view class="width80p fotrt" v-if="oilorderdetails.gasOilSubsidy">¥{{oilorderdetails.gasOilSubsidy}}</view>
<view class="width80p fotrt" v-else>¥0</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">每升优惠</view>
<view class="width80p fotrt" v-if="oilorderdetails.gasLitersPreferences">
¥{{oilorderdetails.gasLitersPreferences}}</view>
<view class="width80p fotrt" v-else>¥0</view>
</view>
<view class="width92 fcor666 font14 mart20 alijusstart">
<view class="width20">优惠价格</view>
<view class="width80p fotrt" v-if="oilorderdetails.gasPricePreferences">
¥{{oilorderdetails.gasPricePreferences}}</view>
<view class="width80p fotrt" v-else>¥0</view>
</view>
<view class="width92 line1 mart15"></view>
<view class="width92 fcor666 font18 mart20 alijusstart">
<view class="width50">加油实付金额</view>
<view class="width50 fcor333 fontwig6 fotrt">¥{{oilorderdetails.payRealPrice}}</view>
</view>
<view class="width92 line1 mart15"></view>
<view class="width92 fcor666 font16 mart20 alijusstart">
<view class="width50" v-if="oilorderdetails.payType == 1">支付宝支付</view>
<view class="width50" v-if="oilorderdetails.payType == 2">微信支付</view>
<view class="width50" v-if="oilorderdetails.payType == 3">金币支付</view>
<view class="width50" v-if="oilorderdetails.payType == 4">汇联通工会卡支付</view>
<view class="width50" v-if="oilorderdetails.payType == 5">银联支付</view>
<view class="width50" v-if="oilorderdetails.payType == 6">银联分期支付</view>
<view class="width50 fotrt">¥{{oilorderdetails.payRealPrice}}</view>
</view>
<view class="height40p"></view>
</view>
</template>
<script>
import {
getGasOrderDetail
} from '../../../Utils/Api.js';
export default {
data() {
return {
orderNo: '', //订单号
oilorderdetails: '' // 订单详情
}
},
onLoad(options) {
this.orderNo = options.ordesid;
this.getGasOrderDetail();
},
methods: {
getGasOrderDetail() {
uni.showLoading({
title: '加载中'
})
let datas = {
orderNo: this.orderNo
}
getGasOrderDetail(datas).then(res => {
uni.hideLoading();
if (res.return_code == '000000') {
this.oilorderdetails = res.return_data;
}
});
}
}
}
</script>
<style lang="scss">
.headimg {
position: absolute;
width: 100%;
height: 180px;
}
.headsearch {
position: relative;
height: 180px;
}
.heads {
padding-top: 40px;
}
.ordslef {
width: 40%;
margin-left: 5%;
color: #FFFFFF;
font-size: 15px;
float: left;
}
.ordsrig {
width: 50%;
color: #FFFFFF;
float: right;
font-size: 15px;
}
.prices {
color: #FFFFFF;
margin-left: 5%;
font-size: 14px;
}
.line1con {
width: 100%;
height: 1px;
background-color: #f6f6f6;
margin-top: 20px;
}
.titles {
border-left: 4px solid #3981ed;
padding-left: 10px;
}
</style>