ezhizao_dms_app/components/dialog-lotReporting/dialog-lotReporting.vue

<template>
	<dialog-base class="dialog-body" ref="baseDialog" title="添加批次报工">
		<view style="overflow: auto;height: 800rpx;">
			<view v-for="(item, index) in lotData" :key="index" class="list-item" >
				<view class="item-info uni-row">
					<text class="label">批次号</text>
					<text class="label right">{{ item['lotCode'] }}</text>
				</view>
				<view class="item-info uni-row">
					<text class="label">生产计划单号</text>
					<text class="label right">{{ item['productionPlanNo'] }}</text>
				</view>
				<view class="item-info uni-row">
					<text class="label">产品描述</text>
					<text class="label right">{{ item['productDescription'] }}</text>
				</view>
				<view class="item-info uni-row">
					<text class="label">箱号</text>
					<text class="label right">{{ item['carrierName'] }}</text>
				</view>
				<view class="item-info uni-row">
						<text class="label">下道工序</text>
						<view class="label right uni-row">{{ item['nextProcess'] ? item['nextProcess'].processAlias : '-' }}
							(<view style="color:  #1684fc;" @click.stop="handleClickProcessList(item)">&nbsp;工艺列表&nbsp;
							</view>)
						</view>
					</view>
					<view class='middle'>
						<view class='segment'></view>
						<uni-icons type="paperclip" size="30" style="margin: 10rpx;"></uni-icons>
						<view class='segment'></view>
					</view>
			</view>
			</view>
			<view class="list-item">
				<view class="item-info uni-row">
					<text class="label">下序车间</text>
							<uni-data-select v-model="curDaywork.workshopId" :localdata="workshopList" @change="handleChangeWorkshop"
								:clear="false"
								style="outline: 2rpx solid #999999;border-radius: 10rpx;"></uni-data-select>
				</view>
				<view class="item-info uni-row">
					<text class="label">下序工段</text>
							<uni-data-select v-model="curDaywork.deptId" :localdata="deptList"
								:clear="false"
								style="outline: 2rpx solid #999999;border-radius: 10rpx;"></uni-data-select>
				</view>
				</view>

			<!-- 抽屉 -->
				<view>
		</view>
		<view style="z-index: 99999;">
		<uni-drawer ref="showRight" mode="right" :mask-click="true">
			<view class="scroll-view">
				<scroll-view class="scroll-view-box"  style="height:100%;">
					<view style="width: 100%;text-align: center;;font-size: 48rpx;margin: 48rpx 0 24rpx 0;">工艺列表
					</view>
					<view style="font-size: 24rpx;width: 100%;text-align: center;color: red;margin-bottom: 48rpx;">
						仅显示当前工序后面工艺</view>
					<view class="info-content" v-for="(item,index) in curProcessAfte" :key="index"
						style="width: 100%;margin: 8rpx 0 8rpx 14%;">
						<text>{{ index + 1 }}.{{item.processAlias}}</text>
					</view>
				</scroll-view>
			</view>
		</uni-drawer>
		</view>
		<view class="add-btn-container uni-row">
			<button type="default" class="leftBtn" @click="handleFinishScan">结束扫码</button>
			<button type="default" class="rightBtn" @click="handleContinueScan">继续扫码</button>
		</view>
	</dialog-base>
</template>

<script setup>
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	import {
		getDictInfoByType
	} from '@/api/dict/dict.js'

	const baseDialog = ref(null)
	const lotData = ref(null)
	const curDaywork = ref({})
	const workshopList = ref([])
	const curProcessAfte = ref([])
	const deptList = ref([])
	const showRight = ref(null) // 抽屉
	function open(data) {
		lotData.value = data
		baseDialog.value.open()
		init()
	}
	function init() {
		//查询车间
    }
	function handleClickProcessList(item) {
		 let curProcessAfterList = [{processAlias:'下料'},{processAlias:'大切断'},{processAlias:'分选'},{processAlias:'下料'},{processAlias:'大切断'},{processAlias:'分选'}];
		// let nextIndex = 0;
		// for (let i = 0; i < item.processSequence.length; i++) {
		// 	if (item.nextProcess.id == item.processSequence[i].id) {
		// 		nextIndex = i;
		// 	}
		// }
		// for (let i = 0; i < item.processSequence.length; i++) {
		// 	if (i >= nextIndex) {
		// 		curProcessAfterList.push(item.processSequence[i]);
		// 	}
		// }
		// console.log(curProcessAfterList)
		 curProcessAfte.value = curProcessAfterList;
		showRight.value.open();
	}
	//切换车间
	function handleChangeWorkshop() {
		
	}
	//结束扫码
	function handleFinishScan() {
		
	}
	//继续扫码
	function handleContinueScan() {
		
	}

	function close() {
		baseDialog.value.close()
	}

	defineExpose({
		open
	})
</script>

<style lang="scss">
	.dialog-body {
		// height: 60%;
		// margin: auto auto;
		overflow: auto;
	}

	.item-info {
		margin: 8rpx;

		.label {
			font-size: 28rpx;
			width: 220rpx;
			color: #808080;

			&.right {
				flex: 1;
				color: #000000;
			}
		}
	}
	.middle {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center
	}
	
	.segment {
		width: 280rpx;
		background-color: rgba(213, 213, 213, 1);
		border: 1rpx solid rgba(213, 213, 213, 1);
	}
	.middle {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center
	}

	.segment {
		width: 80rpx;
		background-color: rgba(213, 213, 213, 1);
		border: 1rpx solid rgba(213, 213, 213, 1);
	}
	.add-btn-container {
		margin-top: 32rpx;
	
		.leftBtn {
			flex: 1;
			background-color: rgb(164, 173, 179);
			color: #FFFFFF;
	
		}
		.rightBtn {
			flex: 1;
			margin-left: 24rpx;
			background-color: rgb(91, 214, 165);
			color: #FFFFFF;
			
		}
	}

</style>