fix: 🐛 修复菜单管理的添加权限按钮bug

web/src/views/system/menu/components/menuButton/crud.tsx

@@ -16,7 +16,6 @@ import { request } from '/@/utils/service';
 //此处为crudOptions配置
 export const createCrudOptions = function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
 	const pageRequest = async (query: UserPageQuery) => {
-		console.log(context!.selectOptions);
 		return await api.GetList({ menu: context!.selectOptions.value.id } as any);
 	};
 	const editRequest = async ({ form, row }: EditReq) => {
@@ -27,7 +26,7 @@ export const createCrudOptions = function ({ crudExpose, context }: CreateCrudOp
 		return await api.DelObj(row.id);
 	};
 	const addRequest = async ({ form }: AddReq) => {
-		return await api.AddObj(form);
+		return await api.AddObj({ ...form, ...{ menu: context!.selectOptions.value.id } });
 	};
 	return {
 		crudOptions: {

web/src/views/system/menu/index.vue

@@ -6,29 +6,23 @@
 					<p class="font-mono font-black text-center text-xl pb-5">
 						菜单列表
 						<el-tooltip effect="dark" :content="content" placement="right">
-							<el-icon> <QuestionFilled /> </el-icon>
+							<el-icon>
+								<QuestionFilled />
+							</el-icon>
 						</el-tooltip>
 					</p>
 					<el-input v-model="filterText" :placeholder="placeholder" />
-					<el-tree
+					<el-tree ref="treeRef" class="font-mono font-bold leading-6 text-7xl" :data="data" :props="treeProps"
-						ref="treeRef"
+						:filter-node-method="filterNode" :load="loadNode" :allow-drag="allowDrag" :allow-drop="allowDrop"
-						class="font-mono font-bold leading-6 text-7xl"
+						@node-drop="nodeDrop" lazy icon="ArrowRightBold" :indent="12" draggable
-						:data="data"
+						@node-click="handleNodeClick">
-						:props="treeProps"
-						:filter-node-method="filterNode"
-						:load="loadNode"
-						:allow-drag="allowDrag"
-						:allow-drop="allowDrop"
-						@node-drop="nodeDrop"
-						lazy
-						icon="ArrowRightBold"
-						:indent="12"
-						draggable
-						@node-click="handleNodeClick"
-					>
 						<template #default="{ node, data }">
-							<span v-if="data.status" class="text-center font-black text-xl"><SvgIcon :name="node.data.icon" />&nbsp;{{ node.label }}</span>
+							<span v-if="data.status" class="text-center font-black text-xl">
-							<span v-else class="text-center font-black text-xl text-red-700"><SvgIcon :name="node.data.icon" />&nbsp;{{ node.label }}</span>
+								<SvgIcon :name="node.data.icon" />&nbsp;{{ node.label }}
+							</span>
+							<span v-else class="text-center font-black text-xl text-red-700">
+								<SvgIcon :name="node.data.icon" />&nbsp;{{ node.label }}
+							</span>
 						</template>
 					</el-tree>
 				</el-card>
@@ -42,29 +36,26 @@
 						</el-divider>
 						<el-row>
 							<el-col :span="10">
-								<el-form-item label="菜单ID" prop="id"> <el-input v-model="form.id" disabled /> </el-form-item>
+								<el-form-item label="菜单ID" prop="id"> <el-input v-model="form.id" disabled />
+								</el-form-item>
 							</el-col>
 							<el-col :span="10">
 								<el-form-item label="父级ID" prop="parent"> <el-input v-model="form.parent" /> </el-form-item>
 							</el-col>
 							<el-col :span="10">
-								<el-form-item required label="菜单名称" prop="name"> <el-input v-model="form.name" /> </el-form-item>
+								<el-form-item required label="菜单名称" prop="name"> <el-input v-model="form.name" />
-							</el-col>
-							<el-col :span="10">
-								<el-form-item label="组件地址" prop="component">
-									<el-autocomplete
-										class="w-full"
-										v-model="form.component"
-										:fetch-suggestions="querySearch"
-										:trigger-on-focus="false"
-										clearable
-										debounce="100"
-										placeholder="输入组件地址"
-									/>
 								</el-form-item>
 							</el-col>
 							<el-col :span="10">
-								<el-form-item required label="Url" prop="web_path"> <el-input v-model="form.web_path" /> </el-form-item>
+								<el-form-item label="组件地址" prop="component">
+									<el-autocomplete class="w-full" v-model="form.component"
+										:fetch-suggestions="querySearch" :trigger-on-focus="false" clearable debounce="100"
+										placeholder="输入组件地址" />
+								</el-form-item>
+							</el-col>
+							<el-col :span="10">
+								<el-form-item required label="Url" prop="web_path"> <el-input v-model="form.web_path" />
+								</el-form-item>
 							</el-col>
 							<el-col :span="10">
 								<el-form-item label="排序" prop="sort">
@@ -79,6 +70,14 @@
 									</el-radio-group>
 								</el-form-item>
 							</el-col>
+							<el-col :span="10">
+								<el-form-item label="侧边可见">
+									<el-radio-group v-model="form.visible">
+										<el-radio :label="true">启用</el-radio>
+										<el-radio :label="false">禁用</el-radio>
+									</el-radio-group>
+								</el-form-item>
+							</el-col>
 
 							<el-col :span="20">
 								<el-form-item label="图标" prop="icon">
@@ -97,7 +96,9 @@
 						</el-row>
 						<el-row>
 							<el-col class="h-full">
-								<el-card :body-style="{ height: '100%' }" class="mt-10"><menuButton :select-menu="form" /></el-card>
+								<el-card :body-style="{ height: '100%' }" class="mt-10">
+									<menuButton :select-menu="form" />
+								</el-card>
 							</el-col>
 						</el-row>
 					</el-form>
@@ -240,6 +241,7 @@ let form: Form<any> = reactive({
 	is_catalog: false,
 	permission: '',
 	icon: '',
+	visible: ''
 });
 
 let menuPermissonList = ref([]);