1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- <template>
- <table-page-template>
- <el-form :inline='true' slot='form' size='mini'>
- <el-form-item label='角色'>
- <el-input class='input' v-model.trim='searchValue' placeholder='请输入角色名进行查询' clearable></el-input>
- </el-form-item>
- <el-form-item>
- <el-button v-if='hasPermission("system:role:query")' type='primary' @click='query'>查询</el-button>
- <el-button type='primary' @click='editRole(null)'>创建角色</el-button>
- </el-form-item>
- </el-form>
- <el-table :data='roles' border stripe style='width: 100%' slot='table'>
- <el-table-column prop='id' label='ID' width='50'></el-table-column>
- <el-table-column prop='name' label='Name'></el-table-column>
- <el-table-column prop='remark' label='备注'></el-table-column>
- <el-table-column label='操作' width='250'>
- <template slot-scope='scope'>
- <el-button @click='editRole(scope.row)' type='primary' size='small'>编辑</el-button>
- <el-button @click='editAuth(scope.row)' type='primary' size='small'>配置权限</el-button>
- <el-button @click='deleteRole(scope.row)' type='danger' size='small'>删除</el-button>
- </template>
- </el-table-column>
- </el-table>
- <div slot='dialog'>
- <role-edit ref='roleEdit' @saved='query'></role-edit>
- <role-manage ref='roleManage'></role-manage>
- </div>
- </table-page-template>
- </template>
- <script>
- import roleapi from '@/api/system/role'
- import RoleEdit from './RoleEdit'
- import RoleManage from './RoleManage'
- export default {
- name: 'RoleList',
- data() {
- return {
- roles: [],
- searchValue: ''
- }
- },
- methods: {
- query() {
- let criteria = {}
- if (this.searchValue) {
- criteria.name = { $like: this.searchValue + '%' }
- }
- roleapi.query({ criteria }).then(resp => {
- this.roles = resp.content
- })
- },
- editRole(row) {
- this.$refs['roleEdit'].show(row)
- },
- editAuth(row) {
- this.$refs['roleManage'].show(row.id)
- },
- deleteRole(row) {
- let opt = {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning'
- }
- this.$confirm('此操作将永久删除, 是否继续?', '提示', opt)
- .then(() => {
- let params = { id: row.id }
- roleapi.delete(params).then(res => {
- if (res.result == 'success') {
- this.$message.success('删除成功')
- this.query()
- } else {
- this.$message.error('删除失败: ' + res.message)
- }
- })
- })
- .catch(() => {})
- }
- },
- created() {
- this.query()
- },
- beforeRouteEnter(to, from, next) {
- next(vm => {
- vm.query()
- })
- },
- components: {
- RoleEdit,
- RoleManage
- }
- }
- </script>
|