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

<template>
	<view class="mask" v-if="isLoading"></view>
	<dialog-base class="dialog-body" ref="baseDialog" title="添加批次报工">
		<view>
			<view class="item-info uni-row">
				<text class="label">批次号</text>
				<text class="label right"
					style="word-wrap: break-word;">{{ lotData.map(v => v.lotCode).join(",") }}</text>
			</view>
			<view class="item-info uni-row">
				<text class="label">产品描述</text>
				<text class="label right" style="word-wrap: break-word;">{{ 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['lastProcess'] ? item['lastProcess'].processAlias : '-' }}
				</view>
			</view>
			<view class="item-info uni-row">
				<text class="label">当前序</text>
				<view class="label right uni-row" style="display: flex; flex-direction: row; flex-wrap: wrap;">
					<view>{{ item['process'] ? item['process'].processAlias : '-' }}
					</view>
					<view style="color:  #1684fc;" @click.stop="handleClickProcessList(item)">(&nbsp;工艺列表&nbsp;)
					</view>
				</view>
			</view>
			<view class="item-info uni-row">
				<text class="label">下序</text>
				<view class="label right uni-row">{{ item['nextProcess'] ? item['nextProcess'].processAlias : '-' }}
				</view>
			</view>
			<view class="item-info uni-row">
				<view class="label">设备</view>
				<view class="label right">
					<uni-data-select v-model="equipmentDetail" :localdata="equipmentDetailList" :clear="false"
						style="outline: 2rpx solid #999999;border-radius: 10rpx;"></uni-data-select>
				</view>
			</view>
			<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;"
					@change="handleDeptChange"></uni-data-select>
			</view>
			<view v-if="!isWx" class="item-info uni-row" style="margin-top: 20rpx;">
				<text class="label" style="width: 250rpx;">是否包装签票</text><text style="margin-left: 24rpx;"
					class="label right">否</text>
				<switch class="switch" @change="switchChange" :checked="normalStatus"
					style="transform: scale(0.8);align-items: center;font-size:28rpx;"
					color="rgba(103, 195, 55, 1.0)" />
				<text class=" label right">是</text>
			</view>

		</view>
		<!-- </view> -->
		<!-- 抽屉 -->
		<view>
		</view>
		<view style="z-index: 99999;">
			<uni-drawer ref="showRight" mode="right" :mask-click="true">
				<view style="text-align: center; font-size: 48rpx; padding: 48rpx 0 24rpx 0;">工艺列表</view>
				<view style="font-size: 24rpx;text-align: center;color: red; margin-bottom
				: 16rpx;">
					仅显示当前工序后面工艺
				</view>
				<scroll-view scroll-y="true" style="height: 80%;" @touchmove.stop>
					<view v-for="(item,index) in curProcessAfte" :key="index"
						style="padding: 8rpx 5% 8rpx 14%; border-top: 1px solid #cccccc">
						<text>{{ index + 1 }}.{{item.processAlias}}</text>
					</view>
				</scroll-view>
				<view><button v-if="!editStatus" class="start-batch-btn" style="margin-bottom: 10rpx;" type="primary"
						@click="handleOpenDrawing">查看本工序图纸</button></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,
		toRef
	} from 'vue'
	import {
		getDictInfoByType
	} from '@/api/dict/dict.js'
	import {
		getQuickDayworkList,
		finishQuick,
		getDayworkByCarrierId,
		reportDaywork
	} from '@/api/business/quickDaywork'
	import {
		store
	} from '@/store/index.js'

	const props = defineProps({
		getList: {
			type: Function,
			default: () => {}
		}
	})

	const emit = defineEmits();
	const baseDialog = ref(null)
	const lotData = ref(null)
	const curDaywork = ref({})
	const productId = ref("")
	const isWx = ref(false)
	const normalStatus = ref(false)
	const processCode = ref("")
	const technologicalProcessId = ref("")
	const currentLotCode = ref("")
	const workshopList = ref([])
	const processAlias = ref("")
	const curProcessAfte = ref([])
	const deptList = ref([])
	const item = ref({})
	const equipmentDetail = ref(null)
	const equipmentDetailList = ref([])
	const isLoading = ref(false);
	const lastRequestTimestamp = ref(0);
	const editStatus = ref(false)
	const showRight = ref(null) // 抽屉
	function open(data) {

		console.log(data)
		lotData.value = data.items
		item.value = data.items[0]
		// lotData.value.map(v => v.lotCode).join(",")
		baseDialog.value.open()
		workshopList.value = data.workShops.map(v => ({
			value: v.id,
			text: v.name,
			deptList: v.depts
		}))

		equipmentDetailList.value = data.equipmentDetailList.length > 0 ? data.equipmentDetailList.map(item => ({
			text: item.commonCode,
			value: item.commonId
		})) : [];
		console.log(equipmentDetailList.value)
		curDaywork.value = {}
		deptList.value = []
		equipmentDetail.value = null
		init()
		// }
	}

	function init() {
		//查询车间
	}

	function handleClickProcessList(item) {
		console.log(item, 7979)
		if (item.isWasteRecycling == 1 || item.isAmend == 1) {
			editStatus.value = true
		} else {
			editStatus.value = false
		}
		var filteredProcess = item.processSequence.filter(i => i.processStepNumber == item.process.processStepNumber);

		processCode.value = filteredProcess[0].processCode
		processAlias.value = filteredProcess[0].processAlias
		productId.value = item.daywork.productId
		technologicalProcessId.value = item.technologicalProcessId

		currentLotCode.value = item.lotCode
		curProcessAfte.value = lotData.value[0].nextProcesses;
		showRight.value.open();
	}
	//切换车间
	function handleChangeWorkshop(arg) {
		// console.log(arg)
		deptList.value = workshopList.value.find(v => v.value === arg).deptList.map(v => ({
			value: v.deptId,
			text: v.deptName,
			isSortPackaging: v.isSortPackaging,
			code: v.deptCode
		}))
		normalStatus.value = false
		isWx.value = false
	}
	//结束扫码
	function handleFinishScan() {
		// 保存新报工信息
		// 然后关闭dialog
		// console.log(props)
		addDayworkItem(() => {
			props.getList()
			baseDialog.value.close()
		})
	}
	//打开电子图纸
	function handleOpenDrawing() {

		// 对 technologicalProcessDetailId 进行URL编码
		var encodedId = encodeURIComponent(productId.value);
		var enTechnologicalProcessId = encodeURIComponent(technologicalProcessId.value);
		var enprocessCode = encodeURIComponent(processCode.value);

		var encodeCode = encodeURIComponent(currentLotCode.value);
		var enProcessAlias = encodeURIComponent(processAlias.value);
		// 构建查询参数字符串
		var queryParam =
			`param1=${encodedId}&param2=${encodeCode}&param3=${enprocessCode}&param4=${enTechnologicalProcessId}&param5=${enProcessAlias}`;


		// 使用模板字符串构建完整的URL
		var navigateUrl = `/pages/drawingMenu/index?${queryParam}`;

		// 导航到指定页面
		uni.navigateTo({
			url: navigateUrl
		});

	}

	function handleDeptChange() {
		console.log(deptList.value)
		let deptInfo = deptList.value.find(item => item.value == curDaywork.value.deptId)
		console.log(deptInfo)
		if (deptInfo.code == '170000') {
			isWx.value = true
		} else {
			isWx.value = false
		}
		if (deptInfo.isSortPackaging == 1) {
			normalStatus.value = true
		} else {
			normalStatus.value = false
		}
	}

	function switchChange(event) {
		console.log(event.detail.value)
		//是
		if (event.detail.value) {
			normalStatus.value = true
		} else {
			//否
			normalStatus.value = false
		}
	}

	function addDayworkItem(callback) {
		console.log(equipmentDetail.value)
		// 判断选择下工段和下车间
		if (curDaywork.value.workshopId == null || curDaywork.value.deptId == null || deptList.value.find(v => v.value ===
				curDaywork.value.deptId) == null) {
			uni.showToast({
				icon: 'none',
				title: '请选择周转车间和下序工段'
			})
			return
		}
		if (equipmentDetail.value == null) {
			console.log("999")
			uni.showToast({
				icon: 'none',
				title: '请选择设备'
			})
			return
		}
		const params = lotData.value.map(v => ({
			...v,
			daywork: {
				...v.daywork,
				processId: v.process.id,
				processStepNumber: v.process.processStepNumber,
				technologicalProcessDetailId: v.process.technologicalProcessDetailId
			},
			quickInfo: {
				deptId: curDaywork.value.deptId,
				workshopId: curDaywork.value.workshopId,
				deptName: deptList.value.find(v => v.value === curDaywork.value.deptId).text,
				isSortPackaging: normalStatus.value ? "1" : "0"
			},
			tenantId: !store.tenantId ? store.userInfo.tenantId : store.tenantId,
			equipmentDetailId: equipmentDetail.value,
			equipmentDetailCode: equipmentDetailList.value.filter(item => item.value == equipmentDetail.value)[
					0]
				.text
		}))
		console.log(params)
		isLoading.value = true; // 显示遮罩层
		uni.showLoading({
			title: '加载中'
		});
		reportDaywork(params).then(res => {
			isLoading.value = false;
			uni.hideLoading();
			callback()
		})
		// callback()
	}
	//继续扫码
	function handleContinueScan() {
		// 保存报工信息
		// 调用前一个页面的扫码方法
		// 关闭dialog
		// console.log(props)
		addDayworkItem(() => {
			props.getList()
			baseDialog.value.close()
			emit("scan")
		})
	}

	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;

		}
	}

	.mask {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 2000;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.mask .loading-text {
		color: #fff;
		font-size: 36rpx;
	}
</style>