ezhizao_dms_app/components/dialog-turnoverTask/dialog-turnoverTask.vue

<template>
	<dialog-base ref="baseDialog" title="周转任务" >
		<view class="list-item">
		<view v-for="(item, index) in confirmTurnoverList"  :key="index" >
		<view class="list-title uni-row"><text class="label">{{item['process']}}</text>
		<text class="label">→</text> 
		<text class="label">{{item['car']}}</text></view>
		<view class="list-container">
			<view class="list-container-item uni-row">
				<text class="label">批次</text>
				<text class="label value">{{item['batch']}}</text>
			</view>
			<view class="list-container-item uni-row">
				<text class="label">箱数</text>
				<text class="label value">{{item['cases']}}</text>
			</view>
			<view class="list-container-item uni-row">
				<text class="label">数量</text>
				<text class="label value">{{item['amount']}}</text>
			</view>
			<view class="list-container-item uni-row" >
				<text class="label">箱号</text>
				<text class="label value">{{item['caseNumber']}}</text>
			</view>
			<view class="list-container-item uni-row" >
				<text class="label">申请时间</text>
				<text class="label value">{{item['applyTime']}}</text>
			</view>
			<view class="list-container-item uni-row" >
				<text class="label">申请人</text>
				<text class="label value">{{item['applier']}}</text>
			</view>
		</view>
		</view>
		</view>
	<view class="add-btn-container uni-row">
		<button type="primary" class="btn" >确认周转</button>
	</view>
	
	</dialog-base>
</template>

<script setup>
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	 const baseDialog = ref(null)
	 const confirmTurnoverList = ref([])
	// const form = ref({
	// 					process: "粗磨",
	// 					car: "NC车",
	// 					batch: "DC23727410070",
	// 					cases: 5,
	// 					amount:780,
	// 					caseNumber: "X12522、X55222、X15522、J5211、J5211",
	// 					applyTime:"2023-06-15 15:52:12",
	// 					applier:"王伟"
	// 				})
const open = (data) => {
	confirmTurnoverList.value = data
			// console.log(dialog.value)
			baseDialog.value.open()
		}
		defineExpose({
		  open
		})
</script>

<style lang="scss">
	.dialog-body {
		.list-title {
			margin: 40rpx 0 20rpx 0;
		    
			.label {
				padding-right: 40rpx;
				font-size: 32rpx;
				font-weight: bold;
			}
		}
		.list-item {
			 overflow: auto;
			 height:700rpx;
		}
		.list-container {
			width: 100%;
			display: flex;
			align-items: flex-start;
			padding: 0 4rpx;
		
			.list-container-item {
				width: 100%;
				padding: 12rpx 8rpx;
				align-items: center;
		
				.label {
					font-size: 28rpx;
					color: gray;
					width: 144rpx;
					
					&.value {
						
						flex: 1;
						color: #000000;
					}
				}
			}
		
		}
	.add-btn-container {
			margin-top: 32rpx;
			.btn {
				flex: 1;
			}
		}
	}
</style>