Commit a138fbc6 by dqjdda

菜单管理功能加强,新增功能项:是否隐藏菜单(某些页面不需要显示在左侧菜单栏中),是否缓存菜单(可解决切换Tab重新渲染的问题)

parent 14aa13e7
......@@ -5,4 +5,5 @@ const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
BASE_API: '"http://localhost:8000"'
// BASE_API: '"https://api.auauz.net"'
})
......@@ -37,7 +37,7 @@
"simple-drawing-board": "^2.0.1",
"vue": "2.5.17",
"vue-count-to": "1.0.13",
"vue-router": "3.0.2",
"vue-router": "^3.1.2",
"vuex": "3.0.1",
"wangeditor": ">=3.0.0",
"xlsx": "^0.11.16"
......
<template>
<section class="app-main">
<transition name="fade-transform" mode="out-in">
<keep-alive :include="cachedViews">
<keep-alive :exclude="cachedViews">
<router-view :key="key"/>
</keep-alive>
</transition>
......
<template>
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="isAdd ? '新增菜单' : '编辑菜单'" append-to-body width="600px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="菜单图标">
<el-popover
placement="bottom-start"
......@@ -20,11 +20,25 @@
<el-form-item label="菜单排序" prop="sort">
<el-input-number v-model.number="form.sort" :min="0" :max="999" controls-position="right" style="width: 460px;"/>
</el-form-item>
<el-form-item label="内部菜单" prop="iframe">
<el-radio v-model="form.iframe" label="false"></el-radio>
<el-radio v-model="form.iframe" label="true" ></el-radio>
<el-form-item label="内部菜单">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="链接地址">
<el-form-item label="是否缓存">
<el-radio-group v-model="form.cache" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="是否隐藏">
<el-radio-group v-model="form.hidden" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="链接地址" prop="path">
<el-input v-model="form.path" placeholder="菜单路径" style="width: 460px;"/>
</el-form-item>
<el-form-item v-if="form.iframe === 'false'" label="组件路径">
......@@ -57,7 +71,7 @@ export default {
data() {
return {
loading: false, dialog: false, menus: [],
form: { name: '', sort: 999, path: '', component: '', iframe: 'false', roles: [], pid: 0, icon: '' },
form: { name: '', sort: 999, path: '', component: '', iframe: 'false', roles: [], pid: 0, icon: '', cache: false, hidden: false },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
......@@ -65,8 +79,8 @@ export default {
sort: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
],
iframe: [
{ required: true, message: '请选择菜单类型', trigger: 'blur' }
path: [
{ required: true, message: '请输入地址', trigger: 'blur' }
]
}
}
......@@ -120,7 +134,7 @@ export default {
resetForm() {
this.dialog = false
this.$refs['form'].resetFields()
this.form = { name: '', sort: 999, path: '', component: '', iframe: 'false', roles: [], pid: 0, icon: '' }
this.form = { name: '', sort: 999, path: '', component: '', iframe: 'false', roles: [], pid: 0, icon: '', cache: false, hidden: false }
},
selected(name) {
this.form.icon = name
......
......@@ -46,6 +46,18 @@
<span v-else></span>
</template>
</el-table-column>
<el-table-column prop="iframe" width="100px" label="是否缓存">
<template slot-scope="scope">
<span v-if="scope.row.cache"></span>
<span v-else></span>
</template>
</el-table-column>
<el-table-column prop="iframe" width="100px" label="是否隐藏">
<template slot-scope="scope">
<span v-if="scope.row.hidden"></span>
<span v-else></span>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
......@@ -136,7 +148,7 @@ export default {
this.isAdd = false
const _this = this.$refs.form
_this.getMenus()
_this.form = { id: data.id, component: data.component, name: data.name, sort: data.sort, pid: data.pid, path: data.path, iframe: data.iframe.toString(), roles: [], icon: data.icon }
_this.form = { id: data.id, component: data.component, name: data.name, sort: data.sort, pid: data.pid, path: data.path, iframe: data.iframe.toString(), roles: [], icon: data.icon, cache: data.cache, hidden: data.hidden }
_this.dialog = true
},
changExpand() {
......
......@@ -156,8 +156,6 @@ export default {
parseTime,
checkPermission,
beforeInit() {
this.$refs.permission.setCheckedKeys([])
this.$refs.menu.setCheckedKeys([])
this.showButton = false
this.url = 'api/roles'
const sort = 'level,asc'
......@@ -165,6 +163,9 @@ export default {
const value = query.value
this.params = { page: this.page, size: this.size, sort: sort }
if (value) { this.params['blurry'] = value }
// 清空权限与菜单的选中
this.$refs.permission.setCheckedKeys([])
this.$refs.menu.setCheckedKeys([])
return true
},
subDelete(id) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment