mes-admin-backend-ui/src/view/performance/06-packingDocuments/index.vue

<template>
	<div>
		<!--    左侧树侧形结构-->
		<el-container>
			<layout-sider :resize-directions="['right']" :width="220" style="margin-right: 10px;">
				<div class="JKWTree-tree" style="height: 70vh;">
					<h3>包装计件单据维护</h3>
					<el-tree :data="treeData" highlight-current @node-click="handleNodeClick" />
				</div>
			</layout-sider>
			<el-container>
				<el-main>
					<!-- 按钮 -->
					<div class="gva-table-box">
						<el-form>
							<el-form-item>
								<el-input v-model="searchInfo" placeholder="搜索产品编号或产品名称" clearable style="width: 180px;" />
								<el-button type="primary" icon="Search" class="search" @click="handleSearch" />
								<el-button type="primary" icon="edit" class="bt" @click="handleShowDetail">查改</el-button>
								<el-button type="primary" icon="edit" class="bt" @click="handleShowAdd">新增</el-button>
								<el-button type="primary" icon="delete" class="bt" @click="handleDelete">删除</el-button>
							</el-form-item>
						</el-form>
						<!-- 数据展示 -->
						<el-table ref="table" style="width: 100%;height: 62vh;" :data="tableData" row-key="ID" highlight-current-row
							border show-overflow-tooltip  @row-dblclick="handleShowDetail"
							:row-style="{ height: '20px' }"  :header-cell-style="{ padding: '0px' }"
							:cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
							@current-change="(row, oldRow) => { currentRow = row}">
							<el-table-column type="selection" width="55" />
							<!-- 循环渲染列 -->
							<el-table-column v-for=" column in tableColumns " :key="column.prop" :prop="column.prop"
								:label="column.label" width="110" sortable />
						</el-table>
						<!-- 分页 -->
						<div class="gva-pagination">
							<el-pagination v-model:current-page="page" v-model:page-size="limit"
								layout="total, sizes, prev, pager, next, jumper" :page-sizes="[10, 30, 50, 100]"
								:total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
						</div>
					</div>
						<el-dialog v-model="BzVisible" title="选择" destroy-on-close width="200px"
							@keydown="selectBZ($event)">
							<el-table tooltip-effect="dark" :data="selectDataBz" row-key="ID"
								highlight-current-row="true" border style="width:100%" @row-dblclick="SelectClickBz"
								ref="table">
								<el-table-column prop="sczl_bzdh" label="班组" width="150" />
							</el-table>
						</el-dialog>
						<el-dialog v-model="BzVisible2" title="冲月定额" destroy-on-close width="200px"
							@keydown="selectCY($event)">
							<el-table tooltip-effect="dark" :data="selectDataCY" row-key="ID"
								highlight-current-row="true" border style="width:100%"  @row-dblclick="SelectClickCY"
								ref="table" :row-style="{ height: '30px' }"	>
								<el-table-column prop="sczl_冲定额" label="冲月定额" width="150"  />
							</el-table>
						</el-dialog>
					<!-- 弹出框 -->
					<div>
						<el-dialog v-model="dialogFormVisible" :title="type" destroy-on-close width="1400px">
							<el-form id="detail-form" :model="detailData" inline label-position="left">
								<el-form-item label="日期">
									<el-input type="date" max="9999-12-31" @focus="rqHandleFocus()" 
										v-model="detailData.sczl_rq" style="width: 120px;" @keydown="ent1($event,$index,row,'')" />
								</el-form-item>

								<el-form-item label="员工编号">
									<el-input v-model="detailData.sczl_bh" style="width: 100px;" id="员工编号"  @keydown="ent1($event,$index,row,'员工编号')" placeholder="Enter回车" />
									<el-input v-model="detailData.name" style="width: 100px; padding-left: 5px;"			@click="selectvalue($event)" readonly />
								</el-form-item>

								<el-form-item label="组别">
									<el-input v-model="detailData.sczl_bzdh" style="width: 80px;"  @keydown="ent1($event,$index,row,'组别')" />
								</el-form-item>
								<br>

								<el-form-item label="计时时数" style="padding-left: 195px;">
									<el-input v-model="detailData.sczl_jsss" style="width: 100px;" @keydown="ent1($event,$index,row,'')"
										@click="selectvalue($event)" />
								</el-form-item>

								<el-form-item label="冲月定额">
									<el-input v-model="detailData.sczl_冲定额"  style="width: 80px;" @keydown="ent1($event,$index,row,'冲月定额')" />
								</el-form-item>
								
								<!-- 表格列表input -->
								<el-table :data="detailData.table" border tooltip-effect="dark"
									:row-style="{ height: '20px' }" :cell-style="{ padding: '0px' }"
									:header-row-style="{ height: '20px' }" :header-cell-style="{ padding: '0px' }">

									<el-table-column label="工单编号" width="120">
										<template #default="{ row, $index }">
											<el-input v-model="row.sczl_gdbh" placeholder="Enter回车"
											@keydown="ent1($event,$index,row,'工单编号')"/>
										</template>
									</el-table-column>

									<el-table-column label="印件工序" width="100">
										<template #default="{ row }">
											<el-input v-model="row.sczl_yjGx"  readonly />
										</template>
									</el-table-column>

									<el-table-column label="工序名称" width="100">
										<template #default="{ row }">
											<el-input v-model="row.sczl_gxmc" readonly />
										</template>
									</el-table-column>

									<el-table-column label="印件名称" width="310">
										<template #default="{ row }">
											<el-input v-model="row.Gd_cpmc"  readonly />
										</template>
									</el-table-column>
									
									<el-table-column label="核算标准" width="100">
										<template #default="{ row }">
											<el-input v-model="row.hsbz" @keydown="ent1($event,$index,row,'核算标准')" />
										</template>
									</el-table-column>
									
								<!-- 	<el-table-column label="核算标准">
										<template #default="{ row }">
											<el-select v-model="row.hsbz" @keydown="ent1($event,$index,row,'')"  placeholder="请选择" popper-class="dropdown" >
												<el-option label="1000" value="1000" ></el-option>
												<el-option label="2500" value="2500"></el-option>
											</el-select>
										</template>
									</el-table-column> -->

									<el-table-column label="包装产量" width="100">
										<template #default="{ row }">
											<el-input v-model="row.sczl_cl" @keydown="ent1($event,$index,row,'')" />
										</template>
									</el-table-column>

									<el-table-column label="返工产量" width="95">
										<template #default="{ row }">
											<el-input v-model="row.sczl_返工产量" @keydown="ent1($event,$index,row,'')" />
										</template>
									</el-table-column>

									<el-table-column label="每箱数量" width="100">
										<template #default="{ row }">
											<el-input v-model="row.sczl_PgCl" @keydown="ent1($event,$index,row,'')"/>
										</template>
									</el-table-column>

									<el-table-column label="计产系数" width="95">
										<template #default="{ row }">
											<el-input v-model="row.sczl_计产系数" @keydown="ent1($event,$index,row,'')"/>
										</template>
									</el-table-column>

									<el-table-column label="来源" width="95">
										<template #default="{ row }">
											<el-input v-model="row.sczl_Jtbh1"  @keydown="ent1($event,$index,row,'')"/>
										</template>
									</el-table-column>

									<el-table-column label="定额代号" width="130">
										<template #default="{ row, $index }">
											<el-input id="input" v-model="row.sczl_dedh" 
											@keydown="ent1($event,$index,row,'定额代号')" />
												
										</template>
									</el-table-column>

								</el-table>

								<el-form-item label="其他备注" style="margin-top: 10px;">
									<el-input v-model="detailData.sczl_desc" @keydown="ent1($event,$index,row,'其他备注')" style="width:600px;"/>
								</el-form-item>

							</el-form>

							<template #footer>
								<div class="dialog-footer">
									<el-button @click="dialogFormVisible = false">取 消</el-button>
									<el-button type="primary" @click="enterDialog">确 定
									</el-button>
								</div>
							</template>
						</el-dialog>


						<!-- 新增定额代号 -->
						<el-dialog v-model="dedhsearchModel" id="tableFplb" @keydown="ent($event)" style="margin-top: 5%;"  >
							<el-form>
									<el-form-item label="选择定额代号" class="mab" prop="keyOrder"></el-form-item>
									<div style="border:1px solid #eee; width:100%; height: 600px; overflow-y: auto;">
										<el-tree :data="dedhtreeData" ref="table_fplb" 
											@keydown="handleTreeKeydown" 
											:props="{ children: 'children',label: 'label'}"
											node-key="id" @node-click="dedhhandleNodeClick">
										</el-tree>
									</div>
							</el-form>
						</el-dialog>
						
						<!-- 核算标准弹窗 -->
						  <!-- 核算标准弹窗 -->
						  <el-dialog v-model="hsbzVisible" title="选择" destroy-on-close width="200px" @keydown="selecthsbz($event)">
						    <el-table
						      tooltip-effect="dark"
						      :data="selectDatahsbz"
						      row-key="value"
						      highlight-current-row="true"
						      border
						      style="width: 100%"
						      @row-dblclick="SelectClickhsbz"
						      ref="tableRef"
						    >
						      <el-table-column align="center" prop="value" label="核算标准" width="168" />
						    </el-table>
						  </el-dialog>
						
						
						<!-- 弹出选项框 -->
						<el-dialog v-model="dialogSelectVisible" title="选择" destroy-on-close width="800px"
							@keydown="selectCP($event)">
							<el-table tooltip-effect="dark" :data="selectData" row-key="ID" highlight-current-row border
								style="width:100%" @row-dblclick="handleSelectClick" ref="table2">
								<el-table-column prop="Gd_cpmc" label="产品名称" width="460" />
								<el-table-column prop="Gy0_gxmc" label="工序" width="200" />
								<el-table-column prop="jyGx" label="工序编号" width="100" />
							</el-table>
						</el-dialog>
					</div>
					
					<!-- 员工选择 -->
					<el-dialog v-model="dialogSelectVisible_Yg" title="选择" destroy-on-close width="300px"
						@keydown="selectGX_Yg($event)">
						<el-table tooltip-effect="dark" :data="selectData_Yg" row-key="ID" highlight-current-row="true"
							border style="width:100%" @row-dblclick="handleSelectClick_Yg" ref="table_Yg">
							<el-table-column prop="员工编号" label="员工编号" width="100" />
							<el-table-column prop="ygxm" label="员工姓名" width="200" />
						</el-table>
					</el-dialog>
					
					<!-- 班组选择 -->
					<el-dialog v-model="dialogSelectVisible_Bz" title="选择" destroy-on-close width="200px"
						@keydown="selectGX_Bz($event)">
						<el-table tooltip-effect="dark" :data="selectData_Bz" row-key="ID" highlight-current-row="true"
							border style="width:100%" @row-dblclick="handleSelectClick_Bz" ref="table_Bz">
							<el-table-column prop="sczl_bzdh" label="班组" width="160" />
						</el-table>
					</el-dialog>

				</el-main>
			</el-container>
		</el-container>
	</div>
