import React from 'react';
import { Row, Col, Card, Space, Statistic } from 'antd';
import Container from '@/components/page/Container';
import Banner from './components/Banner';
import AreaChart from './components/AreaChart';
import BarChart from './components/BarChart';
import PictorialBar from './components/PictorialBar';
import RadarChart from './components/RadarChart';
import PieChart from './components/PieChart';

export default (props) => {

  const chartStyle = {
    height: '360px',
    width: '100%',
  }

  return (
    <Container>
      <Banner />

      <Row gutter={24} style={{ marginTop: '24px' }}>
        <Col span={16}>
          <AreaChart style={chartStyle}/>
        </Col>
        <Col span={8}>
          <RadarChart style={chartStyle}/>
        </Col>
      </Row>

      <Row gutter={24} style={{ marginTop: '24px' }}>
        <Col span={8}>
          <PieChart style={chartStyle}/>
        </Col>
        <Col span={16}>
          <BarChart style={chartStyle}/>
        </Col>
      </Row>
    </Container>
  )
}
