<template>
	<view class="order-infos">
		<!-- #ifdef MP-WEIXIN -->
		<view class="topbar"
			:style="rect ? 'height:' + rect.height + 'px;line-height:' + rect.height + 'px;margin-top:' + rect.top + 'px' : ''">
			<!-- #endif -->
			<!-- #ifndef MP-WEIXIN -->
			<view class="topbar" :style="statusBarHeight ? 'margin-top:' + statusBarHeight + 'px' : ''">
				<!-- #endif -->
				<view class="back-icon" :style="rect ? 'padding:' + (rect.height - 24) + 'rpx 20rpx' : ''">
					<u-icon name="arrow-left" size="24" color="#ffffff" @click="pageBack"></u-icon>
				</view>
				计划订单详情
			</view>
			<view class="after">
				<view class="order-info-card">
					<view class="order-card ">
						<view class="order-info-title">
							<image class="img" src="../../subpages/static/czzn-img/order/orderInfo-tenant.png" mode="scaleToFill" />
							<view class="mid">
								<view class="info">
									<span class="label">
										{{ $t('spare.orderCode') }}
									</span>
									<span class="type fixed">{{ $t('order.plan') }}</span>

								</view>
								<text class="code">{{ orderInfo.code || '' }}</text>
							</view>

							<view class="orderStatus-info" v-if="orderInfo.orderType == '4'">
								<u--image width="100rpx" height="88rpx" v-if="orderInfo.orderStatus == 0"
									src="/subpages/static/czzn-img/state/no-take-order.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="orderInfo.orderStatus == 1"
									src="/subpages/static/czzn-img/state/start-take-order.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="orderInfo.orderStatus == 2"
									src="/subpages/static/czzn-img/state/completed.png"></u--image>
								<u--image width="100rpx" height="88rpx"
									v-if="orderInfo.enabledMarkType == 1 || orderInfo.orderStatus == 4"
									src="/subpages/static/czzn-img/state/cancellation.png"></u--image>
							</view>
						</view>
						<view class="order-card-info">
							<view class="order-type" v-if="orderInfo.isMain == 2">
								<u-tag :text="$t('order.mainOrder')" type="success"></u-tag>
							</view>
							<p class="cell">
								<text class="label">{{ $t('order.orderDate') }}</text>
								<text class="info">{{ orderInfo.setDate || '' }}</text>
							</p>
							<p class="cell">
								<text class="label">{{ $t('order.vehicleType') }}</text>
								<text class="info" v-if="orderInfo.vehicleType == '101'">{{ $t('order.saleOrder') }}</text>
								<text class="info" v-if="orderInfo.vehicleType == '102'">{{ $t('order.purchaseOrder') }}</text>
								<text class="info" v-if="orderInfo.vehicleType == '103'">{{ $t('order.materialsOrder') }}</text>
								<text class="info" v-if="orderInfo.vehicleType == '104'">{{ $t('order.transferOrder') }}</text>
							</p>
							<p class="cell">
								<text class="label">{{ $t('order.companyName') }}</text>
								<text class="info">{{ orderInfo.companyName || '' }}</text>
							</p>
							<view class="cell">
								<text class="label">{{ $t('order.materialName') }}</text>
								<text class="info">{{ orderInfo.materialName || '' }}</text>
							</view>
							<view class="cell">
								<text class="label">{{ $t('order.planNumber') }}</text>
								<text class="info">{{ orderInfo.orderNumber || '0' }}{{ orderInfo.orderType ==
									'4' ? $t('customer_meter.unitN') : $t('customer_meter.unitT') }}</text>
							</view>
							<template v-if="orderInfo.orderStatus != 0 && orderInfo.weighingStatus != 0">
								<p class="cell">
									<text class="label">{{ $t('order.tareWeight') }}</text>
									<text class="info">{{ orderInfo.tareWeight || '0' }}</text>
								</p>
								<p class="cell">
									<text class="label">{{ $t('order.grossWeight') }}</text>
									<text class="info">{{ orderInfo.grossWeight || '0' }}</text>
								</p>
							</template>
							<template v-if="orderInfo.orderStatus != 0 && orderInfo.weighingStatus != 0">
								<p class="cell">
									<text class="label">{{ $t('order.netWeight') }}</text>
									<text class="info">{{ orderInfo.netWeight || '0' }}</text>
								</p>
							</template>
							<template v-if="orderInfo.orderStatus != 0 && orderInfo.weighingStatus == 1">
								<p class="cell">
									<text class="label">{{ $t('order.inTime') }}</text>
									<text class="info">{{ orderInfo.inTime || '' }}</text>
								</p>
							</template>
							<template v-if="orderInfo.orderStatus != 0 && orderInfo.weighingStatus == 2">
								<p class="cell">
									<text class="label">{{ $t('order.outTime') }}</text>
									<text class="info">{{ orderInfo.outTime || '' }}</text>
								</p>
							</template>
							<template v-if="orderInfo.orderStatus == 2">
								<p class="cell">
									<text class="label">{{ $t('order.outDate') }}</text>
									<text class="info">{{ orderInfo.outDoorTime || '' }}</text>
								</p>
							</template>
							<view class="cell">
								<text class="label">{{ $t('order.planNumber') }}</text>
								<text class="info">{{ orderInfo.orderNumber || '0' }}{{ orderInfo.orderType ==
									'4' ? $t('customer_meter.unitN') : $t('customer_meter.unitT') }}</text>
							</view>
							<view class="cell" v-for="(item,index) in vehicles">
								<text class="label">{{ $t('order.vehicle')+(index+1) }}</text>
								<text class="info">{{ item.vehicle || '' }}</text>
							</view>
						</view>
					</view>
					<view v-for="(item, index) in orderInfos" class="order-card" :key="index">
						<!-- 	<view class="order-card-title">
							<span class="type" v-if="item.orderType == '1'">{{ $t('order.temp') }}</span>
							<span class="type" v-if="item.orderType == '2'">{{ $t('order.fixed') }}</span>
							<text class="info">{{ item.tenantName || '' }}</text>
							<text class="no">No {{ item.code || '' }}</text>
					
							<view class="orderStatus-info">
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 0"
									src="../../subpages/static/czzn-img/state/not-factory.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 1 && item.weighingStatus == 0"
									src="../../subpages/static/czzn-img/state/in-factory.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 2"
									src="../../subpages/static/czzn-img/state/completed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 1 && item.weighingStatus != 0"
									src="../../subpages/static/czzn-img/state/weighed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 4"
									src="../../subpages/static/czzn-img/state/cancelllation.png"></u--image>
							</view>
						</view> -->
						<view class="order-info-title">
							<image class="img" src="/subpages/static/czzn-img/order/orderInfo-tenant.png" mode="scaleToFill" />
							<view class="mid">
								<view class="info">
									<span class="label">
										{{ $t('spare.orderCode') }}
									</span>
									<span class="type" v-if="item.orderType == '1'">{{ $t('order.temp') }}</span>
									<span class="type fixed" v-if="item.orderType == '2'">{{ $t('order.fixed') }}</span>
								</view>
								<text class="code">{{ item.code || '' }}</text>
							</view>
							<view class="orderStatus-info" v-if="item.orderType != '4'">
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 0"
									src="/subpages/static/czzn-img/state/not-factory.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 1 && item.weighingStatus == 0"
									src="/subpages/static/czzn-img/state/in-factory.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 2"
									src="/subpages/static/czzn-img/state/completed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 1 && item.weighingStatus != 0"
									src="/subpages/static/czzn-img/state/weighed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 4"
									src="/subpages/static/czzn-img/state/cancellation.png"></u--image>
							</view>
							<!-- <span class="type" v-if="orderInfo.orderType == '1'">{{ $t('order.temp') }}</span>
							<span class="type" v-if="orderInfo.orderType == '2'">{{ $t('order.fixed') }}</span> -->
							<view class="orderStatus-info" v-if="item.orderType == '4'">
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 0"
									src="/subpages/static/czzn-img/state/no-take-order.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 1"
									src="/subpages/static/czzn-img/state/start-take-order.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.orderStatus == 2"
									src="/subpages/static/czzn-img/state/completed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="item.enabledMarkType == 1 || item.orderStatus == 4"
									src="/subpages/static/czzn-img/state/cancellation.png"></u--image>
							</view>
						</view>
						<view class="order-card-info">
							<!-- <view class="order-type">
									<span class="tag tag-ls" v-if="item.orderType == '1'">{{ $t('order.temp') }}</span>
									<span class="tag tag-gd" v-if="item.orderType == '2'">{{ $t('order.fixed') }}</span>
								</view> -->
							<view class="row">
								<p class="cell">
									<text class="label">{{ $t('order.vehicle') }}</text>
									<text class="info">{{ item.vehicle }}</text>
								</p>
							</view>
							<view class="row">
								<p class="cell">
									<text class="label">{{ $t('order.tareWeight') }}</text>
									<text class="info">{{ item.tareWeight || '0' }}</text>
								</p>
								<p class="cell">
									<text class="label">{{ $t('order.grossWeight') }}</text>
									<text class="info">{{ item.grossWeight || '0' }}</text>
								</p>
							</view>
							<view class="row">
								<p class="cell">
									<text class="label">{{ $t('order.netWeight') }}</text>
									<text class="info">{{ item.netWeight || '0' }}</text>
								</p>
								<p class="cell">
									<text class="label">{{ $t('order.orderNumber') }}</text>
									<text class="info">{{ item.orderNumber || '0' }} T</text>
								</p>
							</view>
							<view class="row">
								<p class="cell">
									<text class="label">{{ $t('order.inTime') }}</text>
									<text class="info">{{ item.inTime || '' }}</text>
								</p>
							</view>
							<view class="row" v-if="item.weighingStatus == 2">
								<p class="cell">
									<text class="label">{{ $t('order.outTime') }}</text>
									<text class="info">{{ item.outTime || '' }}</text>
								</p>
							</view>
							<view class="row" v-if="item.orderStatus == 2">
								<p class="cell">
									<text class="label">{{ $t('order.outDate') }}</text>
									<text class="info">{{ item.outDoorTime || '' }}</text>
								</p>
							</view>
						</view>
			
					</view>
				</view>
			</view>


		</view>
	</view>