</template>

<script>
</script>


<script setup>
	import {
		Layout,
		LayoutContent,
		LayoutHeader,
		LayoutSider
	} from '@arco-design/web-vue'
	import {
		ElMessage,
		ElMessageBox,
		dayjs
	} from 'element-plus'

	// import { Download, Search, Delete } from '@element-plus/icons-vue'
	import {
		reactive,
		ref,
		nextTick,
		onMounted
	} from 'vue'
	import {
		getGxMc,
		getInfo,
		getLocate,
		getPackingSideTable,
		getPackingTable,
		updatePackingTable,
		getYg,
		DeletePackingTable,
		addPackingTable,
		getDedh
	} from '@/api/mes_api_gty/myapi'
	import {
		useUserStore
	} from '@/pinia/modules/user'
	const userStore = useUserStore()
	const sys_id = '[' + userStore.userInfo.userName + '/' + userStore.userInfo.nickName + ']'
	defineOptions({
		name: '06PackingDocuments',
	})
	//班组
	const BzVisible = ref (false)
	//
	const BzVisible2 = ref (false)
	const selectDataBz = reactive([])
	const selectDataCY = reactive([])
const SelectClickBz = (row, column, event) => {
	detailData.sczl_bzdh = row.sczl_bzdh
		BzVisible.value = false
	}
	const selectBZ = (event) => {
		if (event.keyCode === 40) { // Enter 或向下箭头
			setCurrent(selectDataBz[1]);

		} else if (event.keyCode === 38) {
			setCurrent(selectDataBz[0]);

		} else if (event.keyCode === 13) {
			BzVisible.value = false
		}

	}
	const selectCY = (event) => {
		if (event.keyCode === 40) { // Enter 或向下箭头
			setCurrent2(selectDataCY[1]);

		} else if (event.keyCode === 38) {
			setCurrent2(selectDataCY[0]);

		} else if (event.keyCode === 13) {
			BzVisible2.value = false
		}

	}
	const SelectClickCY = (row, column, event) => {
		detailData.sczl_冲定额 = row.sczl_冲定额
		BzVisible2.value = false
	}
	// 侧边栏功能
	const treeData = reactive([])
	const getSideData = async () => {
		try {
			const response = await getPackingSideTable()
			if (response.code === 0) {
				const transformedData = response.data.map(item => ({
					label: `${item.date.replace(/-/g, '.')}【单据数: ${item.counts}张】`,
					children: item.sys.map(sysItem => ({
						label: `${sysItem.sys_id} 【记录数: ${sysItem.count}张】`,
						params: {
							date: item.date.replace(/\./g, '-'),
							sys_id: sysItem.sys_id,
						},
					})),
				}))
				treeData.splice(0, treeData.length, ...transformedData)
			}
		} catch (e) {
			console.log(e)
		}
	}
	getSideData()

	// 表格功能
	const tableColumns = [{
			label: '员工编号',
			prop: 'sczl_bh',
			width: '100'
		},
		{
			label: '员工姓名',
			prop: 'name',
			width: '100'
		},
		{
			label: '生产日期',
			prop: 'sczl_rq',
			width: '100'
		},
		{
			label: '班组',
			prop: 'sczl_bzdh',
			width: '100'
		},
		{
			label: '包装产量',
			prop: 'sczl_cl',
			width: '100'
		},
		{
			label: '返工产量',
			prop: 'sczl_fgsl',
			width: '100'
		},
		{
			label: '计件产量',
			prop: 'sczl_jjcl',
			width: '100'
		},
		{
			label: '相关工单',
			prop: 'sczl_gdbh1',
			width: '100'
		},
		{
			label: '创建用户',
			prop: 'sys_id',
			width: '120'
		},
		{
			label: '创建时间',
			prop: 'sys_rq',
			width: '180'
		},
		{
			label: '修改时间',
			prop: 'mod_rq',
			width: '180'
		},
		{
			label: 'UNIQID',
			prop: 'UniqId',
			width: '100'
		},
	]
	const tableData = reactive([])
	const params = {
		type: '',
		date: '',
		sys_id: '',
		gdbh: '',
	}

	const total = ref(0)
	const page = ref(1)
	const limit = ref(50)

	const type = ref('')
	const searchInfo = ref('')
	const currentRow = ref({})
	// const multipleSelection = ref([])

	// 获取列表数据
	const getTableData = async () => {
		console.log('刷新列表')
		try {
			const response = await getPackingTable({
				date: params.date,
				sys_id: params.sys_id,
				page: page.value.toString(),
				limit: limit.value.toString(),
			})
			console.log('查看回调',response)
			if (response.code === 0) {
				total.value = response.data.total
				tableData.splice(0, tableData.length, ...response.data.rows)
				setCurrent(tableData[0])
			}
		} catch (e) {
			console.log(e)
		}
	}
	// 获取定位数据
	const getLocateTable = async () => {
		try {
			const response = await getLocate({
				gdbh: params.gdbh,
				page: page.value.toString(),
				limit: limit.value.toString(),
			})
			if (response.code === 0) {
				total.value = response.data.total
				tableData.splice(0, tableData.length, ...response.data.rows)
			}
		} catch (e) {
			console.log(e)
		}
	}
	// 删除数据
	const deleteTableData = async (id) => {
		try {
			const res = await DeletePackingTable({
				UniqId: id
			})
			if (res.code === 0) {
				return 0
			}
		} catch (e) {
			console.log(e)
		}
	}

	const handleNodeClick = (node, check) => {
		if (node.params) {
			params.date = node.params.date
			params.sys_id = node.params.sys_id
			params.type = 'getTableData'
			page.value = 1
			getTableData()
		}
	}

	const selectvalue = (e) => {
		console.log(e)
		e.currentTarget.select();
	}
	// 定位
	const handleSearch = () => {
		params.gdbh = searchInfo.value
		params.type = 'getLocateTable'
		page.value = 1
		getLocateTable()
	}

	// 查改
	const handleShowDetail = () => {
		type.value = '查改'
		console.log(currentRow.value)
		if (currentRow.value.UniqId == undefined) {
			ElMessage({
				type: 'warning',
				message: '未选中记录',
			})
			return
		} else {
			getTableInfo(currentRow.value?.UniqId)
		}
	}

	// 删除
	const handleDelete = () => {
		if (currentRow.value.UniqId == undefined) {
			ElMessage({
				type: 'warning',
				message: '未选中记录',
			})
			return
		}
		ElMessageBox.confirm(
				`确认删除这条数据么?`,
				'警告', {
					confirmButtonText: '确认',
					cancelButtonText: '取消',
					type: 'warning',
				}
			)
			.then(async () => {
				const ret = await deleteTableData(currentRow.value?.UniqId)
				if (ret === 0) {
					ElMessage({
						type: 'success',
						message: '删除成功',
					})
					getSideData()
					getTableData()
				} else {
					ElMessage({
						type: 'error',
						message: '删除失败',
					})
				}
			})
			.catch(() => {
				ElMessage({
					type: 'info',
					message: '取消删除',
				})
			})
	}
	// 分页
	// #region
	const handleSizeChange = () => {
		switch (params.type) {
			case 'getTableData':
				getTableData()
				break
			case 'getLocateTable':
				getLocateTable()
				break
			default:
				break
		}
	}
	const handleCurrentChange = () => {
		switch (params.type) {
			case 'getTableData':
				getTableData()
				break
			case 'getLocateTable':
				getLocateTable()
				break
			default:
				break
		}
	}
	// #endregion

	// 详情界面
	const detailData = reactive({
		UniqId: '',
		selectIndex: 0,
		sczl_rq: '',
		sczl_bh: '',
		name: '',
		sczl_bzdh: '',
		sczl_jsss: '',
		sczl_冲定额: '',
		sczl_desc: '',
		table: [],
	})
	const selectData = reactive([])
	const table = ref()

	// 弹窗控制标记
	const dialogFormVisible = ref(false)
	const dialogSelectVisible = ref(false)

	const setCurrent = (row) => {
		table.value?.setCurrentRow(row)
		detailData.sczl_bzdh = row.sczl_bzdh
		detailData.sczl_冲定额 = row.sczl_冲定额
	}
	const setCurrent2 = (row) => {
		table.value?.setCurrentRow(row)
		detailData.sczl_冲定额 = row.sczl_冲定额
	}
	// 获取详细信息
	const getTableInfo = async (id) => {
		try {
			const response = await getInfo({
				UniqId: id
			})
			if (response.code === 0) {
				const {
					sczl_rq,
					sczl_bh,
					name,
					sczl_bzdh,
					sczl_jsss,
					sczl_冲定额,
					sczl_desc,
					...rest
				} = response.data
				Object.assign(detailData, {
					sczl_rq,
					sczl_bh,
					name,
					sczl_bzdh,
					sczl_jsss,
					sczl_冲定额,
					sczl_desc
				})
				detailData.table = Array.from({
						length: 6
					}, (_, i) => i + 1)
					.map(num => {
						return {
							sczl_gdbh: rest[`sczl_gdbh${num}`],
							sczl_yjGx: rest[`sczl_yjGx${num}`],
							sczl_gxmc: rest[`sczl_gxmc${num}`],
							Gd_cpmc: rest[`Gd_cpmc${num}`],
							sczl_cl: rest[`sczl_cl${num}`],
							hsbz:rest[`sczl_type${num}`],
							sczl_返工产量: rest[`sczl_返工产量${num}`],
							sczl_PgCl: rest[`sczl_PgCl${num}`],
							sczl_计产系数: rest[`sczl_计产系数${num}`],
							sczl_Jtbh1: rest[`sczl_Jtbh${num}`],
							sczl_dedh: rest[`sczl_dedh${num}`],
						}
					})

				if (type.value === '新增') {
					console.log(detailData)
					// detailData.name = ''
					// detailData.sczl_bh = ''
					// detailData.sczl_bzdh = ''
					// detailData.sczl_desc = ''
					// detailData.sczl_jsss = ''
					// detailData.sczl_rq = ''
					detailData.table.forEach(row => {
						for (const key in row) {
							if ( key === 'sczl_cl'){
								row[key] = '' // 清空每行的内容
							}

						}
					})
				} else {
					detailData.UniqId = id
					dialogFormVisible.value = true
				}

				if (type.value === '新增' || type.value === '查改') {
					detailData.UniqId = id
					dialogFormVisible.value = true

					// 在 setTimeout 中获取元素，确保在 DOM 渲染完毕后执行
					setTimeout(() => {
						formElements = document.getElementById('detail-form').elements
						formElements[0].focus()
					}, 0)
				}
			}
		} catch (e) {
			console.log(e)
		}
	}

	//日期获得焦点事件
	const rqHandleFocus = () => {
		if (detailData.sczl_rq == '') {
			detailData.sczl_rq = new Date().toISOString().split('T')[0]
		}
	}

	// 获取工序名称
	const getTableGxMc = async (event,index, row) => {
		try {
			const response = await getGxMc({
				gdbh: row.sczl_gdbh
			})
			if (response.code === 0) {
				if (response.data.length === 0) {
					ElMessage({
						type: 'error',
						message: row.sczl_gdbh+'工单未发现印件、工艺数据，请先维护工单基础数据',
					})
					detailData.table[index].Gd_cpmc = ''
					detailData.table[index].sczl_yjGx = ''
					detailData.table[index].sczl_gxmc = ''
				}else if (response.data.length === 1) {
					const {
						Gd_cpmc,
						Gy0_gxmc,
						jyGx
					} = response.data[0]
					detailData.table[index].Gd_cpmc = Gd_cpmc
					detailData.table[index].sczl_yjGx = jyGx
					detailData.table[index].sczl_gxmc = Gy0_gxmc
				} else {
					selectData.splice(0, selectData.length, ...response.data)
					setCPCurrent(selectData[0])
					detailData.selectIndex = index
					dialogSelectVisible.value = true
				}
			}
		} catch (e) {
			console.log(e)
		}
	}

	// 更新数据
	const updateDetailData = async () => {
		const restoredData = {
			UniqId: detailData.UniqId,
			sczl_rq: detailData.sczl_rq,
			sczl_bh: detailData.sczl_bh,
			name: detailData.name,
			sczl_bzdh: detailData.sczl_bzdh,
			sczl_jsss: detailData.sczl_jsss,
			sczl_冲定额: detailData.sczl_冲定额,
			sczl_desc: detailData.sczl_desc,
		}
		detailData.table.forEach((item, index, array) => {
			const num = index + 1
			restoredData[`sczl_gdbh${num}`] = item.sczl_gdbh
			restoredData[`sczl_yjGx${num}`] = item.sczl_yjGx
			restoredData[`sczl_gxmc${num}`] = item.sczl_gxmc
			restoredData[`sczl_type${num}`] = item.hsbz === undefined ? '' : item.hsbz;
			restoredData[`Gd_cpmc${num}`] = item.Gd_cpmc
			restoredData[`sczl_cl${num}`] = item.sczl_cl
			restoredData[`sczl_返工产量${num}`] = item.sczl_返工产量
			restoredData[`sczl_PgCl${num}`] = item.sczl_PgCl
			restoredData[`sczl_计产系数${num}`] = item.sczl_计产系数
			restoredData[`sczl_Jtbh${num}`] = item.sczl_Jtbh1
			restoredData[`sczl_dedh${num}`] = item.sczl_dedh
		})
		console.log(restoredData)
		// return false;
		const res = await updatePackingTable(restoredData)
		if (res.code === 0) {
			ElMessage({
				type: 'success',
				message: '更新成功',
			})
		getTableData()
			dialogFormVisible.value = false
		}
		setTimeout(() => {
		const inputElement = document.getElementById('员工编号');
			if (inputElement) {
				inputElement.focus();		
			}
		}, 100);
	}

	// 新增数据
	const handleShowAdd = async () => {
		type.value = '新增'
		if (currentRow.value.UniqId == null) {
			detailData.table = Array.from({
					length: 6
				}, (_, i) => i + 1)
				.map(num => {
					return {
						sczl_gdbh: '',
						sczl_yjGx: '',
						sczl_gxmc: '',
						Gd_cpmc: '',
						sczl_cl: '',
						sczl_返工产量: '',
						sczl_PgCl: '',
						sczl_计产系数: '',
						sczl_Jtbh1: '',
						sczl_dedh: '',
					}
				})
			// setTimeout(() => {
			// 	formElements = document.getElementById('detail-form').elements
			// 	formElements[0].focus()
			// }, 0)
			dialogFormVisible.value = true
		} else {
			await getTableInfo(currentRow.value?.UniqId)
			// 默认日期为前一天的日期
			const date = dayjs().subtract(1, 'day').format('YYYY-MM-DD')
			detailData.sczl_rq = date
		}
	}
	const addDetailData = async () => {
		const restoredData = {
			sys_id: sys_id,
			sczl_rq: detailData.sczl_rq,
			sczl_bh: detailData.sczl_bh,
			// name: detailData.name,
			sczl_bzdh: detailData.sczl_bzdh,
			sczl_jsss: detailData.sczl_jsss,
			sczl_冲定额: detailData.sczl_冲定额,
			sczl_desc: detailData.sczl_desc,
		}
		detailData.table.forEach((item, index, array) => {
			const num = index + 1
			restoredData[`sczl_gdbh${num}`] = item.sczl_gdbh
			restoredData[`sczl_yjGx${num}`] = item.sczl_yjGx
			restoredData[`sczl_gxmc${num}`] = item.sczl_gxmc
			restoredData[`sczl_type${num}`] = item.hsbz === undefined ? '' : item.hsbz;
			// restoredData[`Gd_cpmc${num}`] = item.Gd_cpmc
			restoredData[`sczl_cl${num}`] = item.sczl_cl
			restoredData[`sczl_返工产量${num}`] = item.sczl_返工产量
			restoredData[`sczl_PgCl${num}`] = item.sczl_PgCl
			restoredData[`sczl_计产系数${num}`] = item.sczl_计产系数
			restoredData[`sczl_Jtbh${num}`] = item.sczl_Jtbh1
			restoredData[`sczl_dedh${num}`] = item.sczl_dedh
		})
	
		const res = await addPackingTable(restoredData)
		if (res.code === 0) {
			ElMessage({
				type: 'success',
				message: '新增成功',
			})
		getTableData()
			if (params.date != '') {
				getTableData()
			}
			getSideData()
		}
		setTimeout(() => {
		const inputElement = document.getElementById('员工编号');
			if (inputElement) {
				inputElement.focus();		
			}
		}, 100);
	}
	//弹出框回车事件
	const handleGetYg = async () => {
		if (detailData.sczl_bh == '') {
			formElements = document.getElementById('detail-form').elements
			formElements[3].focus()
			formElements[3].select()
			return
		}
		try {
			const response = await getYg({ sczl_bh: detailData.sczl_bh })
			if (response.code == 0) {
				if (response.data.length == 1) {
					detailData.name = response.data[0].ygxm
					detailData.sczl_bh = response.data[0].员工编号
					detailData.sczl_jsss = "0"
					// detailData.sczl_冲定额 = "0"
					formElements = document.getElementById('detail-form').elements
					formElements[3].focus()
					formElements[3].select()
				} else if (response.data.length > 1) {
					selectData_Yg.splice(0, selectData_Yg.length, ...response.data)
					setGXCurrent_Yg(selectData_Yg[0])
					dialogSelectVisible_Yg.value = true
				} else {
					ElMessage({
						type: 'warning',
						message: '未查询到该员工'
					})
					detailData.name = ''
					detailData.sczl_bh = ''
				}
			} else {
				detailData.name = '';
				detailData.sczl_bh = '';
			}
		} catch (e) {
			console.log(e)
		}
	}
	const dialogSelectVisible_Yg = ref(false)
	const selectData_Yg = reactive([])
	// 处理选择框
	const handleSelectClick_Yg = (row, column, event) => {
		detailData.name = row.ygxm
		detailData.sczl_bh = row.员工编号
		dialogSelectVisible_Yg.value = false
		formElements = document.getElementById('detail-form').elements
		formElements[3].focus()
		formElements[3].select()
	}
	const currentIndex_Yg = ref(0);
	const GXCurrent_Yg = ref(0);
	const selectGX_Yg = (event) => {
		if (event.keyCode === 40) { // 向下箭头
			if (currentIndex_Yg.value < selectData_Yg.length - 1) {
				currentIndex_Yg.value++;
				setGXCurrent_Yg(selectData_Yg[currentIndex_Yg.value]);
			} else {
				currentIndex_Yg.value = 0;
				setGXCurrent_Yg(selectData_Yg[currentIndex_Yg.value]); // 到达最后一行时回到第一行			
			}
		} else if (event.keyCode === 38) { // 向上箭头
			if (currentIndex_Yg.value > 0) {
				currentIndex_Yg.value--;
				setGXCurrent_Yg(selectData_Yg[currentIndex_Yg.value]);
			} else {
				currentIndex_Yg.value = selectData_Yg.length - 1;
				setGXCurrent_Yg(selectData_Yg[currentIndex_Yg.value]); // 到达第一行时回到最后一行
			}
		} else if (event.keyCode === 13) { // 回车键
			dialogSelectVisible_Yg.value = false;
			formElements = document.getElementById('detail-form').elements
			formElements[3].focus()
			formElements[3].select()
		}
	}
	const table_Yg = ref()
	const setGXCurrent_Yg = (row) => {
		setTimeout(() => {
			table_Yg.value?.setCurrentRow(row)
			detailData.name = row.ygxm
			detailData.sczl_bh = row.员工编号
		})
	}

	//班组回车事件
	// const getBzsubmit = (event) => {
	// 	if (event.keyCode !== 37){
	// 	//弹出选择
	// 	const data = [{
	// 		'sczl_bzdh': 'A班'
	// 	}, {
	// 		'sczl_bzdh': 'B班'
	// 	}]
	// 	selectDataBz.splice(0, selectDataBz.length, ...data)
	// 	if (dialogSelectVisible_Yg.value == false){
	// 		BzVisible.value = true
	// 	}

	// 	setCurrent(data[0])
	// 	}

	// }
	// //冲月定额
	// const getBzsubmit2 = (event) => {
	// 	if (event.keyCode !== 37) {
	// 		const data = [{
	// 		'sczl_冲定额': '是'
	// 	}, {
	// 		'sczl_冲定额': '否'
	// 	}]
	// 	selectDataCY.splice(0, selectDataCY.length, ...data)
	// 	BzVisible2.value = true
	// 	setCurrent2(data[0])
	// 	}
	// }
	const dialogSelectVisible_Bz = ref(false)
	const selectData_Bz = reactive([])
	// 处理选择框
	const handleSelectClick_Bz = (row, column, event) => {
		detailData.sczl_bzdh = row.sczl_bzdh
		dialogSelectVisible_Bz.value = false
	}
	const currentIndex_Bz = ref(0);
	const GXCurrent_Bz = ref(0);
	const selectGX_Bz = (event) => {
		if (event.keyCode === 40) { // 向下箭头
			if (currentIndex_Bz.value < selectData_Bz.length - 1) {
				currentIndex_Bz.value++;
				setGXCurrent_Bz(selectData_Bz[currentIndex_Bz.value]);
			} else {
				currentIndex_Bz.value = 0;
				setGXCurrent_Bz(selectData_Bz[currentIndex_Bz.value]); // 到达最后一行时回到第一行			
			}
		} else if (event.keyCode === 38) { // 向上箭头
			if (currentIndex_Bz.value > 0) {
				currentIndex_Bz.value--;
				setGXCurrent_Bz(selectData_Bz[currentIndex_Bz.value]);
			} else {
				currentIndex_Bz.value = selectData_Bz.length - 1;
				setGXCurrent_Bz(selectData_Bz[currentIndex_Bz.value]); // 到达第一行时回到最后一行
			}
		} else if (event.keyCode === 13) { // 回车键
			dialogSelectVisible_Bz.value = false;
		}
	}
	const table_Bz = ref()
	const setGXCurrent_Bz = (row) => {
		setTimeout(() => {
			table_Bz.value?.setCurrentRow(row)
			detailData.sczl_bzdh = row.sczl_bzdh
		})
	}
	
	// 处理选择框回车操作
	// const handleEnter = (event,index, row) => {
	// 	const inputs = document.getElementsByTagName("input");
	// 	const currentIndex = Array.from(inputs).indexOf(event.target);
	// 	// console.log(inputs)
	// 	if(event.keyCode === 13){
	// 		console.log("回车")
	// 		detailData.table[index].sczl_dedh = '030002002'
	// 		detailData.table[index].sczl_计产系数 = '1.000'
	// 		if (row.sczl_gdbh === '') {
	// 			detailData.table[index].sczl_yjGx = ''
	// 			detailData.table[index].sczl_gxmc = ''
	// 			detailData.table[index].Gd_cpmc = ''
	// 		} else {
	// 			getTableGxMc(index, row)
	// 		}
	// 	}
	// }

	// 处理选择框
	const handleSelectClick = (row, column, event) => {
		const {
			Gd_cpmc,
			Gy0_gxmc,
			jyGx
		} = row
		const index = detailData.selectIndex
		detailData.table[index].Gd_cpmc = Gd_cpmc
		detailData.table[index].sczl_yjGx = jyGx
		detailData.table[index].sczl_gxmc = Gy0_gxmc
		dialogSelectVisible.value = false
	}
	const table2 = ref()
	const setCPCurrent = (row) => {
		setTimeout(() => {
			table2.value?.setCurrentRow(row)
			const {
				Gd_cpmc,
				Gy0_gxmc,
				jyGx
			} = row
			const index = detailData.selectIndex
			detailData.table[index].Gd_cpmc = Gd_cpmc
			detailData.table[index].sczl_yjGx = jyGx
			detailData.table[index].sczl_gxmc = Gy0_gxmc
		})
	}
	const CPIndex = ref(0);
	const JYCurrent = ref(0);
	const selectCP = (event) => {
		if (event.keyCode === 40) { // 向下箭头
			if (CPIndex.value < selectData.length - 1) {
				CPIndex.value++;
				setCPCurrent(selectData[CPIndex.value]);
			} else {
				CPIndex.value = 0;
				setCPCurrent(selectData[CPIndex.value]); // 到达最后一行时回到第一行			
			}
		} else if (event.keyCode === 38) { // 向上箭头
			if (CPIndex.value > 0) {
				CPIndex.value--;
				setCPCurrent(selectData[CPIndex.value]);
			} else {
				CPIndex.value = selectData.length - 1;
				setCPCurrent(selectData[CPIndex.value]); // 到达第一行时回到最后一行
			}
		} else if (event.keyCode === 13) { // 回车键
			dialogSelectVisible.value = false

		}
	}
	// 弹窗确定
	const enterDialog = async () => {
		for(let i = 0; i < detailData.table.length; i++) {
				if (detailData.table[i].sczl_gdbh ) {
					if(detailData.table[i].sczl_yjGx === '' || detailData.table[i].sczl_gxmc === '' || detailData.table[i].Gd_cpmc === ''){
						ElMessage({
						type: 'warning',
						message: detailData.table[i].sczl_gdbh + '工单未填写印件工序、工序名称或印件名称，无法保存'
					})
					return;
					}
				}
			}
		ElMessageBox.confirm('数据存盘?', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning'
		}).then(() => {
			console.log(detailData.table[0].sczl_gdbh)
			if (type.value === '查改') {
			updateDetailData()
			console.log('查改')
		} else if (type.value === '新增') {
			addDetailData()
		}
		})
	}


	/*
		定额代号
	*/
	const dedhtreeData = reactive([]);
	const treeRef = ref(null);
	const dedhsearchModel = ref(false);
	const table_fplb = ref(null); // el-tree 的 ref
	const defaultExpandedKey = ref(null); // 默认展开的节点 key
	const selectIndex = ref(0); // 当前选中的索引
	const _index = ref(null)
	
	const getDedhsubmit = async (event,index, row) => {
	  try {
	    // 如果当前值是特殊值，直接跳到下一行
	    if (detailData.table[index].sczl_dedh === "030002002") {
	      jumpToNextRow(index);
	      return;
	    }
	
	    // 请求数据
	    const response = await getDedh();
	    if (response.code === 0) {
	      const treeData = response.data;
	
	      // 判断当前行的值是否存在于返回数据中
	      const isValueExist = checkIfValueExist(treeData, row.sczl_dedh);
	      if (isValueExist) {
	        console.log("匹配成功，跳转到下一行");
	        jumpToNextRow(index); // 跳转到下一行
	      } else {
			  if (event.keyCode === 13) {
				  // 如果不匹配，弹出弹窗
				  dedhsearchModel.value = true; 
				  _index.value = index; // 保存当前行索引
				  	
				  // 构建树形数据
				  dedhtreeData.splice(0, dedhtreeData.length, ...treeData.map((node) => buildTree(node)));
				  	
				  nextTick(() => {
				    const tree = table_fplb.value;
				    if (tree) {
				      const firstNode = tree.getNode(0);
				      if (firstNode) {
				        firstNode.expanded = true; 
				        firstNode.el.scrollIntoView();
				        firstNode.el.focus();
				      }
				    }
				  });
			  }
	      }
	    }
	  } catch (error) {
	    console.error("获取数据出错：", error);
	  }
	};
	
	// 判断当前值是否存在于树数据中
	const checkIfValueExist = (data, targetValue) => {
	  let found = false;
	
	  const search = (nodes) => {
	    for (const node of nodes) {
	      if (node.sys_bh === targetValue) {
	        found = true;
	        break;
	      }
	      if (Array.isArray(node.bh_mc)) {
	        search(node.bh_mc); // 递归搜索
	      }
	    }
	  };
	
	  search(data);
	  return found;
	};
	
	// 构建树形数据
	const buildTree = (node, parentIndex = "") => {
	  return {
	    id: parentIndex ? `${parentIndex}-${node.sys_bh}` : node.sys_bh,
	    label: `${node.sys_mc}【${node.sys_bh}】`,
	    params: { code: node.sys_bh },
	    children: Array.isArray(node.bh_mc)
	      ? node.bh_mc.map((child) => buildTree(child, node.sys_bh))
	      : [],
	  };
	};
	
	// 跳转到下一行的工单编号
	const jumpToNextRow = (currentIndex) => {
	  const nextRowIndex = currentIndex + 1;
	  if (nextRowIndex < detailData.table.length) {
	    nextTick(() => {
	      const nextInput = document.querySelector(
	        `[data-index="${nextRowIndex}"] input`
	      );
	      if (nextInput) {
	        nextInput.focus(); // 聚焦到下一行的工单编号输入框
	      }
	    });
	  }
	};

	
	
	//键盘事件
	const handleTreeKeydown = (event, index) => {
	  // _index.value = index; // 保存当前行索引
	  const tree = table_fplb.value; // 获取树实例
	  if (!tree) {
	    console.error("树组件未加载");
	    return;
	  }
	
	  const focusedElement = document.activeElement;
	  const focusedNodeId = focusedElement?.getAttribute("data-key");
	
	  // 回车键（13）的处理
	  if (event.keyCode === 13 && focusedNodeId) {
	    tree.setCurrentKey(focusedNodeId);
	    tree.$nextTick(() => {
	      const currentNode = tree.getCurrentNode();
	      if (!currentNode) {
	        console.warn("没有选中的节点");
	        return;
	      }
	
	      // 清除上一次的选中状态
	      clearPreviousSelection(tree);
	
	      // 收起所有其他节点
	      Object.keys(tree.store.nodesMap).forEach((key) => {
	        tree.store.nodesMap[key].expanded = false; // 收起所有节点
	      });
	
	      // 展开当前节点
	      tree.store.nodesMap[currentNode.id].expanded = true;
	
	      // 如果当前节点有子节点，选中第一个子节点
	      if (currentNode.children && currentNode.children.length > 0) {
	        const firstChild = currentNode.children[0];
	        if (firstChild) {
	          const firstChildKey = firstChild.id.toString();
	          tree.setCurrentKey(firstChildKey);
	          setTimeout(() => {
	            const firstChildDom = tree.$el.querySelector(`[data-key="${firstChildKey}"]`);
	            if (firstChildDom) {
	              firstChildDom.focus();
	              firstChildDom.scrollIntoView({ block: "nearest" });
	            }
	          });
	        }
	      } else {
	        // 当前节点没有子节点的逻辑
	        console.log("当前行索引:", _index.value); // 打印当前行索引
	        console.log("当前子节点:", currentNode.label);
	        const currentLabel = currentNode.label; 
	        const code = currentLabel.split("【")[1]?.split("】")[0] || "";
	
	        // 赋值给当前行的字段
	        detailData.table[_index.value].sczl_dedh = code;
	        dedhsearchModel.value = false; // 关闭弹窗
	      }
	    });
	  }
	
	  // 上下箭头键（38/40）的处理
	  else if (event.keyCode === 38 || event.keyCode === 40) {
	    const currentNode = tree.getCurrentNode();
	    if (currentNode) {
	      const currentNodeDom = tree.$el.querySelector(`[data-key="${currentNode.id}"]`);
	      if (currentNodeDom) {
	        currentNodeDom.focus();
	      }
	    }
	  }
	};

	
	// 清除之前的选中状态
	const clearPreviousSelection = (tree) => {
	  const selectedNodes = tree.getCheckedNodes();
	  selectedNodes.forEach(node => {
		tree.setChecked(node, false);
	  });
	  tree.setCurrentKey(null);
	};
	
	
	// 弹出框键盘事件
	const ent = (event) => {
	  if (document.activeElement.id === "tableFplb") {
		if (table_fplb.value) {
		  const tree = table_fplb.value?.$el;
		  console.log(111, tree);
		  if (tree) {
			const node = tree.querySelector("[data-key]");
			console.log(222, node);
			if (event.keyCode === 13) {
				/* 跳过 */
			}
			if (node) {
			  node.scrollIntoView({ block: "nearest" }); // 确保节点可见
			  node.focus(); // 确保焦点正确
			}
		  }
		}
	  }
	};
	
	// 点击定额代号
	const dedhhandleNodeClick = (node, check) => {
		console.log(node);
		console.log(node.params.code);
		if (node.children && node.children.length > 0) {
			console.log(11);
		} else {
			detailData.table[_index.value].sczl_dedh = node.params.code
			dedhsearchModel.value = false;
		}
		// dedhsearchModel.value = false;
	};




	let flag_Bz = true
	let formElements
