aiot-app/pages/pda/feeding/bill/index.vue

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


		<view class="list_box">
			<u-list @scrolltolower="scrolltolower" key="dataList">

				<view class="card_box " v-for="(item, index) in dataList" :key="index">
					<view class="item_box rx-bc">
						<view class="round">{{index + 1}}</view>
						<view class="time">投料时间:{{item.createTime}} </view>
					</view>

					<view v-for="(it,idx) in item.orderInfoList" :key="idx">
						<workOrderBom :item='it' :isDetails='true'></workOrderBom>

						<deviceBom v-if='it.equipmentList.length != 0' :list='it.equipmentList'></deviceBom>
						
						
						<productsBom  v-if="Object.prototype.hasOwnProperty.call(it, 'inProductList')" :productsObj="it.inProductList[0]"></productsBom>

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

						<instanceBom v-if='it.instanceList.length != 0'  :isDetails='true' :list='it.instanceList' :currentTaskDiagram='currentTaskDiagram' :equipmentList='it.equipmentList'></instanceBom>
						
						<semiProductBom v-if='it.semiProductList.length != 0'  :isDetails='true' :list='it.semiProductList' :currentTaskDiagram='currentTaskDiagram' :equipmentList="it.equipmentList"></semiProductBom>
						

						<packingBom v-if='it.packingList.length != 0' :list='it.packingList'></packingBom>
						
						<palletBom v-if="Object.prototype.hasOwnProperty.call(it, 'palletList')" :palletList='it.palletList'></palletBom>
						
						<revolvingDiskBom v-if="Object.prototype.hasOwnProperty.call(it, 'revolvingDiskList')"  :revolvingDiskList="it.revolvingDiskList"></revolvingDiskBom>

					</view>




				</view>

			</u-list>
		</view>

	</view>
</template>

<script>
	import workOrderBom from '../components/workOrderBom.vue'
	import deviceBom from '../components/deviceBom.vue'
	import modelBom from '../components/modelBom.vue'
	import instanceBom from '../components/instanceBom.vue'
	import semiProductBom from '../components/semiProductBom'
	import packingBom from '../components/packingBom.vue'
	import palletBom from '../components/palletBom'
	import revolvingDiskBom from '../components/revolvingDiskBom'
	import productsBom from'../components/productsBom.vue'
	import {
		feedByOrderIds
	} from '@/api/pda/feeding.js'
	export default {
		components: {
			workOrderBom,
			deviceBom,
			modelBom,
			instanceBom,
			packingBom,
			palletBom,
			revolvingDiskBom,
			semiProductBom,
			productsBom
		},
		data() {
			return {
				ids: [],
				dataList: [],
				
				currentTaskDiagram: {
					isFirstTask: 0
				}
			}
		},

		onLoad(option) {
			this.ids = [option.id]
			this.getList()
		},

		methods: {


			async getList() {
				const res = await feedByOrderIds(this.ids)
				this.dataList = res

			},


			scrolltolower() {}
		}
	}
</script>

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

	}

	.item_box {
		margin-top: 10rpx;
		margin-bottom: 16rpx;
		width: 706rpx;

		.round {
			width: 40rpx;
			height: 40rpx;
			line-height: 40rpx;
			border-radius: 50%;
			background: $theme-color;
			color: #fff;
			text-align: center;
			font-size: 20rpx;
		}

		.time {
			color: #000;
			font-family: PingFang HK;
			font-size: 28rpx;
			font-style: normal;
			font-weight: 600;
			margin-left: 16rpx;
		}

	}


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

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

		.card_box {
			padding: 16rpx 24rpx;
		}


	}
</style>