<template>
  <el-dialog
    class="blindDialog"
    title="权限绑定"
    :visible.sync="isShow"
    :close-on-click-modal="false"
    width="470px"
    @close="handleclose"
  >
    <div class="treeBoxList" v-loading="treeLoading">
      <el-tree
        :data="treeData"
        show-checkbox
        node-key="id"
        ref="tree"
        highlight-current
        :props="defaultProps"
      >
      </el-tree>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="isShow = false">取 消</el-button>
      <el-button type="primary" @click="submitForm()">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import {
  getPermissionTree,
  getPermission,
  changePermission,
} from "@/utils/api/index";
export default {
  props: {},
  data() {
    return {
      roleUser: "",
      isShow: false,
      treeData: [],
      defaultProps: {
        //指定参数格式回显数据
        children: "list",
        label: "name",
      },
      treeLoading: false,
      rowData: "",
      premissData: [],
      selectTreeNode: [],
      rules: {
        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
      },
      xgrules: {
        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
      },
    };
  },
  methods: {
    //判断
    getdataform(val) {
      this.rowData = JSON.parse(JSON.stringify(val));
      this.getPermissionRole();
    },
    //获取权限树结构
    getPermissionList() {
      this.treeLoading = true;
      getPermissionTree()
        .then((res) => {
          if (res.code == 200) {
            console.log(res);
            this.treeLoading = false;
            this.treeData = res.data.list;
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((err) => {});
    },
    //获取查询杈限
    getPermissionRole() {
      console.log(this.rowData);
      getPermission({ id: this.rowData.id })
        .then((res) => {
          if (res.code == 200) {
            console.log(res);
            this.premissData = res.data;
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((err) => {});
    },

    // 保存确定操作
    submitForm() {
      console.log(this.$refs.tree.getCheckedNodes());
      this.selectTreeNode = this.$refs.tree.getCheckedNodes();
      console.log(this.selectTreeNode);
      // changePermission()
      //   .then((res) => {
      //     if (res.code == 200) {
      //       console.log(res);
      //     } else {
      //       this.$message.error(res.msg);
      //     }
      //   })
      //   .catch((err) => {});
    },
    display() {
      this.isShow = true;
      this.getPermissionList();
    },
    hide() {
      this.isShow = false;
    },
    handleclose() {
      this.treeData = [];
    },
  },
  mounted() {},
};
</script>
<style lang="less">
.blindDialog {
  .treeBoxList {
    height: 600px;
    overflow: auto;
    .el-dialog__body {
      overflow: auto;
    }
  }
}
</style>