// 	const moveFocus = (event,index,row,title) => {
// 		// console.log(formElements);
//     const index = Array.from(formElements).indexOf(event.target);
//     const key = event.key;
// 	console.log(index);
// 	const currentInputValue = formElements[index].value;
//     event.preventDefault();
//     switch (index) {
//         case 0:
//             if (key === 'ArrowRight' ) {
//                 formElements[1].focus();
//                 formElements[1].select();
//             } else if (key === 'ArrowLeft') {
//                 formElements[formElements.length - 1].focus();
//                 formElements[formElements.length - 1].select();
//             } else if (key === 'Enter') {
//                 formElements[1].focus();
//                 formElements[1].select();
//             }
//             break;
//         case 1:
//             if (key === 'ArrowRight') {
//                 formElements[3].focus();
//                 formElements[3].select();
//             } else if (key === 'ArrowLeft') {
//                 formElements[0].focus();
//                 formElements[0].select();
//             } else if (key === 'Enter') {
//                 handleGetYg();
//             }
//             break;

//         case 3:
//             if (key === 'ArrowRight') {

//                 formElements[4].focus();
//                 formElements[4].select();
//             } else if (key === 'ArrowLeft') {
//                 formElements[1].focus();
//                 formElements[1].select();
//             } else if (key === 'Enter') {
//                 formElements[4].focus();
//                 formElements[4].select();
//             }
//             break;

