import { Col, Row, Statistic } from 'antd';
import { ArrowDownOutlined, ArrowUpOutlined } from '@ant-design/icons';
const MoreData = (props: any, title: string, company = '人') => {
  return (
    <div>
      <p>{title}</p>
      <h2>{props.time}</h2>
      <h1>
        {props.mon_user}
        {company}
      </h1>
      <div>
        <Row>
          <Col span={12}>
            <Statistic
              title="较环比"
              value={props.day_proportion}
              valueStyle={
                props.week_proportion > 0
                  ? { color: '#3f8600', fontSize: 15 }
                  : { color: '#cf1322', fontSize: 15 }
              }
              prefix={props.week_proportion > 0 ? <ArrowDownOutlined /> : <ArrowUpOutlined />}
              suffix="%"
            />
          </Col>
          <Col span={12}>
            <Statistic
              title="较同比"
              value={Math.abs(props.week_proportion)}
              valueStyle={
                props.week_proportion > 0
                  ? { color: '#3f8600', fontSize: 15 }
                  : { color: '#cf1322', fontSize: 15 }
              }
              prefix={props.week_proportion > 0 ? <ArrowDownOutlined /> : <ArrowUpOutlined />}
              suffix="%"
            />
          </Col>
        </Row>
      </div>
    </div>
  );
};
export default MoreData;
