import React from 'react';
import { Card } from 'antd';
import { CardProps } from 'antd/lib/card';

export type PageCoreProps = {
    extra?: React.ReactElement,
    title?: string,
    cardProps?: CardProps,
}

export const PageCore:React.FunctionComponent<PageCoreProps> = (props) => {
    const { cardProps = {}, extra, title, children } = props;
    const { tabList, onTabChange, activeTabKey, ...restCardProps } = cardProps;
    return (
        <div style={{
                backgroundColor: 'white',
                marginBottom: '16px',
            }}
            >
                {
                    tabList ? (
                        <Card
                            headStyle={{ fontSize: '16px' }}
                            bodyStyle={{ padding: '1px 24px 32px' }}
                            bordered={false}
                            { ...restCardProps }
                            tabList={tabList}
                            onTabChange={onTabChange}
                            activeTabKey={activeTabKey}
                            // tabBarExtraContent={tabBarExtraContent}
                            >
                            <Card
                                title={title}
                                extra={extra}       // Card 的 extra，每次都会创建一个新对象
                                bordered={false}
                                headStyle={{ 
                                    fontSize: '16px',
                                    borderBottom: 0,
                                    padding: 0,
                                }}
                                bodyStyle={{ padding: 0 }}
                                >
                                { children }
                            </Card>
                        </Card>
                    ) : (
                        <Card
                            headStyle={{ border: 'none' }}
                            bodyStyle={{ paddingTop: 0, paddingBottom: '32px' }}
                            bordered={false}
                            { ...restCardProps }
                            extra={extra}           // Card 的 extra，每次都会创建一个新对象
                            title={title}
                            >
                            { children }
                        </Card>
                    )
                }                        
        </div>
    );
}