import React, { PureComponent } from "react";
import { connect } from "dva";
import { routerRedux } from "dva/router";
import { Menu, Icon, Pagination, Button, Table, Checkbox, message } from "antd";
import styles from "./index.less";
import GoodsBuyIpt from "../GoodsBuyIpt/index.js";
import CustIcon, { STATUS as IconStatus } from "../CustIcon";
import Fly from "@/utils/fly";
import moment from "moment";
import erroImg  from "@/assets/imgError.png";
import { amountPrecision } from '@/utils/utils';
import { getCustomer } from '@/utils/request';
import { goodsVersion } from '@/utils/common';

class GoodsTableList extends PureComponent {
    constructor(props) {
        super(props);
        this.styleObj = { background: "#E14C46" };
        this.state = {
            selectedRowKeys: [],
            totalMoney: amountPrecision(0, 'amount'),
            checked: false,
            indeterminate: false
        };
    }
    componentWillReceiveProps(nextProps) {
      const { tabIndex } = this.props;
      if (tabIndex !== nextProps.tabIndex) {
        this.setState({
          selectedRowKeys: [],
          totalMoney: amountPrecision(0, 'amount'),
          checked: false,
          indeterminate: false
        });
      }
    }
    onSelectChange(selectedRowKeys) {
        const { goodsData, tabIndex } = this.props;
        let totalMoney = 0;
        let indeterminate = false;
        let checked = true;
        if (selectedRowKeys.length == 0) {
            totalMoney = 0;
            checked = false;
        } else {
            for (let i = 0; i < selectedRowKeys.length; i++) {
                if (tabIndex == 3) {
                    totalMoney += parseFloat(goodsData[selectedRowKeys[i]].basePrice) * (parseFloat(goodsData[selectedRowKeys[i]].orderNum) || 1);
                } else if (tabIndex == 4) {
                    totalMoney += parseFloat(goodsData[selectedRowKeys[i]].promPrice || goodsData[selectedRowKeys[i]].baseDiscountPrice) * (parseFloat(goodsData[selectedRowKeys[i]].orderNum) || 1);
                } else {
                  totalMoney += parseFloat(goodsData[selectedRowKeys[i]].baseDiscountPrice) * (parseFloat(goodsData[selectedRowKeys[i]].orderNum) || 1);
              }
            }
        }
        if (selectedRowKeys.length != 0 && selectedRowKeys.length < goodsData.length) {
            indeterminate = true;
            checked = false;
        }
        this.setState({
            selectedRowKeys,
            totalMoney: amountPrecision(totalMoney, 'amount'),
            checked: checked,
            indeterminate: indeterminate
        });
    }
    onSelectAll(selected, selectedRows, changeRows) {
        const { goodsData } = this.props;
    }
    // 全选
    start(e) {
        const { goodsData } = this.props;
        const selectedRowArr = [];
        for (let i = 0; i < goodsData.length; i++) {
            if (goodsData[i].stock > 0) {
                selectedRowArr.push(i);
            }
        }
        let checked = e.target.checked;
        if (this.state.indeterminate) {
            checked = true;
        }
        const selectedRowKeys = checked ? selectedRowArr : [];
        this.onSelectChange(selectedRowKeys);
        this.setState({
            selectedRowKeys: selectedRowKeys,
            checked: checked,
            indeterminate: false
        });
    }
    // 购物车飞入动画
    iconFly(element) {
        // 动画起始定位
        const sourcePostion = {
            left: element.offsetLeft, // 开始位置（必填）#fly元素会被设置成position: fixed
            top: element.offsetTop - window.scrollY - 30 // 开始位置（必填）
        };
        // 动画目标定位
        const targetPostion = {
            left: document.querySelector(".header-btn-add-shopcart").offsetLeft, // 结束位置（必填）
            top: document.querySelector(".header-btn-add-shopcart").offsetTop -
                window.scrollY // 结束位置（必填）
        };
        // fly options
        const options = {
            start: {
                width: element.offsetWidth, // 开始时高度
                height: element.offsetHeight, // 开始时高度
                ...sourcePostion
            },
            end: {
                width: element.offsetWidth, // 结束时高度
                height: element.offsetHeight, // 结束时高度
                ...targetPostion
            },
            autoPlay: false, // 是否直接运动,默认true
            speed: 2.0, // 越大越快，默认1.2
            vertex_Rtop: 100 // 运动轨迹最高点top值，默认20
            // onEnd: () => {} // 结束回调
        };
        const IconFly = new Fly(element, options);
        IconFly.play();
    }
    // 点击商品去详情
    goDetails(item) {
        const { dispatch, tabIndex } = this.props;
        const goodsId = tabIndex == 2 ? item.id : item.goodsId;
        dispatch(
            routerRedux.push({
                pathname: "/buyer/goods/GoodsDetail",
                query: {
                    code: item.code,
                    id: goodsId,
                    saleOrgId: item.saleOrgId ? item.saleOrgId : item.supplier
                }
            })
        );
        localStorage.setItem("goodsSku", item.code);
        localStorage.setItem("goodsDetailsId", goodsId);  // 商品Id
        localStorage.setItem("goodsDetailSsaleOrgId", item.saleOrgId ? item.saleOrgId : item.supplier);  // 供应商
    }
     // 购买数量改变
    orderNumChange(index, num) {
        const { goodsData, dispatch } = this.props;
        goodsData[index][`orderNum`] = num;
        const selectedRowKeys = this.state.selectedRowKeys;
        if (selectedRowKeys.indexOf(index) != -1) {
            this.onSelectChange(selectedRowKeys);
        }
        dispatch({
            type: "goodsPurchase/goodsData",
            goodsData: goodsData
        });
    }
    // 加入购物车
    addCart(item, ele) {
        const { dispatch, goodsData } = this.props;
        if (item == 'all') {
            const selectedRowKeys = this.state.selectedRowKeys;
            const addCartList = [];
            for (let i = 0; i < selectedRowKeys.length; i++) {
                const data = goodsData[selectedRowKeys[i]];
                dispatch({
                    type: "cartList/addCart",
                    payload: {
                        goodsId: data.id,
                        orderNum: data.orderNum || 1,
                        mainNum: parseFloat(data.orderNum || 1) * parseFloat(data.conversionRate || 1),
                        goodsId: data.id,
                        goodsDisplayName: data.displayName,
                        goodsName: data.name,
                        goodsCode: data.code,
                        goodsImg: data.mainPictureFileUrl,
                        orderNumUnitId: data.assistUnitId,
                        orderNumUnitCode: data.assistUnitCode,
                        orderNumUnitName: data.assistUnitName,
                        orderNumUnitScale: data.orderNumUnitScale || 0,
                        mainNumUnitId: data.basicUnitId,
                        mainNumUnitCode: data.basicUnitCode,
                        mainNumUnitName: data.basicUnitName,
                        mainNumUnitScale: data.basicUnitPrecision || 0,
                        weight: data.grossWeight, // 默认取毛重
                        ...data
                    }
                }).finally(() => {
                    message.warning('已加入购物车');
                });
            }
        } else {
            // this.iconFly(ele.target);
            dispatch({
                type: "cartList/addCart",
                payload: {
                    goodsId: item.id,
                    orderNum: item.orderNum || 1,
                    mainNum: parseFloat(item.orderNum || 1) * parseFloat(item.conversionRate || 1),
                    goodsId: item.id,
                    goodsDisplayName: item.displayName,
                    goodsName: item.name,
                    goodsCode: item.code,
                    goodsImg: item.mainPictureFileUrl,
                    orderNumUnitId: item.assistUnitId,
                    orderNumUnitCode: item.assistUnitCode,
                    orderNumUnitName: item.assistUnitName,
                    orderNumUnitScale: item.orderNumUnitScale || 0,
                    mainNumUnitId: item.basicUnitId,
                    mainNumUnitCode: item.basicUnitCode,
                    mainNumUnitName: item.basicUnitName,
                    mainNumUnitScale: item.basicUnitPrecision || 0,
                    weight: item.grossWeight, // 默认取毛重
                    ...item
                }
            }).finally(() => {
                message.warning('已加入购物车');
            });
        }
    }
    // 关注 && 取消关注
    follow(item, index) {
        const { goodsData, dispatch } = this.props;
        if (item == 'all') {
            const selectedRowKeys = this.state.selectedRowKeys;
            const addCartList = [];
            for (let i = 0; i < selectedRowKeys.length; i++) {
                addCartList.push({
                    customerId: getCustomer().id,
                    goodsId: goodsData[selectedRowKeys[i]].id,
                    goodsImg: goodsData[selectedRowKeys[i]].mainPictureFileUrl,
                    isPrimaryChannel: 1,
                    saleOrgId: goodsData[selectedRowKeys[i]].saleOrgId,
                    supplierId: null
                });
            }
            dispatch({
                type: 'public/getAddStores',
                payload: addCartList
            }).finally(() => {
                message.warning('已关注');
                dispatch({
                    type: "public/getStoreLength",
                    payload: { customer: getCustomer().id }
                });
            });
        } else {
            const postData = {
                customer: getCustomer().id,
                id: item.goodsIdgoodsId
            };
            dispatch({
                type: 'public/getDelStore',
                payload: postData
              }).finally(() => {
                const { goodsData } = this.props;
                goodsData.splice(index, 1);
                message.warning('已取消关注');
                dispatch({
                    type: "goodsPurchase/goodsData",
                    goodsData: goodsData
                });
                dispatch({
                    type: "public/getStoreLength",
                    payload: { customer: getCustomer().id }
                });
                // this.setState({ refresh: !this.state.refresh });
              });
        }
    }
    // 结算
    shoppingCatBtn(e) {
        e.preventDefault();
        const { goodsData, dispatch } = this.props;
        const selectedRowKeys = this.state.selectedRowKeys;
        if (selectedRowKeys.length == 0) {
            message.warning('至少选择一条商品');
            return;
        }
        const shoppingList = [];
        for (let i = 0; i < selectedRowKeys.length; i++) {
            shoppingList.push(goodsData[selectedRowKeys[i]]);
        }
    }
    // 分页切换
    paginationChange(page, pageSize) {
        const { paginationChange, tabIndex } = this.props;
        if (paginationChange) {
            paginationChange(page - 1, pageSize, tabIndex);
        }
    }
    // 点击行
    expandedRowRender(record, index, event) {
        return (
            <div className={styles.goodsListChildren}>
                <p className={styles.children1}>
                    <span className={styles.detailsTitle}><CustIcon type="icon-icon-attribute" style={{ color: "#999" }} /><em className={styles.ml10}>关键属性</em></span>
                    <span className={styles.detailsDesc}>贝岛沙发 | 三人座 | 全真皮 | 高端升级版</span>
                </p>
                <p className={styles.children2}>
                    <span className={styles.detailsTitle}><CustIcon type="icon-icon-sale1" style={{ color: "#999" }} /><em className={styles.ml10}>近30天日销量</em></span>
                    <span className={styles.detailsDesc}>
                        50
                        <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>台</em>
                    </span>
                </p>
                <p className={styles.children3}>
                    <span className={styles.detailsTitle}><CustIcon type="icon-icon-date" style={{ color: "#999" }} /><em className={styles.ml10}>合理库存天数</em></span>
                    <span className={styles.detailsDesc}>
                        15
                        <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>天</em>
                    </span>
                </p>
                <p className={styles.children4}>
                    <span className={styles.detailsTitle}><CustIcon type="icon-icon-quantity" style={{ color: "#999" }} /><em className={styles.ml10}>建议补货数量</em></span>
                    <span className={styles.detailsDesc}>
                        15*50-40-18
                        <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>台</em>
                    </span>
                </p>
            </div>
        );
    }
    // 图片加载失败
    imgErro(e) {
        e.target.src = erroImg;
    }
    render() {
        const { loading, selectedRowKeys } = this.state;
        const { goodsData, dispatch, paginationData, tabIndex, tabloading } = this.props;
        const rowSelection = {
            selectedRowKeys,
            onChange: this.onSelectChange.bind(this),
            onSelectAll: this.onSelectAll.bind(this),
            getCheckboxProps: record => ({
                // disabled: record.stock <= 0   // 筛选有问题
            }),
        };
        const totalElements = paginationData ? paginationData.total : 0;
        const pageSize = paginationData ? paginationData.pageSize : 10;
        const hasSelected = selectedRowKeys.length > 0;
        const paginationCfg = {
            hideDefaultSelections: true,
            showQuickJumper: true,
            showSizeChanger: true,
            size: 'small',
            total: totalElements,
            pageSize: pageSize,
            onChange: this.paginationChange.bind(this),
            onShowSizeChange: this.paginationChange.bind(this),
        };
        let columns;
        switch (tabIndex) {
          case '1':
                columns = [
                    {
                        title: '商品',
                        width: '330px',
                        dataIndex: 'baseDiscountPricebaseDiscountPrice',
                        key: 'baseDiscountPricebaseDiscountPrice',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsList} onClick={this.goDetails.bind(this, record)}>
                                    <p>
                                        <img src={record.mainPictureFileUrl ? record.mainPictureFileUrl : erroImg} alt="" onError={this.imgErro.bind(this)}  style={{ width: '60px', height: '60px', border: '1px solid #eee', marginTop: '-7px' }} />
                                    </p>
                                    <p className={styles.ml10}>
                                        <span className={styles.font14_333}>{record.displayName.length > 14 ? `${record.displayName.substr(0, 13)}...` : record.goodsDisplayName}</span>
                                        <span style={{ width: '170px', fontSize: '12px', color: '#999', marginTop: '5px' }} >{record.code}{goodsVersion(record.version)}</span>
                                    </p>
                                </div>
                            );
                        }
                    },
                    {
                        title: '价格',
                        width: '200px',
                        dataIndex: 'baseDiscountPrice',
                        key: 'baseDiscountPrice',
                        align: 'right',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font16_e14}>{amountPrecision(record.baseDiscountPrice)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>/{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '库存',
                        width: '130px',
                        dataIndex: 'stock',
                        key: 'stock',
                        align: 'right',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font14_333}>{record.stock}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                      title: '现存量',
                      width: '130px',
                      dataIndex: 'stock',
                      key: 'astock',
                      align: 'right',
                      className: 'pr30',
                      render: (text, record, index) => {
                          return (
                              <span>
                                  <em className={styles.font14_333}>{record.stock}</em>
                                  <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitName}</em>
                              </span>
                          );
                      }
                    },
                    {
                      title: '在途量',
                      width: '130px',
                      dataIndex: 'stock',
                      key: 'bstock',
                      align: 'right',
                      className: 'pr30',
                      render: (text, record, index) => {
                          return (
                              <span>
                                  <em className={styles.font14_333}>{record.stock}</em>
                                  <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitName}</em>
                              </span>
                          );
                      }
                    },
                    {
                        title: '建议补货量',
                        width: '190px',
                        dataIndex: 'num',
                        key: 'num',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsBuyIpt}>
                                    <GoodsBuyIpt
                                      num={record.orderNum}
                                      onChange={this.orderNumChange.bind(this, index)}
                                    />
                                    <span className={`${styles.ml10} ${styles.font12_999}`}>{record.assistUnitName}</span>
                                </div>
                            );
                        }
                    },
                    {
                        title: '主数量',
                        width: '130px',
                        dataIndex: 'basicUnitPrecision',
                        className: 'pl20',
                        key: 'basicUnitPrecision',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font14_333}>{parseFloat(record.orderNum) * parseFloat(record.conversionRate)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '购物车',
                        width: '115px',
                        className: 'shoppingCat',
                        key: 'shoppingCat',
                        render: (text, record, index) => (
                            <CustIcon
                              type="icon-icon-shoppingcart"
                              status={record.stock > 0 ? record.inCart : IconStatus.DISABLE}
                              onClick={record.stock > 0 ? this.addCart.bind(this, record) : ''}
                            />
                        ),
                    }
                ];
              break;
            case '2':
                columns = [
                    {
                        title: '商品',
                        width: '330px',
                        dataIndex: 'baseDiscountPricebaseDiscountPrice',
                        key: 'baseDiscountPricebaseDiscountPrice',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsList} onClick={this.goDetails.bind(this, record)}>
                                    <p>
                                        <img src={record.mainPictureFileUrl ? record.mainPictureFileUrl : erroImg} alt="" onError={this.imgErro.bind(this)}  style={{ width: '60px', height: '60px', border: '1px solid #eee', marginTop: '-7px' }} />
                                    </p>
                                    <p className={styles.ml10}>
                                        <span className={styles.font14_333}>{record.displayName}</span>
                                        <span style={{ fontSize: '12px', color: '#999', marginTop: '5px' ,display: 'flex'}} >
                                            <span style={{color: 'rgb(153, 153, 153)'}}>编码：{record.code}</span>
                                            <span style={{'margin-left':' 20px', color: 'rgb(153, 153, 153)'}}>型号：{record.model}</span>
                                        </span>
                                        <span style={{ fontSize: '12px', color: '#999', marginTop: '5px' ,display: 'flex'}} >
                                            <span style={{color: 'rgb(153, 153, 153)'}}>规格：{record.specification}</span>
                                        </span>
                                    </p>
                                </div>
                            );
                        }
                    },
                    {
                        title: '价格',
                        width: '200px',
                        dataIndex: 'baseDiscountPrice',
                        key: 'baseDiscountPrice',
                        align: 'center',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font16_e14}>{amountPrecision(record.baseDiscountPrice)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>/{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '最近订购',
                        width: '180px',
                        dataIndex: 'stock1',
                        key: 'stock1',
                        render: (text, record, index) => {
                            return (
                                <div>
                                    <p className={styles.order}>
                                        <em className={styles.font14_333}>{record.reqOrderNum}</em>
                                        <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>/{record.assistUnitName}</em>
                                    </p>
                                    <p className={styles.order}>
                                        <CustIcon
                                          type="icon-icon-track"
                                          style={{ fontSize: 14 }}
                                        />
                                        <em className={`${styles.font12_999} ${styles.ml5}`}>{record.reqCreationTime ? moment(record.reqCreationTime).format("YYYY-MM-DD HH:mm") : ""}</em>
                                    </p>
                                </div>
                            );
                        }
                    },
                    {
                        title: '建议补货量',
                        width: '190px',
                        dataIndex: 'num',
                        key: 'num',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsBuyIpt}>
                                    <GoodsBuyIpt
                                      num={record.orderNum}
                                      onChange={this.orderNumChange.bind(this, index)}
                                    />
                                    <span className={`${styles.ml10} ${styles.font12_999}`}>{record.assistUnitName}</span>
                                </div>
                            );
                        }
                    },
                    {
                        title: '购物车',
                        width: '115px',
                        className: 'shoppingCat',
                        key: 'shoppingCat',
                        render: (text, record, index) => (
                            <CustIcon
                              type="icon-icon-shoppingcart"
                              status={record.stock > 0 ? record.inCart : IconStatus.DISABLE}
                              onClick={record.stock > 0 ? this.addCart.bind(this, record) : ''}
                            />
                        ),
                    }
                ];
            break;
            case '3':
                columns = [
                    {
                        title: '商品',
                        width: '300px',
                        dataIndex: 'baseDiscountPricebaseDiscountPrice',
                        key: 'baseDiscountPricebaseDiscountPrice',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsList} onClick={this.goDetails.bind(this, record)}>
                                    <p>
                                        <img src={record.goodsImg ? record.goodsImg : erroImg} alt="" onError={this.imgErro.bind(this)}  style={{ width: '60px', height: '60px', border: '1px solid #eee', marginTop: '-7px' }} />
                                    </p>
                                    <p className={styles.ml10}>
                                        <span className={styles.font14_333}>{record.goodsDisplayName}</span>
                                        <span style={{ width: '170px', fontSize: '12px', color: '#999', marginTop: '5px' ,display: 'flex'}} >
                                            <span style={{color: 'rgb(153, 153, 153)'}}>编码：{record.goodsCode}</span>
                                            <span style={{'margin-left':' 20px', color: 'rgb(153, 153, 153)'}}>型号：{record.model}</span>
                                        </span>
                                        <span style={{ width: '170px', fontSize: '12px', color: '#999', marginTop: '5px' ,display: 'flex'}} >
                                            <span style={{color: 'rgb(153, 153, 153)'}}>规格：{record.specification}</span>
                                        </span>
                                    </p>
                                </div>
                            );
                        }
                    },
                    {
                        title: '价格',
                        width: '200px',
                        dataIndex: 'baseDiscountPrice',
                        key: 'baseDiscountPrice',
                        align: 'center',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font16_e14}>{amountPrecision(record.basePrice)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>/{record.mainNumUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '建议补货量',
                        width: '190px',
                        dataIndex: 'num',
                        key: 'num',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsBuyIpt}>
                                    <GoodsBuyIpt
                                      num={record.orderNum}
                                      onChange={this.orderNumChange.bind(this, index)}
                                    />
                                    <span className={`${styles.ml10} ${styles.font12_999}`}>{record.orderNumUnitName}</span>
                                </div>
                            );
                        }
                    },
                    {
                        title: '操作',
                        width: '120px',
                        render: (text, record, index) => {
                            return (
                                <div>
                                    <CustIcon
                                      type="icon-icon-shoppingcart"
                                      status={record.stock > 0 ? record.inCart : IconStatus.DISABLE}
                                      onClick={this.addCart.bind(this, record)}
                                      style={{ fontSize: 26 }}
                                    />
                                    <CustIcon
                                      type="icon-icon-heart-i"
                                      onClick={this.follow.bind(this, record, index)}
                                      style={{ fontSize: 26, marginLeft: 30, color: '#E14C46' }}
                                    />
                                </div>
                            );
                        }
                    }
                ];
            break;
            case '4':
                columns = [
                    {
                        title: '商品',
                        width: '300px',
                        dataIndex: 'promGoodsId',
                        key: 'promGoodsId',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsList} onClick={this.goDetails.bind(this, record)}>
                                    <p>
                                        <img src={record.goodsImg ? record.goodsImg : erroImg} alt="" onError={this.imgErro.bind(this)}  style={{ width: '60px', height: '60px', border: '1px solid #eee', marginTop: '-7px' }} />
                                    </p>
                                    <p className={styles.ml10}>
                                        <span className={styles.font14_333}>{record.displayName.length > 14 ? `${record.displayName.substr(0, 14)}...` : record.displayName}</span>
                                        <span style={{ width: '170px', fontSize: '12px', color: '#999', marginTop: '5px' }} >{record.code}{goodsVersion(record.version)}</span>
                                    </p>
                                </div>
                            );
                        }
                    },
                    {
                        title: '价格',
                        width: '200px',
                        dataIndex: 'baseDiscountPrice',
                        key: 'baseDiscountPrice-prom',
                        align: 'right',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font16_e14}>{amountPrecision(record.promPrice || record.baseDiscountPrice)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>/{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '库存',
                        width: '130px',
                        dataIndex: 'stock',
                        key: 'stock-prom',
                        align: 'right',
                        className: 'pr30',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font14_333}>{record.stock}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitName}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '订货量',
                        width: '190px',
                        dataIndex: 'orderNum',
                        key: 'orderNum-key',
                        render: (text, record, index) => {
                            return (
                                <div className={styles.goodsBuyIpt}>
                                    <GoodsBuyIpt
                                      num={record.orderNum}
                                      onChange={this.orderNumChange.bind(this, index)}
                                    />
                                    <span className={`${styles.ml10} ${styles.font12_999}`}>{record.assistUnitName}</span>
                                </div>
                            );
                        }
                    },
                    {
                        title: '主数量',
                        width: '210px',
                        dataIndex: 'basicUnitPrecision',
                        className: 'pr110 pr90',
                        key: 'mainNum-prom',
                        align: 'right',
                        render: (text, record, index) => {
                            return (
                                <span>
                                    <em className={styles.font14_333}>{parseFloat(record.orderNum) * parseFloat(record.conversionRate || 1)}</em>
                                    <em className={`${styles.font12_999} ${styles.ml5} ${styles.basicUnitName}`}>{record.basicUnitId}</em>
                                </span>
                            );
                        }
                    },
                    {
                        title: '操作',
                        width: '120px',
                        render: (text, record, index) => {
                            return (
                                <div>
                                    <CustIcon
                                      type="icon-icon-shoppingcart"
                                      status={record.stock > 0 ? record.inCart : IconStatus.DISABLE}
                                      onClick={this.addCart.bind(this, record)}
                                      style={{ fontSize: 26 }}
                                    />
                                    <CustIcon
                                      type="icon-icon-heart-i"
                                      onClick={this.follow.bind(this, record, index)}
                                      style={{ fontSize: 26, marginLeft: 30, color: '#E14C46' }}
                                    />
                                </div>
                            );
                        }
                    }
                ];
            break;
        }
        return (
            <div>
                <Table
                  className={styles.goodsTable}
                //   rowSelection={rowSelection}
                  columns={columns}
                  dataSource={goodsData}
                  pagination={paginationCfg}
                  loading={tabloading}
                  // expandedRowRender={this.expandedRowRender.bind(this)}        // 一期不做展示，二期在做
                  expandRowByClick={false}
                />
            </div>
        );
    }
}
export default GoodsTableList;
