解决字典父类子类选择弹出错误问题

src/views/setting/dict/index.vue

@@ -32,7 +32,7 @@
 					</el-tree>
 				</el-main>
 				<el-footer style="height: 51px">
-					<el-button type="primary" size="mini" icon="el-icon-plus" style="width: 100%" @click="addDicTree"> 字典分类 </el-button>
+					<el-button type="primary" icon="el-icon-plus" style="width: 100%" @click="addHandler('tree')">字典分类</el-button>
 				</el-footer>
 			</el-container>
 		</el-aside>
@@ -47,7 +47,7 @@
 				:columns="activeColumns"
 			>
 				<template #toolLeft>
-					<el-button type="primary" @click="addHandler">
+					<el-button type="primary" @click="addHandler('table')">
 						<el-icon class="btn-icon">
 							<Plus />
 						</el-icon>
@@ -105,6 +105,7 @@ import { ElMessage, ElTree, ElMessageBox } from 'element-plus'
 import { useTablePage } from '@/hooks/useTablePage'
 import { Plus, Delete, Edit } from '@element-plus/icons-vue'
 import StatusIndicator from '@/components/StatusIndicator'
+import tree from '@/config/rule/tree.ts'
 
 const visible = ref(false) // 弹窗显示隐藏
 const isCreate = ref(true)
@@ -152,15 +153,20 @@ const formsDialog = [
 ]
 // 新增的表单 和 编辑的表单
 const formOptions = computed(() => {
-	// 去掉 formsDialog 下标为 0 的数据
-	const { 0: pid, ...rest } = formsDialog
-	let treeFormDialog = []
-	for (let i in rest) {
-		treeFormDialog.push(rest[i])
+	let tempForm = []
+	if (current_mode.value === 'tree') {
+		for (let i in formsDialog) {
+			let fd = formsDialog[i]
+			if (fd.prop == 'pid') {
+				continue
+			}
+			tempForm.push(fd)
+		}
+	} else {
+		tempForm = formsDialog
 	}
-
 	return {
-		forms: current_mode.value === 'tree' ? treeFormDialog : formsDialog,
+		forms: tempForm,
 		labelWidth: 120,
 		span: 30,
 		showResetBtn: true,
@@ -190,13 +196,11 @@ const getGroup = async () => {
 	})
 	showGroupLoading.value = false
 	data.unshift({ id: '', name: '所有' })
-	treeData.value = data // console.log('获取左侧菜单数据')
+	treeData.value = data
 }
 
 // 左侧菜单点击
 const leftTreeClick = data => {
-	console.log(data.id, 'data.id')
-	// 修改search参数 watch 变更 自动刷新 列表
 	searchData.value = { ...searchData.value, data: { pid: data.id ? data.id : null } }
 }
 
@@ -204,16 +208,13 @@ const leftTreeClick = data => {
 const queryList = async () => {
 	const { options, searchParams } = tableOpts
 	options.loading = true
-	console.log('搜索参数： ', JSON.stringify(tableOpts.searchParams))
 	try {
 		const { records: list, total } = await dict.dictPageApi(searchParams)
 		tableOpts.total = total
 		tableOpts.list = list
 	} catch {
-		console.log('获取列表数据失败')
 		tableOpts.total = 0
 		tableOpts.list = []
-		options.loading = false // 更改加载中的 loading值
 	} finally {
 		options.loading = false
 	}
@@ -319,7 +320,7 @@ const table_edit = async row => {
 
 // 弹窗事件
 const submitHandler = async params => {
-	formOptions.value.formConfig.submitLoading = true
+	let flg = true
 	try {
 		params.status = params.status ? 1 : 0
 		params.id = activeData.value.id ? activeData.value.id : null
@@ -330,17 +331,18 @@ const submitHandler = async params => {
 			getGroup()
 		}
 		updateParams()
-		formOptions.value.formConfig.submitLoading = false
 	} catch (e) {
+		flg = false
 		console.log(e)
-		formOptions.value.formConfig.submitLoading = false
 	}
+	formOptions.value.formConfig.submitLoading = flg
 }
 
-const addHandler = () => {
+const addHandler = mode => {
 	isCreate.value = true
 	activeData.value = {}
 	visible.value = true
+	current_mode.value = mode
 }
 
 // 删除左侧树
@@ -365,11 +367,6 @@ const dicEdit = data => {
 	table_edit(data)
 }
 
-const addDicTree = () => {
-	current_mode.value = 'tree'
-	addHandler()
-}
-
 nextTick(() => {
 	getGroup()
 	queryList()
@@ -387,18 +384,12 @@ watch(groupFilterText, val => {
 	min-height: 0;
 	//background: #fff;
 }
+
 .content-warp {
 	flex: 1;
 	//width: calc(100% - 250px);
 	width: calc(100% - 210px);
 }
-// 单独自己写的
-/*:deep(.box-card) {
-	height: 100%;
-	.el-card__body {
-		padding: 0;
-	}
-}*/
 
 // 角色的树结构样式
 :deep(.menu-tree) {
@@ -411,9 +402,11 @@ watch(groupFilterText, val => {
 			}
 		}
 	}
+
 	.el-tree-node__content {
 		height: 36px;
 	}
+
 	.el-tree-node__content .el-tree-node__label .icon {
 		margin-right: 5px;
 	}