pika_shangjia/pages/orderDetail/orderDetail.vue

<template>
	<view style="padding-bottom: 50rpx;">
		<view class="money-box ddflex">
			<view class="state">
				<view>{{info.lease.returnStatus==0?'未归还':info.lease.returnStatus==1?'已归还':info.lease.returnStatus==2?'丢失':''}}</view>
				<view class="act-color">{{info.status==0?'待支付':info.status==1?'待支付':info.status==2?'取消订单':info.status==3?'已支付':''}}</view>
			</view>
			<view class="money act-color ddflex">
				<text class="symbol">￥</text>
				<text>{{(info.totalMoney||info.totalMoney===0||info.totalMoney==='0')?info.totalMoney:'0'}}</text>
			</view>
		</view>
		
		<view class="info-box">
			<view class="info-item ddflex">
				<view class="info-item-label">订单编号</view>
				<view class="ddflex">
					<view class="info-item-data fflex tover">{{info.orderNo}}</view>
					<view style="color: #2A82E4;margin-left: 10rpx;text-decoration: underline;" @click="copy(info.orderNo)">复制</view>
				</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">使用时长</view>
				<view class="info-item-data fflex tover">{{info.type==2?'一次':info.lease.time?info.lease.time+'分钟':'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">计费方式</view>
				<view class="info-item-data fflex tover">{{info.type==2?'按次计费':info.type==3?'按时计费':''}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">使用费用</view>
				<view class="info-item-data fflex tover">{{info.realMoney?'￥'+info.realMoney:'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">超时</view>
				<view class="info-item-data fflex tover">{{info.timeoutTime?info.timeoutTime+'分钟':'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">超时费用</view>
				<view class="info-item-data fflex tover">{{info.timeoutMoney?'￥'+info.timeoutMoney:'-'}}</view>
			</view>	
			<view class="info-item ddflex">
				<view class="info-item-label">订单总额</view>
				<view class="info-item-data fflex tover act-color">{{info.totalMoney?'￥'+info.totalMoney:'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">支付方式</view>
				<view class="info-item-data fflex tover">{{info.payType==1?'钱包支付':info.payType==2?'微信支付':info.payType==3?'汇付':'-'}}</view>
			</view>
			<view class="info-item dflex">
				<view class="info-item-label">收费标准</view>
				<view class="info-item-data fflex">
					<block v-if="info.type==3">
						{{info.battery.price}}元/小时，免费试用{{info.battery.freeTime}}分钟，不足60分钟按60分钟计费
					</block>
					<block v-if="info.type==2">
						{{info.battery.oncePrice}}元/次，超时按{{info.battery.timeoutPrice}}元/小时计费
					</block>
				</view>
			</view>
		</view>
		
		<view class="info-box">
			<view class="info-box-title">租借信息</view>
			<view class="info-item ddflex">
				<view class="info-item-label">租赁合同</view>
				<view class="ddflex">
					<view class="info-item-data fflex tover">{{info.contractId}}</view>
					<view style="color: #2A82E4;margin-left: 10rpx;text-decoration: underline;" @click="jump('/mine/page/page?title=租赁合同&isHetong=true&hetongId='+info.contractId)">查看</view>
				</view>
			</view>
			<!-- <view class="info-item ddflex">
				<view class="info-item-label">租借方式</view>
				<view class="info-item-data fflex tover">微信支付分租借</view>
			</view> -->
			<view class="info-item ddflex">
				<view class="info-item-label">租借时间</view>
				<view class="info-item-data fflex tover">{{info.lease.leaseTime}}</view>
			</view>
			<view class="info-item ddflex mag-b50">
				<view class="info-item-label">归还时间</view>
				<view class="info-item-data fflex tover">{{info.lease.returnTime?info.lease.returnTime:'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">电池ID</view>
				<view class="info-item-data fflex tover">{{info.lease.batteryId}}</view>
			</view>	
			<view class="info-item ddflex">
				<view class="info-item-label">电池型号</view>
				<view class="info-item-data fflex tover">{{info.battery.model}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">租借机柜</view>
				<view class="info-item-data fflex tover">{{info.lease.leaseDevId}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">租借门店</view>
				<view class="info-item-data fflex tover">{{info.lease.leaseStoreName}}</view>
			</view>
			<view class="info-item dflex mag-b50">
				<view class="info-item-label">租借地点</view>
				<view class="info-item-data fflex">{{info.lease.leaseStoreAddress}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">归还门店</view>
				<view class="info-item-data fflex tover">{{info.lease.returnStoreName?info.lease.returnStoreName:'-'}}</view>
			</view>
			<view class="info-item dflex">
				<view class="info-item-label">归还地点</view>
				<view class="info-item-data fflex">{{info.lease.returnStoreAddress?info.lease.returnStoreAddress:'-'}}</view>
			</view>
			<view class="info-item ddflex mag-b50">
				<view class="info-item-label">归还机柜</view>
				<view class="info-item-data fflex tover">{{info.lease.returnDevId?info.lease.returnDevId:'-'}}</view>
			</view>
			<view class="info-item ddflex">
				<view class="info-item-label">用户</view>
				<view class="info-item-data fflex tover">{{info.realName}} ({{info.phone}})</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	const app = getApp();
	const req = require("../../utils/request.js");

	export default {
		components: {},
		props: {},
		data() {
			return {
				id:null,
				info:{}
			}
		},
		onLoad(options) {
			this.id = options.id
			this.getData()
		},
		onShow() {
		},
		methods: {
			jump(url) {
				uni.navigateTo({
					url: url
				});
			},
			getData(){
				req.getRequest('/admin/v2/order/'+this.id,{},res=>{
					this.info = res
				})
			},
			copy(val){
				uni.setClipboardData({
					data: val,
					complete() {
						req.msg('复制成功')
					}
				})
			},
		},
		mounted() {
		},
		onPageScroll: function(e) {
		}
	}
</script>

<style>
	@import "./orderDetail.css";
</style>