wangluohuoyun-app/pages/order/orderDetails.vue

<!-- 订单详情-->
<template>
	<view class="content">
		<u-divider text="基本信息"></u-divider>
		<view class="content1">
			<view class='row-between'>
				<view class="">货主</view>
				<view>张三</view>
			</view>
			<view class='row-between'>
				<view class="">货主单位</view>
				<view>黑龙江中天昊元贸易有限公司</view>
			</view>
			<view class='row-between'>
				<view class="">卸货地</view>
				<view>黑龙江省齐齐哈尔市梅里斯达斡尔族区杜尔门沁达斡尔乡53农场</view>
			</view>
			<view class='row-between'>
				<view class="">货名</view>
				<view>玉米</view>
			</view>
			<view class='row-between'>
				<view class="">距离</view>
				<view>约15公里</view>
			</view>
			<view class='row-between'>
				<view class="">货运费</view>
				<view>100元/吨</view>
			</view>
		</view>
		<u-divider text="承运信息"></u-divider>
		<view class="content2">
			<view class='row-between'>
				<view class="">合同编号</view>
				<view>待签订 ></view>
			</view>
			<view class='row-between'>
				<view class="">订单编号</view>
				<view>CY20220210666666</view>
			</view>
			<view class='row-between'>
				<view class="">装车反馈</view>
				<view>未装车</view>
			</view>
			<view class='row-between'>
				<view class="">车牌号</view>
				<view>辽H12345</view>
			</view>
			<view class='row-between'>
				<view class="">装车净重</view>
				<view>10吨</view>
			</view>
			<view class='row-between'>
				<view class="">装车时间</view>
				<view>2022-02-10 16:13:15</view>
			</view>
			<view class='row-between'>
				<view class="">装车照片</view>
				<view class="flex">
					<u--image :showLoading="true" :src="src" width="40px" height="40px"></u--image>
					<u--image :showLoading="true" :src="src" width="40px" height="40px"></u--image>
				</view>
			</view>
			<view class='row-between'>
				<view class="">卸车反馈</view>
				<view class="flex">
					<view>已卸车</view>
					<view>未确认</view>
				</view>
			</view>
			<view class='row-between'>
				<view class="">卸车净重</view>
				<view>100吨</view>
			</view>
			<view class='row-between'>
				<view class="">卸车时间</view>
				<view>2022-02-10 16:13:15</view>
			</view>
			<view class='row-between'>
				<view class="">卸车照片</view>
				<view class="flex">
					<u--image :showLoading="true" :src="src" width="40px" height="40px"></u--image>
					<u--image :showLoading="true" :src="src" width="40px" height="40px"></u--image>
				</view>
			</view>
		</view>
		<u-divider text="运费信息"></u-divider>
		<view class="content3">
			<view class='row-between'>
				<view class="">预付运费</view>
				<view>2000</view>
			</view>
			<view class='row-between'>
				<view class="">2022-02-11 15:15:15</view>
			</view>
			<view class='row-between'>
				<view class="">运费尾款</view>
				<view>2000</view>
			</view>
			<view class='row-between'>
				<view class="">2022-02-11 15:15:15</view>
			</view>
			<view class='row-between'>
				明细：预付2000元，扣款200元，服务费150元，尾款2000元，合计收款4000元。
			</view>
		</view>
		<u-button text="确认装车" type="primary" @click="goConfirmLoading()"></u-button>
		<u-button text="联系客服" type="primary" @click="$helper.contactCustomerService"></u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cyinfoStatus: '未装车',
				src: 'https://cdn.uviewui.com/uview/album/1.jpg',
				id: 1
			}

		},
		methods: {
			goConfirmLoading(id) {
				console.log('点击详情id：', id)
				uni.$u.route('/pages/order/confirmLoading', {
					id: this.id,
				});
			},
		}
	}
</script>

<style lang="scss">

</style>