"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
var __values = (this && this.__values) || function (o) {
    var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
    if (m) return m.call(o);
    return {
        next: function () {
            if (o && i >= o.length) o = void 0;
            return { value: o && o[i++], done: !o };
        }
    };
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var _ = require("lodash");
var moment = require("moment");
var antd_1 = require("antd");
var index_1 = require("../index");
var utils_1 = require("../../utils");
var AutoComplete_1 = require("./DataComponents/AutoComplete");
var DateRange_1 = require("./DataComponents/DateRange");
var antd_2 = require("antd");
var getOptions = function (field) {
    if (_.has(field, 'options')) {
        if (_.isArray(field.options)) {
            return [field.options, 'name', 'value'];
        }
        if (_.isObject(field.options)) {
            return [field.options.data, field.options.nameField, field.options.valueField];
        }
    }
    if (_.has(field.config, 'dict')) {
        return [utils_1.Renders.dictRender(field.config.dict).nodes, 'name', 'value'];
    }
    return null;
};
var default_1 = /** @class */ (function (_super) {
    __extends(default_1, _super);
    function default_1(props) {
        var _this = _super.call(this, props) || this;
        _this.fieldOutside = false;
        _this.cols = 3;
        _this.fieldWidth = 250;
        _this.labelWidth = 90;
        _this.SearchFilelds = [];
        _this.state = {
            __expand: false
        };
        if (_.has(_this.props, 'cols')) {
            _this.cols = _this.props.cols;
        }
        if (_.has(_this.props, 'fieldWidth')) {
            if (_.isArray(_this.props.fieldWidth)) {
                _this.fieldWidth = _this.props.fieldWidth[0];
                _this.labelWidth = _this.props.fieldWidth[1];
            }
            else if (_.isNumber(_this.props.fieldWidth)) {
                _this.fieldWidth = _this.props.fieldWidth;
            }
        }
        return _this;
    }
    default_1.prototype.componentDidMount = function () {
        var _this = this;
        if (_.has(this.props, 'default') && this.props.fields && this.props.fields.length > 0) {
            var state_1 = {};
            this.props.fields.map(function (field) {
                if (field.type == 'timerange' || field.type == 'daterange') {
                    var _a = __read(field.field.split(','), 2), startField = _a[0], endField = _a[1];
                    if (_.has(_this.props.default, startField)) {
                        state_1[startField] = _this.props.default[startField];
                    }
                    if (_.has(_this.props.default, endField)) {
                        state_1[endField] = _this.props.default[endField];
                    }
                }
                if (_.has(_this.props.default, field.field)) {
                    state_1[field.field] = _this.props.default[field.field];
                }
            });
            this.setState(state_1);
        }
    };
    // 支持有 label 和 无 label 两种展现方式
    default_1.prototype.labelInput = function (field, node, rowIndex) {
        if (rowIndex === void 0) { rowIndex = 0; }
        if (this.fieldOutside) {
            var width = this.fieldWidth * (field.span || 1) - this.labelWidth;
            if (rowIndex > 0 && field.span == this.cols && (field.type == 'radio' || field.type == 'checkbox' || field.type == 'radiomore')) {
                width = "calc(100% - " + (this.labelWidth + 80) + "px)";
            }
            return React.createElement(React.Fragment, null,
                React.createElement("label", { style: { width: this.labelWidth }, className: "search-bar-field-label" }, field.label),
                React.createElement("div", { className: "search-bar-field-input search-bar-field-input-" + field.type, style: { width: width } }, React.cloneElement(node, { key: "input" + field.field, })));
        }
        return React.cloneElement(node, { style: { width: this.fieldWidth * (field.span || 1) } });
    };
    default_1.prototype.check = function (field, value) {
        var _a;
        if (utils_1.Const.SPECIAL_CHARACTER.test(value)) {
            antd_2.message.error('不能输入特殊字符');
            return;
        }
        this.setState((_a = {}, _a[field] = value, _a));
    };
    default_1.prototype.text = function (field) {
        var _this = this;
        var param = {
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u8F93\u5165" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        if (field.icon) {
            param.prefix = React.createElement(antd_1.Icon, { type: field.icon, className: "search-param-prefix" });
        }
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field];
        }
        return this.labelInput(field, React.createElement(antd_1.Input, __assign({}, field.config, param, { onChange: function (e) { return _this.check(field.field, e.target.value); } })));
    };
    default_1.prototype.number = function (field) {
        var _this = this;
        var param = {
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u8F93\u5165" + field.label,
        };
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field];
        }
        return this.labelInput(field, React.createElement(antd_1.InputNumber, __assign({}, field.config, param, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value, _a));
            } })));
    };
    default_1.prototype.autocomplete = function (field) {
        var _this = this;
        if (!_.has(field.config, 'api')) {
            console.error('field type : autocomplete must have a api');
            return this.text(field);
        }
        var param = {
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field];
        }
        return this.labelInput(field, React.createElement(AutoComplete_1.default, __assign({}, param, field.config, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value, _a));
            } })));
    };
    default_1.prototype.select = function (field) {
        var _this = this;
        var cfg = getOptions(field);
        if (cfg == null) {
            console.error('field type : select must have a options field, or config dict');
            return this.text(field);
        }
        var _a = __read(cfg, 3), options = _a[0], nameField = _a[1], valueField = _a[2];
        var param = {
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field] || undefined;
        }
        return this.labelInput(field, React.createElement(antd_1.Select, __assign({}, field.config, param, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value, _a));
            } }), options.map(function (option) { return React.createElement(antd_1.Select.Option, { value: option[valueField] }, option[nameField]); })));
    };
    default_1.prototype.multiselect = function (field) {
        var _this = this;
        var cfg = getOptions(field);
        if (cfg == null) {
            console.error('field type : select must have a options field, or config dict');
            return this.text(field);
        }
        var _a = __read(cfg, 3), options = _a[0], nameField = _a[1], valueField = _a[2];
        var param = {
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        if (_.has(this.state, field.field)) {
            param.value = _.filter(this.state[field.field].split(','), function (s) { return s != ''; });
        }
        // @ts-ignore
        return this.labelInput(field, React.createElement(antd_1.Select, __assign({ mode: "multiple" }, field.config, param, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value.join(','), _a));
            } }), options.map(function (option) { return React.createElement(antd_1.Select.Option, { value: option[valueField] }, option[nameField]); })));
    };
    default_1.prototype.treeselect = function (field) {
        var _this = this;
        if (!_.has(field.config, 'treeData')) {
            console.error('field type : dictselect must have a treeData field');
            return this.text(field);
        }
        var param = {
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field] || undefined;
        }
        return this.labelInput(field, React.createElement(antd_1.TreeSelect, __assign({}, field.config, param, { dropdownStyle: { maxHeight: 400, overflow: 'auto' }, treeDefaultExpandAll: true, onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value, _a));
            } })));
    };
    default_1.prototype.radio = function (field, rowIndex) {
        var _this = this;
        if (rowIndex === void 0) { rowIndex = 0; }
        var cfg = getOptions(field);
        if (cfg == null) {
            console.error('field type : select must have a options field, or config dict');
            return this.text(field);
        }
        var _a = __read(cfg, 3), options = _a[0], nameField = _a[1], valueField = _a[2];
        var param = {};
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field];
        }
        else {
            param.value = '';
            if (_.isEmpty(options[0][valueField]) && options[0][valueField] !== 0) {
                param.value = options[0][valueField];
            }
        }
        return this.labelInput(field, React.createElement(antd_1.Radio.Group, __assign({}, field.config, param, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value.target.value, _a));
            } }), options.map(function (option) { return React.createElement(antd_1.Radio, { value: option[valueField] }, option[nameField]); })), rowIndex);
    };
    default_1.prototype.radiomore = function (field, rowIndex) {
        // let cfg = getOptions(field);
        // if (cfg == null) {
        //     console.error('field type : select must have a options field, or config dict')
        //     return this.text(field);
        // }
        // let [options, nameField, valueField] = cfg;
        // let param: any = {}
        // if (_.has(this.state, field.field)) {
        //     param.value = this.state[field.field];
        // } else {
        //     param.value = '';
        //     if (_.isEmpty(options[0][valueField]) && options[0][valueField] !== 0) {
        //         param.value = options[0][valueField];
        //     }
        // }
        // options.push({ [nameField]: '更多', [valueField]: '___RADIO___MORE' })
        if (rowIndex === void 0) { rowIndex = 0; }
        // return this.labelInput(field, <Radio.Group  {...field.config} {...param} className="radio-group-widt-more" onChange={value => this.setState({ [field.field]: value.target.value })} >
        //      {options.map(item => item.value == '___RADIO___MORE' ? ():<Radio value={item[valueField]}>{item[nameField]}</Radio>
        //      )}
        //       {item.value == '___RADIO___MORE' ? (this.props.form.getFieldValue(column.field) == MORE ? <Input onChange={evt => STOREMORE[MORE + column.field] = evt.target.value} defaultValue={STOREMORE[MORE + column.field]} style={{ width: 100, marginLeft: 10 }} /> : null) : null}
        // </Radio.Group>)
        return this.text(field);
        // let value = this.props.form.getFieldValue(column.field);
        // var idx = _.findIndex(column.options, { value });
        // if (idx < 0) {
        //     STOREMORE[MORE + column.field] = value;
        //     this.props.form.setFieldsValue({ [column.field]: MORE })
        // }
    };
    default_1.prototype.checkbox = function (field, rowIndex) {
        var _this = this;
        if (rowIndex === void 0) { rowIndex = 0; }
        var cfg = getOptions(field);
        if (cfg == null) {
            console.error('field type : select must have a options field, or config dict');
            return this.text(field);
        }
        var _a = __read(cfg, 3), options = _a[0], nameField = _a[1], valueField = _a[2];
        var param = { value: [] };
        if (_.has(this.state, field.field)) {
            param.value = this.state[field.field].split(',');
        }
        return this.labelInput(field, React.createElement(antd_1.Checkbox.Group, __assign({}, field.config, param, { onChange: function (value) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = value.join(','), _a));
            } }), options.map(function (option) { return React.createElement(antd_1.Checkbox, { value: option[valueField] + '' }, option[nameField]); })), rowIndex);
    };
    default_1.prototype.datetime = function (field) {
        var _this = this;
        var param = {
            value: undefined,
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        var format = _.has(field.config, 'format') ? field.config.format : 'YYYY-MM-DD HH:mm:ss';
        if (_.has(this.state, field.field) && this.state[field.field]) {
            param.value = moment(this.state[field.field], format);
        }
        return this.labelInput(field, React.createElement(antd_1.DatePicker, __assign({}, field.config, param, { showTime: true, format: format, onChange: function (date) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = date ? date.format(format) : '', _a));
            } })));
    };
    default_1.prototype.date = function (field) {
        var _this = this;
        var param = {
            value: undefined,
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        var format = _.has(field.config, 'format') ? field.config.format : 'YYYY-MM-DD';
        if (_.has(this.state, field.field) && this.state[field.field]) {
            param.value = moment(this.state[field.field], format);
        }
        return this.labelInput(field, React.createElement(antd_1.DatePicker, __assign({}, field.config, param, { showTime: false, format: format, onChange: function (date) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = date ? date.format(format) : '', _a));
            } })));
    };
    default_1.prototype.month = function (field) {
        var _this = this;
        var param = {
            value: undefined,
            allowClear: true,
            placeholder: _.has(field.config, 'placeholder') ? field.config.placeholder : null || field.placeholder || "\u8BF7\u9009\u62E9" + field.label,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        var format = _.has(field.config, 'format') ? field.config.format : 'YYYY-MM-01';
        if (_.has(this.state, field.field) && this.state[field.field]) {
            param.value = moment(this.state[field.field], format);
        }
        return this.labelInput(field, React.createElement(antd_1.DatePicker.MonthPicker, __assign({}, field.config, param, { showTime: false, format: format, onChange: function (date) {
                var _a;
                return _this.setState((_a = {}, _a[field.field] = date ? date.format(format) : '', _a));
            } })));
    };
    default_1.prototype.timerange = function (field) {
        var _this = this;
        var param = {
            allowClear: true,
            start: undefined,
            end: undefined,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        var format = _.has(field.config, 'format') ? field.config.format : 'YYYY-MM-DD HH:mm:ss';
        var _a = __read(field.field.split(','), 2), startField = _a[0], endField = _a[1];
        if (_.has(this.state, startField) && this.state[startField]) {
            param.start = moment(this.state[startField], format);
        }
        if (_.has(this.state, endField) && this.state[endField]) {
            param.end = moment(this.state[endField], format);
        }
        return this.labelInput(field, React.createElement(DateRange_1.default, __assign({}, field.config, param, { showTime: true, onChange: function (start, end) {
                var _a;
                return _this.setState((_a = {}, _a[startField] = start ? start.format(format) : '', _a[endField] = end ? end.format(format) : '', _a));
            } })));
    };
    default_1.prototype.daterange = function (field) {
        var _this = this;
        var param = {
            allowClear: true,
            start: undefined,
            end: undefined,
        };
        if (field.allowClear === false) {
            param.allowClear = false;
        }
        var format = _.has(field.config, 'format') ? field.config.format : 'YYYY-MM-DD';
        var startFormat = _.has(field.config, 'startFormat') ? field.config.startFormat : format;
        var endFormat = _.has(field.config, 'endFormat') ? field.config.endFormat : format;
        var _a = __read(field.field.split(','), 2), startField = _a[0], endField = _a[1];
        if (_.has(this.state, startField) && this.state[startField]) {
            param.start = moment(this.state[startField], format);
        }
        if (_.has(this.state, endField) && this.state[endField]) {
            param.end = moment(this.state[endField], format);
        }
        return this.labelInput(field, React.createElement(DateRange_1.default, __assign({}, field.config, param, { showTime: false, onChange: function (start, end) {
                var _a;
                return _this.setState((_a = {}, _a[startField] = start ? start.format(startFormat) : '', _a[endField] = end ? end.format(endFormat) : '', _a));
            } })));
    };
    default_1.prototype.renderInput = function (field, rowIndex) {
        if (rowIndex === void 0) { rowIndex = 0; }
        switch (field.type) {
            case 'text':
                return this.text(field);
            case 'number':
                return this.number(field);
            case 'autocomplete':
                return this.autocomplete(field);
            case 'select':
                return this.select(field);
            case 'multiselect':
                return this.multiselect(field);
            case 'treeselect':
                return this.treeselect(field);
            case 'radio':
                return this.radio(field, rowIndex);
            case 'radiomore':
                return this.radiomore(field, rowIndex);
            case 'checkbox':
                return this.checkbox(field, rowIndex);
            case 'datetime':
                return this.datetime(field);
            case 'date':
                return this.date(field);
            case 'month':
                return this.month(field);
            case 'timerange':
                return this.timerange(field);
            case 'daterange':
                return this.daterange(field);
            default:
                return this.text(field);
        }
    };
    default_1.prototype.clear = function () {
        var _this = this;
        var state = {};
        _.keys(this.state).map(function (key) {
            if (!key.startsWith('__')) {
                state[key] = _.has(_this.props.default, key) ? _this.props.default[key] : '';
            }
        });
        this.setState(state);
    };
    default_1.prototype.search = function () {
        var _this = this;
        var query = {};
        _.keys(this.state).map(function (key) {
            if (!key.startsWith('__')) {
                if (_this.state[key]) {
                    query[key] = _this.state[key];
                }
                else {
                    query[key] = null;
                }
            }
        });
        this.props.onSearch(query);
    };
    default_1.prototype.expand = function (__expand) {
        var _this = this;
        this.setState({ __expand: __expand }, function () {
            if (_this.props.onExpands) {
                _this.props.onExpands();
            }
        });
    };
    default_1.prototype.renderButtons = function () {
        var e_1, _a;
        var _this = this;
        if (!_.has(this.props, 'buttons')) {
            return [];
        }
        var groups = [[]];
        try {
            for (var _b = __values(this.props.buttons), _c = _b.next(); !_c.done; _c = _b.next()) {
                var btn = _c.value;
                if (btn == null) {
                    groups.push([]);
                }
                else if (btn.show !== false) {
                    groups[groups.length - 1].push(btn);
                }
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_1) throw e_1.error; }
        }
        return groups.map(function (group) { return React.createElement(antd_1.Button.Group, null, group.map(function (btn) {
            var param = {};
            if (_.has(btn, 'icon')) {
                param.icon = btn.icon;
            }
            if (_.has(btn, 'type')) {
                param.type = btn.type;
            }
            if (btn.mustSelect) {
                param.disabled = true;
                if (_.isArray(_this.props.selectedRowKeys) && _this.props.selectedRowKeys.length > 0) {
                    param.disabled = false;
                }
            }
            if (btn.confirm && param.disabled !== true) {
                return React.createElement(antd_1.Popconfirm, { trigger: "click", placement: "bottomLeft", onConfirm: function () { return btn.onClick(_this.props.selectedRowKeys, _this.props.selectObjects); }, title: btn.confirm },
                    React.createElement(antd_1.Button, __assign({}, btn.config, param), btn.label));
            }
            if (btn.upload) {
                var param_1 = {
                    text: btn.label,
                    icon: btn.icon,
                };
                if (_.isString(btn.upload)) {
                    param_1.url = btn.upload;
                }
                return React.createElement(index_1.FileUpload.Single, __assign({}, param_1, btn.config, { callback: function (resp) {
                        // @ts-ignore
                        btn.onClick(resp);
                    } }));
                // param.onClick = {}
            }
            else {
                param.onClick = function () { return btn.onClick(_this.props.selectedRowKeys, _this.props.selectObjects, _this.props.param); };
            }
            return React.createElement(antd_1.Button, __assign({}, btn.config, param), btn.label);
        })); });
    };
    default_1.prototype.render = function () {
        var _this = this;
        var rowUse = 0;
        var hasLabel = this.props.fieldOutside || false;
        this.SearchFilelds = [];
        if (_.has(this.props, 'fields') && this.props.fields.length > 0) {
            this.SearchFilelds.push([]);
            this.props.fields.map(function (field) {
                if (field.show === false) {
                    return;
                }
                var row = _this.SearchFilelds[_this.SearchFilelds.length - 1];
                var span = field.span || 1;
                if (hasLabel || field.type == 'radio' || field.type == 'checkbox') {
                    hasLabel = true;
                }
                var tryfill = rowUse + span;
                if (tryfill > _this.cols) {
                    _this.SearchFilelds.push([field]);
                    rowUse = span;
                }
                else {
                    row.push(field);
                    rowUse += span;
                }
            });
        }
        this.fieldOutside = hasLabel;
        return React.createElement(antd_1.Row, { className: "vap-table-search-bar " + (this.state.__expand ? "vap-table-search-bar-expand" : "") }, this.state.__expand ? React.createElement(antd_1.Col, { className: "vap-table-search-bar-input" },
            this.SearchFilelds.map(function (row, i) { return React.createElement(antd_1.Input.Group, { compact: !_this.fieldOutside, className: _this.fieldOutside ? 'search-bar-outside' : 'search-bar-inside' },
                row.map(function (field) { return _this.renderInput(field, i); }),
                i == 0 && React.createElement("div", { className: "vap-table-search-bar-btns" }, _this.renderButtons())); }),
            React.createElement(antd_1.Input.Group, { className: "vap-table-search-bar-actions", style: { paddingLeft: this.fieldOutside ? this.labelWidth : 0 } },
                this.props.onSearch && React.createElement(antd_1.Button, { icon: "search", onClick: function (e) { return _this.search(); }, type: "primary" }, "\u67E5\u8BE2"),
                React.createElement(antd_1.Button, { icon: "history", type: "ghost", onClick: function (e) { return _this.clear(); } }, "\u91CD\u7F6E"),
                React.createElement(antd_1.Button, { icon: "filter", onClick: function (e) { return _this.expand(false); } }, "\u66F4\u5C11\u6761\u4EF6"))) : React.createElement(antd_1.Col, { className: "vap-table-search-bar-input" },
            React.createElement(antd_1.Input.Group, { compact: !this.fieldOutside, className: this.fieldOutside ? 'search-bar-outside' : 'search-bar-inside' },
                (this.SearchFilelds.length > 0) && React.createElement(React.Fragment, null,
                    this.SearchFilelds[0].map(function (field) { return _this.renderInput(field); }),
                    this.props.onSearch && React.createElement(antd_1.Button, { icon: "search", type: "primary", title: "\u67E5\u8BE2", onClick: function (e) { return _this.search(); } }),
                    React.createElement(antd_1.Button, { icon: "history", type: "ghost", title: "\u91CD\u7F6E", onClick: function (e) { return _this.clear(); } }),
                    this.SearchFilelds.length > 1 && React.createElement(antd_1.Button, { icon: "filter", onClick: function (e) { return _this.expand(true); }, title: "\u66F4\u591A\u6761\u4EF6" })),
                React.createElement("div", { className: "vap-table-search-bar-btns" }, this.renderButtons()))));
    };
    return default_1;
}(React.PureComponent));
exports.default = default_1;
