dlt-for-react 1.0.3 → 1.0.5

package/lib/components/KyTable/highSearchForm.js

@@ -0,0 +1,749 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _row = require('antd/lib/row');
+
+var _row2 = _interopRequireDefault(_row);
+
+var _button = require('antd/lib/button');
+
+var _button2 = _interopRequireDefault(_button);
+
+var _col = require('antd/lib/col');
+
+var _col2 = _interopRequireDefault(_col);
+
+var _inputNumber = require('antd/lib/input-number');
+
+var _inputNumber2 = _interopRequireDefault(_inputNumber);
+
+var _timePicker = require('antd/lib/time-picker');
+
+var _timePicker2 = _interopRequireDefault(_timePicker);
+
+var _form = require('antd/lib/form');
+
+var _form2 = _interopRequireDefault(_form);
+
+var _input = require('antd/lib/input');
+
+var _input2 = _interopRequireDefault(_input);
+
+var _tooltip = require('antd/lib/tooltip');
+
+var _tooltip2 = _interopRequireDefault(_tooltip);
+
+var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray');
+
+var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2);
+
+var _getIterator2 = require('babel-runtime/core-js/get-iterator');
+
+var _getIterator3 = _interopRequireDefault(_getIterator2);
+
+var _set = require('babel-runtime/core-js/set');
+
+var _set2 = _interopRequireDefault(_set);
+
+var _extends2 = require('babel-runtime/helpers/extends');
+
+var _extends3 = _interopRequireDefault(_extends2);
+
+var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
+
+var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
+
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
+var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
+
+var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
+
+var _inherits2 = require('babel-runtime/helpers/inherits');
+
+var _inherits3 = _interopRequireDefault(_inherits2);
+
+var _datePicker = require('antd/lib/date-picker');
+
+var _datePicker2 = _interopRequireDefault(_datePicker);
+
+require('antd/lib/row/style');
+
+require('antd/lib/button/style');
+
+require('antd/lib/col/style');
+
+require('antd/lib/input-number/style');
+
+require('antd/lib/time-picker/style');
+
+require('antd/lib/form/style');
+
+require('antd/lib/input/style');
+
+require('antd/lib/tooltip/style');
+
+require('antd/lib/date-picker/style');
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _highSelect = require('./highSelect');
+
+var _highSelect2 = _interopRequireDefault(_highSelect);
+
+var _AddFieldsModal = require('./AddFieldsModal');
+
+var _AddFieldsModal2 = _interopRequireDefault(_AddFieldsModal);
+
+var _equalsObj = require('../../utils/equalsObj');
+
+var _equalsObj2 = _interopRequireDefault(_equalsObj);
+
+var _NHCore = require('../../utils/NHCore');
+
+require('../../../assets/components/KyTable/highSearchForm.less');
+
+var _moment = require('moment');
+
+var _moment2 = _interopRequireDefault(_moment);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/*
+ * @Description:高级搜索
+ * @Version: 1.0
+ * @Author: 琴时
+ */
+
+var RangePicker = _datePicker2.default.RangePicker;
+
+/**
+ *      searchType:"input",// 类型，可选值：输入框：input，下拉框：select，日期：date，时间：time，日期时间：datetime，数字：number
+        parentField:"xxxx",// 级联下拉框时的上一级字段，值需要跟NHTable配置的一样
+        dmbz:"xxx",// 下拉框的数据来源，如果没有传代码库标志或者下拉框配置标志则默认使用列表数据，
+        sign:"xxxx",// 下拉框的数据来源，如果没有传代码库标志或者下拉框配置标志则默认使用列表数据，
+        defaultSearch:true,// 默认true，如果不需要默认显示为高级搜索时设置为false
+
+        说明：
+        级联下拉框暂时只支持都是列表数据的情况
+        字段为date(YYYY-MM-dd)，datetime(YYYY-MM-dd HH:mm:ss)，time(HH:mm)三种类型时，列表查询的数据必须是字符串且满足特定格式
+ */
+var HighSearchForm = function (_React$Component) {
+  (0, _inherits3.default)(HighSearchForm, _React$Component);
+
+  function HighSearchForm(props) {
+    (0, _classCallCheck3.default)(this, HighSearchForm);
+
+    var _this = (0, _possibleConstructorReturn3.default)(this, (HighSearchForm.__proto__ || (0, _getPrototypeOf2.default)(HighSearchForm)).call(this, props));
+
+    _this.getCascaderField = function (columns) {
+      var cascaderField = {};
+      columns && columns.forEach(function (item) {
+        // 列表下拉框且存在parentField
+        if (item.searchType && item.searchType === 'select' && !item.dmbz && !item.sign && item.parentField) {
+          cascaderField[item.parentField] = item.dataIndex;
+        }
+      });
+      return cascaderField;
+    };
+
+    _this.onTableSelectChange = function (field, value) {
+      var cascaderField = _this.state.cascaderField;
+      if (cascaderField[field]) {
+        _this.filterTableSelectData(field, value, cascaderField[field]);
+      }
+    };
+
+    _this.filterTableSelectData = function (curField, curvalue, nextField) {
+      var tableData = _this.props.tableData;
+      var dataSource = (0, _extends3.default)({}, _this.state.dataSource);
+      var data = [];
+      if (tableData) {
+        var setlist = new _set2.default();
+        if (curvalue && curvalue.length === 0) {
+          tableData.forEach(function (item) {
+            setlist.add(item[nextField]);
+          });
+        } else {
+          tableData.forEach(function (item) {
+            var _iteratorNormalCompletion = true;
+            var _didIteratorError = false;
+            var _iteratorError = undefined;
+
+            try {
+              for (var _iterator = (0, _getIterator3.default)(curvalue), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+                var v = _step.value;
+
+                if (item[curField] === v) {
+                  setlist.add(item[nextField]);
+                }
+              }
+            } catch (err) {
+              _didIteratorError = true;
+              _iteratorError = err;
+            } finally {
+              try {
+                if (!_iteratorNormalCompletion && _iterator.return) {
+                  _iterator.return();
+                }
+              } finally {
+                if (_didIteratorError) {
+                  throw _iteratorError;
+                }
+              }
+            }
+          });
+        }
+        data = [].concat((0, _toConsumableArray3.default)(setlist)).map(function (item) {
+          return { label: item, value: item };
+        }).sort(function (a, b) {
+          var v = a.label;
+          if (typeof v === 'number') {
+            return b.label - v;
+          } else {
+            return (b.label || '').localeCompare(v, 'zh-CN');
+          }
+        });
+      }
+      dataSource[nextField] = data;
+      _this.setState({ dataSource: dataSource });
+    };
+
+    _this.getTableSelect = function (columns) {
+      var tableSelect = [];
+      columns && columns.forEach(function (item) {
+        if (item.searchType && item.searchType === 'select' && !item.dmbz && !item.sign) {
+          tableSelect.push(item.dataIndex);
+        }
+      });
+      return tableSelect;
+    };
+
+    _this.generateSelectData = function (tableData) {
+      var dataSource = {};
+      var _this$state$tableSele = _this.state.tableSelect,
+          tableSelect = _this$state$tableSele === undefined ? [] : _this$state$tableSele;
+      // 遍历列表数据
+
+      tableData && tableData.forEach(function (item, index) {
+        var _iteratorNormalCompletion2 = true;
+        var _didIteratorError2 = false;
+        var _iteratorError2 = undefined;
+
+        try {
+          for (var _iterator2 = (0, _getIterator3.default)(tableSelect), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
+            var dataIndex = _step2.value;
+
+            if (!dataSource[dataIndex]) {
+              dataSource[dataIndex] = new _set2.default();
+            }
+            if (item[dataIndex] && item[dataIndex] !== null && item[dataIndex] !== undefined) {
+              if (typeof item[dataIndex] === 'string' && item[dataIndex].trim() !== '') {
+                dataSource[dataIndex].add(item[dataIndex]);
+              } else {
+                dataSource[dataIndex].add(item[dataIndex]);
+              }
+            }
+          }
+        } catch (err) {
+          _didIteratorError2 = true;
+          _iteratorError2 = err;
+        } finally {
+          try {
+            if (!_iteratorNormalCompletion2 && _iterator2.return) {
+              _iterator2.return();
+            }
+          } finally {
+            if (_didIteratorError2) {
+              throw _iteratorError2;
+            }
+          }
+        }
+      });
+      var _iteratorNormalCompletion3 = true;
+      var _didIteratorError3 = false;
+      var _iteratorError3 = undefined;
+
+      try {
+        for (var _iterator3 = (0, _getIterator3.default)(tableSelect), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {
+          var dataIndex = _step3.value;
+
+          if (dataSource[dataIndex]) {
+            dataSource[dataIndex] = [].concat((0, _toConsumableArray3.default)(dataSource[dataIndex])).map(function (item) {
+              return { label: item, value: item };
+            });
+          }
+        }
+      } catch (err) {
+        _didIteratorError3 = true;
+        _iteratorError3 = err;
+      } finally {
+        try {
+          if (!_iteratorNormalCompletion3 && _iterator3.return) {
+            _iterator3.return();
+          }
+        } finally {
+          if (_didIteratorError3) {
+            throw _iteratorError3;
+          }
+        }
+      }
+
+      _this.setState({ dataSource: dataSource });
+    };
+
+    _this.showToolTip = function (e) {
+      if (e.target.clientWidth >= e.target.scrollWidth) {
+        e.target.style.pointerEvents = 'none'; // 阻止鼠标事件
+      }
+    };
+
+    _this.hightSearch = function (fieldpro, index) {
+      var parentColumns = _this.props.parentColumns;
+      var parentColumnTitle = '';
+      if (parentColumns && parentColumns.length) {
+        var exactPreant = parentColumns.filter(function (item) {
+          return item.children.includes(fieldpro.dataIndex);
+        });
+        parentColumnTitle = exactPreant.length ? exactPreant[0].title : '';
+      }
+
+      // 如果不需要作为高级搜索字段或者没有设置高级搜索字段的类型
+      if (fieldpro.defaultSearch === 'false' || fieldpro.defaultSearch === false || !fieldpro.searchType) {
+        return null;
+      }
+      var _this$props$form = _this.props.form,
+          getFieldDecorator = _this$props$form.getFieldDecorator,
+          getFieldValue = _this$props$form.getFieldValue;
+
+      if (fieldpro.searchType === 'input') {
+        // 输入框
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          getFieldDecorator('S_' + fieldpro.dataIndex + '_LK', {
+            initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+          })(_react2.default.createElement(_input2.default, { placeholder: '\u8BF7\u8F93\u5165' + fieldpro.title }))
+        );
+      } else if (fieldpro.searchType === 'select') {
+        index = fieldpro.dataIndex + index;
+        // 下拉框
+        if (fieldpro.dmbz) {
+          // 存在代码标志，根据代码标志获取数据
+          return _react2.default.createElement(
+            _form2.default.Item,
+            {
+              label: _react2.default.createElement(
+                _tooltip2.default,
+                { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+                parentColumnTitle + fieldpro.title,
+                ' '
+              ),
+              key: index
+            },
+            getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {
+              initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+            })(_react2.default.createElement(_highSelect2.default, {
+              mode: 'multiple',
+              maxTagCount: 3,
+              sign: 'DMK_' + fieldpro.dmbz,
+              placeholder: '\u8BF7\u9009\u62E9' + fieldpro.title,
+              hhzs: fieldpro.hhzs
+            }))
+          );
+        } else if (fieldpro.sign) {
+          // 不存在代码标志，存在下拉框标志，根据标志获取数据
+          var params = {};
+          if (fieldpro.parentField) {
+            params.parentLabel = getFieldValue('S_' + fieldpro.parentField + '_IN');
+          }
+          return _react2.default.createElement(
+            _form2.default.Item,
+            {
+              label: _react2.default.createElement(
+                _tooltip2.default,
+                { title: fieldpro.title, onMouseEnter: _this.showToolTip },
+                fieldpro.title
+              ),
+              key: index
+            },
+            getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {
+              initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+            })(_react2.default.createElement(_highSelect2.default, (0, _extends3.default)({
+              mode: 'multiple',
+              maxTagCount: 3
+            }, params, {
+              sign: fieldpro.sign,
+              placeholder: '\u8BF7\u9009\u62E9' + fieldpro.title,
+              hhzs: fieldpro.hhzs
+            })))
+          );
+        } else {
+          // 代码标志和sign都不存在，默认是列表数据
+          return _react2.default.createElement(
+            _form2.default.Item,
+            {
+              label: _react2.default.createElement(
+                _tooltip2.default,
+                { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+                parentColumnTitle + fieldpro.title
+              ),
+              key: index
+            },
+            getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {
+              initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+            })(_react2.default.createElement(_highSelect2.default, {
+              mode: 'multiple',
+              maxTagCount: 3,
+              onChange: function onChange(value, label) {
+                return _this.onTableSelectChange(fieldpro.dataIndex, value);
+              },
+              dataSource: _this.state.dataSource[fieldpro.dataIndex] || [],
+              onCancel: function onCancel() {
+                return _this.setState({ hightSearch: false });
+              },
+              placeholder: '\u8BF7\u9009\u62E9' + fieldpro.title,
+              hhzs: fieldpro.hhzs,
+              fetching: _this.props.highSearchFetching
+            }))
+          );
+        }
+      } else if (fieldpro.searchType === 'date') {
+        // 日期
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          getFieldDecorator('D_' + fieldpro.dataIndex + '_date', {
+            initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+          })(_react2.default.createElement(RangePicker, null))
+        );
+      } else if (fieldpro.searchType === 'time') {
+        // 时间,没有时间范围组件
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          _react2.default.createElement(
+            _form2.default.Item,
+            { style: { display: 'inline-block', width: 'calc(50% - 12px)' } },
+            getFieldDecorator('T_' + fieldpro.dataIndex + '_time_start', {})(_react2.default.createElement(_timePicker2.default, { format: 'HH:mm' }))
+          ),
+          _react2.default.createElement(
+            'span',
+            { style: { display: 'inline-block', width: '24px', textAlign: 'center' } },
+            '~'
+          ),
+          _react2.default.createElement(
+            _form2.default.Item,
+            { style: { display: 'inline-block', width: 'calc(50% - 12px)' } },
+            getFieldDecorator('T_' + fieldpro.dataIndex + '_time_end', {})(_react2.default.createElement(_timePicker2.default, { format: 'HH:mm' }))
+          )
+        );
+      } else if (fieldpro.searchType === 'datetime') {
+        var formItemLayout = {
+          labelCol: {
+            xs: { span: 24 },
+            sm: { span: 4 }
+          },
+          wrapperCol: {
+            xs: { span: 24 },
+            sm: { span: 20 }
+          }
+        };
+        // 日期时间
+        return _react2.default.createElement(
+          _form2.default.Item,
+          (0, _extends3.default)({}, formItemLayout, {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          }),
+          getFieldDecorator('DT_' + fieldpro.dataIndex + '_date', {})(_react2.default.createElement(RangePicker, {
+            style: { width: '100%' },
+            showTime: {
+              defaultValue: [(0, _moment2.default)('00:00:00', 'HH:mm:ss'), (0, _moment2.default)('23:59:59', 'HH:mm:ss')]
+            },
+            format: 'YYYY-MM-DD HH:mm:ss'
+          }))
+        );
+      } else if (fieldpro.searchType === 'rangeDate') {
+        //起止日期
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          getFieldDecorator('RD_' + fieldpro.dataIndex + '_dateRange', {})(_react2.default.createElement(RangePicker, { style: { width: 'auto' } }))
+        );
+      } else if (fieldpro.searchType === 'rangeDateTime') {
+        //起止日期时间
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          getFieldDecorator('RDT_' + fieldpro.dataIndex + '_dateTimeRange', {})(_react2.default.createElement(RangePicker, {
+            style: { width: 'auto' },
+            showTime: {
+              defaultValue: [(0, _moment2.default)('00:00:00', 'HH:mm:ss'), (0, _moment2.default)('23:59:59', 'HH:mm:ss')]
+            },
+            format: 'YYYY-MM-DD HH:mm:ss'
+          }))
+        );
+      } else if (fieldpro.searchType === 'number') {
+        // 数字
+        return _react2.default.createElement(
+          _form2.default.Item,
+          {
+            label: _react2.default.createElement(
+              _tooltip2.default,
+              { title: parentColumnTitle + fieldpro.title, onMouseEnter: _this.showToolTip },
+              parentColumnTitle + fieldpro.title
+            ),
+            key: index
+          },
+          _react2.default.createElement(
+            _form2.default.Item,
+            { style: { display: 'inline-block', width: 'calc(50% - 12px)' } },
+            getFieldDecorator('N_' + fieldpro.dataIndex + '_number_start', {
+              initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+            })(_react2.default.createElement(_inputNumber2.default, { style: { width: '100%' }, placeholder: '\u8BF7\u8F93\u5165' + fieldpro.title }))
+          ),
+          _react2.default.createElement(
+            'span',
+            { style: { display: 'inline-block', width: '24px', textAlign: 'center' } },
+            '~'
+          ),
+          _react2.default.createElement(
+            _form2.default.Item,
+            { style: { display: 'inline-block', width: 'calc(50% - 12px)' } },
+            getFieldDecorator('N_' + fieldpro.dataIndex + '_number_end', {
+              initialValue: fieldpro.defaultValue ? fieldpro.defaultValue : undefined
+            })(_react2.default.createElement(_inputNumber2.default, { style: { width: '100%' }, placeholder: '\u8BF7\u8F93\u5165' + fieldpro.title }))
+          )
+        );
+      }
+    };
+
+    _this.showAddModal = function () {
+      _this.setState({ visible: true });
+    };
+
+    _this.hideAddModal = function () {
+      _this.setState({ visible: false });
+    };
+
+    _this.state = {
+      selectData: {},
+      tableSelect: [],
+      dataSource: {}, // 列表下拉框数据
+      cascaderField: {},
+      visible: false,
+      searchCols: _this.props.columns
+    };
+    return _this;
+  }
+
+  (0, _createClass3.default)(HighSearchForm, [{
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      var _this2 = this;
+
+      var _props = this.props,
+          _props$columns = _props.columns,
+          columns = _props$columns === undefined ? [] : _props$columns,
+          _props$tableData = _props.tableData,
+          tableData = _props$tableData === undefined ? [] : _props$tableData;
+
+      var tableSelect = this.getTableSelect(columns);
+      var cascaderField = this.getCascaderField(columns);
+      this.setState({ tableSelect: tableSelect, cascaderField: cascaderField }, function () {
+        return _this2.generateSelectData(tableData);
+      });
+    }
+  }, {
+    key: 'UNSAFE_componentWillReceiveProps',
+    value: function UNSAFE_componentWillReceiveProps(nextprops) {
+      var _this3 = this;
+
+      if ('columns' in nextprops && !(0, _equalsObj2.default)(this.props.columns, nextprops.columns) && nextprops.columns) {
+        this.props.getHightSearchData && this.props.getHightSearchData(function () {
+          var _nextprops$columns = nextprops.columns,
+              columns = _nextprops$columns === undefined ? [] : _nextprops$columns,
+              _nextprops$tableData = nextprops.tableData,
+              tableData = _nextprops$tableData === undefined ? [] : _nextprops$tableData;
+
+          var tableSelect = _this3.getTableSelect(columns);
+          var cascaderField = _this3.getCascaderField(columns);
+          _this3.setState({ tableSelect: tableSelect, cascaderField: cascaderField, searchCols: [].concat((0, _toConsumableArray3.default)(columns)) }, function () {
+            return _this3.generateSelectData(tableData);
+          });
+        });
+      } else if ('tableData' in nextprops && nextprops.tableData && this.props.tableData != nextprops.tableData) {
+        this.generateSelectData(nextprops.tableData);
+      }
+    }
+    // 获得级联字段的上下级关系
+
+    /**
+     * 级联下拉框过滤下一级数据
+     * @param curField 当前选择下拉框的字段标识
+     * @param curvalue 当前下拉框选中的值
+     * @param nextField 下一级下拉框的字段标识
+     */
+
+    // 获取所有从下拉框获取数据的字段标识
+
+    // 对所有从列表获取数据的下拉框统一获取数据
+
+
+    // 当文字超出时才显示tooltip
+
+
+    // 高级搜索
+
+    // 添加搜索字段模态框-关闭
+
+  }, {
+    key: 'render',
+    value: function render() {
+      var _this4 = this;
+
+      var columns = this.props.columns;
+      var _state = this.state,
+          visible = _state.visible,
+          _state$searchCols = _state.searchCols,
+          searchCols = _state$searchCols === undefined ? [] : _state$searchCols;
+
+      var checkedCol = searchCols.filter(function (item) {
+        return item.defaultSearch !== 'false' && item.defaultSearch !== false && item.searchType;
+      });
+      checkedCol = checkedCol.map(function (item) {
+        return item.dataIndex;
+      });
+      var ncolumns = columns.filter(function (item) {
+        return item.title !== '序号' && item.searchType;
+      });
+      var formItemLayout = {
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 8 }
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 16 }
+        }
+      };
+      return _react2.default.createElement(
+        'div',
+        { className: 'highSearchForm' },
+        _react2.default.createElement(
+          _form2.default,
+          formItemLayout,
+          _react2.default.createElement(
+            _row2.default,
+            { gutter: 16, type: 'flex', align: 'middle' },
+            searchCols && searchCols.map(function (item, index) {
+              var comp = _this4.hightSearch(item, index);
+              if (item.searchType === 'datetime' && comp != null) {
+                return _react2.default.createElement(
+                  _col2.default,
+                  { key: index, xxl: 12, xl: 16, lg: 24, md: 24, sm: 24 },
+                  comp
+                );
+              }
+              if (comp != null) {
+                return _react2.default.createElement(
+                  _col2.default,
+                  { key: index, xxl: 6, xl: 8, lg: 12, md: 12, sm: 24 },
+                  comp
+                );
+              }
+              return null;
+            }),
+            _react2.default.createElement(
+              _col2.default,
+              { span: 24, style: { textAlign: 'right' } },
+              _react2.default.createElement(
+                _button2.default,
+                { type: 'primary', onClick: this.props.onSearch },
+                '\u6267\u884C\u9AD8\u7EA7\u641C\u7D22'
+              ),
+              _react2.default.createElement(
+                _button2.default,
+                { onClick: this.showAddModal },
+                '\u6DFB\u52A0\u641C\u7D22\u5B57\u6BB5'
+              ),
+              _react2.default.createElement(
+                _button2.default,
+                { onClick: this.props.onRest },
+                '\u91CD\u7F6E'
+              ),
+              _react2.default.createElement(
+                'a',
+                { style: { marginLeft: 10 }, onClick: this.props.onCancel },
+                '[\u5173\u95ED\u9AD8\u7EA7\u641C\u7D22]'
+              )
+            )
+          )
+        ),
+        _react2.default.createElement(_AddFieldsModal2.default, {
+          visible: visible,
+          data: ncolumns,
+          checkedList: checkedCol,
+          onOk: function onOk(result) {
+            return _this4.setState({ searchCols: result, visible: false }, _this4.props.refreshHeight);
+          },
+          onCancel: this.hideAddModal
+        })
+      );
+    }
+  }]);
+  return HighSearchForm;
+}(_react2.default.Component);
+
+exports.default = _form2.default.create()(HighSearchForm);