<template>
    <view class="flex flex-col bg-white rounded-lg shadow shadow-blue-100 p-30">
        <tree-view-node v-for="node in treeData" :node="node" @node-click="handleNodeClick">
            <template v-for="(_, name) in $slots" #[name]="scope">
                <slot :name="name" v-bind="scope"/>
            </template>
        </tree-view-node>
    </view>
</template>

<script>
import TreeViewNode from "@/pages/topic-center/index/components/tree-view-node.vue";
import {empty} from "@/uni_modules/uv-ui-tools/libs/function/test";

export default {
    name: 'tree-view',
    components: {TreeViewNode},
    emits: ['node-click', 'leaf-click'],
    props: {
        treeData: {
            type: Array,
            required: true,
        }
    },
    methods: {
        handleNodeClick({node, deep}) {
            this.$emit('node-click', {node, deep})
            if (empty(node.children)) this.$emit('leaf-click', {node, deep})
        }
    }
};
</script>

<style scoped>
</style>
