<template>
  <div class="siteManage-main roleInfoPage">
    <div style="text-align: right; margin-bottom: 20px">
      <!-- <el-button type="success" >新增</el-button> -->
      <el-button type="primary" @click="saveMenu()">保存</el-button>
    </div>

    <el-table :data="menuData" border stripe>
      <el-table-column prop="label" label="菜单" width="180"></el-table-column>
      <el-table-column prop="authority2" label="权限" class="roleLeft">
        <template #default="scope">
          <el-radio-group
            v-model="scope.row.authority2"
            @change="listTabsChange(scope.row)"
          >
            <el-radio label="1" :disabled="radio1 == 1 ? true : false">
              是
            </el-radio>
            <el-radio label="0" :disabled="radio1 == 1 ? true : false">
              否
            </el-radio>
          </el-radio-group>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

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

export default defineComponent({
  name: 'RoleInfoCom',
  props: ['menuData', 'objItem', 'radio1'],

  // props: {
  //   menuData: Object,
  //   objItem: Object,
  //   radio1: String,
  // },

  setup(props) {
    const aa = ref([])
    const saveArr = ref([])

    function saveMenu() {
   



      api
        .saveMenu({
          menuIds: saveArr.value,
          roleId: props.radio1,
          roleKey: props.objItem.roleKey,
          roleName: props.objItem.roleName,
          roleSort: props.objItem.roleSort,
        })
        .then((requset) => {
          if (requset.status === 'SUCCESS') {
            ElMessage.success({
              message: '权限修改成功',
              type: 'success',
            })
          } else {
            ElMessage.error(requset.msg)
          }
        })
    }

    const listTabsChange = (value) => {
      saveArr.value = []
      value


      props.menuData.forEach(function (item) {
        if (item.authority2 == '1') {
          saveArr.value.push(item.id)
          var aa = item.children
          aa.forEach(function (item) {
              saveArr.value.push(item.id)
            
          })
        }
      })
   
    }

    onMounted(() => {})
    //监听变化
    watch(
      () => props.radio1,
      (newVal) => {
        newVal

     
        // if (newVal == '1') {
        //   alert(1)
        //   props.menuData.forEach(function (item) {
        //     item.authority2 = '1'
        //     saveArr.value.push(item.id)
        //   })
        //   console.log(' 22props.menuData')
        //   console.log(props.menuData)
        // }
      }
    )

    return {
      saveMenu,
      aa,
      listTabsChange,
      saveArr,
    }
  },
})
</script>

<style  lang="scss">
</style>
