blog/blog-boot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善菜单管理页面，修正“菜单图标”画面显示问题

Browse Source
This commit is contained in:
dataprince 2023-11-17 09:27:14 +08:00
parent ec3eae7bae
commit cad6506ac8
1 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ruoyi-ui/src/views/system/menu/index.vue
View File

@ -130,7 +130,7 @@
@show="showSelectIcon"
>
<template #reference>
<el-input v-model="form.icon" placeholder="点击选择图标" @click="showSelectIcon" readonly>
<el-input v-model="form.icon" v-click-outside="hideSelectIcon" placeholder="点击选择图标" @blur="showSelectIcon" readonly>
<template #prefix>
<svg-icon
v-if="form.icon"
@ -202,7 +202,7 @@
<el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
<template #label>
<span>
<el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
<el-tooltip content="控制器中定义的权限字符，如：@SaCheckPermission('system:user:query')" placement="top">
<i class="el-icon-question"></i>
</el-tooltip>
权限字符
@ -258,7 +258,7 @@
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-col :span="12" v-if="form.menuType != 'F'">
<el-form-item>
<template #label>
<span>
@ -291,8 +291,10 @@
<script setup name="Menu">
import { addMenu, delMenu, getMenu, listMenu, updateMenu } from "@/api/system/menu";
import SvgIcon from "@/components/SvgIcon";
import IconSelect from "@/components/IconSelect";
import SvgIcon from "@/components/SvgIcon/index.vue";
import IconSelect from "@/components/IconSelect/index.vue";
import { ClickOutside as vClickOutside } from 'element-plus';
import { ref, reactive, toRefs, nextTick } from 'vue';
const { proxy } = getCurrentInstance();
const { sys_show_hide, sys_normal_disable } = proxy.useDict("sys_show_hide", "sys_normal_disable");
@ -366,6 +368,14 @@ function showSelectIcon() {
iconSelectRef.value.reset();
showChooseIcon.value = true;
}
/** 图标外层点击隐藏下拉列表 */
function hideSelectIcon(event) {
let elem = event.relatedTarget || event.srcElement || event.target || event.currentTarget;
let className = elem.className;
if (className !== 'el-input__inner') {
showChooseIcon.value = false;
}
}
/** 选择图标 */
function selected(name) {
form.value.icon = name;