import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import React, { Fragment } from 'react';
import { Button, Checkbox, Icon } from '@whalecloud/fdx';
import EcomIcon from '../ecom-icon';
import './index.less';
var Seven = EcomIcon.Seven,
    QualityProduct = EcomIcon.QualityProduct;

var CLICK_TYPE;
(function (CLICK_TYPE) {
    CLICK_TYPE["CHECKBOX"] = "CHECKBOX";
    CLICK_TYPE["ORDERID"] = "ORDERID";
    CLICK_TYPE["STORE"] = "STORE";
    CLICK_TYPE["IMG"] = "IMG";
    CLICK_TYPE["TITLE"] = "TITLE";
    CLICK_TYPE["DETAIL"] = "DETAIL";
    CLICK_TYPE["UNPAID"] = "UNPAID";
    CLICK_TYPE["CONFIRM"] = "CONFIRM";
    CLICK_TYPE["RATING"] = "RATING";
    CLICK_TYPE["RETURN"] = "RETURN";
    CLICK_TYPE["AGAIN"] = "AGAIN";
    CLICK_TYPE["CANCEL"] = "CANCEL";
})(CLICK_TYPE || (CLICK_TYPE = {}));
var STATE_TO_NAME;
(function (STATE_TO_NAME) {
    STATE_TO_NAME["A"] = "Unpaid";
    STATE_TO_NAME["B"] = "To Ship";
    STATE_TO_NAME["C"] = "To Receive";
    STATE_TO_NAME["D"] = "Completed";
    STATE_TO_NAME["E"] = "Cancelled";
})(STATE_TO_NAME || (STATE_TO_NAME = {}));
var NAME_TO_STATE;
(function (NAME_TO_STATE) {
    NAME_TO_STATE["UNPAID"] = "A";
    NAME_TO_STATE["TO_SHIP"] = "B";
    NAME_TO_STATE["TO_RECEIVED"] = "C";
    NAME_TO_STATE["COMPLETED"] = "D";
    NAME_TO_STATE["CANCELLED"] = "E";
})(NAME_TO_STATE || (NAME_TO_STATE = {}));
var SHIP_STATE;
(function (SHIP_STATE) {
    SHIP_STATE["ALL_SHIP"] = "C";
})(SHIP_STATE || (SHIP_STATE = {}));