//         case formElements.length - 1:
//             if (key === 'ArrowRight') {
//                 formElements[0].focus();
//                 formElements[0].select();
//             } else if (key === 'ArrowLeft') {
//                 formElements[index - 1].focus();
//                 formElements[index - 1].select();
//             } else if (key === 'Enter') {
//                 formElements[0].focus();
//                 formElements[0].select();
// 				enterDialog()
//             }
//             break;

//         default:
//             if (key === 'ArrowRight') {
//                 formElements[index + 1].focus();
//                 formElements[index + 1].select();
//             } else if (key === 'ArrowLeft') {
//                 formElements[index - 1].focus();
//                 formElements[index - 1].select();
//             } else if (key === 'Enter') {
//                 formElements[index + 1].focus();
//                 formElements[index + 1].select();
//             }
//             break;
//     }
// };
// 	const movefous2 = (event,row,index)=>{
// 		const index2 = Array.from(formElements).indexOf(event.target)
// 			if (row.sczl_dedh != '' & event.key === "ArrowRight"){
// 				event.stopPropagation();
// 				formElements[index2+2].focus();
// 				formElements[index2+2].select();
// 			}
// 	}
// 	const movefous = (event,row,index)=>{
// 		console.log(1)
// 		const index2 = Array.from(formElements).indexOf(event.target)
// 			if (row.sczl_dedh != '' & event.key === "ArrowLeft"){
// 				event.stopPropagation();
// 				formElements[index2-2].focus();
// 				formElements[index2-2].select();
// 			}
// 			if(row.sczl_gdbh === '' && event.key === "Enter" ){
// 				event.stopPropagation();
// 				formElements[index2+11].focus();
// 				formElements[index2+11].select();
// 				row.sczl_yjGx = ""
// 				row.sczl_gxmc = ""
// 				row.Gd_cpmc = ""
// 				row.hsbz = ""
// 				row.sczl_cl = ""
// 				row.sczl_返工产量 = ""
// 				row.sczl_计产系数 = ""
// 				row.sczl_PgCl = ""
// 				row.sczl_Jtbh1 = ""
// 				row.sczl_dedh = ""
// 			}
// 	}
	
