import _extends from 'babel-runtime/helpers/extends';
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';
var _jsxFileName = 'src/table/Tr.jsx';
/**
 * Tr.jsx
 *
 * @Author: apple
 * @Date: 2018/4/17 18:09
 */

import React from 'react';
import classNames from 'classnames';
import TableCell from './TableCell';
import Icon from '../icon';
import { isFunction } from '../util/isType';
import pubsub from '../util/observer';
import { addClass, deleteClass } from '../util/operateClass';

var Tr = function (_React$PureComponent) {
    _inherits(Tr, _React$PureComponent);

    function Tr(props, context) {
        _classCallCheck(this, Tr);

        var _this = _possibleConstructorReturn(this, (Tr.__proto__ || Object.getPrototypeOf(Tr)).call(this, props, context));

        _this.handleExpandClick = function (e, type) {
            var _this$pubsubEvent = _this.pubsubEvent,
                expandRow = _this$pubsubEvent.expandRow,
                shrinkRow = _this$pubsubEvent.shrinkRow;
            var _this$props = _this.props,
                position = _this$props.position,
                leftFixed = _this$props.leftFixed;

            if (position === 'left' && leftFixed || position === 'main') {
                if (type === 'right-arrow') {
                    pubsub.publish(expandRow);
                }
                if (type === 'down-arrow') {
                    pubsub.publish(shrinkRow);
                }
            }
        };

        _this.handleMouseEnter = function () {
            var isHover = _this.props.isHover;
            var mouseEnterRow = _this.pubsubEvent.mouseEnterRow;

            isHover && pubsub.publish(mouseEnterRow);
        };

        _this.handleMouseLeave = function () {
            var isHover = _this.props.isHover;
            var mouseLeaveRow = _this.pubsubEvent.mouseLeaveRow;

            isHover && pubsub.publish(mouseLeaveRow);
        };

        var _this$props2 = _this.props,
            id = _this$props2.id,
            pubsubEventString = _this$props2.pubsubEventString;
        // 事件随机key值，确保在整个项目中独一无二

        _this.pubsubEvent = {
            expandRow: id + '-' + pubsubEventString.token + '-expand-main',
            shrinkRow: id + '-' + pubsubEventString.token + '-shrink-main',
            fixExpandRow: id + '-' + pubsubEventString.token + '-expand-fix',
            fixShrinkRow: id + '-' + pubsubEventString.token + '-shrink-fix',
            mouseEnterRow: id + '-' + pubsubEventString.token + '-mouseEnterRow',
            mouseLeaveRow: id + '-' + pubsubEventString.token + '-mouseLeaveRow'
        };
        _this.state = {
            displayExpandRow: false
        };
        return _this;
    }

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

            var self = this;
            var position = this.props.position;
            var _pubsubEvent = this.pubsubEvent,
                expandRow = _pubsubEvent.expandRow,
                shrinkRow = _pubsubEvent.shrinkRow,
                fixExpandRow = _pubsubEvent.fixExpandRow,
                fixShrinkRow = _pubsubEvent.fixShrinkRow,
                mouseEnterRow = _pubsubEvent.mouseEnterRow,
                mouseLeaveRow = _pubsubEvent.mouseLeaveRow;
            // 需要针对是否是主表格来决定如何监听

            if (position === 'main') {
                // 订阅打开展开栏事件
                pubsub.subscribe(expandRow, function () {
                    self.setState({
                        displayExpandRow: true,
                        arrowType: 'down-arrow'
                    }, function () {
                        pubsub.publish(fixExpandRow, _this2.expandTr.getBoundingClientRect().height);
                    });
                });
                // 订阅收缩展开栏事件
                pubsub.subscribe(shrinkRow, function () {
                    self.setState({
                        displayExpandRow: false,
                        arrowType: 'right-arrow'
                    }, function () {
                        pubsub.publish(fixShrinkRow);
                    });
                });
            } else {
                // 订阅固定列打开展开栏事件
                pubsub.subscribe(fixExpandRow, function (event, height) {
                    self.setState({
                        displayExpandRow: true,
                        arrowType: 'down-arrow'
                    });
                    _this2.expandTr.style.height = height + 'px';
                });
                // 订阅固定列收缩展开栏事件
                pubsub.subscribe(fixShrinkRow, function () {
                    self.setState({
                        displayExpandRow: false,
                        arrowType: 'right-arrow'
                    });
                });
            }
            pubsub.subscribe(mouseEnterRow, function () {
                addClass(_this2.normalTr, 'ne-table-is-hover');
            });
            pubsub.subscribe(mouseLeaveRow, function () {
                deleteClass(_this2.normalTr, 'ne-table-is-hover');
            });
        }
    }, {
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
            for (var item in this.pubsubEvent) {
                pubsub.unsubscribe(item);
            }
        }
    }, {
        key: 'render',
        value: function render() {
            var _this3 = this;

            var _props = this.props,
                id = _props.id,
                elm = _props.elm,
                classStr = _props.classStr,
                renderColumns = _props.renderColumns,
                data = _props.data,
                rules = _props.rules,
                colSpan = _props.colSpan,
                selfPrefixCls = _props.selfPrefixCls,
                position = _props.position;
            var displayExpandRow = this.state.displayExpandRow;
            var _pubsubEvent2 = this.pubsubEvent,
                expandRow = _pubsubEvent2.expandRow,
                shrinkRow = _pubsubEvent2.shrinkRow;

            var displayStyle = {};
            if (position !== 'main') {
                displayStyle.display = 'none';
            }
            var trClass = classStr;
            return [React.createElement(
                'tr',
                {
                    key: 'tr-' + id,
                    'data-row': id,
                    className: trClass,
                    onMouseEnter: this.handleMouseEnter,
                    onMouseLeave: this.handleMouseLeave,
                    ref: function ref(normalTr) {
                        return _this3.normalTr = normalTr;
                    }, __source: {
                        fileName: _jsxFileName,
                        lineNumber: 134
                    },
                    __self: this
                },
                isFunction(elm) ? elm(rules.length) : rules.map(function (e, index) {
                    var render = renderColumns[index].render;
                    if (e === 'expandBtn') {
                        var type = 'right-arrow';
                        if (displayExpandRow) {
                            type = 'down-arrow';
                        }
                        render = function render() {
                            return React.createElement(Icon, { type: type, onClick: function onClick(e) {
                                    return _this3.handleExpandClick(e, type);
                                }, __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 150
                                },
                                __self: _this3
                            });
                        };
                    }
                    var renderData = data;
                    if (elm._tableExpandRow) {
                        renderData = _extends({}, data);
                        delete renderData._tableExpandRow;
                    }
                    return React.createElement(TableCell, {
                        key: 'tr-' + id + '-td-' + e,
                        content: elm[e],
                        className: classNames(renderColumns[index].className, {
                            'text-center': renderColumns[index].textCenter
                        }),
                        render: isFunction(render) ? function () {
                            return render(id, renderData, e, {
                                publish: function publish(event) {
                                    return pubsub.publish(event);
                                },
                                shrinkEvent: shrinkRow,
                                expandEvent: expandRow
                            });
                        } : null,
                        __source: {
                            fileName: _jsxFileName,
                            lineNumber: 158
                        },
                        __self: _this3
                    });
                })
            ),
            // 展开栏
            elm._tableExpandRow && displayExpandRow && React.createElement(
                'tr',
                { key: 'tr-' + id + '-expand', 'data-row': id + '-expand', ref: function ref(expandTr) {
                        return _this3.expandTr = expandTr;
                    }, __source: {
                        fileName: _jsxFileName,
                        lineNumber: 181
                    },
                    __self: this
                },
                React.createElement(TableCell, {
                    colSpan: '' + colSpan,
                    style: displayStyle,
                    content: elm._tableExpandRow(),
                    className: classNames(selfPrefixCls + '-body-expand-row-' + position),
                    key: 'tr-' + id + '-td-expand',
                    __source: {
                        fileName: _jsxFileName,
                        lineNumber: 182
                    },
                    __self: this
                })
            )];
        }
    }]);

    return Tr;
}(React.PureComponent);

Tr.propTypes = {};
Tr.defaultProps = {};


export default Tr;