aiot-app/pages/pda/workOrder/index/details.vue

<template>
	<view class="content-box">
		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" :title="title" background-color="#F7F9FA"
			color="#000" @clickLeft="back" >
		</uni-nav-bar>

		<view class="list_box">
			<u-list @scrolltolower="scrolltolower">
				<view class="card_box" v-for="(objData,index) in list" :key='index'>

					<view class="rx-bc title_card">
						<view>{{index + 1}}</view>
						<view>报工时间: {{objData.createTime}}</view>
					</view>

					<workOrderBom :item='objData' v-if='objData' :isDetails='true'></workOrderBom>

					<deviceBom v-if='objData.equipmentList.length != 0' :list='objData.equipmentList'></deviceBom>

					<modelBom v-if='objData.modelList.length != 0' :list='objData.modelList'>
					</modelBom>

					<jobBom :item='objData' :palletList='objData.palletList' :notFormed='objData.notFormedList'
						:isDetails='true'></jobBom>

					<byProductBom v-if='objData.productRecycleList.length != 0 ' :list='objData.productRecycleList'
						:isDetails='true'>
					</byProductBom>

					<turnoverBom v-if='objData.turnover.length != 0' :list='objData.turnover' :wordItem='objData'
						pattern='job' :isDetails='true'>
					</turnoverBom>



					<aridRegion v-if='objData.aridRegionList.length != 0' :list='objData.aridRegionList'
						:remainingTime='0'  :isType='true'></aridRegion>


				</view>

				<view v-if='list.length == 0'>
					<view style='margin-top: 20vh;'>
						<u-empty iconSize='150' textSize='32' text='暂无报工详情'>
						</u-empty>
					</view>
				</view>
			</u-list>
		</view>
	</view>
</template>

<script>
	import {
		listWorkReport,
	} from '@/api/pda/workOrder.js'
	import workOrderBom from '../../feeding/components/workOrderBom.vue'
	import deviceBom from '../../feeding/components/deviceBom.vue'
	import modelBom from '../../feeding/components/modelBom.vue'
	import jobBom from '../../jobBooking/components/jobBom.vue'
	import oneJobBom from '../../jobBooking/components/oneJobBom.vue'
	import byProductBom from '../../jobBooking/components/byProductBom'
	import turnoverBom from '../../jobBooking/components/turnoverBom.vue'
	import aridRegion from '../../feeding/components/aridRegion.vue'
	import paramBom from '../../feeding/components/paramBom.vue'
	export default {
		components: {
			workOrderBom,
			deviceBom,
			modelBom,
			jobBom,
			oneJobBom,
			byProductBom,
			turnoverBom,
			aridRegion,
			paramBom,
		},
		data() {
			return {
				workOrderId: null,
				taskId: null,
				list: []
			}
		},
		onLoad(options) {
			this.title = options.taskName ? options.taskName + '-报工详情' : '报工详情'
			this.workOrderId = options.id
			this.taskId = options.taskId
			this.getList()
		},

		methods: {
			getList() {
				let param = {
					workOrderId: this.workOrderId,
					taskId: this.taskId
				}
				listWorkReport(param).then(res => {

					this.list = res
				})
			},

			scrolltolower() {}
		}
	}
</script>

<style lang="scss" scoped>
	.content-box {
		height: 100vh;
		overflow: hidden;
		display: flex;
		flex-direction: column;

	}

	.list_box {
		flex: 1;
		overflow: hidden;
		padding: 4rpx 0;

		.u-list {
			height: 100% !important;
		}

		.card_box {
			padding: 16rpx 24rpx;
		}



	}

	.bottom-wrapper {
		.btn_box {
			width: 750rpx;
			height: 88rpx;
			line-height: 88rpx;
			background: $theme-color;
			text-align: center;
			font-size: 36rpx;
			font-style: normal;
			font-weight: 400;
			color: #fff;
		}
	}


	.operate_box {
		padding: 10rpx 160rpx;

		/deep/ .u-button {
			width: 160rpx;
		}
	}



	.title_card {
		height: 70rpx;
		width: 100%;
		background: #157A2C;
		font-size: 30rpx;
		color: #fff;
		line-height: 70rpx;
		padding: 0 22rpx;
		box-sizing: border-box;
	}
</style>