<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}}(kg)
				</view>
			</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">
						<label v-if="item.carSize">{{item.carSize}} (米)</label>
						<label v-else>-</label>
					</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.operator">
					<view class="l" >作业人员：</view>
					<view class="r">
						{{item.operator}}
					</view>
				</view>
				<view class="item" v-if="item.operateTime">
					<view class="l" >作业时间：</view>
					<view class="r">
						{{item.operateTime}}
					</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: 7;">{{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: 7;">业务费：</view>
				<view class="r">
					{{form.itemPrice}}
					<text>(元)</text>
				</view>
			</view>
			<view class="item">
				<view class="l" style="flex: 7;">订单状态：</view>
				<view class="r">
				<text v-if="form.confirmInput==0">未确认</text>
				<text v-else>已确认</text>
				</view>
			</view>
			<view class="item">
				<view class="l" style="flex: 7;">支付状态：</view>
				<view class="r">
				<text v-if="form.payStatus==1">未支付</text>
				<text v-if="form.payStatus==3">已支付</text>
				</view>
			</view>
			<view class="hj">
				总费用：{{form.itemPrice}}元
			</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>
