count-pass-app/subpages/driver/runOrderInfo.vue

<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" v-if="orderInfo.orderType == '1'">{{ $t('order.temp') }}</span>
									<span class="type" v-if="orderInfo.orderType == '2'">{{ $t('order.fixed') }}</span>
									<view class="order-type" v-if="orderInfo.isMain==2">
										<u-tag :text="$t('order.mainOrder')" type="success"></u-tag>
									</view>
								</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/not-factory.png"></u--image>
								<u--image width="100rpx" height="88rpx"
									v-if="orderInfo.orderStatus == 1 && orderInfo.weighingStatus == 0"
									src="/subpages/static/czzn-img/state/in-factory.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.orderStatus == 1 && orderInfo.weighingStatus != 0"
									src="/subpages/static/czzn-img/state/weighed.png"></u--image>
								<u--image width="100rpx" height="88rpx" v-if="orderInfo.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="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">

							<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.orderNumber') }}</text>
								<!-- 	<text class="info">{{ orderInfo.orderNumber || '0' }}{{orderInfo.orderType ==
											'4' ? $t('customer_meter.unitN') : $t('customer_meter.unitT')  }}</text> -->
								<text class="info"
									:style="'font-size: 9pt;font-weight: bold;'+(orderInfo.companyClientType=='109'?'color: green;':'color: red;')">
									{{ orderInfo.orderNumber || '0' }}{{ orderInfo.materialKind=='101' && orderInfo.companyClientType=='109'?$t('customer_meter.unitB')  :(orderInfo.orderType ==
									'4' ? $t('customer_meter.unitN') : $t('customer_meter.unitT')) }}</text>
							</view>
							<!-- 		<view class="cell">
								<text class="label">{{ $t('order.driver') }}</text>
								<text class="info">{{ orderInfo.driver || '' }}</text>
							</view> -->
							<view class="cell">
								<text class="label">{{ $t('order.vehicle') }}</text>
								<text class="info">{{ orderInfo.vehicle || '' }}</text>
							</view>

							<template v-if="orderInfo.weighingStatus != 0 && orderInfo.materialKind!='101'">
								<view class="cell">
									<text class="label">{{ $t('order.tareWeight') }}</text>
									<text class="info">{{ orderInfo.tareWeight || '0' }}</text>
								</view>
								<view class="cell">
									<text class="label">{{ $t('order.grossWeight') }}</text>
									<text class="info">{{ orderInfo.grossWeight || '0' }}</text>
								</view>
							</template>
							<template v-if="orderInfo.weighingStatus != 0 && orderInfo.materialKind!='101'">
								<view class="cell">
									<text class="label">{{ $t('order.netWeight') }}</text>
									<text class="info">{{ orderInfo.netWeight || '0' }}</text>
								</view>
							</template>
							<template v-if="orderInfo.orderStatus != 0">
								<view class="cell">
									<text class="label">{{ $t('order.inDoorTime') }}</text>
									<text class="info">{{ orderInfo.inDoorTime || '' }}</text>
								</view>
							</template>
							<template v-if="orderInfo.orderStatus != 0 && orderInfo.weighingStatus != 0">
								<view class="cell">
									<text class="label">{{ $t('order.inTime') }}</text>
									<text class="info">{{ orderInfo.inTime || '' }}</text>
								</view>
							</template>
							<template v-if="orderInfo.weighingStatus == 2">
								<view class="cell">
									<text class="label">{{ $t('order.outTime') }}</text>
									<text class="info">{{ orderInfo.outTime || '' }}</text>
								</view>
								<view class="cell">
									<text class="label">{{ $t('order.outDate') }}</text>
									<text class="info">{{ orderInfo.outDoorTime || '' }}</text>
								</view>
								<view class="cell">
									<text class="label">{{ $t('base.common.arrive') }}</text>
									<text :class="'info '+ (orderInfo.arriveFlag=='1'?'use':'used')">
										{{orderInfo.arriveFlag=='1'?$t('base.common.arrived'):$t('base.common.noArrive')}}
									</text>
								</view>
								<view class="cell">
									<text class="label">{{ $t('base.common.receive') }}</text>
									<text :class="'info '+ (orderInfo.receiveFlag=='1'?'use':'used')">
										{{orderInfo.receiveFlag=='1'?$t('base.common.received'):$t('base.common.noReceive')}}
									</text>
								</view>
							</template>
						</view>
					</view>
				</view>
				<view class="sure-btn" v-if="orderInfo.orderStatus==2 && orderInfo.receiveFlag !=1">
					<button class="btn" @click="onArriveClick">{{ $t('base.common.arrive') }}</button>
				</view>
			</view>
			<u-modal :show="showAdd" ref="addModal" closeOnClickOverlay @cancel="showAdd = false"
				@close="showAdd = false" @confirm="showAdd = false" stlye="z-index:100"
				:cancelText="$t('settings.cancelText')" :confirmText="$t('settings.confirmText')"
				:title="$t('driver.pleasePhotograph')">
				<view class="invite-box">
					<uni-file-picker v-model="imageValue" ref="files" :auto-upload="false" :limit='3'
						@select="onFileSelect" @progress="progress" @success="success" @delete="deleteImg" />
				</view>

			</u-modal>
		</view>