// 	const moveFocus3 = (event, index, formElements) => {
// 	  const key = event.key; // 获取当前按下的键

// 	  console.log("当前按下的键:", key);

// 	  if (key === 'ArrowRight') {
// 		// 右方向键：将焦点移到下一个元素
// 		if (index + 1 < formElements.length) {
// 		  formElements[index + 1].focus();
// 		  formElements[index + 1].select();
// 		}
// 	  } else if (key === 'ArrowLeft') {
// 		// 左方向键：将焦点移到上一个元素
// 		if (index - 1 >= 0) {
// 		  formElements[index - 1].focus();
// 		  formElements[index - 1].select();
// 		}
// 	  } else if (key === 'Enter') {
// 		event.stopPropagation();
// 		formElements[index2-2].focus();
// 		formElements[index2-2].select();
// 	  }
// 	};

	/*
		核算标准
	*/
    const hsbzVisible = ref(false); // 控制弹窗显示
    const selectDatahsbz = ref([{ value: "1000" }, { value: "2500" }]); // 弹窗数据
    const currentRowIndex = ref(0); // 弹窗中当前高亮的行索引
    const tableRef = ref(null); // 弹窗表格的引用
    const editingRow = ref(null); // 当前主表格中正在编辑的行

    // 弹窗键盘事件处理
    const selecthsbz = (event) => {
      const maxIndex = selectDatahsbz.value.length - 1;
      if (event.key === "ArrowUp") {
        currentRowIndex.value = currentRowIndex.value === 0 ? maxIndex : currentRowIndex.value - 1;
        updateHighlightRow();
      } else if (event.key === "ArrowDown") {
        currentRowIndex.value = currentRowIndex.value === maxIndex ? 0 : currentRowIndex.value + 1;
        updateHighlightRow();
      } else if (event.key === "Enter") {
        const selectedRow = selectDatahsbz.value[currentRowIndex.value];
        if (selectedRow) {
          SelectClickhsbz(selectedRow);
        }
      }
    };

    // 更新弹窗中高亮行
    const updateHighlightRow = () => {
      nextTick(() => {
        if (tableRef.value) {
          tableRef.value.setCurrentRow(selectDatahsbz.value[currentRowIndex.value]);
        }
      });
    };

    // 选中某一行，并将数据回填到主表格
    const SelectClickhsbz = (selectedRow) => {
      if (!selectedRow) return;
      console.log("selectedRow.value", selectedRow.value);
      // 将选中的值回填到主表格当前行的 `hsbz` 字段
      if (editingRow.value) {
        editingRow.value.hsbz = selectedRow.value; // 确保 editingRow 是响应式的
      } else {
        console.error("当前没有编辑的行！");
      }
      // 关闭弹窗
      hsbzVisible.value = false;
    };

