import './index.scss';

import React from 'react';
import cs from 'classnames';
import { Layout , Icon } from 'antd';
import { NavLink } from 'react-router-dom';

const {Header} = Layout;

export function CommonHeader(props) {
    const {
        toggleMenu ,
        collapsed ,
        list ,
        componentMap ,
        selfCode ,
        currentIndex ,
        headerRightChildren = null ,
        otherLink = null
    } = props;
    return (
        <Header className="common-header">
            <Icon
                className="common-header-trigger"
                type={collapsed ? 'menu-unfold' : 'menu-fold'}
                onClick={toggleMenu}
            />
            <nav>
                {list.map((item , index) => {
                    const {name , children , code} = item;
                    let url = '';

                    if (Array.isArray(children)) {
                        if (children.length) {
                            if (children[ 0 ]) {
                                const subChildren = children[ 0 ].children;
                                if (Array.isArray(subChildren)) {
                                    url = subChildren[ 0 ].url;
                                } else if (children[ 0 ].url) {
                                    url = children[ 0 ].url;
                                } else if (item.url) {
                                    url = item.url;
                                }
                            }
                        } else if (componentMap[ code ]) {
                            url = item.url;
                        }
                    } else {
                        if (componentMap[ code ]) {
                            url = item.url;
                        }
                    }

                    if (selfCode && selfCode !== code) {
                        console.log(code,selfCode);
                        return <a href={url} key={url} className="common-header-link">{name}</a>;
                    }

                    return (
                        <NavLink
                            className={cs('common-header-link' , {
                                'common-header-link__active':
                                    currentIndex === index
                            })}
                            key={url}
                            to={url}
                        >
                            {name}
                        </NavLink>
                    );
                })}
                {otherLink}
            </nav>
            {headerRightChildren}
        </Header>
    );
}