<template>
    <div class="hc-project-collect-middle hc-h-full">
        <div class="menu hc-h-full inline-block w-[180px]">
            <hc-card>
                <HcMenuBar :cur="menuKey" :datas="menuData" @change="menuChange" />
            </hc-card>
        </div>
        <div class="content hc-h-full inline-block">
            <hc-card>
                项目资料收集
            </hc-card>
        </div>
    </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import { getStore } from 'hc-vue3-ui'
import HcMenuBar from '~src/layout/modules/MenuBar.vue'
import { getArrValue, isNullES } from 'js-fast-way'

//左侧菜单
const menuKey = ref('')
const menuData = ref([])
const menuChange = ({ code }) => {
    menuKey.value = code
}

//渲染完成
onMounted(() => {
    getMenuDataKey()
})

//获取菜单数据
const getMenuDataKey = async () => {
    const menu = getArrValue(getStore('projectMenu'))
    menuData.value = menu
    menuKey.value = await getMenuDefaultKey(menu)
}

//获取菜单默认key
const getMenuDefaultKey = async (data) => {
    const children = data[0].children
    if (!isNullES(children) && children.length > 0) {
        return await getMenuDefaultKey(children)
    } else {
        return data[0].code
    }
}
</script>

<style lang="scss">
@import '~src/styles/project/middle';
</style>