//回车事件
const ent1 = (event,index,row,title) => {
  const inputs = document.getElementsByTagName("input");
  const currentIndex = Array.from(inputs).indexOf(event.target);
  
  if (event.keyCode === 13 && title === '工单编号') { // 检测是否按下回车键，且当前列为工单编号
      if (row["sczl_gdbh"] === "") { // 如果当前工单编号为空
        event.preventDefault(); // 阻止默认事件
        event.stopPropagation(); // 阻止事件冒泡
  
        // 跳转到下一行的工单编号输入框
        const nextInputIndex = currentIndex + 11; // 假设每行有 10 个 input
        if (nextInputIndex < inputs.length) { // 如果下一行的 input 存在
          inputs[nextInputIndex].focus(); // 聚焦到下一行的工单编号
          inputs[nextInputIndex].select(); // 选中内容
        }
  
        // 清空当前行的相关字段
        row.sczl_yjGx = "";
        row.sczl_gxmc = "";
        row.Gd_cpmc = "";
        row.hsbz = "";
        row.sczl_cl = "";
        row.sczl_返工产量 = "";
        row.sczl_计产系数 = "";
        row.sczl_PgCl = "";
        row.sczl_Jtbh1 = "";
        row.sczl_dedh = "";
  
        // 设置当前行默认值
        // detailData.table[index].sczl_dedh = "030002002"; // 设置默认 dedh 值
        // detailData.table[index].sczl_计产系数 = "1.000"; // 设置默认 计产系数 值
		detailData.table[index].sczl_dedh = ""; // 设置默认 dedh 值
		detailData.table[index].sczl_计产系数 = ""; // 设置默认 计产系数 值
  
        return; // 当前工单为空时，跳到下一行后停止后续逻辑
      }
  
      // 如果当前工单编号不为空，调用处理函数
      getTableGxMc(event, index, row);
    }
  
  
  if(event.keyCode === 13 && title ==='员工编号'){
	  //调用员工编号方法
	  handleGetYg();
  }
  if(event.keyCode === 13 && title ==='组别'){
	//弹出选择
	const data = [
		{
			'sczl_bzdh': 'A班'
		}, 
		{
			'sczl_bzdh': 'B班'
		},
	]
	selectDataBz.splice(0, selectDataBz.length, ...data)
	if (dialogSelectVisible_Yg.value == false){
		BzVisible.value = true
	}
	setCurrent(data[0])
  }
  if(event.keyCode === 13 && title ==='冲月定额'){
	const data = [
		{
			'sczl_冲定额': '是'
		}, 
		{
			'sczl_冲定额': '否'
		},
	]
	selectDataCY.splice(0, selectDataCY.length, ...data)
	BzVisible2.value = true
	setCurrent2(data[0])
  }
  
  
  if(event.keyCode === 13 && title ==='核算标准'){
	  hsbzVisible.value = true; // 显示弹窗
	  editingRow.value = row; // 将当前行数据存储到 editingRow 中
	  currentRowIndex.value = 0; // 默认选中第一行
	  nextTick(() => {
		updateHighlightRow(); // 高亮弹窗中的第一行
	  });
  }
  
  if(event.keyCode === 13 && title ==='定额代号'){
		getDedhsubmit(event,index,row,title)
  }
  
  
  
  if (event.keyCode === 13 && title === '其他备注') {
	  const index = Array.from(formElements).indexOf(event.target);
	  const key = event.key;
	  console.log(index);
	  const currentInputValue = formElements[index].value;
	  event.preventDefault();
	  switch (index) {
	      case 0:
	          if (key === 'ArrowRight' ) {
	              formElements[1].focus();
	              formElements[1].select();
	          } else if (key === 'ArrowLeft') {
	              formElements[formElements.length - 1].focus();
	              formElements[formElements.length - 1].select();
	          } else if (key === 'Enter') {
	              formElements[1].focus();
	              formElements[1].select();
	          }
	          break;
	      case 1:
	          if (key === 'ArrowRight') {
	              formElements[3].focus();
	              formElements[3].select();
	          } else if (key === 'ArrowLeft') {
	              formElements[0].focus();
	              formElements[0].select();
	          } else if (key === 'Enter') {
	              handleGetYg();
	          }
	          break;
	  
	      case 3:
	          if (key === 'ArrowRight') {
	  
	              formElements[4].focus();
	              formElements[4].select();
	          } else if (key === 'ArrowLeft') {
	              formElements[1].focus();
	              formElements[1].select();
	          } else if (key === 'Enter') {
	              formElements[4].focus();
	              formElements[4].select();
	          }
	          break;
	  
	      case formElements.length - 1:
	          if (key === 'ArrowRight') {
	              formElements[0].focus();
	              formElements[0].select();
	          } else if (key === 'ArrowLeft') {
	              formElements[index - 1].focus();
	              formElements[index - 1].select();
	          } else if (key === 'Enter') {
	              formElements[0].focus();
	              formElements[0].select();
	  			enterDialog()
	          }
	          break;
	  
	      default:
	          if (key === 'ArrowRight') {
	              formElements[index + 1].focus();
	              formElements[index + 1].select();
	          } else if (key === 'ArrowLeft') {
	              formElements[index - 1].focus();
	              formElements[index - 1].select();
	          } else if (key === 'Enter') {
	              formElements[index + 1].focus();
	              formElements[index + 1].select();
	          }
	          break;
	  }
  }

  
  
  if (event.keyCode === 13 || event.keyCode === 40) {
    // Enter 或向下箭头
    for (let i = currentIndex + 1; i < inputs.length; i++) {
      if (!inputs[i].readOnly) {
        nextTick(() => {
          inputs[i].focus();
          inputs[i].select();
        });
        break;
      }
    }
  } else if (event.keyCode === 38) {
    // 向上箭头
    for (let i = currentIndex - 1; i >= 0; i--) {
      if (!inputs[i].readOnly) {
        nextTick(() => {
          inputs[i].focus();
          inputs[i].select();
        });
        break;
      }
    }
  // } else if (event.keyCode === 8) {
  //   // 删除箭头
  //   if (event.target.selectionStart === 0) {
  //     for (let i = currentIndex - 1; i >= 0; i--) {
  //       if (!inputs[i].readOnly) {
  //         nextTick(() => {
  //           inputs[i].focus();
  //           inputs[i].setSelectionRange(0, 0);
  //           inputs[i].select(); // 全选输入框内容
  //         });
  //         break;
  //       }
  //     }
  //   }
  } else if (event.keyCode === 37) {
    // 向左箭头
    if (event.target.selectionStart === 0) {
      for (let i = currentIndex - 1; i >= 0; i--) {
        if (!inputs[i].readOnly) {
          nextTick(() => {
            inputs[i].focus();
            inputs[i].select();
          });
          break;
        }
      }
    }
  } else if (event.keyCode === 39) {
    // 向右箭头
    if (event.target.selectionStart === event.target.value.length) {
      for (let i = currentIndex + 1; i < inputs.length; i++) {
        if (!inputs[i].readOnly) {
          nextTick(() => {
            inputs[i].focus();
            inputs[i].select();
          });
          break;
        }
      }
    }
  }
};

