import React from 'react';
import { Label } from 'cbkfe-ui';
import './style';

export default function CommonHeader({
    title,
    num = '',
    hideLine,
    handleClick,
    classname,
    label = '',
    headerIcon = null,
    subTitle = '',
    subTitleStyle,
    subTitleClassName = '',
    rightText }) {
    const showAfter = num && num > 1;

    return <div className={`commonheader-container ${classname}`}>
        <div className="commonheader-container-leftSlide">
            {headerIcon}
            <h3
                className={`
                cmh-title  
                
                ${!hideLine && 'cmh-title--line'}
                ${showAfter && 'cmh-title--num'}
                `}
                data-after={showAfter ? `(${num})` : ''}
            ><span className={`commonheader-title ${label && 'cmh-title--label'}`}>{title}</span>
            { subTitle && <span style={subTitleStyle || {}} className={subTitleClassName || ''}>{subTitle}</span> }
            </h3>
            {label && <Label className="commonheader-title__label" value={label} type="primary" borderRadius={['bl', 'tr']} />}
        </div>

        {(num > 1 || rightText) && <span className="cmh-all" onClick={() => { handleClick(); }}>{rightText || '查看全部'}<i className="iconfont icon--arrow"></i></span>}
    </div>;
}