用户权限表格页面

章志军

 <template>
      <el-table
        :data="rightList"
        style="width: 100%">
        <el-table-column type="index">
        </el-table-column>

        <el-table-column label="权限说明" prop="authName">
        </el-table-column>

        <el-table-column label="路径" prop="path">
        </el-table-column>

        <el-table-column label="等级" prop="level">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.level === '0'">1</el-tag>
          <el-tag type="info" v-if="scope.row.level === '1'">2</el-tag>
          <el-tag type="warning" v-if="scope.row.level === '2'">3</el-tag>
          </template>
        </el-table-column>

      </el-table>
      </template>

<script>
  export default {
    data(){
      return{
        rightList:[]
      }
    },
    created(){
      //获取所有的权限
      this.getRightsList()
    },
    methods:{
      //获取权限列表
     async getRightsList(){
      const{data:res} = await this.$http.get('rights/list')
      if( res.meta.status !== 200 ){
        return this.$message.error('获取权限信息失败')
      }

      this.rightList = res.data
       console.log(this.rightList)
      }
    }
    // methods end
  }
</script>