import React from "react";
import { Spin } from "antd";
import { connect } from "dva";
import PanelNav from "./PanelNav";
import BarChart from "./BarChart";
import styles from "../styles/common.less";

const AddProductTrend = ({ data, loading, dispatch }) => {
  const parseData = (barData) => {
    const xAxisdata = [];
    const seriesData = [];

    barData.forEach((item) => {
      xAxisdata.push(item.month);
      seriesData.push(item.newGoodsNum);
    });

    return {
      xAxisdata,
      seriesData,
    };
  };
  return (
    <Spin spinning={loading}>
      <div className={styles.common}>
        <div className={styles.common_header}>
          <PanelNav title="新增商品趋势" />
        </div>
        <div className={styles.common_content}>
          <BarChart {...parseData(data)} />
        </div>
      </div>
    </Spin>
  );
};

export default connect(({ bigscreen }) => ({
  data: bigscreen.productAddTrendData.data,
  loading: bigscreen.productAddTrendData.loading,
}))(AddProductTrend);
