/** @format */

import React, { useEffect, useState } from 'react';

import BasicBarChart from '..';

function Demo() {
  const [data, setData] = useState([
    [10, 52, 200, 334, 390, 330, 220],
    [21, 520, 200, 334, 350, 300, 200],
    [210, 520, 200, 334, 350, 300, 200],
  ]);

  useEffect(() => {
    const timer = setTimeout(() => {
      setData([
        [101, 520, 200, 334, 390, 330, 220],
        [21, 520, 200, 334, 350, 300, 200],
        [210, 520, 200, 334, 350, 300, 200],
      ]);
    }, 1000);

    return () => {
      clearTimeout(timer);
    };
  }, []);

  return (
    <div
      style={{
        background: '#181B1D',
        width: '100%',
        height: '100%',
        padding: 50,
      }}
    >
      <BasicBarChart
        option={{ legend: { show: true } }}
        data={{
          xData: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
          yData: data,
        }}
      />
    </div>
  );
}

export default Demo;