import React from 'react';
import { Col, Statistic, Row, Icon } from '@btri-ui/base';

export default () => {
  return (
    <>
      <Row automode>
        <Col span={12}>
          <Statistic
            suffix={
              <Icon
                iconName="TrendingDown"
                style={{ color: '#33D053', fontSize: '26px' }}
              />
            }
            title="数值带后缀"
            value={358126}
          ></Statistic>
        </Col>
        <Col span={12}>
          <Statistic
            title="数值带前缀"
            prefix={
              <Icon
                iconName="TrendingUp"
                style={{ color: '#F82828', fontSize: '26px' }}
              />
            }
            value={358126}
          ></Statistic>
        </Col>
        <Col span={12} style={{ marginTop: '16px' }}>
          <Statistic
            title="自定义数值"
            prefix={
              <Icon
                iconName="TrendingUp"
                style={{ color: '#F82828', fontSize: '26px' }}
              />
            }
            suffix={<span style={{ fontSize: '26px' }}>%</span>}
            valueStyle={{ color: '#F82828' }}
            value={358126}
          ></Statistic>
        </Col>
      </Row>
    </>
  );
};