dlt-for-react 1.0.12 → 1.0.14

package/lib/components/KyTableCardList/highSearchForm.js

@@ -0,0 +1,585 @@
+'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 _AddFieldsModal = require('./AddFieldsModal');
+
+var _AddFieldsModal2 = _interopRequireDefault(_AddFieldsModal);
+
+var _highSelect = require('./highSelect');
+
+var _highSelect2 = _interopRequireDefault(_highSelect);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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)三种类型时，列表查询的数据必须是字符串且满足特定格式
+ */
+/*
+ * @Description: 高级搜索
+ * @Author: zengweijin
+ * @Date: 2019-09-10 14:31:50
+ * @LastEditors: jiangzhongxin
+ * @LastEditTime: 2022-07-04 14:39:34
+ */
+
+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 };
+                });
+            }
+            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].trim() !== '') {
+                            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.hightSearch = function (fieldpro, index) {
+            // 如果不需要作为高级搜索字段或者没有设置高级搜索字段的类型
+            if (fieldpro.defaultSearch === 'false' || fieldpro.defaultSearch === false || !fieldpro.searchType) {
+                return null;
+            }
+            var getFieldDecorator = _this.props.form.getFieldDecorator;
+
+            if (fieldpro.searchType === 'input') {
+                // 输入框
+                return _react2.default.createElement(
+                    _form2.default.Item,
+                    { label: _react2.default.createElement(
+                            _tooltip2.default,
+                            { title: fieldpro.title },
+                            fieldpro.title
+                        ), key: index },
+                    getFieldDecorator('S_' + fieldpro.dataIndex + '_LK', {})(_react2.default.createElement(_input2.default, { placeholder: '\u8BF7\u8F93\u5165' + fieldpro.title }))
+                );
+            } else if (fieldpro.searchType === 'select') {
+                // 下拉框
+                if (fieldpro.dmbz) {
+                    // 存在代码标志，根据代码标志获取数据
+                    return _react2.default.createElement(
+                        _form2.default.Item,
+                        { label: _react2.default.createElement(
+                                _tooltip2.default,
+                                { title: fieldpro.title },
+                                fieldpro.title
+                            ), key: index },
+                        getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {})(_react2.default.createElement(_highSelect2.default, { mode: 'multiple', maxTagCount: 3, sign: 'DMK_' + fieldpro.dmbz, placeholder: '\u8BF7\u9009\u62E9' + fieldpro.title }))
+                    );
+                } else if (fieldpro.sign) {
+                    // 不存在代码标志，存在下拉框标志，根据标志获取数据
+                    return _react2.default.createElement(
+                        _form2.default.Item,
+                        { label: _react2.default.createElement(
+                                _tooltip2.default,
+                                { title: fieldpro.title },
+                                fieldpro.title
+                            ), key: index },
+                        getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {})(_react2.default.createElement(_highSelect2.default, { mode: 'multiple', maxTagCount: 3, sign: fieldpro.sign, placeholder: '\u8BF7\u9009\u62E9' + fieldpro.title }))
+                    );
+                } else {
+                    // 代码标志和sign都不存在，默认是列表数据
+                    return _react2.default.createElement(
+                        _form2.default.Item,
+                        { label: _react2.default.createElement(
+                                _tooltip2.default,
+                                { title: fieldpro.title },
+                                fieldpro.title
+                            ), key: index },
+                        getFieldDecorator('S_' + fieldpro.dataIndex + '_IN', {})(_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 }))
+                    );
+                }
+            } else if (fieldpro.searchType === 'date') {
+                // 日期
+                return _react2.default.createElement(
+                    _form2.default.Item,
+                    { label: _react2.default.createElement(
+                            _tooltip2.default,
+                            { title: fieldpro.title },
+                            fieldpro.title
+                        ), key: index },
+                    getFieldDecorator('D_' + fieldpro.dataIndex + '_date', {})(_react2.default.createElement(RangePicker, null))
+                );
+            } else if (fieldpro.searchType === 'time') {
+                // 时间,没有时间范围组件
+                return _react2.default.createElement(
+                    _form2.default.Item,
+                    { label: _react2.default.createElement(
+                            _tooltip2.default,
+                            { title: fieldpro.title },
+                            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') {
+                // 日期时间
+                return _react2.default.createElement(
+                    _form2.default.Item,
+                    { label: _react2.default.createElement(
+                            _tooltip2.default,
+                            { title: fieldpro.title },
+                            fieldpro.title
+                        ), key: index },
+                    getFieldDecorator('DT_' + fieldpro.dataIndex + '_date', {})(_react2.default.createElement(RangePicker, { style: { width: 'auto' }, showTime: true, 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: fieldpro.title },
+                            fieldpro.title
+                        ), key: index },
+                    _react2.default.createElement(
+                        _form2.default.Item,
+                        { style: { display: 'inline-block', width: 'calc(50% - 12px)' } },
+                        getFieldDecorator('N_' + fieldpro.dataIndex + '_number_start', {})(_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', {})(_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 && 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 下一级下拉框的字段标识
+         */
+
+        // 获取所有从下拉框获取数据的字段标识
+
+        // 对所有从列表获取数据的下拉框统一获取数据
+
+        // 高级搜索
+
+        // 添加搜索字段模态框-关闭
+
+    }, {
+        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',
+                null,
+                _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 (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);
+
+var WrapHighSearchForm = _form2.default.create()(HighSearchForm);
+exports.default = WrapHighSearchForm;