index.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. <template>
  2. <div class="">
  3. <toolbar @on-filter="filterData" @on-reset="filterData" />
  4. <div class="m-10 bg-w p-20 br-10">
  5. <!-- <el-button type="primary" icon="el-icon-plus" @click="handleAdd"
  6. >新增</el-button
  7. > -->
  8. <base-table
  9. :columns="columns"
  10. :items="items"
  11. :pagination="pagination"
  12. :page-change="pageChange"
  13. />
  14. </div>
  15. </div>
  16. </template>
  17. <script>
  18. import toolbar from './toolbar';
  19. import mxFilterList from '@/mixins/filterList';
  20. import { getPage, delItem } from '@/api/system';
  21. export default {
  22. name: 'RoleManagement',
  23. components: { toolbar },
  24. mixins: [
  25. mxFilterList({
  26. fetchList: getPage, // 在下方data再声明一个 fetchList: iGetList 同等效果
  27. internalFilterObj: {
  28. isDel: false
  29. }
  30. })
  31. ],
  32. data() {
  33. return {
  34. columns: [
  35. {
  36. key: 'id',
  37. name: '#',
  38. minWidth: this.$col.b
  39. },
  40. {
  41. key: 'name',
  42. name: '角色名',
  43. width: '240'
  44. },
  45. {
  46. key: 'code',
  47. name: '角色值',
  48. minWidth: '120'
  49. },
  50. {
  51. key: 'remarks',
  52. name: '备注',
  53. minWidth: '180'
  54. }
  55. // {
  56. // key: 'action',
  57. // name: '操作',
  58. // width: '180',
  59. // render: (h, { row }) => {
  60. // const action = [];
  61. // action.push(
  62. // h(
  63. // 'el-button',
  64. // {
  65. // props: {
  66. // type: 'text'
  67. // },
  68. // on: {
  69. // click: () =>
  70. // this.$SceneItemModal({
  71. // id: row.id
  72. // })
  73. // }
  74. // },
  75. // '编辑'
  76. // )
  77. // );
  78. // action.push(
  79. // h(
  80. // 'BaseBtn',
  81. // {
  82. // props: {
  83. // popip: true,
  84. // txt: '删除',
  85. // type: 'text'
  86. // },
  87. // class: 'ml-10',
  88. // on: {
  89. // ok: () => this.handleDelItem(row)
  90. // }
  91. // },
  92. // '删除'
  93. // )
  94. // );
  95. // return h('div', action);
  96. // }
  97. // }
  98. ]
  99. };
  100. },
  101. created() {
  102. this.$g_on('system_reload', this.reload);
  103. },
  104. beforeDestroy() {
  105. this.$g_off('system_reload', this.reload);
  106. },
  107. methods: {
  108. // handleAdd() {
  109. // this.$SceneItemModal();
  110. // },
  111. async handleDelItem(item) {
  112. const { success, msg } = await delItem({
  113. id: item.id
  114. });
  115. if (success) {
  116. this.$success('删除成功!');
  117. this.$g_emit('system_reload');
  118. }
  119. }
  120. }
  121. };
  122. </script>
  123. <style type="scss" scoped></style>