|
|
|
@ -1,15 +1,20 @@ |
|
|
|
<template> |
|
|
|
<el-tabs v-model="activeName" class="my-tabs" type="card" @tab-click="handleClick"> |
|
|
|
<el-tabs |
|
|
|
v-model="activeName" |
|
|
|
class="my-tabs" |
|
|
|
type="card" |
|
|
|
@tab-click="handleClick" |
|
|
|
> |
|
|
|
<el-tab-pane label="菜单列表" name="roleList"> |
|
|
|
<div class="content"> |
|
|
|
<div class="table-describe clearfix"> |
|
|
|
<h4 style="color:#000;">菜单列表</h4> |
|
|
|
<h4 style="color: #000">菜单列表</h4> |
|
|
|
</div> |
|
|
|
<el-table |
|
|
|
ref="multipleTable" |
|
|
|
:data="tableData" |
|
|
|
border |
|
|
|
style="width: 100%;" |
|
|
|
style="width: 100%" |
|
|
|
row-key="sid" |
|
|
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" |
|
|
|
> |
|
|
|
@ -32,21 +37,25 @@ |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="pageUrl" label="链接地址" align="center" /> |
|
|
|
<el-table-column prop="isEnable" label="可见性" align="center"> |
|
|
|
<el-table-column prop="isShow" label="可见性" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-switch |
|
|
|
v-model="scope.row.isEnable" |
|
|
|
v-model="scope.row.isShow" |
|
|
|
active-color="#13ce66" |
|
|
|
inactive-color="#ff4949" |
|
|
|
active-value="1" |
|
|
|
inactive-value="0" |
|
|
|
@change="enabledChange(scope.row.isEnable,scope.row)" |
|
|
|
@change="enabledChange(scope.row.isShow, scope.row)" |
|
|
|
/> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</div> |
|
|
|
<el-dialog :title="dialogTitle + '功能信息'" :visible.sync="editDialog" width="40%"> |
|
|
|
<el-dialog |
|
|
|
:title="dialogTitle + '功能信息'" |
|
|
|
:visible.sync="editDialog" |
|
|
|
width="40%" |
|
|
|
> |
|
|
|
<table class="e-table" cellspacing="0"> |
|
|
|
<tr> |
|
|
|
<td>菜单名称</td> |
|
|
|
@ -100,13 +109,17 @@ |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</table> |
|
|
|
<div style="margin-top: 20px; text-align: center;"> |
|
|
|
<div style="margin-top: 20px; text-align: center"> |
|
|
|
<el-button type="primary" @click="save()">保 存</el-button> |
|
|
|
<el-button @click="editDialog = false">关 闭</el-button> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
<!-- 添加角色权限 --> |
|
|
|
<el-dialog :title="dialogTitle + '角色权限'" :visible.sync="editRolDialog" width="40%"> |
|
|
|
<el-dialog |
|
|
|
:title="dialogTitle + '角色权限'" |
|
|
|
:visible.sync="editRolDialog" |
|
|
|
width="40%" |
|
|
|
> |
|
|
|
<table class="e-table" cellspacing="0"> |
|
|
|
<tr> |
|
|
|
<td>菜单名称</td> |
|
|
|
@ -115,12 +128,9 @@ |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td>备注</td> |
|
|
|
<td>角色</td> |
|
|
|
<td> |
|
|
|
<el-select |
|
|
|
v-model="Rol.roleSid" |
|
|
|
style="width: 300px" |
|
|
|
> |
|
|
|
<el-select v-model="Rol.roleSid" style="width: 300px"> |
|
|
|
<el-option |
|
|
|
v-for="(item, i) in postSidData" |
|
|
|
:key="i" |
|
|
|
@ -131,7 +141,7 @@ |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</table> |
|
|
|
<div style="margin-top: 20px; text-align: center;"> |
|
|
|
<div style="margin-top: 20px; text-align: center"> |
|
|
|
<el-button type="primary" @click="saveRol()">保 存</el-button> |
|
|
|
<el-button @click="editRolDialog = false">关 闭</el-button> |
|
|
|
</div> |
|
|
|
@ -193,45 +203,55 @@ |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</table> |
|
|
|
<div style="margin-top: 20px; text-align: center;"> |
|
|
|
<div style="margin-top: 20px; text-align: center"> |
|
|
|
<el-button type="primary" @click="save()">保存</el-button> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import {pageList, menusTreelist, saveMenusInfo, putMenusInfo, delMenus, IsEnable} from '@/api/system/menu/index.js' |
|
|
|
import {sourceList,alterRole,addSysMenuRole} from '@/api/system/functional/functional.js' |
|
|
|
import { |
|
|
|
pageList, |
|
|
|
menusTreelist, |
|
|
|
saveMenusInfo, |
|
|
|
putMenusInfo, |
|
|
|
delMenus, |
|
|
|
IsEnable, |
|
|
|
} from "@/api/system/menu/index.js"; |
|
|
|
import { |
|
|
|
sourceList, |
|
|
|
alterRole, |
|
|
|
addSysMenuRole, |
|
|
|
} from "@/api/system/functional/functional.js"; |
|
|
|
|
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
activeName: 'roleList', |
|
|
|
activeName: "roleList", |
|
|
|
editDialog: false, |
|
|
|
editRolDialog: false, |
|
|
|
dialogTitle: '', |
|
|
|
checked: '', |
|
|
|
dialogTitle: "", |
|
|
|
checked: "", |
|
|
|
Rol: { |
|
|
|
menuSid:'' |
|
|
|
menuSid: "", |
|
|
|
}, |
|
|
|
form: { |
|
|
|
pname: '顶级菜单', |
|
|
|
iconUrl: '', |
|
|
|
pname: "顶级菜单", |
|
|
|
iconUrl: "", |
|
|
|
isShow: 1, |
|
|
|
menuName: '', |
|
|
|
menuUrl: '', |
|
|
|
pageAliasName: '', |
|
|
|
pageName: '', |
|
|
|
pageUrl: '', |
|
|
|
pageUrlRedirect: '', |
|
|
|
psid: '', |
|
|
|
remarks: '', |
|
|
|
menuName: "", |
|
|
|
menuUrl: "", |
|
|
|
pageAliasName: "", |
|
|
|
pageName: "", |
|
|
|
pageUrl: "", |
|
|
|
pageUrlRedirect: "", |
|
|
|
psid: "", |
|
|
|
remarks: "", |
|
|
|
sortNo: 0, |
|
|
|
sourceSid: '' |
|
|
|
sourceSid: "", |
|
|
|
}, |
|
|
|
rolsid:'', |
|
|
|
rolsid: "", |
|
|
|
postSidData: {}, |
|
|
|
formBackup: Object.assign({}, this.form), |
|
|
|
tableData: [], |
|
|
|
@ -240,61 +260,64 @@ |
|
|
|
size: 10, |
|
|
|
total: 0, |
|
|
|
params: { |
|
|
|
name: '', |
|
|
|
psid: '', |
|
|
|
sourceName: '', |
|
|
|
sourceSid: '' |
|
|
|
} |
|
|
|
name: "", |
|
|
|
psid: "", |
|
|
|
sourceName: "", |
|
|
|
sourceSid: "", |
|
|
|
}, |
|
|
|
rank: '1', |
|
|
|
}, |
|
|
|
rank: "1", |
|
|
|
sourceNameData: [], // 资源 |
|
|
|
isadd: false |
|
|
|
} |
|
|
|
isadd: false, |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.getPageList() |
|
|
|
this.getsourceList() |
|
|
|
this.getPageList(); |
|
|
|
this.getsourceList(); |
|
|
|
|
|
|
|
alterRole().then(res => { |
|
|
|
this.postSidData=res.data |
|
|
|
}) |
|
|
|
alterRole().then((res) => { |
|
|
|
this.postSidData = res.data; |
|
|
|
}); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
pagination(val) { // 分页 |
|
|
|
this.page.current = val.pageNum |
|
|
|
this.page.size = val.pageSize |
|
|
|
this.getPageList() |
|
|
|
pagination(val) { |
|
|
|
// 分页 |
|
|
|
this.page.current = val.pageNum; |
|
|
|
this.page.size = val.pageSize; |
|
|
|
this.getPageList(); |
|
|
|
}, |
|
|
|
resetSearch() { // 重置 |
|
|
|
this.page.params = this.pageBackup |
|
|
|
resetSearch() { |
|
|
|
// 重置 |
|
|
|
this.page.params = this.pageBackup; |
|
|
|
}, |
|
|
|
getPageList() { // 获取列表 |
|
|
|
getPageList() { |
|
|
|
// 获取列表 |
|
|
|
pageList(this.page).then((res) => { |
|
|
|
console.log('这里是条件查询', this.page) |
|
|
|
const treedata = res.data |
|
|
|
console.log('菜单列表', res) |
|
|
|
this.tableData = treedata |
|
|
|
this.page.total = res.data.total |
|
|
|
}) |
|
|
|
console.log("这里是条件查询", this.page); |
|
|
|
const treedata = res.data; |
|
|
|
console.log("菜单列表", res); |
|
|
|
this.tableData = treedata; |
|
|
|
this.page.total = res.data.total; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 资源名称 |
|
|
|
getsourceList() { |
|
|
|
const params = {} |
|
|
|
sourceList(params).then(res => { |
|
|
|
this.sourceNameData = res.data |
|
|
|
this.loading = false |
|
|
|
}) |
|
|
|
const params = {}; |
|
|
|
sourceList(params).then((res) => { |
|
|
|
this.sourceNameData = res.data; |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleClick(tab, event) { |
|
|
|
if (tab.name == 'addrole') { |
|
|
|
this.dialogTitle = '新增' |
|
|
|
this.roleForm = Object.assign({}, this.formBackup) |
|
|
|
if (tab.name == "addrole") { |
|
|
|
this.dialogTitle = "新增"; |
|
|
|
this.roleForm = Object.assign({}, this.formBackup); |
|
|
|
} else { |
|
|
|
this.getPageList() |
|
|
|
this.getPageList(); |
|
|
|
} |
|
|
|
}, |
|
|
|
add(row) { |
|
|
|
this.activeName = 'addrole' |
|
|
|
this.activeName = "addrole"; |
|
|
|
// if(row == 0){ |
|
|
|
// this.isadd = false |
|
|
|
// }else{ |
|
|
|
@ -302,106 +325,105 @@ |
|
|
|
// } |
|
|
|
// this.dialogTitle = '新增' |
|
|
|
// this.editDialog = true |
|
|
|
this.form = Object.assign({}, this.formBackup) |
|
|
|
this.form.isShow = 1 |
|
|
|
this.form = Object.assign({}, this.formBackup); |
|
|
|
this.form.isShow = 1; |
|
|
|
// this.form.psid = row.sid || 0 |
|
|
|
this.form.pname = row.name || '顶级菜单' |
|
|
|
this.form.sourceSid = row.sourceSid || '' |
|
|
|
if (row.isSource == '1') { |
|
|
|
this.form.psid = 0 |
|
|
|
this.form.pname = row.name || "顶级菜单"; |
|
|
|
this.form.sourceSid = row.sourceSid || ""; |
|
|
|
if (row.isSource == "1") { |
|
|
|
this.form.psid = 0; |
|
|
|
} else { |
|
|
|
this.form.psid = row.sid |
|
|
|
this.form.psid = row.sid; |
|
|
|
} |
|
|
|
}, |
|
|
|
editRow(row) { |
|
|
|
this.dialogTitle = '编辑' |
|
|
|
this.editDialog = true |
|
|
|
this.form = Object.assign({}, row) |
|
|
|
this.form.isShow = 1 |
|
|
|
this.form.pname = row.psid == '0' ? '顶级菜单' : row.pname |
|
|
|
this.dialogTitle = "编辑"; |
|
|
|
this.editDialog = true; |
|
|
|
this.form = Object.assign({}, row); |
|
|
|
this.form.isShow = 1; |
|
|
|
this.form.pname = row.psid == "0" ? "顶级菜单" : row.pname; |
|
|
|
}, |
|
|
|
editRol(row) { |
|
|
|
this.dialogTitle = '添加' |
|
|
|
this.editRolDialog = true |
|
|
|
this.form = Object.assign({}, row) |
|
|
|
this.Rol.menuSid=row.name |
|
|
|
this.rolsid=row.sid |
|
|
|
this.dialogTitle = "添加"; |
|
|
|
this.editRolDialog = true; |
|
|
|
this.form = Object.assign({}, row); |
|
|
|
this.Rol.menuSid = row.name; |
|
|
|
this.rolsid = row.sid; |
|
|
|
console.log(this.rolsid); |
|
|
|
}, |
|
|
|
save() { |
|
|
|
if (this.form.sid) { |
|
|
|
putMenusInfo(this.form).then(res => { |
|
|
|
this.editDialog = false |
|
|
|
this.getPageList(this.page) |
|
|
|
putMenusInfo(this.form).then((res) => { |
|
|
|
this.editDialog = false; |
|
|
|
this.getPageList(this.page); |
|
|
|
this.$message({ |
|
|
|
message: res.msg, |
|
|
|
type: 'success' |
|
|
|
}) |
|
|
|
}) |
|
|
|
type: "success", |
|
|
|
}); |
|
|
|
}); |
|
|
|
} else { |
|
|
|
saveMenusInfo(this.form).then(res => { |
|
|
|
this.activeName = 'roleList' |
|
|
|
this.getPageList() |
|
|
|
saveMenusInfo(this.form).then((res) => { |
|
|
|
this.activeName = "roleList"; |
|
|
|
this.getPageList(this.page); |
|
|
|
this.$message({ |
|
|
|
message: res.msg, |
|
|
|
type: 'success' |
|
|
|
}) |
|
|
|
}) |
|
|
|
type: "success", |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
saveRol() { |
|
|
|
this.editRolDialog = false |
|
|
|
this.Rol.menuSid=this.rolsid |
|
|
|
this.editRolDialog = false; |
|
|
|
this.Rol.menuSid = this.rolsid; |
|
|
|
console.log(this.Rol); |
|
|
|
addSysMenuRole(this.Rol).then((res) => { |
|
|
|
console.log(res); |
|
|
|
if (res.code == 200) { |
|
|
|
this.$message({ |
|
|
|
type: 'success', |
|
|
|
message: '添加成功!' |
|
|
|
}) |
|
|
|
type: "success", |
|
|
|
message: "添加成功!", |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
}); |
|
|
|
}, |
|
|
|
deleteRow(row) { |
|
|
|
this.$confirm('确定要删除该菜单吗, 是否继续?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning' |
|
|
|
this.$confirm("确定要删除该菜单吗, 是否继续?", "提示", { |
|
|
|
confirmButtonText: "确定", |
|
|
|
cancelButtonText: "取消", |
|
|
|
type: "warning", |
|
|
|
}).then(() => { |
|
|
|
delMenus({sid: row.sid}).then(res => { |
|
|
|
this.getPageList(this.page) |
|
|
|
delMenus({ sid: row.sid }).then((res) => { |
|
|
|
this.getPageList(this.page); |
|
|
|
this.$message({ |
|
|
|
type: 'success', |
|
|
|
message: '删除成功!' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}) |
|
|
|
type: "success", |
|
|
|
message: "删除成功!", |
|
|
|
}); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 是否可用 按钮 |
|
|
|
enabledChange(value, row) { |
|
|
|
IsEnable({ |
|
|
|
putMenusInfo({ |
|
|
|
sid: row.sid, |
|
|
|
isEnable:value |
|
|
|
}).then(res => { |
|
|
|
id:row.id, |
|
|
|
isShow: value, |
|
|
|
}).then((res) => { |
|
|
|
this.$message({ |
|
|
|
type: 'success', |
|
|
|
message: res.msg |
|
|
|
}) |
|
|
|
}) |
|
|
|
type: "success", |
|
|
|
message: res.msg, |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
//保存排序 |
|
|
|
getSorting(){ |
|
|
|
|
|
|
|
}, |
|
|
|
getSorting() {}, |
|
|
|
retname(sid) { |
|
|
|
obj = this.sourceNameData.find((item) => { |
|
|
|
return item.sid == sid// 筛选出匹配数据 |
|
|
|
}) |
|
|
|
return obj.name |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
return item.sid == sid; // 筛选出匹配数据 |
|
|
|
}); |
|
|
|
return obj.name; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style> |
|
|
|
@ -417,17 +439,17 @@ |
|
|
|
padding: 0 20px; |
|
|
|
border: 1px solid #ccc; |
|
|
|
border-radius: 2px; |
|
|
|
background-color: #FFFFFF; |
|
|
|
background-color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.el-icon-arrow-left:before, |
|
|
|
.el-icon-arrow-right:before { |
|
|
|
content: '下一页'; |
|
|
|
content: "下一页"; |
|
|
|
color: #727272; |
|
|
|
} |
|
|
|
|
|
|
|
.el-icon-arrow-left:before { |
|
|
|
content: '上一页'; |
|
|
|
content: "上一页"; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
|
fengdong777
2 years ago