</template>

<script>
import {
	getFixedOrderList
} from "../../api/order"
export default {
	data() {
		return {
			loading: false,
			statusBarHeight: null,
			orderInfo:{},
			orderInfos:[],
			vehicles:[],
			keyword: '',
		};
	},
	onLoad(options) {
		this.onGetPlanOrderList(options)
		let sysInfo = wx.getSystemInfoSync(); //状态栏的高度
		this.statusBarHeight = sysInfo.statusBarHeight;
		this.rect = wx.getMenuButtonBoundingClientRect();
		console.log(this.rect, this.statusBarHeight);
	},

	methods: {
		onGetPlanOrderList(data) {
			var that = this;
			getFixedOrderList(data).then(res => {
				if (res.statusCode == 200 && res.data.code==0) {
					that.orderInfo = res.data.data.orderInfo
					that.orderInfos = res.data.data.orderInfos
					that.vehicles = res.data.data.vehicles
				}
				console.log("获取到的计划订单信息、", that.orderInfo);
			})
		},
		pageBack() {
				uni.navigateBack({
					delta: 1
				})
			}
	},
};
</script>
<style>
/* #ifndef APP-NVUE */
view {
	display: flex;
	box-sizing: border-box;
	flex-direction: column;
}

page {
	box-sizing: border-box;
	/* padding: 40rpx 40rpx 80rpx; */
	height: 100%;
	background: url('../../subpages/static/czzn-img/order/order-detail2.png') no-repeat;
	background-size: 750rpx auto;
}

/* #endif*/
</style>
<style lang="scss" scoped>
@import '../../common/css/public.scss';
</style>