import { __assign, __extends, __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { PureComponent } from 'react';
import classnames from 'classnames';
import ColGroup from './ColGroup';
import isNil from '../utils/isNil';
import ToolTip from '../tooltip';
import Icon from '../icon';
var sortToolTipMap = new Map([
    ['', '取消排序'],
    ['asc', '点击升序'],
    ['desc', '点击降序'],
]);
var Header = (function (_super) {
    __extends(Header, _super);
    function Header(props) {
        var _this = _super.call(this, props) || this;
        _this.getSortInfo = function (column, props) {
            var sortBy = props.sortBy, _a = props.sortType, sortType = _a === void 0 ? '' : _a, _b = props.defaultSortType, defaultSortType = _b === void 0 ? 'desc' : _b;
            var name = column.name;
            var newSortType;
            if (name === sortBy) {
                if (sortType === '') {
                    newSortType = defaultSortType;
                }
                else if (sortType === defaultSortType) {
                    newSortType = defaultSortType === 'asc' ? 'desc' : 'asc';
                }
                else {
                    newSortType = '';
                }
            }
            if (name !== sortBy) {
                newSortType = defaultSortType;
            }
            return {
                sortBy: name,
                sortType: newSortType,
                sortTooltip: sortToolTipMap.get(newSortType),
            };
        };
        _this.getChildrenAndEvents = function (column, props) {
            var _a;
            var prefix = props.prefix, sortBy = props.sortBy, sortType = props.sortType, onChange = props.onChange;
            var cn = classnames(prefix + "-grid-thead-sort", (_a = {},
                _a[prefix + "-grid-thead-sort-" + sortType] = sortType && column.name === sortBy,
                _a));
            if (column.needSort) {
                var _b = _this.getSortInfo(column, props), sortBy_1 = _b.sortBy, sortType_1 = _b.sortType, sortTooltip = _b.sortTooltip;
                return {
                    children: (_jsx(ToolTip, __assign({ title: sortTooltip, position: "top-center", cushion: 12 }, { children: _jsxs("div", __assign({ className: prefix + "-grid-thead-sort-btn", "data-zv": 'v10.0.11' }, { children: [column.title, _jsxs("span", __assign({ className: cn, "data-zv": 'v10.0.11' }, { children: [_jsx(Icon, { type: "caret-up", className: "caret-up" }, void 0), _jsx(Icon, { type: "caret-down", className: "caret-down" }, void 0)] }), void 0)] }), void 0) }), void 0)),
                    onClick: function () { return onChange({ sortBy: sortBy_1, sortType: sortType_1 }); },
                };
            }
            return {
                children: column.title,
            };
        };
        _this.getHeaderRows = function (passProps, columns, currentRow, rows) {
            if (currentRow === void 0) { currentRow = 0; }
            if (rows === void 0) { rows = []; }
            var props = passProps || _this.props;
            var prefix = props.prefix, propsColumns = props.columns;
            columns = columns || propsColumns;
            rows[currentRow] = rows[currentRow] || [];
            (columns || []).forEach(function (column, index) {
                var _a;
                if (column.rowSpan && rows.length < column.rowSpan) {
                    while (rows.length < column.rowSpan) {
                        rows.push([]);
                    }
                }
                var name = column.name, key = column.key, className = column.className, colSpan = column.colSpan, rowSpan = column.rowSpan, nowrap = column.nowrap, noWrap = column.noWrap, textAlign = column.textAlign, width = column.width;
                var cell = __assign({ key: name || key || index, className: classnames(prefix + "-grid-th", className, (_a = {},
                        _a[prefix + "-grid-text-align-" + textAlign] = textAlign,
                        _a[prefix + "-grid-nowrap"] = noWrap !== null && noWrap !== void 0 ? noWrap : nowrap,
                        _a[prefix + "-grid-th-selection"] = ['selection-column', 'selection-column-single'].indexOf(key) !== -1,
                        _a[prefix + "-grid-th-expand"] = key === 'expand-column',
                        _a[prefix + "-grid-th-sortable"] = column.needSort,
                        _a[prefix + "-grid-th-break-word"] = typeof width !== undefined,
                        _a)) }, _this.getChildrenAndEvents(column, props));
                if (column.children) {
                    _this.getHeaderRows(props, column.children, currentRow + 1, rows);
                }
                if (typeof colSpan === 'number') {
                    cell.colSpan = colSpan;
                }
                if (typeof rowSpan === 'number') {
                    cell.rowSpan = rowSpan;
                }
                if (cell.colSpan !== 0) {
                    rows[currentRow].push(cell);
                }
            });
            return rows.filter(function (row) { return row.length > 0; });
        };
        _this.subscribe = function () {
            var store = _this.props.store;
            _this.unsubscribe = store.subscribe('columns', function () {
                _this.setState({ rows: _this.getHeaderRows() });
            });
        };
        _this.state = {
            rows: _this.getHeaderRows(props),
        };
        return _this;
    }
    Header.prototype.componentDidMount = function () {
        this.subscribe();
    };
    Header.prototype.componentWillReceiveProps = function (nextProps) {
        if (nextProps.columns !== this.props.columns ||
            nextProps.sortType !== this.props.sortType ||
            nextProps.sortBy !== this.props.sortBy) {
            this.setState({
                rows: this.getHeaderRows(nextProps),
            });
        }
    };
    Header.prototype.componentWillUnmount = function () {
        if (this.unsubscribe) {
            this.unsubscribe();
        }
    };
    Header.prototype.renderThead = function () {
        var _a = this.props, prefix = _a.prefix, fixed = _a.fixed, fixedColumnsHeadRowsHeight = _a.fixedColumnsHeadRowsHeight;
        var rows = this.state.rows;
        var headerHeight = fixedColumnsHeadRowsHeight[0];
        var rowsLen = rows.length;
        return (_jsx("thead", __assign({ className: prefix + "-grid-thead", "data-zv": 'v10.0.11' }, { children: (rows || []).map(function (row, index) {
                var height = fixed && headerHeight
                    ? headerHeight / rowsLen
                    : undefined;
                return (_jsx("tr", __assign({ className: prefix + "-grid-tr", style: {
                        height: height,
                    }, "data-zv": 'v10.0.11' }, { children: row.map(function (_a) {
                        var key = _a.key, props = __rest(_a, ["key"]);
                        return (_jsx("th", __assign({}, props, { "data-zv": 'v10.0.11' }), key));
                    }) }), index));
            }) }), void 0));
    };
    Header.prototype.render = function () {
        var _a = this.props, scroll = _a.scroll, fixed = _a.fixed, prefix = _a.prefix, columns = _a.columns, size = _a.size;
        var headerStyle = {};
        if (!fixed && !isNil(scroll.x)) {
            headerStyle.width = scroll.x;
        }
        return scroll.y ? (_jsxs("table", __assign({ className: prefix + "-grid-table " + prefix + "-grid-table-" + size, style: headerStyle, "data-zv": 'v10.0.11' }, { children: [_jsx(ColGroup, { columns: columns }, void 0), this.renderThead()] }), void 0)) : (this.renderThead());
    };
    return Header;
}(PureComponent));
export default Header;