</script>

<style scoped>
	:deep(.plan-usage-low div) {
		color: red !important;
	}

	.JKWTree-container {
		display: flex;
	}

	.JKWTree-tree {
		width: 100%;
		background-color: #fff;
		/*background-color: rgba(241, 224, 224, 0.99);*/
		padding: 10px;
		margin-right: 20px;
	}

	.JKWTree-tree h3 {
		font-size: 15px;
		font-weight: 700;
		margin: 10px 0;
	}

	.JKWTree-content {
		flex: 1;
	}


	:deep(.el-table__body .warning-row) {
		background: #FFFF80 !important;
	}

	/* 选中某行时的背景色 */
	:deep(.el-table__body tr.current-row)>td {
		background: #ff80ff !important;
	}

	:deep(.el-table .bg-yellow) {
		background: yellow;
	}
</style>
<style scoped>
	:deep(.el-table td .cell) {
		line-height: 25px !important;
	}

	:deep(.el-tabs__header) {
		margin-bottom: 0;
	}
	

	.search {
		margin-left: 0px !important;
		margin-right: 10px !important;
	}

	.bt {
		margin-left: 2px !important;
		padding: 3px !important;
		font-size: 12px;

	}

	.el-tabs__header {
		margin: 0px !important;
	}

	.gva-table-box {
		padding: 0px !important;
	}

	.mab {
		margin-bottom: 5px;
	}
	/* tree组件背景高亮 */
	:deep(.el-tree-node:focus > .el-tree-node__content){
			background: #ff80ff !important;
		}
</style>