import React, { PureComponent } from "react";
import { connect } from "dva";
import { Menu, Icon } from "antd";
import styles from "./index.less";
import imgsrc from "./goodsHot.png";
import GoodsBuyIpt from "../GoodsBuyIpt/index.js";

class GoodsHot extends PureComponent {
  constructor(props) {
    super(props);
  }
  // 购买数量改变
  buyNumChange(key, num) {
    const { data } = this.props;
    orderCartData[key][`buyNum`] = num;
    this.props.dispatch({
      type: "orderEdit/orderCartData",
      orderCartData: orderCartData
    });
  }
  // 增加购物车
  addCartHandle(data) {
    console.log(data);
    const { dispatch } = this.props;
    const postData = {
      buyNum: "",
      goodsSku: data.code
    };
    dispatch({
      type: "cartList/addCart",
      payload: postData
    });
  }
  render() {
    const { data, index } = this.props;
    if (!data) return null;
    return (
      <div className={styles.goodsHot}>
        <div className={styles.imgBox}>
          <img src={data.pictureUrl} alt={{}} className={styles.img} />
        </div>
        {/* 商品信息 */}
        <div className={styles.goodsHotInfobox}>
          <div className={styles.goodsHotTitlebox}>
            <span className={styles.goodsTitle}>{data.name}</span>
            <span className={styles.goodsHotPrice}>￥{data.salePrice}</span>
          </div>
          <div className={styles.goodsHotCodeBox}>
            <div className={styles.goodsHotCode}>
              <span className={styles.goodsCode}>商品编码: </span>
              <span className={styles.codeInfo}>{data.code}</span>
            </div>
            <div className={styles.goodsNumBox}>
              <span className={styles.goodsNum}>库存: </span>
              <span className={styles.num}>
                {data.stockNum} {data.unitName}
              </span>
            </div>
            <span className={styles.oldPrice}>￥{data.marketPrice}</span>
          </div>
        </div>
        {/* 商品信息 --结束 */}
        {/* 鼠标移入 */}
        <div className={styles.goodsHotHoverBox}>
          <div className={styles.goodsCollect}>
            <Icon type="heart-o" className={styles.collectIcon} />
            <span className={styles.collectTxt}>关注商品</span>
          </div>
          <div className={styles.iptBox}>
            <GoodsBuyIpt
              onChange={this.buyNumChange.bind(this, index)}
              num={0}
            />
          </div>
          <div
            className={styles.addCart}
            onClick={this.addCartHandle.bind(this, data)}
          >
            <Icon type="shopping-cart" className={styles.cartIcon} />
            <span className={styles.cartTxt}>加入购物车</span>
          </div>
        </div>
        {/* 鼠标移入--结束 */}
      </div>
    );
  }
}
export default GoodsHot;
