Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue

@@ -19,7 +19,7 @@
    </el-aside>

    <el-main>
      <basic-container>
      <basic-container v-loading="treeLoading">
        <h3 style="margin: 0 0 10px 0">UI权限配置</h3>
        <div>
          <el-button icon="el-icon-place" plain size="small" type="primary" @click="saveHandler">授权</el-button>
@@ -49,7 +49,7 @@
          </el-select>
        </div>
        <div style="height:  calc(100vh - 232px);margin-top: 10px;">
          <avue-tree ref="uiTree" :data="uiTreeData" :option="uiTreeOption">
          <avue-tree ref="uiTree" :data="uiTreeData" :node-key="oid" :option="uiTreeOption">
            <span slot-scope="{ node, data }" class="el-tree-node__label">
               <span style="font-size: 15px">
                  <i :class="data.icon"></i>
@@ -65,7 +65,7 @@
</template>

<script>
import {gridRoles} from "@/api/system/role/api";
import {gridRoles, getRightListByRoleId} from "@/api/system/role/api";
import {getUIAuthor, authorizedUI} from "@/api/authority/ui/uiAuthor";
import {getBizTree, gridUIContextData} from "@/api/UI/uiDefine";

@@ -73,6 +73,7 @@
  name: "index",
  data() {
    return {
      treeLoading: false,
      type: '',//业务类型
      context: '',//UI上下文code
      treeOption: {
@@ -106,9 +107,11 @@
  },
  created() {
    this.getTreeList();
    this.getTypeList()
    // this.getUITree();
    this.getTypeList();
  },
  methods: {

    getTreeList() {
      const loading = this.$loading({});
      gridRoles().then(res => {
@@ -118,41 +121,69 @@
        loading.close();
      })
    },

    // 角色点击
    nodeClick(row) {
      this.nodeRow = row;
      this.getUITree();
      // const params = {
      //   roleId: row.oid
      // }
      // getRightListByRoleId(params).then(res => {
      //   const data = res.data.data.map(item => item.funcId);
      //   console.log(data);
      //   this.$refs.uiTree.setCheckedKeys(data);
      // })
    },

    getUITree() {
      if (this.nodeRow && this.nodeRow.oid) {
        const loading = this.$loading({});
        const params = {
          'conditionMap[roleId]': this.nodeRow.oid,
          'conditionMap[type]': this.type,
          'conditionMap[context]': this.context,
          'conditionMap[showCheckbox]': true
        }
        this.defaultExpandKeys = ['root'];
        getUIAuthor(params).then(res => {
          this.processChildren(res.data.data[0]); // 处理每个节点
          this.uiTreeOption.defaultExpandedKeys = this.defaultExpandKeys;
          this.uiTreeData = [{
            attributes: {},
            checked: false,
            expanded: true,
            data: "root",
            level: 0,
            icon: 'el-icon-s-home',
            oid: res.data.data[0].oid,
            label: res.data.data[0].text,
            children: res.data.data[0].children
          }];
          loading.close();
        }).catch(error => {
          loading.close();
        })
      this.treeLoading = true;
      const params = {
        'conditionMap[roleId]': this.nodeRow.oid,
        'conditionMap[type]': this.type,
        'conditionMap[context]': this.context,
        'conditionMap[showCheckbox]': true
      }
      this.defaultExpandKeys = ['root'];
      getUIAuthor(params).then(res => {
        this.processChildren(res.data.data[0]); // 处理每个节点
        this.uiTreeOption.defaultExpandedKeys = this.defaultExpandKeys;
        this.uiTreeData = [{
          attributes: {},
          checked: false,
          expanded: true,
          data: "root",
          level: 0,
          icon: 'el-icon-s-home',
          oid: res.data.data[0].oid,
          label: res.data.data[0].text,
          children: res.data.data[0].children
        }];
        const checkedData = this.findCheckedOids(res.data.data[0]);
        this.$refs.uiTree.setCheckedKeys(checkedData);

        this.treeLoading = false;
      }).catch(error => {
        this.treeLoading = false;
      })
    },

    // 查找已选择节点
    findCheckedOids(obj, result = []) {
      if (obj.checked === true) {
        result.push(obj.oid);
      }

      // 如果有 children，则继续遍历
      if (obj.children && obj.children.length > 0) {
        obj.children.forEach(child => {
          this.findCheckedOids(child, result);
        });
      }

      return result;
    },

    //处理树
    processChildren(item) {
      if (item.children && item.children.length > 0) {
@@ -182,11 +213,13 @@
        });
      }
    },

    getTypeList() {
      getBizTree().then(res => {
        this.typeData = res.data.obj.children;
      })
    },

    typeChange(data) {
      this.contextData = [];
      this.type = data;
@@ -202,10 +235,12 @@
      }
      this.getUITree();
    },

    contextChange(data) {
      this.context = data;
      this.getUITree();
    },

    saveHandler() {
      const selectTreeList = this.$refs.uiTree.getCheckedNodes();
      if (selectTreeList.length == 0) {
@@ -225,6 +260,7 @@
        }
      });
    },

    clearValue() {
      this.$refs.uiTree.setCheckedNodes([]);
    }