var OrderItem = function (_React$Component) {
    _inherits(OrderItem, _React$Component);

    function OrderItem() {
        _classCallCheck(this, OrderItem);

        var _this = _possibleConstructorReturn(this, (OrderItem.__proto__ || Object.getPrototypeOf(OrderItem)).apply(this, arguments));

        _this.getBtnGroup = function (data) {
            var _onClick = _this.props.onClick;

            var unpaidBtnGrp = React.createElement(
                Fragment,
                null,
                React.createElement(
                    Button,
                    { className: 'pay-btn', ghost: true, onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.UNPAID, data);
                        } },
                    React.createElement(
                        'span',
                        null,
                        'Pay now'
                    )
                ),
                React.createElement(
                    'a',
                    { className: 'cancel-a', onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.CANCEL, data);
                        } },
                    'Cancel'
                )
            );
            var toReceiveBtnGrp = React.createElement(
                Fragment,
                null,
                React.createElement(
                    Button,
                    { className: 'receipt-btn', type: 'primary', ghost: true, onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.CONFIRM, data);
                        } },
                    React.createElement(
                        'span',
                        null,
                        'Confirm Receipt'
                    )
                ),
                React.createElement(
                    'a',
                    { className: 'detail-a', onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.AGAIN, data);
                        } },
                    'Buy again'
                )
            );
            var completBtnGrp = React.createElement(
                Fragment,
                null,
                data.canEvaluate === 'Y' ? React.createElement(
                    Button,
                    { className: 'review-btn', type: 'default', ghost: true, onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.RATING, data);
                        } },
                    React.createElement(
                        'span',
                        null,
                        'Rating'
                    )
                ) : null,
                React.createElement(
                    'a',
                    { className: 'detail-a', onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.AGAIN, data);
                        } },
                    'Buy again'
                )
            );
            var cancelBtnGrp = React.createElement(
                'a',
                { className: 'detail-a', onClick: function onClick() {
                        return _onClick && _onClick(CLICK_TYPE.AGAIN, data);
                    } },
                'Buy again'
            );
            return React.createElement(
                'td',
                { rowSpan: data.orderItems.length, className: 'tr-td td-operation' },
                data.status === NAME_TO_STATE.UNPAID && unpaidBtnGrp,
                data.deliveryState === SHIP_STATE.ALL_SHIP && data.status === NAME_TO_STATE.TO_RECEIVED && toReceiveBtnGrp,
                data.status === NAME_TO_STATE.COMPLETED && completBtnGrp,
                data.status === NAME_TO_STATE.CANCELLED && cancelBtnGrp,
                React.createElement(
                    'a',
                    { className: 'detail-a', onClick: function onClick() {
                            return _onClick && _onClick(CLICK_TYPE.DETAIL, data);
                        } },
                    'Detail'
                )
            );
        };
        return _this;
    }

    _createClass(OrderItem, [{
        key: 'render',
        value: function render() {
            var _this2 = this;

            var _props = this.props,
                data = _props.data,
                _onClick2 = _props.onClick;

            return React.createElement(
                'table',
                { className: data.status === 'Completion' ? 'order-item-warp-gray' : 'order-item-warp' },
                React.createElement(
                    'tbody',
                    null,
                    React.createElement(
                        'tr',
                        { className: data.status === 'Completion' ? 'tr-th-gray' : 'tr-th' },
                        React.createElement(
                            'td',
                            { colSpan: 5, className: 'tr-td' },
                            React.createElement(
                                'span',
                                { className: 's-dateTime' },
                                React.createElement(Checkbox, { className: 's-checkbox', onChange: function onChange(v) {
                                        return _onClick2 && _onClick2(CLICK_TYPE.CHECKBOX, v);
                                    } }),
                                data && data.createTime
                            ),
                            React.createElement(
                                'span',
                                { className: 's-orderID' },
                                'Order No.:',
                                React.createElement(
                                    'span',
                                    { className: 's-order-content', onClick: function onClick() {
                                            return _onClick2 && _onClick2(CLICK_TYPE.ORDERID, data);
                                        } },
                                    data && data.orderNbr
                                )
                            ),
                            React.createElement(
                                'span',
                                { className: 's-store' },
                                React.createElement(Icon, { type: 'shop', className: 's-icon' }),
                                React.createElement(
                                    'span',
                                    { onClick: function onClick() {
                                            return _onClick2 && _onClick2(CLICK_TYPE.STORE, data);
                                        } },
                                    data && data.store
                                )
                            )
                        )
                    ),
                    data.orderItems.map(function (d, index) {
                        return React.createElement(
                            'tr',
                            { className: 'tr-bd', key: d.id + index },
                            React.createElement(
                                'td',
                                { className: 'tr-td td-goods' },
                                React.createElement(
                                    'div',
                                    { className: 'goods-item', onClick: function onClick() {
                                            return _onClick2 && _onClick2(CLICK_TYPE.IMG, data, d);
                                        } },
                                    React.createElement('img', { src: d && d.img, style: { width: '56px', height: '56px' } })
                                ),
                                React.createElement(
                                    'div',
                                    { className: 'goods-msg' },
                                    React.createElement(
                                        'div',
                                        { className: 'goods-title', title: '' + (d && d.title), onClick: function onClick() {
                                                return _onClick2 && _onClick2(CLICK_TYPE.TITLE, data, d);
                                            } },
                                        d && d.title
                                    ),
                                    React.createElement(
                                        'div',
                                        { className: 'goods-description', title: '' + (d && d.description) },
                                        d && d.description
                                    ),
                                    React.createElement(
                                        'div',
                                        { className: 'goods-icon' },
                                        React.createElement(Seven, { style: { color: '#14C97E', marginRight: 10 } }),
                                        React.createElement(QualityProduct, { style: { color: '#14C97E', marginRight: 10 } })
                                    )
                                ),
                                React.createElement(
                                    'div',
                                    { className: 'goods-price' },
                                    d && d.price
                                ),
                                React.createElement(
                                    'div',
                                    { className: 'goods-number' },
                                    d && d.number
                                )
                            ),
                            React.createElement(
                                'td',
                                { className: 'tr-td td-ship' },
                                data.status === NAME_TO_STATE.COMPLETED ? React.createElement(
                                    'span',
                                    { className: 'refund', onClick: function onClick() {
                                            _onClick2 && _onClick2(CLICK_TYPE.RETURN, data, d);
                                        } },
                                    'Refund & Return'
                                ) : null
                            ),
                            index === 0 && React.createElement(
                                Fragment,
                                null,
                                React.createElement(
                                    'td',
                                    { rowSpan: data.orderItems.length, className: 'tr-td td-status' },
                                    React.createElement(
                                        'div',
                                        null,
                                        STATE_TO_NAME[data.status]
                                    )
                                ),
                                React.createElement(
                                    'td',
                                    { rowSpan: data.orderItems.length, className: 'tr-td td-amount' },
                                    data && data.totalAmount
                                ),
                                _this2.getBtnGroup(data)
                            )
                        );
                    })
                )
            );
        }
    }]);

    return OrderItem;
}(React.Component);

export default OrderItem;