|
@@ -0,0 +1,247 @@
|
|
|
+<!--
|
|
|
+机构授权
|
|
|
+@Author: linqian
|
|
|
+@Date: 2021-04-02 09:08
|
|
|
+-->
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <dg-row gutter="1rem">
|
|
|
+ <!-- 机构列表 -->
|
|
|
+ <dg-col :span="5">
|
|
|
+ <dg-card header="机构列表" class="box-card">
|
|
|
+ <org-tree
|
|
|
+ ref="tree"
|
|
|
+ class="u-pm__left"
|
|
|
+ treeHeight="calc(100vh - 18rem)"
|
|
|
+ :search="true"
|
|
|
+ paddingRight="15px"
|
|
|
+ @handleGetNode="handleGetNode"
|
|
|
+ @submitRootNode="handleGetNode"
|
|
|
+ ></org-tree>
|
|
|
+ </dg-card>
|
|
|
+ </dg-col>
|
|
|
+
|
|
|
+ <!-- 权限设置 -->
|
|
|
+ <scrollCard contentHeight="calc(100vh - 15.5rem)" :colSpan="19">
|
|
|
+ <template #cardHeader>
|
|
|
+ <div style="display:flex;justify-content: space-between;">
|
|
|
+ <span>角色列表</span>
|
|
|
+ <dg-button type="primary" :icon="'保存' | optIcon" @click="handleSave()">保存</dg-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 角色搜索栏 -->
|
|
|
+ <search-bar :conditionForm="roleConditionForm" @submitSearch="receiveRoleSearch"></search-bar>
|
|
|
+ <!-- 角色操作栏 -->
|
|
|
+ <!-- <operate-bar :pageOptList="pageOptList" @submitPageOpt="handleSave()"></operate-bar> -->
|
|
|
+
|
|
|
+ <!-- 角色列表 -->
|
|
|
+ <dg-table
|
|
|
+ ref="table"
|
|
|
+ :condition="condition"
|
|
|
+ :url="tableUrl"
|
|
|
+ :span-method="objectSpanMethod"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ row-key="roleId"
|
|
|
+ overflow="tooltip"
|
|
|
+ lazyLoad
|
|
|
+ @selection-change="handleSelectChange"
|
|
|
+ :before-quest="handleBeforeQuest"
|
|
|
+ >
|
|
|
+ <dg-table-column prop="appName" label="应用系统名称" min-width="120" align="center"> </dg-table-column>
|
|
|
+ <dg-table-column type="selection" reserve-selection width="50" align="center"></dg-table-column>
|
|
|
+ <dg-table-column prop="roleName" label="角色名称" align="center"> </dg-table-column>
|
|
|
+ </dg-table>
|
|
|
+ </scrollCard>
|
|
|
+ </dg-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import orgTree from '@/components/tree';
|
|
|
+import scrollCard from '@/components/scroll-card';
|
|
|
+import searchBar from '@/components/search-bar';
|
|
|
+
|
|
|
+import * as roleAuthApi from '@/api/role-auth-info';
|
|
|
+import * as Api from '@/api/org-role-manage';
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ orgTree,
|
|
|
+ scrollCard,
|
|
|
+ searchBar,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ roleConditionForm: [
|
|
|
+ {
|
|
|
+ label: '应用系统名称',
|
|
|
+ name: 'appId',
|
|
|
+ op: '=',
|
|
|
+ value: '',
|
|
|
+ component: 'SelectApp',
|
|
|
+ apiUrl: roleAuthApi.roleViewApplication,
|
|
|
+ valueName: 'id',
|
|
|
+ labelName: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '角色名称',
|
|
|
+ name: 'roleName',
|
|
|
+ op: 'like',
|
|
|
+ value: '',
|
|
|
+ component: 'ElInput',
|
|
|
+ attr: {
|
|
|
+ style: 'width: 150px'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ condition: {
|
|
|
+ orgId: {
|
|
|
+ value: '',
|
|
|
+ op: '='
|
|
|
+ },
|
|
|
+ appId: {
|
|
|
+ value: '',
|
|
|
+ op: '='
|
|
|
+ },
|
|
|
+ roleName: {
|
|
|
+ value: '',
|
|
|
+ op: 'like'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tableUrl: Api.tableUrl,
|
|
|
+ pageOptList: ['保存'],
|
|
|
+ checkRoleList: [],
|
|
|
+ deleteIds: [],
|
|
|
+ updateRoles: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ methods: {
|
|
|
+ /**
|
|
|
+ * @description: 获取机构节点
|
|
|
+ * @param {*} node
|
|
|
+ */
|
|
|
+ async handleGetNode(node) {
|
|
|
+ this.condition.orgId.value = node.id;
|
|
|
+ this.refreshTable();
|
|
|
+ },
|
|
|
+ async refreshTable() {
|
|
|
+ this.$refs.table.clearAll();
|
|
|
+ await this.getRoleChecked(this.condition.orgId.value);
|
|
|
+ this.selectRoleList = [];
|
|
|
+ this.$refs.table.searchForm();
|
|
|
+ },
|
|
|
+ receiveRoleSearch(condition) {
|
|
|
+ this.condition = { ...this.condition, ...condition };
|
|
|
+ this.refreshTable();
|
|
|
+ },
|
|
|
+ objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ if (columnIndex === 0) {
|
|
|
+ return {
|
|
|
+ rowspan: row.rowspan,
|
|
|
+ colspan: 1
|
|
|
+ };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSelectChange(selection) {
|
|
|
+ this.selectRoleList = this.$lodash.cloneDeep(selection);
|
|
|
+ },
|
|
|
+ // 角色列表数据渲染前整合数据
|
|
|
+ handleBeforeQuest(res) {
|
|
|
+ const { content, totalElements } = res.data;
|
|
|
+ this.currentPageContent = content;
|
|
|
+ if (this.checkRoleList.length > 0) {
|
|
|
+ let rowKeys = [];
|
|
|
+ for (let j = 0; j < content.length; j++) {
|
|
|
+ const cItem = content[j];
|
|
|
+ const index = this.checkRoleList.findIndex((item) => item == cItem.roleId);
|
|
|
+ if (index > -1) {
|
|
|
+ rowKeys.push(this.checkRoleList[index]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.table.setCheck(rowKeys);
|
|
|
+ }, 500);
|
|
|
+ }
|
|
|
+ this.roleTotal = totalElements;
|
|
|
+
|
|
|
+ const result = {
|
|
|
+ data: {
|
|
|
+ content: this.setRowSpans(content),
|
|
|
+ totalElements
|
|
|
+ }
|
|
|
+ };
|
|
|
+ return result;
|
|
|
+ },
|
|
|
+ setRowSpans(tableData) {
|
|
|
+ // 先给所有的数据都加一个v.rowspan = 1
|
|
|
+ tableData.forEach((v) => {
|
|
|
+ v.rowspan = 1;
|
|
|
+ });
|
|
|
+ // 双层循环
|
|
|
+ for (let i = 0; i < tableData.length; i++) {
|
|
|
+ // 内层循环,上面已经给所有的行都加了v.rowspan = 1
|
|
|
+ // 这里进行判断
|
|
|
+ // 如果当前行的id和下一行的id相等
|
|
|
+ // 就把当前v.rowspan + 1
|
|
|
+ // 下一行的v.rowspan - 1
|
|
|
+ for (let j = i + 1; j < tableData.length; j++) {
|
|
|
+ //此处可根据相同字段进行合并,此处是根据的id
|
|
|
+ if (tableData[i].appId === tableData[j].appId) {
|
|
|
+ tableData[i].rowspan++;
|
|
|
+ tableData[j].rowspan--;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 这里跳过已经重复的数据
|
|
|
+ i = i + tableData[i].rowspan - 1;
|
|
|
+ }
|
|
|
+ return tableData;
|
|
|
+ },
|
|
|
+ handleSave() {
|
|
|
+ if (this.roleTotal == 0) {
|
|
|
+ this.$message.warning('没有可保存的数据!');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ const delRoleIds = this.checkRoleList
|
|
|
+ .filter((item) => !this.selectRoleList.map((sItem) => sItem.roleId).includes(item))
|
|
|
+ .map((item) => item);
|
|
|
+
|
|
|
+ const addRoleIds = this.selectRoleList
|
|
|
+ .filter((item) => !this.checkRoleList.map((cItem) => cItem).includes(item.roleId))
|
|
|
+ .map((item) => item.roleId);
|
|
|
+
|
|
|
+ const saveParams = {
|
|
|
+ orgId: this.condition.orgId.value,
|
|
|
+ addRoleIds,
|
|
|
+ delRoleIds
|
|
|
+ };
|
|
|
+
|
|
|
+ // 保存
|
|
|
+ Api.save(saveParams)
|
|
|
+ .then(() => {
|
|
|
+ this.$message.success('保存成功');
|
|
|
+ this.refreshTable();
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.$message.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 获取角色列表选中记录
|
|
|
+ getRoleChecked(orgId) {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ Api.getChecked(orgId).then((res) => {
|
|
|
+ this.checkRoleList = res;
|
|
|
+ resolve(res);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ mounted() {}
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang='scss' scoped>
|
|
|
+</style>
|