<template>
  <div class='m-container'>
    <h2><div class="squrt"></div>系统角色权限管理</h2>
    <div class="m-core">
      <div @click="onAdminOperation('create')" class='newBand'>添加</div>
      <!-- 列表 -->
      <div class="tableWrap">
        <el-table :data='tableList' header-cell-class-name="headerName">
          <el-table-column align='center' prop="roleName"
                           label="角色类型">
          </el-table-column>
          <el-table-column align='center' prop="roleDesc"
                           label="角色描述">
          </el-table-column>
          <el-table-column align='center'
                           label="操作">
            <template slot-scope="scope">
              <el-button @click="onAdminOperation('update', scope.row)" type="text">修改</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination :total="pageInfo.total"
                    :page.sync="pageInfo.page"
                    :limit.sync="pageInfo.limit"
                    :page-sizes="pageInfo.page_size"
                    @pagination="getList" />
      </div>
    </div>
  </div>
</template>
<script>
import pagination from '@/components/Pagination/index'
import { roleQueryPage } from '@/api/systemManage'
import store from '@/store'
export default {
  components: { pagination },
  name: 'adminManager',
  data () {
    return {
      tableList: [],
      pageInfo: {
        // 分页规则
        limit: 10, // 限制显示条数
        page: 1, // 当前页
        total: 0, // 总条数
        page_size: [10, 20, 40, 50] // 选择限制显示条数
      },
      organId: store.getters.organ
    }
  },
  mounted() {
    // console.log(store.getters.permission)
    this.getList()
  },
  methods: {
    getList () { 
      roleQueryPage({ 
        organId: this.organId,
        rows: this.pageInfo.limit,
        page: this.pageInfo.page
      }).then(res => {
        if(res.code == 200 && res.data) {
          this.tableList = res.data.rows
          this.pageInfo.total = res.data.total

        }
      })
    },
    onAdminOperation(type, row) {
      let params = {
        path: '/specialSetup/adminoperation',
        query: {
          type: type
        }
      }
      if(row) {
        params.query.id = row.id
      }
      this.$router.push(params)
    }
  }
}
</script>
<style lang="scss">
.headerName {
  background-color: #EDEEF0 !important;
  color: #444444; 
}
</style>