privilege_group_list.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <template>
  2. <section class="content">
  3. <div class="box box-info">
  4. <div class="box-body">
  5. <el-table :data="privilegeGroupList" border resizable stripe>
  6. <el-table-column prop="id" label="ID" width="100" />
  7. <el-table-column prop="code" label="权限组编码" />
  8. <el-table-column prop="name" label="权限组名称" />
  9. <el-table-column prop="appName" label="应用名称" />
  10. <el-table-column width="300" label="操作">
  11. <div slot-scope="scope">
  12. <el-button
  13. size="small"
  14. type="primary"
  15. @click="editPrivilege(scope.row)"
  16. >
  17. 权限配置
  18. </el-button>
  19. </div>
  20. </el-table-column>
  21. </el-table>
  22. </div>
  23. </div>
  24. </section>
  25. </template>
  26. <script>
  27. import { mapState } from "vuex";
  28. import { CORE_API } from "@/constants/constants.js";
  29. export default {
  30. name: "PrivilegeGroupList",
  31. data() {
  32. return {
  33. privilegeGroupList: []
  34. };
  35. },
  36. computed: {
  37. ...mapState({ user: state => state.user })
  38. },
  39. methods: {
  40. async queryAppList() {
  41. var url = CORE_API + "/rolePrivilege/getPrivilegeGroupList";
  42. const response = await this.$httpWithMsg.get(url);
  43. this.privilegeGroupList = response.data;
  44. },
  45. editPrivilege(row) {
  46. this.$router.push({ path: "/basic/privilege_tree/" + row.id });
  47. }
  48. },
  49. created() {
  50. this.queryAppList();
  51. }
  52. };
  53. </script>
  54. <style scoped></style>