import {cloneElement}  from '@main/utils/vnode';
const PopMenu = {
    props: {
        mode: {
            type: String,
            default: 'inline'
        },
        eventKey: {
            type: String
        },
        level:{
            type:Number
        },
        children: {
            type: Array,
            default: () => {
                return [];
            }
        },
        parent:{
            type:Object,
            default:null
        }
    },
    methods: {
        renderMenuItem(c, i) {
            if (!c) {
                return null;
            }
            let {...props} =this.$props;
            let newProps={
                props:{
                    ...props,
                    level:props.level,
                    parent:props.parent
                }
            }
            let vnd = cloneElement(c,newProps)
            return vnd;
        },
        handleMouseEnter(evt){
            this.$emit('mouseenter')
        },
        handleMouseLeave(evt){
            this.$emit('mouseleave')
        }
    },
    render(h) {
        const { ...props } = this.$props;
        const { eventKey, children, mode } = props;
        const nodeProp = {
            class: {
                ['pl-menus']: 1,
                [`pl-menus-${mode}`]: 1
            },
            on:{
                mouseenter:this.handleMouseEnter,
                mouseleave:this.handleMouseLeave
            },
            attrs:{
                level:props.level
            }
        }
        return (
            <ul {...nodeProp}>
                {children.map((c, i) => this.renderMenuItem(c, i, eventKey || '0-menu-'))}
            </ul>
        )
    }
}
export default PopMenu;