admin-fiveFollowing/src/views/systemManage/rolePermission/roleInfoCom/index.vue

<template>
  <div class="siteManage-main roleInfoPage">

     <div style="text-align:right;margin-bottom:20px">
      <!-- <el-button type="success" >新增</el-button> -->
      <!-- <el-button type="primary" >保存</el-button>   -->
    </div>
    
    
    <el-table :data="menuData" border stripe >
      <!-- <el-table-column prop="authority2" label="序号" width="80" ></el-table-column> -->
      <el-table-column prop="label" label="菜单" width="180" ></el-table-column>
      <el-table-column prop="authority2" label="权限"  class="roleLeft">
        <template #default="scope">

          <el-radio v-model="scope.row.authority2" label="1">是</el-radio>
          <el-radio v-model="scope.row.authority2" label="0">否</el-radio>

          <!-- <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>
</template>

<script>
import { defineComponent,ref,onMounted } from 'vue'
// import * as api from '@/api/systemManage/rolePermission.js'
// import { ElMessage } from 'element-plus'

export default defineComponent({
  name: 'RoleInfoCom',
  props: {
    menuData: Object,
   
  },

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

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

     function menuList(){
       console.log('....')
       console.log(props)
       console.log(props.menuData.value)
     }

    
    onMounted(() => {
      menuList()

     
    })



     return{
       tableData
     }
    
    

  },
})
</script>

<style  lang="scss">

</style>