pco/app/pages/business-entering/business-detail.vue

<template>
	<view>
		<view class="box">
			<view class="top">
				<text class="title">业务详情</text>
			</view>
			<view class="item">
				<view class="l">企业名称：</view>
				<view class="r">
					{{form.customerName}}
				</view>
			</view>
			<view class="item">
				<view class="l">货物：</view>
				<view class="r">
					{{form.goodsName}}
				</view>
			</view>
			<view class="item">
				<view class="l">货重：</view>
				<view class="r">
					{{form.netWeight}}(吨)
				</view>
			</view>
			<view class="item-line">
				车辆
			</view>
			<view v-for="item in form.cars" :key="item.id" style="border-bottom: 1px solid #E5E5E5;">
				<view class="item">
					<view class="l" >车牌号：</view>
					<view class="r">
						{{item.carNo}}
					</view>
				</view>
				<view class="item">
					<view class="l" >规格：</view>
					<view class="r">
						{{item.carSize}} (米)
					</view>
				</view>
				<view class="item" v-if="item.realInTime">
					<view class="l" >入场时间：</view>
					<view class="r">
						{{item.realInTime}} 
					</view>
				</view>
				<view class="item" v-if="item.realOutTime">
					<view class="l" >离场时间：</view>
					<view class="r">
						{{item.realOutTime}} (米)
					</view>
				</view>
				<view class="item" v-if="item.driverName">
					<view class="l" >联系人：</view>
					<view class="r">
						{{item.driverName}}
					</view>
				</view>
				<view class="item" v-if="item.driverPhone">
					<view class="l">联系号码：</view>
					<view class="r">
						{{item.driverPhone}}
					</view>
				</view>
			</view>
			
			<view class="item-line">
				业务项
			</view>
			<view class="item" v-for="item in form.items" :key="item.id">
				<view class="l" style="flex: 6;">{{item.itemTypeName}}：</view>
				<view class="r">
					{{item.itemName}}({{item.itemPrice}}x{{item.num}}={{item.total}}元)
				</view>
			</view>
			
			<view class="item" >
				<view class="l" style="flex: 6;">境外车停车费：</view>
				<view class="r">
					{{form.partMoney}}
					<text>(元)</text>
				</view>
			</view>
			<view class="item">
				<view class="l" style="flex: 6;">中国车停车费：</view>
				<view class="r">
					{{form.chinaPartMoney}}
					<text>(元)</text>
				</view>
			</view>
			<view class="item">
				<view class="l">业务费：</view>
				<view class="r">
					{{form.itemPrice}}
					<text>(元)</text>
				</view>
			</view>
			<view class="item">
				<text class="p1">订单状态:</text>
				<text class="p2">
					<text v-if="form.confirmInput==0">未确认</text>
					<text v-else>已确认</text>
				</text>
			</view>
			<view class="item">
				<text class="p1">支付状态:</text>
				<text class="p2">
					<text v-if="form.payStatus==1">未支付</text>
					<text v-if="form.payStatus==2">已支付(未确认)</text>
					<text v-if="form.payStatus==3">已支付(已确认)</text>
				</text>
			</view>
			<view class="hj">
				总费用：{{form.totalMoney}}元
			</view>
			<u-button type="primary" text="返回" @click="backFn"></u-button>
				<view style="height: 80rpx;"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {}
			}
		},
		onShow() {},

		onLoad(options) {
			this.id = options.id;
		},
		onShow() {
			this.getBusinessById();
		},
		methods: {
			backFn() {
				this.$common.back();
			},
			getBusinessById() {
				this.$api.getBusinessById({
					id: this.id
				}).then(resp => {
					this.form = resp.data;
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	.hs-item {
		text-align: center;
	}

	.item-line {
		color: #a2a2a2;
		padding: 5px 0 10px 29px;
		border-bottom: 1px solid #E5E5E5;
	}

	.hj {
		padding: 50rpx;
		font-size: 30rpx;
		color: red;
		font-weight: bold;
	}

	.save-btn {
		background-color: #ff4200;
		height: 88rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 60rpx;
		color: #fff;
		font-size: 30rpx;
		font-weight: bold;
		border-radius: 10rpx;
	}
	@import '@/common/common.scss'
</style>