choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
1,035 lines (876 loc) • 39.2 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
var _tslib = require("tslib");
var _react = _interopRequireWildcard(require("react"));
var _mobxReact = require("mobx-react");
var _mobx = require("mobx");
var _uniq = _interopRequireDefault(require("lodash/uniq"));
var _pull = _interopRequireDefault(require("lodash/pull"));
var _noop = _interopRequireDefault(require("lodash/noop"));
var _map = _interopRequireDefault(require("lodash/map"));
var _isObject = _interopRequireDefault(require("lodash/isObject"));
var _isEmpty2 = _interopRequireDefault(require("lodash/isEmpty"));
var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
var _isArray = _interopRequireDefault(require("lodash/isArray"));
var _isString = _interopRequireDefault(require("lodash/isString"));
var _omit = _interopRequireDefault(require("lodash/omit"));
var _debounce = _interopRequireDefault(require("lodash/debounce"));
var _utils = require("../../../../lib/configure/utils");
var _UnitConvertor = require("../../../../lib/_util/UnitConvertor");
var _icon = _interopRequireDefault(require("../../../../lib/icon"));
var _KeyCode = _interopRequireDefault(require("../../../../lib/_util/KeyCode"));
var _enum = require("../../../../lib/trigger/enum");
var _DataSet = _interopRequireDefault(require("../../data-set/DataSet"));
var _enum2 = require("../../data-set/enum");
var _button = _interopRequireDefault(require("../../button"));
var _dropdown = _interopRequireDefault(require("../../dropdown"));
var _textField = _interopRequireDefault(require("../../text-field"));
var _tooltip = _interopRequireDefault(require("../../tooltip"));
var _TableContext = _interopRequireDefault(require("../TableContext"));
var _localeContext = require("../../locale-context");
var _autobind = _interopRequireDefault(require("../../_util/autobind"));
var _isEmpty3 = _interopRequireDefault(require("../../_util/isEmpty"));
var _FieldList = _interopRequireDefault(require("../../table/query-bar/FieldList"));
var _ColumnFilter = _interopRequireDefault(require("../tool-bar/ColumnFilter"));
var _enum3 = require("../../text-field/enum");
var _iteratorUtils = require("../../_util/iteratorUtils");
var _QuickFilterMenu = _interopRequireDefault(require("../../table/query-bar/quick-filter/QuickFilterMenu"));
var _QuickFilterMenuContext = _interopRequireDefault(require("../../table/query-bar/quick-filter/QuickFilterMenuContext"));
var _QuickFilterDataSet = require("../../table/query-bar/quick-filter/QuickFilterDataSet");
/**
* 当前数据是否有值并需要选中
* @param data
*/
function isSelect(data) {
if ((0, _isObject["default"])(data[1])) {
return !(0, _isEmpty2["default"])(data[1]);
}
return data[0] !== '__dirty' && !(0, _isEmpty3["default"])(data[1]);
}
function isEqualDynamicProps(originalValue, newValue) {
if ((0, _isEqual["default"])(newValue, originalValue)) {
return true;
}
if ((0, _isObject["default"])(newValue) && (0, _isObject["default"])(originalValue) && Object.keys(newValue).length) {
return Object.keys(newValue).every(function (key) {
var value = newValue[key];
var oldValue = originalValue[key];
if (oldValue === value) {
return true;
}
var oEp = (0, _isNumber["default"])(oldValue) ? (0, _isEmpty3["default"])(oldValue) : (0, _isEmpty2["default"])(oldValue);
var nEp = (0, _isNumber["default"])(value) ? (0, _isEmpty3["default"])(value) : (0, _isEmpty2["default"])(value);
if (oEp && nEp) {
return true;
}
return (0, _isEqual["default"])(oldValue, value);
});
}
return (0, _isEqual["default"])(newValue, originalValue);
}
function getQueryData(queryDataSet) {
var current = queryDataSet.current;
if (current) {
var queryData = (0, _omit["default"])(current.toData(true), ['__dirty']);
return Object.keys(queryData).reduce(function (p, key) {
var value = queryData[key];
if (!(0, _isEmpty3["default"])(value)) {
p[key] = value;
}
return p;
}, {});
}
return {};
}
var TableDynamicFilterBar = /*#__PURE__*/function (_Component) {
(0, _inherits2["default"])(TableDynamicFilterBar, _Component);
var _super = (0, _createSuper2["default"])(TableDynamicFilterBar);
function TableDynamicFilterBar(props, context) {
var _this;
(0, _classCallCheck2["default"])(this, TableDynamicFilterBar);
_this = _super.call(this, props, context);
_this.refDropdown = null;
_this.refFilterWrapper = null;
_this.refSingleWrapper = null;
_this.refEditors = new Map();
_this.originalConditionFields = [];
_this.enterNum = 0;
_this.handleClickOut = function (e) {
if (_this.refDropdown && !_this.refDropdown.contains(e.target)) {
_this.fieldSelectHidden = true;
}
};
_this.setOriginalConditionFields = function (code) {
var queryDataSet = _this.props.queryDataSet;
if (!code) {
_this.originalConditionFields = [];
} else {
var codes = Array.isArray(code) ? code : [code];
_this.originalConditionFields = (0, _uniq["default"])([].concat((0, _toConsumableArray2["default"])(_this.originalConditionFields), (0, _toConsumableArray2["default"])(codes)));
}
queryDataSet.setState('selectFields', (0, _toConsumableArray2["default"])(_this.originalConditionFields));
};
/**
* 勾选
* @param code
*/
_this.handleSelect = function (code) {
var queryDataSet = _this.props.queryDataSet;
var codes = Array.isArray(code) ? code : [code];
var selectFields = queryDataSet.getState('selectFields') || [];
queryDataSet.setState('selectFields', (0, _uniq["default"])([].concat((0, _toConsumableArray2["default"])(selectFields), (0, _toConsumableArray2["default"])(codes))));
var shouldUpdate = !(0, _isEqual["default"])((0, _mobx.toJS)(queryDataSet.getState('selectFields') || []), (0, _mobx.toJS)(_this.originalConditionFields));
_this.setConditionStatus(shouldUpdate ? _enum2.RecordStatus.update : _enum2.RecordStatus.sync);
};
/**
* 取消勾选
* @param code
*/
_this.handleUnSelect = function (code) {
var queryDataSet = _this.props.queryDataSet;
var codes = Array.isArray(code) ? code : [code];
if (queryDataSet) {
var current = queryDataSet.current;
if (current) {
codes.forEach(function (name) {
return current.set(name, undefined);
});
}
}
var selectFields = queryDataSet.getState('selectFields') || [];
queryDataSet.setState('selectFields', _pull["default"].apply(void 0, [(0, _toConsumableArray2["default"])(selectFields)].concat((0, _toConsumableArray2["default"])(codes))));
var shouldUpdate = !(0, _isEqual["default"])((0, _mobx.toJS)(queryDataSet.getState('selectFields')), (0, _mobx.toJS)(_this.originalConditionFields));
_this.setConditionStatus(shouldUpdate ? _enum2.RecordStatus.update : _enum2.RecordStatus.sync);
};
(0, _mobx.runInAction)(function () {
_this.fieldSelectHidden = true;
_this.expand = true;
});
return _this;
}
(0, _createClass2["default"])(TableDynamicFilterBar, [{
key: "componentDidMount",
value: function componentDidMount() {
this.processDataSetListener(true);
document.addEventListener('click', this.handleClickOut);
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
document.removeEventListener('click', this.handleClickOut);
this.processDataSetListener(false);
}
}, {
key: "processDataSetListener",
value: function processDataSetListener(flag) {
var queryDataSet = this.props.queryDataSet;
if (queryDataSet) {
var handler = flag ? queryDataSet.addEventListener : queryDataSet.removeEventListener;
handler.call(queryDataSet, 'validate', this.handleDataSetValidate);
handler.call(queryDataSet, 'update', this.handleDataSetUpdate);
handler.call(queryDataSet, 'create', this.handleDataSetCreate);
}
}
/**
* queryDataSet 查询前校验事件 触发展开动态字段
* @param dataSet 查询DS
* @param result
*/
}, {
key: "handleDataSetValidate",
value: function () {
var _handleDataSetValidate = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(_ref) {
var _this2 = this;
var dataSet, result, refSingleWrapper;
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
dataSet = _ref.dataSet, result = _ref.result;
_context.next = 3;
return result;
case 3:
if (_context.sent) {
_context.next = 7;
break;
}
(0, _mobx.runInAction)(function () {
var current = dataSet.current;
dataSet.fields.forEach(function (field, key) {
if (!field.isValid(current)) {
_this2.handleSelect(key);
}
});
_this2.expand = true;
});
refSingleWrapper = this.refSingleWrapper;
if (refSingleWrapper) {
refSingleWrapper.style.height = '';
refSingleWrapper.style.overflow = '';
}
case 7:
case "end":
return _context.stop();
}
}
}, _callee, this);
}));
function handleDataSetValidate(_x) {
return _handleDataSetValidate.apply(this, arguments);
}
return handleDataSetValidate;
}()
}, {
key: "setConditionStatus",
value: function setConditionStatus(value, orglValue) {
var queryDataSet = this.props.queryDataSet;
queryDataSet.setState('conditionStatus', value);
if (value === _enum2.RecordStatus.sync && orglValue) {
this.originalValue = orglValue;
}
}
/**
* 筛选条件更新 触发表格查询
*/
}, {
key: "handleDataSetUpdate",
value: function handleDataSetUpdate(_ref2) {
var record = _ref2.record;
var _this$props = this.props,
dataSet = _this$props.dataSet,
_this$props$onQuery = _this$props.onQuery,
onQuery = _this$props$onQuery === void 0 ? _noop["default"] : _this$props$onQuery,
autoQuery = _this$props.autoQuery;
var status = _enum2.RecordStatus.update;
if (record) {
status = isEqualDynamicProps(this.originalValue, record.toData()) ? _enum2.RecordStatus.sync : _enum2.RecordStatus.update;
}
this.setConditionStatus(status);
if (autoQuery) {
dataSet.query();
onQuery();
}
}
/**
* queryDS 新建,初始勾选值
*/
}, {
key: "handleDataSetCreate",
value: function handleDataSetCreate(props) {
var _this3 = this;
var dataSet = props.dataSet,
record = props.record;
var queryDataSet = this.props.queryDataSet;
var originalValue = record.toData();
var conditionData = Object.entries(originalValue);
this.originalValue = originalValue;
var fields = dataSet.fields;
(0, _map["default"])(conditionData, function (data) {
var name = data[0];
if (!fields.has(data[0]) && (0, _isObject["default"])(data[1]) && !(0, _isEmpty2["default"])(data[1]) && !(0, _isArray["default"])(data[1])) {
name = "".concat(data[0], ".").concat(Object.keys(data[1])[0]);
}
if (isSelect(data) && !(queryDataSet.getState('selectFields') || []).includes(name)) {
var field = dataSet.getField(name);
if (!field || !field.get('bind', record)) {
_this3.originalConditionFields.push(name);
_this3.handleSelect(name);
}
}
});
this.initMenuDataSet();
}
}, {
key: "initMenuDataSet",
value: function () {
var _initMenuDataSet = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
var _this4 = this;
var _this$props2, queryDataSet, dataSet, dynamicFilterBar, searchCode, searchCodes, menuDataSet, conditionDataSet, optionDataSet, filterMenuDataSet, result, menuRecord, current;
return _regenerator["default"].wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
_this$props2 = this.props, queryDataSet = _this$props2.queryDataSet, dataSet = _this$props2.dataSet, dynamicFilterBar = _this$props2.dynamicFilterBar, searchCode = _this$props2.searchCode;
searchCodes = dynamicFilterBar && dynamicFilterBar.searchCode || searchCode;
menuDataSet = new _DataSet["default"]((0, _QuickFilterDataSet.QuickFilterDataSet)({
searchCode: searchCodes,
queryDataSet: queryDataSet,
tableFilterAdapter: this.tableFilterAdapter
}));
conditionDataSet = new _DataSet["default"]((0, _QuickFilterDataSet.ConditionDataSet)());
optionDataSet = new _DataSet["default"]({
selection: _enum2.DataSetSelection.single
});
filterMenuDataSet = new _DataSet["default"]({
autoCreate: true,
fields: [{
name: 'filterName',
type: _enum2.FieldType.string,
textField: 'searchName',
valueField: 'searchId',
options: optionDataSet,
ignore: _enum2.FieldIgnore.always
}]
});
queryDataSet.setState('menuDataSet', menuDataSet);
queryDataSet.setState('conditionDataSet', conditionDataSet);
queryDataSet.setState('optionDataSet', optionDataSet);
queryDataSet.setState('filterMenuDataSet', filterMenuDataSet);
_context2.next = 12;
return menuDataSet.query();
case 12:
result = _context2.sent;
if (optionDataSet) {
optionDataSet.loadData(result);
}
menuRecord = menuDataSet.current;
if (menuRecord) {
conditionDataSet.loadData(menuRecord.get('conditionList'));
}
if (result && result.length) {
(0, _mobx.runInAction)(function () {
_this4.shouldLocateData = true;
});
} else {
current = filterMenuDataSet.current;
if (current) current.set('filterName', undefined);
(0, _mobx.runInAction)(function () {
_this4.shouldLocateData = true;
});
if (dataSet.props.autoQuery) {
dataSet.query();
}
}
case 17:
case "end":
return _context2.stop();
}
}
}, _callee2, this);
}));
function initMenuDataSet() {
return _initMenuDataSet.apply(this, arguments);
}
return initMenuDataSet;
}()
/**
* tableFilterSuffix 预留自定义区域
*/
}, {
key: "renderSuffix",
value: function renderSuffix() {
var _this$context = this.context,
tableStore = _this$context.tableStore,
proPrefixCls = _this$context.tableStore.proPrefixCls;
var _this$props3 = this.props,
dynamicFilterBar = _this$props3.dynamicFilterBar,
queryDataSet = _this$props3.queryDataSet,
dataSet = _this$props3.dataSet;
var suffixes = dynamicFilterBar && dynamicFilterBar.suffixes || tableStore.getConfig('tableFilterSuffix');
var children = [];
if (suffixes && suffixes.length) {
suffixes.forEach(function (suffix) {
if (suffix === 'filter') {
children.push( /*#__PURE__*/_react["default"].createElement(_ColumnFilter["default"], {
prefixCls: proPrefixCls
}));
} else if ( /*#__PURE__*/(0, _react.isValidElement)(suffix)) {
children.push(suffix);
} else if ((0, _isFunction["default"])(suffix)) {
children.push(suffix({
queryDataSet: queryDataSet,
dataSet: dataSet
}));
}
});
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-dynamic-filter-bar-suffix")
}, children);
}
}
}, {
key: "getPrefix",
value: function getPrefix() {
var proPrefixCls = this.context.tableStore.proPrefixCls;
var _this$props4 = this.props,
dynamicFilterBar = _this$props4.dynamicFilterBar,
queryDataSet = _this$props4.queryDataSet,
dataSet = _this$props4.dataSet;
var prefixes = dynamicFilterBar && dynamicFilterBar.prefixes;
var children = [];
if (prefixes && prefixes.length) {
prefixes.forEach(function (prefix) {
if ((0, _isString["default"])(prefix) && prefix === 'filter') {
children.push( /*#__PURE__*/_react["default"].createElement(_ColumnFilter["default"], {
prefixCls: proPrefixCls
}));
} else if ( /*#__PURE__*/(0, _react.isValidElement)(prefix)) {
children.push(prefix);
} else if ((0, _isFunction["default"])(prefix)) {
children.push(prefix({
queryDataSet: queryDataSet,
dataSet: dataSet
}));
}
});
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-dynamic-filter-bar-prefix")
}, children), /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-search-divide")
}));
}
return null;
}
/**
* 注入 onEnterDown 事件
* @param element
* @param name
*/
}, {
key: "createFields",
value: function createFields(element, name) {
var _this5 = this;
var onEnterDown = element.props.onEnterDown;
if (onEnterDown && (0, _isFunction["default"])(onEnterDown)) {
return element;
}
var props = {
onEnterDown: function onEnterDown() {
_this5.handleQuery();
},
ref: function ref(node) {
return _this5.refEditors.set(name, node);
}
};
return /*#__PURE__*/(0, _react.cloneElement)(element, props);
}
/**
* 判断查询值是否为空
* @param value
*/
}, {
key: "isEmpty",
value: function isEmpty(value) {
return (0, _mobx.isArrayLike)(value) ? !value.length : (0, _isEmpty3["default"])(value);
}
}, {
key: "tableFilterAdapter",
get: function get() {
var dynamicFilterBar = this.props.dynamicFilterBar;
var tableStore = this.context.tableStore;
return dynamicFilterBar && dynamicFilterBar.tableFilterAdapter || tableStore.getConfig('tableFilterAdapter');
}
/**
* 是否单行操作
*/
}, {
key: "isSingleLineOpt",
value: function isSingleLineOpt() {
var fuzzyQuery = this.props.fuzzyQuery;
return !(fuzzyQuery || this.tableFilterAdapter);
}
/**
* 渲染展开逻辑
* @param hidden 是否隐藏全部
*/
}, {
key: "getExpandNode",
value: function getExpandNode(hidden) {
var _this6 = this;
var proPrefixCls = this.context.tableStore.proPrefixCls;
var expandButton = this.props.expandButton;
if (!expandButton) {
return;
}
return /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-menu-expand"),
onClick: function onClick() {
var refSingleWrapper = _this6.refSingleWrapper;
if (refSingleWrapper) {
var _refSingleWrapper$get = refSingleWrapper.getBoundingClientRect(),
height = _refSingleWrapper$get.height;
var _refSingleWrapper$chi = refSingleWrapper.children[0].children[0].getBoundingClientRect(),
childHeight = _refSingleWrapper$chi.height;
(0, _mobx.runInAction)(function () {
_this6.expand = hidden ? height <= 0 : height <= childHeight + 18;
});
if (hidden && height) {
// 收起全部
refSingleWrapper.style.display = 'none';
} else {
refSingleWrapper.style.display = 'flex';
refSingleWrapper.style.height = '';
refSingleWrapper.style.overflow = '';
}
if (height > childHeight + 18 && !hidden) {
// 收起留一行高度
refSingleWrapper.style.height = (0, _UnitConvertor.pxToRem)(childHeight + 18, true) || '';
refSingleWrapper.style.overflow = 'hidden';
} else {
refSingleWrapper.style.height = '';
refSingleWrapper.style.overflow = '';
}
}
}
}, this.expand ? /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
title: (0, _localeContext.$l)('Table', 'collapse')
}, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
type: "baseline-arrow_drop_up"
})) : /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
title: (0, _localeContext.$l)('Table', 'expand_button')
}, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
type: "baseline-arrow_drop_down"
})));
}
/**
* 渲染模糊搜索
*/
}, {
key: "getFuzzyQuery",
value: function getFuzzyQuery() {
var _this7 = this;
var fuzzyQuery = this.props.fuzzyQuery;
if (!fuzzyQuery) return null;
var _this$props5 = this.props,
dataSet = _this$props5.dataSet,
dynamicFilterBar = _this$props5.dynamicFilterBar,
autoQueryAfterReset = _this$props5.autoQueryAfterReset,
fuzzyQueryPlaceholder = _this$props5.fuzzyQueryPlaceholder,
_this$props5$onReset = _this$props5.onReset,
onReset = _this$props5$onReset === void 0 ? _noop["default"] : _this$props5$onReset;
var _this$context2 = this.context,
tableStore = _this$context2.tableStore,
_this$context2$tableS = _this$context2.tableStore,
proPrefixCls = _this$context2$tableS.proPrefixCls,
node = _this$context2$tableS.node,
highlightRowIndexs = _this$context2$tableS.highlightRowIndexs;
var searchText = dynamicFilterBar && dynamicFilterBar.searchText || tableStore.getConfig('tableFilterSearchText') || 'params';
var placeholder = fuzzyQueryPlaceholder || (0, _localeContext.$l)('Table', 'enter_search_content');
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-search")
}, /*#__PURE__*/_react["default"].createElement(_textField["default"], {
style: {
width: 280
},
clearButton: true,
placeholder: placeholder,
prefix: /*#__PURE__*/_react["default"].createElement(_icon["default"], {
type: "search"
}),
value: this.searchText,
valueChangeAction: _enum3.ValueChangeAction.input,
onChange: (0, _debounce["default"])(function (value) {
(0, _mobx.runInAction)(function () {
_this7.searchText = value || '';
if (dynamicFilterBar && dynamicFilterBar.quickSearch) {
tableStore.highlightRowIndexs = [];
tableStore.searchText = value || '';
node.forceUpdate();
}
});
dataSet.setQueryParameter(searchText, value);
_this7.handleQuery();
}, 500),
onKeyDown: function onKeyDown(e) {
if (e.keyCode === _KeyCode["default"].ENTER && dynamicFilterBar && dynamicFilterBar.quickSearch) {
e.preventDefault();
var rows = (0, _toConsumableArray2["default"])(new Set(highlightRowIndexs));
node.scrollTop(rows[_this7.enterNum] * node.getRowHeight());
_this7.enterNum += 1;
if (_this7.enterNum + 1 > rows.length) {
_this7.enterNum = 0;
}
}
},
onClear: function onClear() {
(0, _mobx.runInAction)(function () {
_this7.searchText = '';
if (dynamicFilterBar && dynamicFilterBar.quickSearch) {
tableStore.searchText = '';
tableStore.highlightRowIndexs = [];
node.forceUpdate();
}
});
onReset();
if (autoQueryAfterReset) {
dataSet.setQueryParameter(searchText, undefined);
_this7.handleQuery(true);
}
}
}));
}
/**
* 渲染重置按钮
*/
}, {
key: "getResetButton",
value: function getResetButton() {
var _this8 = this;
var proPrefixCls = this.context.tableStore.proPrefixCls;
var _this$props6 = this.props,
queryDataSet = _this$props6.queryDataSet,
autoQueryAfterReset = _this$props6.autoQueryAfterReset,
_this$props6$onReset = _this$props6.onReset,
onReset = _this$props6$onReset === void 0 ? _noop["default"] : _this$props6$onReset;
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-buttons")
}, queryDataSet.getState('conditionStatus') === _enum2.RecordStatus.update && /*#__PURE__*/_react["default"].createElement(_button["default"], {
onClick: function onClick() {
if (queryDataSet) {
var current = queryDataSet.current;
if (current) {
current.reset();
_this8.handleDataSetCreate({
dataSet: queryDataSet,
record: current
});
}
}
_this8.setConditionStatus(_enum2.RecordStatus.sync);
onReset();
if (autoQueryAfterReset) {
_this8.handleQuery();
}
}
}, (0, _localeContext.$l)('Table', 'reset_button')));
}
/**
* 筛选头
* fuzzyQuery + quickFilterMenu + resetButton + buttons
*/
}, {
key: "getFilterMenu",
value: function getFilterMenu() {
var proPrefixCls = this.context.tableStore.proPrefixCls;
var _this$props7 = this.props,
queryFields = _this$props7.queryFields,
queryDataSet = _this$props7.queryDataSet,
dataSet = _this$props7.dataSet,
dynamicFilterBar = _this$props7.dynamicFilterBar,
searchCode = _this$props7.searchCode,
autoQuery = _this$props7.autoQuery,
expandButton = _this$props7.expandButton;
if (queryDataSet && queryFields.length) {
var prefix = this.getPrefix();
var fuzzyQuery = this.getFuzzyQuery();
var searchCodes = dynamicFilterBar && dynamicFilterBar.searchCode || searchCode;
var quickFilterMenu = this.tableFilterAdapter && searchCodes ? /*#__PURE__*/_react["default"].createElement(_QuickFilterMenuContext["default"].Provider, {
value: {
autoQuery: autoQuery,
prefixCls: proPrefixCls,
expand: this.expand,
dataSet: dataSet,
queryDataSet: queryDataSet,
onChange: this.handleSelect,
conditionStatus: queryDataSet.getState('conditionStatus'),
onStatusChange: this.setConditionStatus,
selectFields: queryDataSet.getState('selectFields'),
onOriginalChange: this.setOriginalConditionFields,
menuDataSet: queryDataSet.getState('menuDataSet'),
filterMenuDataSet: queryDataSet.getState('filterMenuDataSet'),
conditionDataSet: queryDataSet.getState('conditionDataSet'),
optionDataSet: queryDataSet.getState('optionDataSet'),
shouldLocateData: this.shouldLocateData
}
}, /*#__PURE__*/_react["default"].createElement(_QuickFilterMenu["default"], null)) : null;
var resetButton = this.isSingleLineOpt() || this.tableFilterAdapter ? null : this.getResetButton();
var expandNode = this.getExpandNode(true);
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-menu")
}, prefix, fuzzyQuery, quickFilterMenu, resetButton, this.isSingleLineOpt() ? null : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, expandButton ? /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-search-divide")
}) : null, expandNode), this.renderSuffix());
}
}
/**
* 渲染查询条
*/
}, {
key: "getQueryBar",
value: function getQueryBar() {
var _this9 = this;
var proPrefixCls = this.context.tableStore.proPrefixCls;
var _this$props8 = this.props,
_this$props8$queryFie = _this$props8.queryFieldsLimit,
queryFieldsLimit = _this$props8$queryFie === void 0 ? 3 : _this$props8$queryFie,
queryFields = _this$props8.queryFields,
queryDataSet = _this$props8.queryDataSet;
var selectFields = queryDataSet.getState('selectFields') || [];
var singleLineModeAction = this.isSingleLineOpt() ? /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-dynamic-filter-bar-single-action")
}, this.getResetButton(), this.getExpandNode(false)) : null;
if (queryDataSet && queryFields.length) {
return /*#__PURE__*/_react["default"].createElement("div", {
key: "query_bar",
className: "".concat(proPrefixCls, "-dynamic-filter-bar")
}, this.getFilterMenu(), /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "--dynamic-filter-single-wrapper"),
ref: function ref(node) {
return _this9.refSingleWrapper = node;
}
}, /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-wrapper")
}, queryFields.slice(0, queryFieldsLimit).map(function (element) {
var _element$props = element.props,
name = _element$props.name,
hidden = _element$props.hidden;
if (hidden) return null;
var queryField = queryDataSet.getField(name);
var itemClassName = "".concat(proPrefixCls, "-filter-item");
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-content"),
key: name,
onClick: function onClick() {
return _this9.refEditors.get(name).focus();
}
}, /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-label")
}, queryField && queryField.get('label')), /*#__PURE__*/_react["default"].createElement("span", {
className: itemClassName
}, _this9.createFields(element, name)));
}), queryFields.slice(queryFieldsLimit).map(function (element) {
var _element$props2 = element.props,
name = _element$props2.name,
hidden = _element$props2.hidden;
if (hidden) return null;
var queryField = queryDataSet.getField(name);
if (selectFields.includes(name)) {
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-content"),
key: name,
onClick: function onClick() {
return _this9.refEditors.get(name).focus();
}
}, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
type: "cancel",
className: "".concat(proPrefixCls, "-filter-item-close"),
onClick: function onClick() {
_this9.handleUnSelect([name]);
}
}), /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-label")
}, queryField && queryField.get('label')), /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-filter-item")
}, _this9.createFields(element, name)));
}
return null;
}), queryFieldsLimit < queryFields.length && /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(proPrefixCls, "-filter-item")
}, /*#__PURE__*/_react["default"].createElement(_dropdown["default"], {
visible: !this.fieldSelectHidden,
overlay: /*#__PURE__*/_react["default"].createElement("div", {
role: "none",
ref: function ref(node) {
return _this9.refDropdown = node;
},
onClick: function onClick(e) {
e.stopPropagation();
}
}, /*#__PURE__*/_react["default"].createElement(_FieldList["default"], {
groups: [{
title: (0, _localeContext.$l)('Table', 'predefined_fields'),
fields: (0, _iteratorUtils.iteratorFilterToArray)(queryDataSet.fields.values(), function (f) {
return !f.get('bind') && !f.get('name').includes('__tls');
}).slice(queryFieldsLimit)
}],
prefixCls: "".concat(proPrefixCls, "-filter-list") || 'c7n-pro-table-filter-list',
closeMenu: function closeMenu() {
return (0, _mobx.runInAction)(function () {
return _this9.fieldSelectHidden = true;
});
},
value: selectFields,
onSelect: this.handleSelect,
onUnSelect: this.handleUnSelect
})),
trigger: [_enum.Action.click]
}, /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(proPrefixCls, "-add-fields"),
onClick: function onClick(e) {
e.nativeEvent.stopImmediatePropagation();
(0, _mobx.runInAction)(function () {
_this9.fieldSelectHidden = false;
});
}
}, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
type: "add"
}), (0, _localeContext.$l)('Table', 'add_filter'))))), singleLineModeAction));
}
return null;
}
}, {
key: "handleQuery",
value: function handleQuery(collapse) {
var _this$props9 = this.props,
dataSet = _this$props9.dataSet,
queryDataSet = _this$props9.queryDataSet,
_this$props9$onQuery = _this$props9.onQuery,
onQuery = _this$props9$onQuery === void 0 ? _noop["default"] : _this$props9$onQuery,
autoQuery = _this$props9.autoQuery;
if (autoQuery) {
dataSet.query();
}
if (!collapse) {
var data = getQueryData(queryDataSet);
onQuery({
dataSet: dataSet,
queryDataSet: queryDataSet,
data: data,
params: this.searchText
});
}
}
}, {
key: "render",
value: function render() {
return this.getQueryBar();
}
}], [{
key: "contextType",
get: function get() {
return _TableContext["default"];
}
}]);
return TableDynamicFilterBar;
}(_react.Component);
TableDynamicFilterBar.defaultProps = {
prefixCls: (0, _utils.getProPrefixCls)('table'),
queryFieldsLimit: 3,
autoQueryAfterReset: true,
fuzzyQuery: true,
autoQuery: true,
expandButton: true
};
(0, _tslib.__decorate)([_mobx.observable], TableDynamicFilterBar.prototype, "moreFields", void 0);
(0, _tslib.__decorate)([_mobx.observable], TableDynamicFilterBar.prototype, "fieldSelectHidden", void 0);
(0, _tslib.__decorate)([_mobx.observable], TableDynamicFilterBar.prototype, "expand", void 0);
(0, _tslib.__decorate)([_mobx.observable], TableDynamicFilterBar.prototype, "searchText", void 0);
(0, _tslib.__decorate)([_mobx.observable], TableDynamicFilterBar.prototype, "shouldLocateData", void 0);
(0, _tslib.__decorate)([_mobx.action], TableDynamicFilterBar.prototype, "handleClickOut", void 0);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "handleDataSetValidate", null);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "setConditionStatus", null);
(0, _tslib.__decorate)([_mobx.action], TableDynamicFilterBar.prototype, "setOriginalConditionFields", void 0);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "handleDataSetUpdate", null);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "handleDataSetCreate", null);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "initMenuDataSet", null);
(0, _tslib.__decorate)([_mobx.action], TableDynamicFilterBar.prototype, "handleSelect", void 0);
(0, _tslib.__decorate)([_mobx.action], TableDynamicFilterBar.prototype, "handleUnSelect", void 0);
(0, _tslib.__decorate)([_autobind["default"]], TableDynamicFilterBar.prototype, "handleQuery", null);
TableDynamicFilterBar = (0, _tslib.__decorate)([_mobxReact.observer], TableDynamicFilterBar);
var _default = TableDynamicFilterBar;
exports["default"] = _default;
//# sourceMappingURL=TableDynamicFilterBar.js.map