|
|
@@ -0,0 +1,338 @@
|
|
|
+<template>
|
|
|
+ <div class="m-container">
|
|
|
+ <h2>
|
|
|
+ <el-page-header
|
|
|
+ @back="onCancel"
|
|
|
+ :content="(pageType == 'create' ? '添加' : '修改') + '平台角色'"
|
|
|
+ ></el-page-header>
|
|
|
+ </h2>
|
|
|
+ <div class="m-core">
|
|
|
+ <el-form ref="form" label-width="120px" style="width: 500px">
|
|
|
+ <el-form-item label="角色名称" prop="roleName">
|
|
|
+ <el-input v-model.trim="result.roleName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="角色描述">
|
|
|
+ <el-input type="textarea" v-model.trim="result.roleDesc"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="搜索">
|
|
|
+ <el-input
|
|
|
+ style="width: 210px"
|
|
|
+ v-model.trim="seachRoleValue"
|
|
|
+ clearable
|
|
|
+ ></el-input>
|
|
|
+ <el-button style="margin-left: 10px" type="danger" @click="seachRoles"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ <!-- <el-button type="primary"
|
|
|
+ @click="onReSetRole">重置</el-button> -->
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="基本权限">
|
|
|
+ <el-checkbox
|
|
|
+ :indeterminate="isIndeterminate"
|
|
|
+ @change="onCheckAll"
|
|
|
+ v-model.trim="checkAll"
|
|
|
+ >全选</el-checkbox
|
|
|
+ >
|
|
|
+
|
|
|
+ <el-tree
|
|
|
+ :data="data"
|
|
|
+ show-checkbox
|
|
|
+ node-key="id"
|
|
|
+ @check="onTreeCheck"
|
|
|
+ :filter-node-method="filterNode"
|
|
|
+ ref="tree"
|
|
|
+ accordion
|
|
|
+ highlight-current
|
|
|
+ :default-checked-keys="result.menuIds"
|
|
|
+ :props="defaultProps"
|
|
|
+ >
|
|
|
+ <div slot-scope="{ node, data }">
|
|
|
+ {{ node.label }}
|
|
|
+ <el-tag v-if="data.type == 1" effect="dark">按钮</el-tag>
|
|
|
+ </div>
|
|
|
+ </el-tree>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button @click="onSubmit" type="primary"
|
|
|
+ >立即{{ pageType == "create" ? "创建" : "修改" }}</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onReSet('form')">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { getUserRole } from "@/api/systemManage";
|
|
|
+import store from "@/store";
|
|
|
+import { getSilder } from "@/api/silder";
|
|
|
+import {
|
|
|
+ roleGetMenus,
|
|
|
+ getRoleInfo,
|
|
|
+ roleUpdate,
|
|
|
+ roleAdd,
|
|
|
+} from "@/api/systemManage";
|
|
|
+export default {
|
|
|
+ name: "adminOperation",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ organId: null,
|
|
|
+ pageType: null,
|
|
|
+ id: null,
|
|
|
+ page: null,
|
|
|
+ isIndeterminate: false,
|
|
|
+ data: [],
|
|
|
+ defaultProps: {
|
|
|
+ children: "children",
|
|
|
+ label: "label",
|
|
|
+ },
|
|
|
+ result: {
|
|
|
+ roleName: null,
|
|
|
+ roleDesc: null,
|
|
|
+ },
|
|
|
+ checkAll: false,
|
|
|
+ splice: [],
|
|
|
+ silderList: [],
|
|
|
+ allChildIds: [], // 所有子编号
|
|
|
+ slideCount: 0,
|
|
|
+ seachRoleValue: "", //权限搜索字段
|
|
|
+ // filterIds: [4794, 4743, 3266, 3268, 3306, 3307, 3309, 3784, 4627],
|
|
|
+ filterIds: [],
|
|
|
+ isplatform: null,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.onReSet();
|
|
|
+ this.init();
|
|
|
+ console.log(this.$route)
|
|
|
+ },
|
|
|
+ activated() {
|
|
|
+ this.onReSet();
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this.pageType = this.$route.query.type;
|
|
|
+ this.id = this.$route.query.id;
|
|
|
+ this.page = this.$route.query.page;
|
|
|
+ this.isplatform = this.$route.query.isplatform;
|
|
|
+ if (this.pageType == "create") {
|
|
|
+ this.$refs.tree.setCheckedKeys([4229]);
|
|
|
+ }
|
|
|
+ this.lookSilder();
|
|
|
+ },
|
|
|
+ onSubmit() {
|
|
|
+ let tempIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ let halfIds = this.$refs.tree.getHalfCheckedKeys();
|
|
|
+ let allIds = [...tempIds, ...halfIds];
|
|
|
+ let tenantId = null;
|
|
|
+ if (this.isplatform) {
|
|
|
+ tenantId = -1;
|
|
|
+ }
|
|
|
+ if (this.pageType == "update") {
|
|
|
+ roleUpdate({
|
|
|
+ id: this.id,
|
|
|
+ organId: this.organId,
|
|
|
+ roleDesc: this.result.roleDesc,
|
|
|
+ roleName: this.result.roleName,
|
|
|
+ menuIds: allIds,
|
|
|
+ tenantId,
|
|
|
+ }).then((res) => {
|
|
|
+ this.messageTips("修改", res);
|
|
|
+ });
|
|
|
+ } else if (this.pageType == "create") {
|
|
|
+ roleAdd({
|
|
|
+ organId: this.organId,
|
|
|
+ roleDesc: this.result.roleDesc,
|
|
|
+ roleName: this.result.roleName,
|
|
|
+ menuIds: allIds,
|
|
|
+ tenantId,
|
|
|
+ }).then((res) => {
|
|
|
+ this.messageTips("添加", res);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ messageTips(title, res) {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success(`${title}成功`);
|
|
|
+ this.$store.dispatch("delVisitedViews", this.$route);
|
|
|
+ if (this.isplatform) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/platformAdminManger",
|
|
|
+ query: { page: this.page },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/adminManager",
|
|
|
+ query: { page: this.page },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async lookSilder() {
|
|
|
+ // 修复反写没有loading request返回的不是Promise await无效
|
|
|
+ getSilder({ hid: 0 }).then(async (silderList) => {
|
|
|
+ let tempData = [];
|
|
|
+ if (silderList.code == 200) {
|
|
|
+ this.silderList = silderList.data;
|
|
|
+ tempData = this.setTableData(silderList.data);
|
|
|
+ this.data = tempData;
|
|
|
+ // console.log(this.data)
|
|
|
+ }
|
|
|
+ // console.log(this.pageType)
|
|
|
+ if (this.pageType == "update") {
|
|
|
+ let roleInfo = await getRoleInfo({ id: this.id });
|
|
|
+ if (roleInfo.code == 200) {
|
|
|
+ let roleData = roleInfo.data;
|
|
|
+ // 是否是全部选中
|
|
|
+ this.checkAll = roleData.menuIds.length >= this.slideCount;
|
|
|
+ // 是否是半选
|
|
|
+ this.isIndeterminate =
|
|
|
+ roleData.menuIds.length > 0 &&
|
|
|
+ roleData.menuIds.length < this.slideCount;
|
|
|
+ let tSplice = this.getParent(roleData.menuIds, tempData);
|
|
|
+ roleData.menuIds = tSplice;
|
|
|
+ this.result = roleData;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.onReSet();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onTreeCheck() {
|
|
|
+ let checkTree = this.$refs.tree.getCheckedKeys();
|
|
|
+ this.checkAll = checkTree.length >= this.slideCount;
|
|
|
+ this.isIndeterminate =
|
|
|
+ checkTree.length > 0 && checkTree.length < this.slideCount;
|
|
|
+ },
|
|
|
+ onCheckAll(val) {
|
|
|
+ if (val) {
|
|
|
+ // 先去掉半选
|
|
|
+ this.isIndeterminate = false;
|
|
|
+ this.$refs.tree.setCheckedNodes(this.data);
|
|
|
+ } else {
|
|
|
+ this.$refs.tree.setCheckedNodes([]);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //递归获取到所有的为子级的ID
|
|
|
+ getParent(checkIds, data) {
|
|
|
+ let removeIds = JSON.parse(JSON.stringify(checkIds));
|
|
|
+ this.getAllChildIds(data);
|
|
|
+ let tempAllChildIds = this.allChildIds;
|
|
|
+ for (let i = checkIds.length; i > 0; i--) {
|
|
|
+ if (!tempAllChildIds.includes(checkIds[i - 1])) {
|
|
|
+ removeIds.splice(i - 1, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return removeIds;
|
|
|
+ },
|
|
|
+ getAllChildIds(data) {
|
|
|
+ // 获取所有最子集编号
|
|
|
+ let child = this.allChildIds;
|
|
|
+ let tempList = [];
|
|
|
+ data.forEach((item, index) => {
|
|
|
+ let temp = [];
|
|
|
+ if (item.children && item.children.length > 0) {
|
|
|
+ temp = this.getAllChildIds(item.children);
|
|
|
+ } else {
|
|
|
+ child.push(item.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ setTableData(result) {
|
|
|
+ let list = [];
|
|
|
+ list = result.map((res) => {
|
|
|
+ if (!this.filterIds.includes(res.id)) {
|
|
|
+ let tempList = {};
|
|
|
+ tempList = {
|
|
|
+ id: res.id,
|
|
|
+ name: res.name,
|
|
|
+ label: res.name,
|
|
|
+ type: res.type,
|
|
|
+ path: res.path,
|
|
|
+ permission: res.permission,
|
|
|
+ icon: res.icon,
|
|
|
+ parentId: res.parentId,
|
|
|
+ };
|
|
|
+ this.slideCount++;
|
|
|
+ if (res.sysMenus && res.sysMenus.length > 0) {
|
|
|
+ tempList.children = this.setTableData(res.sysMenus);
|
|
|
+ }
|
|
|
+ return tempList;
|
|
|
+ }
|
|
|
+ return null;
|
|
|
+ });
|
|
|
+ let tempList = [];
|
|
|
+ list.forEach((item) => {
|
|
|
+ if (item) {
|
|
|
+ tempList.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return tempList;
|
|
|
+ },
|
|
|
+ onReSet() {
|
|
|
+ this.$refs.tree.setCheckedNodes([]);
|
|
|
+ this.result = {
|
|
|
+ roleName: null,
|
|
|
+ roleDesc: null,
|
|
|
+ };
|
|
|
+ this.isIndeterminate = false;
|
|
|
+ this.checkAll = false;
|
|
|
+ },
|
|
|
+ onCancel() {
|
|
|
+ this.$store.dispatch("delVisitedViews", this.$route);
|
|
|
+ // this.$router.push({
|
|
|
+ // path: "/adminManager",
|
|
|
+ // query: {
|
|
|
+ // page: this.$route.query.page,
|
|
|
+ // },
|
|
|
+ // });
|
|
|
+ if (this.isplatform) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/platformAdminManger",
|
|
|
+ query: { page: this.page },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/adminManager",
|
|
|
+ query: { page: this.page },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ seachRoles() {
|
|
|
+ this.$refs.tree.filter(this.seachRoleValue);
|
|
|
+ },
|
|
|
+ filterNode(value, data) {
|
|
|
+ console.log(data);
|
|
|
+ if (!value) return true;
|
|
|
+ return data.label.indexOf(value) !== -1;
|
|
|
+ },
|
|
|
+ onReSetRole() {
|
|
|
+ this.seachRoleValue = "";
|
|
|
+ this.data = this.setTableData(this.silderList);
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.el-row {
|
|
|
+ margin-top: 40px;
|
|
|
+}
|
|
|
+.el-col {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin-right: 50%;
|
|
|
+}
|
|
|
+.el-input-group {
|
|
|
+ width: 200px;
|
|
|
+ margin: 0 20px;
|
|
|
+}
|
|
|
+/deep/.el-tree-node__content {
|
|
|
+ height: 40px !important;
|
|
|
+}
|
|
|
+</style>
|