</template>

<script>
	import {
		getDriverLatelyOrderInfo,
	} from '../../api/order'
	import {
		orderArrive,
		deleteArriveFile,
	} from '../../api/arrive'
	import Oss from '../../components/oss/oss'
	import {
		getTimeInfo
	} from '../../utils/util.js'
	export default {
		data() {
			return {
				showAdd: false,
				orderInfo: {},
				rect: undefined,
				statusBarHeight: null,
				imageValue: [],
				arriveId: null

			}
		},
		components: {
			Oss
		},
		onLoad(options) {
			this.imageValue = []
			this.arriveId = null
			this.orderInfo = JSON.parse(options.orderInfo)
			console.log("获取到运行订单信息、", this.orderInfo);
			if (this.orderInfo.vehicleArriveDetailInfo) {
				this.orderInfo.vehicleArriveDetailInfo.forEach(item => {
					this.imageValue.push({
						"fileID": item.id,
						"isAdd": 0,
						"name": item.fileName,
						"extname": item.fileSuffix,
						"url": item.address,
						"uri": item.address,
						"imageType": "ACCEPT",
					})
				});
			}
			console.log("获取到运行订单的签收图片信息、", this.imageValue);
			let sysInfo = uni.getSystemInfoSync(); //状态栏的高度
			this.statusBarHeight = sysInfo.statusBarHeight;
			// #ifdef MP-WEIXIN
			this.rect = wx.getMenuButtonBoundingClientRect();
			// #endif
			console.log(this.rect, this.statusBarHeight);
		},
		methods: {
			onArriveClick() {
				var that = this;
				if (!that.orderInfo || !that.orderInfo.id) {
					uni.showToast({
						title: '没有需要签到的订单信息',
						icon: 'none'
					})
					return;
				}
				let data = {
					orderId: that.orderInfo.id
				}
				orderArrive(data).then(res => {
					if (res.data.code == 0) {
						that.showAdd = true
						that.arriveId = res.data.data.id
					}
				})

			},
			pageBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			onFileSelect(e) {
				console.log('选择文件：', e)
				var that = this;
				if (!that.arriveId) {
					uni.showToast({
						title: '没有需要签到的订单信息',
						icon: 'none'
					})
					return;
				}
				uni.uploadFile({
					url: '/admin/vehicleArriveDetail/addArrive',
					name: 'file',
					filePath: e.tempFilePaths[0],
					header: {
						'Authorization': 'Bearer ' + uni.getStorageSync('token'),
						"Tenant-Id": that.orderInfo.tenantId
					},
					formData: {
						'tenantId': that.orderInfo.tenantId,
						"arriveId": that.arriveId,
						"fileLength": 1
					},
					success: (res) => {
						console.log("获取到的上传后文件信息、", res.data);
						let response = JSON.parse(res.data)
						if (response.code == 0 && response.data) {
							uni.showToast({
								title: '图片上传成功',
								icon: 'none'
							})
							response.data.forEach(item => {
								this.imageValue.push({
									"fileID": item.id,
									"isAdd": 0,
									"name": item.fileName,
									"extname": item.fileSuffix,
									"url": item.address,
									"uri": item.address,
									"imageType": "ACCEPT",
								})
							});
						} else {
							uni.showToast({
								title: '图片上传失败',
								icon: 'none'
							})
						}
					},
					fail: function(res) {
						console.log('图片上传接口失败', res);
						uni.showToast({
							title: '系统错误，请稍后再试！',
							icon: 'none'
						})
					},
					complete: function(res) {
						console.log('图片上传接口完成');
						// console.log(res);
						uni.hideLoading()
					}
				})
			},

			progress(e) {
				console.log('上传进度：', e)
			},
			success(e) {
				console.log('上传成功', e)
			},
			deleteImg(e) {
				if (!this.arriveId) {
					uni.showToast({
						title: '没有需要签到的订单信息',
						icon: 'none'
					})
					return;
				}
				if (e.tempFile.fileID) {
					let data = {
						id: e.tempFile.fileID,
						arriveId: this.arriveId
					}
					deleteArriveFile(data).then(res => {
						if (res.data.code == 0) {
							var index = this.imageValue.findIndex(function(item) {
								return item.fileID === e.tempFile.fileID;
							});
							if (index > -1) {
								this.imageValue.splice(index, 1)
							}
						}
						console.log("处理后的图片信息、", this.imageValue);
					})

				}

			},
		}
	}
</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/orderInfo-bg.jpg') no-repeat;
		background-size: 750rpx auto;
		background-color: #f5f7fa;
	}

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

	.invite-box {
		width: 100%;
		height: 100%;
	}
</style>