index.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <template>
  2. <div class="m-container">
  3. <h2>
  4. <div class="squrt"></div>
  5. 平台角色管理
  6. </h2>
  7. <div class="m-core">
  8. <save-form
  9. :inline="true"
  10. ref="searchForm"
  11. :model="searchForm"
  12. @submit="search"
  13. @reset="onReSet"
  14. >
  15. <el-form-item prop="search">
  16. <el-input
  17. v-model.trim="searchForm.search"
  18. clearable
  19. @keyup.enter.native="search"
  20. placeholder="请输入角色类型"
  21. ></el-input>
  22. </el-form-item>
  23. <el-form-item>
  24. <el-button native-type="submit" type="primary">搜索</el-button>
  25. <el-button native-type="reset" type="danger">重置</el-button>
  26. </el-form-item>
  27. </save-form>
  28. <el-button
  29. style="margin-bottom: 20px"
  30. type="primary"
  31. v-permission="'role/add'"
  32. @click="onAdminOperation('create')"
  33. icon="el-icon-plus"
  34. >添加</el-button
  35. >
  36. <!-- 列表 -->
  37. <div class="tableWrap">
  38. <el-table :data="tableList" header-cell-class-name="headerName">
  39. <el-table-column align="center" prop="roleName" label="角色类型">
  40. </el-table-column>
  41. <el-table-column align="center" prop="roleDesc" label="角色描述">
  42. </el-table-column>
  43. <el-table-column align="center" label="操作">
  44. <template slot-scope="scope">
  45. <el-button
  46. @click="onAdminOperation('update', scope.row)"
  47. v-permission="'role/update'"
  48. type="text"
  49. >修改</el-button
  50. >
  51. </template>
  52. </el-table-column>
  53. </el-table>
  54. <pagination
  55. :total.sync="pageInfo.total"
  56. :page.sync="pageInfo.page"
  57. :limit.sync="pageInfo.limit"
  58. :page-sizes="pageInfo.page_size"
  59. @pagination="getList"
  60. />
  61. </div>
  62. </div>
  63. </div>
  64. </template>
  65. <script>
  66. import pagination from "@/components/Pagination/index";
  67. import { roleQueryPage } from "@/api/systemManage";
  68. export default {
  69. name: "adminManager",
  70. components: { pagination },
  71. data() {
  72. return {
  73. tableList: [],
  74. searchForm:{
  75. search:''
  76. },
  77. pageInfo: {
  78. // 分页规则
  79. limit: 10, // 限制显示条数
  80. page: 1, // 当前页
  81. total: 0, // 总条数
  82. page_size: [10, 20, 40, 50], // 选择限制显示条数
  83. },
  84. };
  85. },
  86. created() {
  87. this.init();
  88. },
  89. activated() {
  90. this.init();
  91. },
  92. mounted() {},
  93. methods: {
  94. search() {
  95. this.pageInfo.page = 1;
  96. this.getList();
  97. },
  98. onReSet() {
  99. this.$refs.searchForm.resetFields();
  100. this.search();
  101. },
  102. init() {
  103. this.$route.query.page
  104. ? (this.pageInfo.page = parseInt(this.$route.query.page))
  105. : (this.pageInfo.page = 1);
  106. this.getList();
  107. },
  108. getList() {
  109. roleQueryPage({
  110. rows: this.pageInfo.limit,
  111. page: this.pageInfo.page,
  112. ...this.searchForm,
  113. tenantId:-1
  114. }).then((res) => {
  115. if (res.code == 200 && res.data) {
  116. this.tableList = res.data.rows;
  117. this.pageInfo.total = res.data.total;
  118. }
  119. });
  120. },
  121. onAdminOperation(type, row) {
  122. let params = {
  123. path: "/platformManager/adminOperation",
  124. query: {
  125. type: type,
  126. page: this.pageInfo.page,
  127. isplatform:true
  128. },
  129. };
  130. let tagTitle = "新建";
  131. if (row) {
  132. params.query.id = row.id;
  133. tagTitle = "修改";
  134. }
  135. this.$router.push(params, (route) => {
  136. route.meta.title = tagTitle + "系统角色权限";
  137. });
  138. },
  139. },
  140. };
  141. </script>
  142. <style lang="scss">
  143. .headerName {
  144. background-color: #edeef0 !important;
  145. color: #444444;
  146. }
  147. </style>