|
@@ -5,64 +5,83 @@
|
|
<!-- <el-button @click='resetSilder'>修改按钮</el-button> -->
|
|
<!-- <el-button @click='resetSilder'>修改按钮</el-button> -->
|
|
<!-- <el-button @click="lookSilder" type='error'>查询</el-button> -->
|
|
<!-- <el-button @click="lookSilder" type='error'>查询</el-button> -->
|
|
|
|
|
|
- <el-table
|
|
|
|
- :data="tableList"
|
|
|
|
- style="width: 100%;margin-bottom: 20px;"
|
|
|
|
- row-key="id" border
|
|
|
|
- :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
|
|
|
- <el-table-column
|
|
|
|
- prop="name"
|
|
|
|
- label="菜单名称">
|
|
|
|
|
|
+ <el-table :data="tableList"
|
|
|
|
+ style="width: 100%;margin-bottom: 20px;"
|
|
|
|
+ row-key="id"
|
|
|
|
+ border
|
|
|
|
+ :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
|
|
|
+ <el-table-column prop="name"
|
|
|
|
+ label="菜单名称">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column
|
|
|
|
- prop="id"
|
|
|
|
- label="元素ID">
|
|
|
|
|
|
+ <el-table-column prop="id"
|
|
|
|
+ label="元素ID">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column
|
|
|
|
- prop="path"
|
|
|
|
- label="文件路径">
|
|
|
|
|
|
+ <el-table-column prop="path"
|
|
|
|
+ label="文件路径">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column
|
|
|
|
- prop="permission"
|
|
|
|
- label="权限标识">
|
|
|
|
|
|
+ <el-table-column prop="permission"
|
|
|
|
+ label="权限标识">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column
|
|
|
|
- prop="type"
|
|
|
|
- label="菜单类型">
|
|
|
|
|
|
+ <el-table-column prop="type"
|
|
|
|
+ label="菜单类型">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column
|
|
|
|
- label="操作">
|
|
|
|
|
|
+ <el-table-column label="操作">
|
|
<template slot-scope="scope">
|
|
<template slot-scope="scope">
|
|
- <el-button @click="onOperation('update', scope.rows)" type="text">修改</el-button>
|
|
|
|
- <el-button @click="onDelete(scope.rows)" type="text">删除</el-button>
|
|
|
|
|
|
+ <el-button @click="onOperation('update', scope.row)"
|
|
|
|
+ type="text">修改</el-button>
|
|
|
|
+ <el-button @click="onDelete(scope.row)"
|
|
|
|
+ type="text">删除</el-button>
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
|
|
|
|
- <el-dialog title="侧边栏管理" :visible.sync="branchStatus" @close="onFormClose('ruleForm')" width="500px">
|
|
|
|
- <el-form :model="form" ref="ruleForm">
|
|
|
|
- <el-form-item label="菜单名" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.name" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-dialog title="侧边栏管理"
|
|
|
|
+ :visible.sync="branchStatus"
|
|
|
|
+ @close="onFormClose('ruleForm')"
|
|
|
|
+ width="500px">
|
|
|
|
+ <el-form :model="form"
|
|
|
|
+ ref="ruleForm">
|
|
|
|
+ <el-form-item label="菜单名"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.name"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="文件路径" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.path" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-form-item label="文件路径"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.path"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="权限标识" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.permission" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-form-item label="权限标识"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.permission"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="组件名" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.component" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-form-item label="组件名"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.component"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="父元素ID" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.parentId" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-form-item label="父元素ID"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.parentId"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="排序" :label-width="formLabelWidth">
|
|
|
|
- <el-input v-model="form.sort" autocomplete="off"></el-input>
|
|
|
|
|
|
+ <el-form-item label="是否隐藏"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.hidden"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="排序"
|
|
|
|
+ :label-width="formLabelWidth">
|
|
|
|
+ <el-input v-model="form.sort"
|
|
|
|
+ autocomplete="off"></el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-form>
|
|
- <span slot="footer" class="dialog-footer">
|
|
|
|
|
|
+ <span slot="footer"
|
|
|
|
+ class="dialog-footer">
|
|
<el-button @click="branchStatus = false">取 消</el-button>
|
|
<el-button @click="branchStatus = false">取 消</el-button>
|
|
- <el-button @click="onBranchSubmit" type="primary">确 定</el-button>
|
|
|
|
|
|
+ <el-button @click="onBranchSubmit"
|
|
|
|
+ type="primary">确 定</el-button>
|
|
</span>
|
|
</span>
|
|
</el-dialog>
|
|
</el-dialog>
|
|
</div>
|
|
</div>
|
|
@@ -82,6 +101,7 @@ export default {
|
|
parentId: null,
|
|
parentId: null,
|
|
sort: 1,
|
|
sort: 1,
|
|
component: null,
|
|
component: null,
|
|
|
|
+ hidden: 0
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
@@ -102,9 +122,9 @@ export default {
|
|
]
|
|
]
|
|
}
|
|
}
|
|
*/
|
|
*/
|
|
- onOperation(type, row) {
|
|
|
|
|
|
+ onOperation (type, row) {
|
|
this.branchStatus = true
|
|
this.branchStatus = true
|
|
- if(type == 'update') {
|
|
|
|
|
|
+ if (type == 'update') {
|
|
console.log(row)
|
|
console.log(row)
|
|
this.form = {
|
|
this.form = {
|
|
name: row.name,
|
|
name: row.name,
|
|
@@ -116,7 +136,7 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- onBranchSubmit(type) {
|
|
|
|
|
|
+ onBranchSubmit (type) {
|
|
let form = this.form
|
|
let form = this.form
|
|
addSilder({
|
|
addSilder({
|
|
path: form.path,
|
|
path: form.path,
|
|
@@ -124,9 +144,10 @@ export default {
|
|
name: form.name,
|
|
name: form.name,
|
|
permission: form.permission,
|
|
permission: form.permission,
|
|
sort: form.sort,
|
|
sort: form.sort,
|
|
- parentId: form.parentId
|
|
|
|
|
|
+ parentId: form.parentId,
|
|
|
|
+ hidden: form.hidden
|
|
}).then(res => {
|
|
}).then(res => {
|
|
- if(res.code == 200) {
|
|
|
|
|
|
+ if (res.code == 200) {
|
|
this.$message({
|
|
this.$message({
|
|
message: '添加成功',
|
|
message: '添加成功',
|
|
type: 'success'
|
|
type: 'success'
|
|
@@ -136,16 +157,16 @@ export default {
|
|
}
|
|
}
|
|
})
|
|
})
|
|
},
|
|
},
|
|
-
|
|
|
|
|
|
+
|
|
lookSilder () {
|
|
lookSilder () {
|
|
getSilder().then(res => {
|
|
getSilder().then(res => {
|
|
- if(res.code != 200) return
|
|
|
|
|
|
+ if (res.code != 200) return
|
|
this.tableList = this.setTableData(res.data)
|
|
this.tableList = this.setTableData(res.data)
|
|
})
|
|
})
|
|
},
|
|
},
|
|
- setTableData(result) {
|
|
|
|
|
|
+ setTableData (result) {
|
|
let list = []
|
|
let list = []
|
|
- list = result.map( res => {
|
|
|
|
|
|
+ list = result.map(res => {
|
|
let tempList = {}
|
|
let tempList = {}
|
|
tempList = {
|
|
tempList = {
|
|
id: res.id,
|
|
id: res.id,
|
|
@@ -154,21 +175,22 @@ export default {
|
|
path: res.path,
|
|
path: res.path,
|
|
permission: res.permission,
|
|
permission: res.permission,
|
|
icon: res.icon,
|
|
icon: res.icon,
|
|
- parentId: res.parentId
|
|
|
|
|
|
+ parentId: res.parentId,
|
|
|
|
+ hidden: res.hidden
|
|
}
|
|
}
|
|
- if(res.sysMenus && res.sysMenus.length > 0) {
|
|
|
|
- tempList.children = this.setTableData(res.sysMenus)
|
|
|
|
|
|
+ if (res.sysMenus && res.sysMenus.length > 0) {
|
|
|
|
+ tempList.children = this.setTableData(res.sysMenus)
|
|
}
|
|
}
|
|
return tempList
|
|
return tempList
|
|
})
|
|
})
|
|
return list
|
|
return list
|
|
},
|
|
},
|
|
- onDelete(row) { // 删除左则菜单
|
|
|
|
|
|
+ onDelete (row) { // 删除左则菜单
|
|
deleteSilder(row.id).then(res => {
|
|
deleteSilder(row.id).then(res => {
|
|
console.log(res);
|
|
console.log(res);
|
|
})
|
|
})
|
|
},
|
|
},
|
|
- onFormClose(formName) { // 关闭弹窗重置验证
|
|
|
|
|
|
+ onFormClose (formName) { // 关闭弹窗重置验证
|
|
this.form = {
|
|
this.form = {
|
|
name: null,
|
|
name: null,
|
|
path: null,
|
|
path: null,
|