<template>
	<!-- 工单出材率 -->
	<view class="pagepaddings font13">
		<view v-for="(item,index) in list" :key="index" class="detail_list contentboxsty">
			<view class="list_top">
				<view class="top_left">
					工单号:{{item.name}}
				</view>
				<view class="top_right">
					工单详情
				</view>
			</view>
			<view class="list_content">
				<view class="list_centre">
					<view class="centre_left">
						加工规格:{{item.specs}}
					</view>
					<view class="centre_right">
						生产中
					</view>
				</view>
				<view class="list_below">
					<view class="below_left">
						<view class="">
							算法出材率
						</view>
						<view class="percentage font24">
							{{item.algorithm}}%
						</view>
					</view>
					<view class="below_left">
						<view class="">
							算法出材率
						</view>
						<view class="percentage font24">
							{{item.reality}}%
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[{
					name:'SO202401111004',
					algorithm:'81.5',
					reality:'81.4',
					state:'生产中',
					specs:'4*9*3.66',
					time:'jan-11 10:05',
					timeConsuming:'3.5H',
					number:'12.66m³'
				},{
					name:'SO202401111004',
					algorithm:'81.5',
					reality:'81.4',
					state:'生产中',
					specs:'4*9*3.66',
					time:'jan-11 10:05',
					timeConsuming:'3.5H',
					number:'12.66m³'
				},{
					name:'SO202401111004',
					algorithm:'81.5',
					reality:'81.4',
					state:'生产中',
					specs:'4*9*3.66',
					time:'jan-11 10:05',
					timeConsuming:'3.5H',
					number:'12.66m³'
				},{
					name:'SO202401111004',
					algorithm:'81.5',
					reality:'81.4',
					state:'生产中',
					specs:'4*9*3.66',
					time:'jan-11 10:05',
					timeConsuming:'3.5H',
					number:'12.66m³'
				}]
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.detail_list{
	// .list_top{display: flex;padding: 12px 0;border-bottom: 1px solid #2D3A6F;margin-bottom: 8px;
	// 	.top_left{flex: 1;}
	// }
	.list_centre{display: flex;
		.centre_left{flex: 1;}
	}
	.list_below{display: flex;text-align: center;padding: 20px 0;
		view{flex: 1;}
		.percentage{color: #00B68D;}
	}
}	
</style>
