<template>
    
        <el-menu active-text-color="#409eff" text-color="#fff" default-active="1" class="el-menu-vertical-demo " style="height: 100%;" 
        @select="subEvent" >
                        <MyMenu :meun="toRaw(meun)" :thisIndex="'1'"></MyMenu>
                    </el-menu>
    
                    
</template>


<style scoped>


.el-menu {
    
    background: rgba(0, 0, 0, 0.0)
    /* background-image: url('../assets/imgs/home/zuoce_d.png');
    background-size: 100% 100%;
    background-repeat: no-repeat; */
}

</style>


<script lang="ts" setup>
import { reactive, ref } from 'vue'
import MyMenu from './MyMenu.vue';
import { toRaw } from 'vue'
const props = defineProps(['meun']);
const emit= defineEmits(['subEvent','openM','closeM']);


// console.log('data props:')
// if(props.meun!=null){
//     console.log(toRaw(props.meun));
// }

function subEvent(index, indexPath,item){
    // console.log(index)
    
    // var data = toRaw(props.meun)
    // var arr=index.split('-');
    
    emit('subEvent',index)
}

function closeM(){
    console.log('提交收起事件')
    emit('closeM');
}
function test()
{
    console.log('test');
}
    function openM(){
    console.log('提交展开事件')
    emit('openM');
}

function subMenuEvent(menu){
    emit('subEvent',menu.menuId);
}
const handleOpen = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
</script>