<template>
  <div class="siteManage-main roleInfoPage">
    <el-table :data="tableData" border stripe >
      <el-table-column prop="xuhao" label="序号" width="80" ></el-table-column>
      <el-table-column prop="menu" label="菜单" width="180" ></el-table-column>
      <el-table-column prop="authority" label="权限"  class="roleLeft">
        <template #default="scope">
          <el-checkbox
            v-for="item in scope.row.authority"
            :label="item.name"
            :key="item.actionid"
            v-model="item.checked"
          ></el-checkbox>
        </template>
      </el-table-column>
    </el-table>
    <div style="text-align:right">
      <el-button type="success" class="mt-20" >保存</el-button>
    </div>
    
  </div>
</template>

<script>
import { defineComponent,ref } from 'vue'

export default defineComponent({
  name: 'RoleInfoCom',
  setup() {
     const  tableData=ref([
       {
          xuhao: '1',
          menu: '首页',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true}],
        },
        {
          xuhao: '2',
          menu: '站点概览',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true}],
        },
        {
          xuhao: '3',
          menu: '配电系统图',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true}],
        },
        {
          xuhao: '4',
          menu: '事件告警报表',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '告警处理', checked: true}],
        },
        {
          xuhao: '5',
          menu: '告警管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '告警处理', checked: true}],
        },
        {
          xuhao: '6',
          menu: '站点管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },
        {
          xuhao: '7',
          menu: '台区管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },

        {
          xuhao: '8',
          menu: '设备管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },
        {
          xuhao: '9',
          menu: '数据管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '导出', checked: true}],
        },
        {
          xuhao: '10',
          menu: '电能质量',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true}],
        },
        {
          xuhao: '11',
          menu: '月度报告',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '导出', checked: true},{name: '编辑模板', checked: true}],
        },
        {
          xuhao: '12',
          menu: '计划停电',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },
        {
          xuhao: '13',
          menu: '巡检管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '删除', checked: true},{name: '巡检处理', checked: true}],
        },
        {
          xuhao: '14',
          menu: '运维管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true}],
        },
        {
          xuhao: '15',
          menu: '工单管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true},{name: '工单处理', checked: true}],
        },
        {
          xuhao: '16',
          menu: '用户管理',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },
        {
          xuhao: '17',
          menu: '角色权限',
          authority: [{name: '全选', checked: true},{name: '查看', checked: true},{name: '编辑', checked: true},{name: '新增', checked: true},{name: '删除', checked: true}],
        },
     ]) 

     return{
       tableData
     }
    
    

  },
})
</script>

<style  lang="scss">

</style>
