sea-chart 2.0.37 → 2.0.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/api/index.js +20 -69
- package/dist/assets/css/sea-chart-d3-tooltip.css +0 -1
- package/dist/components/cell-factory/FormatterConfig.js +55 -62
- package/dist/components/cell-factory/SimpleCellFormatter.js +5 -12
- package/dist/components/cell-factory/SingleSelectOption.js +11 -18
- package/dist/components/cell-factory/cell-editor-factory.js +5 -12
- package/dist/components/cell-factory/cell-formatter-factory.js +4 -11
- package/dist/components/cell-factory/link-content.js +30 -38
- package/dist/components/chart-color-selector/color-selector.js +11 -18
- package/dist/components/collaborator/index.js +7 -14
- package/dist/components/color-picker/index.js +12 -19
- package/dist/components/color-popover/color-rules/color-rule.js +26 -34
- package/dist/components/color-popover/color-rules/index.js +7 -15
- package/dist/components/color-popover/color-rules/rule-filters/filter.js +27 -34
- package/dist/components/color-popover/color-rules/rule-filters/index.js +17 -25
- package/dist/components/color-popover/color-rules/rule-filters/number-input.js +9 -17
- package/dist/components/color-popover/color-rules-popover.js +31 -37
- package/dist/components/color-popover/color-selector-popover.js +12 -20
- package/dist/components/color-setting/color-group-selector.js +13 -21
- package/dist/components/common-add-tool/index.js +8 -15
- package/dist/components/data-process-setter/data-setting-header.js +7 -14
- package/dist/components/data-process-setter/hide-column-setter.js +13 -20
- package/dist/components/data-process-setter/index.js +4 -27
- package/dist/components/data-process-setter/sort-setter.js +18 -26
- package/dist/components/draggable/Draggable.js +7 -13
- package/dist/components/drill-down-settings/drill-down-fields-popover/index.js +41 -48
- package/dist/components/drill-down-settings/drill-down-fields-settings/index.js +10 -18
- package/dist/components/drill-down-settings/index.js +11 -18
- package/dist/components/dtable-popover/index.js +13 -20
- package/dist/components/dtable-search-input/index.js +13 -21
- package/dist/components/font-settings/index.js +14 -22
- package/dist/components/goal-line-setting/goal-setting-item.js +6 -14
- package/dist/components/goal-line-setting/index.js +12 -19
- package/dist/components/highlighter/highlighter.js +7 -14
- package/dist/components/icon/index.js +12 -23
- package/dist/components/index.js +7 -48
- package/dist/components/loading/index.js +6 -13
- package/dist/components/number-input/index.js +11 -24
- package/dist/components/pixel-editor/index.js +15 -23
- package/dist/components/popover/hide-column-popover/hide-column-popover-widgets/hide-column-item.js +13 -16
- package/dist/components/popover/hide-column-popover/hide-column-popover.css +5 -1
- package/dist/components/popover/hide-column-popover/hide-column-popover.js +28 -38
- package/dist/components/popover/sort-popover/sort-popover-widgets/sort-utils.js +9 -18
- package/dist/components/popover/sort-popover/sort-popover.js +58 -69
- package/dist/components/resize-handle/ResizeHandle.js +6 -13
- package/dist/components/row-card/row-card-header-cell.js +17 -24
- package/dist/components/row-card/row-card-header.js +15 -22
- package/dist/components/row-card/row-card-item.js +35 -43
- package/dist/components/row-card/row-card.js +17 -25
- package/dist/components/statistic-record-dialog/index.js +61 -68
- package/dist/components/tooltip/index.js +39 -28
- package/dist/components/types-dialog/index.js +62 -70
- package/dist/components/types-dialog/use-force-update.js +4 -10
- package/dist/constants/color-rules.js +8 -14
- package/dist/constants/common-constants.js +8 -14
- package/dist/constants/error.js +2 -8
- package/dist/constants/geolocation.js +9 -15
- package/dist/constants/index.js +142 -271
- package/dist/constants/key-codes.js +0 -2
- package/dist/constants/model.js +3 -9
- package/dist/constants/regions.js +3 -8
- package/dist/constants/style.js +6 -12
- package/dist/constants/table.js +1 -7
- package/dist/constants/type-image.js +33 -39
- package/dist/constants/type.js +3 -9
- package/dist/context.js +13 -20
- package/dist/editor/index.js +13 -16
- package/dist/index.js +13 -104
- package/dist/intl.js +10 -17
- package/dist/locale/index.js +16 -23
- package/dist/locale/lang/de.js +2 -7
- package/dist/locale/lang/en.js +2 -7
- package/dist/locale/lang/es.js +2 -7
- package/dist/locale/lang/fr.js +2 -7
- package/dist/locale/lang/pt.js +2 -7
- package/dist/locale/lang/ru.js +2 -7
- package/dist/locale/lang/zh_CN.js +2 -7
- package/dist/model/area-group.js +12 -19
- package/dist/model/area.js +12 -19
- package/dist/model/bar-custom.js +11 -18
- package/dist/model/bar-group.js +12 -19
- package/dist/model/bar-stack.js +10 -17
- package/dist/model/bar.js +11 -18
- package/dist/model/base-model.js +4 -11
- package/dist/model/basic-number-card.js +13 -20
- package/dist/model/chart.js +7 -13
- package/dist/model/combination.js +15 -22
- package/dist/model/compare-bar.js +14 -21
- package/dist/model/completeness-group.js +11 -18
- package/dist/model/completeness.js +10 -17
- package/dist/model/dashboard.js +7 -14
- package/dist/model/funnel.js +14 -21
- package/dist/model/generic-model.js +135 -143
- package/dist/model/heat-map.js +9 -16
- package/dist/model/horizontal-bar.js +11 -18
- package/dist/model/horizontal-group-bar.js +10 -17
- package/dist/model/index.js +69 -93
- package/dist/model/line-group.js +13 -20
- package/dist/model/line.js +12 -19
- package/dist/model/map-bubble.js +14 -17
- package/dist/model/map.js +12 -19
- package/dist/model/mirror.js +13 -20
- package/dist/model/pie.js +12 -19
- package/dist/model/ring.js +12 -19
- package/dist/model/scatter.js +10 -17
- package/dist/model/stacked-horizontal-bar.js +11 -18
- package/dist/model/table-element.js +5 -12
- package/dist/model/table.js +7 -14
- package/dist/model/tree-map.js +7 -14
- package/dist/model/trend.js +11 -18
- package/dist/model/user.js +1 -7
- package/dist/model/world-map-bubble.js +12 -19
- package/dist/model/world-map.js +12 -19
- package/dist/services/map-json.js +14 -17
- package/dist/settings/advance-bar-settings/data-settings.js +36 -44
- package/dist/settings/advance-bar-settings/index.js +3 -20
- package/dist/settings/advance-bar-settings/style-settings.js +66 -73
- package/dist/settings/bar-settings/data-settings.js +39 -47
- package/dist/settings/bar-settings/index.js +3 -20
- package/dist/settings/bar-settings/style-settings.js +51 -59
- package/dist/settings/basic-number-card/data-settings.js +50 -57
- package/dist/settings/basic-number-card/index.js +3 -20
- package/dist/settings/basic-number-card/style-settings.js +19 -27
- package/dist/settings/combination-settings/data-settings.js +55 -64
- package/dist/settings/combination-settings/index.js +3 -20
- package/dist/settings/combination-settings/style-settings.js +67 -75
- package/dist/settings/completeness-settings/callbacks/callbacks.js +16 -27
- package/dist/settings/completeness-settings/data-settings/completion-settings.js +21 -28
- package/dist/settings/completeness-settings/data-settings/data-settings.js +25 -32
- package/dist/settings/completeness-settings/index.js +3 -20
- package/dist/settings/completeness-settings/style-settings.js +19 -26
- package/dist/settings/dashboard-settings/data-settings.js +44 -51
- package/dist/settings/dashboard-settings/index.js +2 -13
- package/dist/settings/data-settings.js +72 -79
- package/dist/settings/funnel-settings/components/dnd-item/dnd-item.js +12 -19
- package/dist/settings/funnel-settings/components/dnd-list.js +15 -23
- package/dist/settings/funnel-settings/components/funnel-label-setting.js +32 -40
- package/dist/settings/funnel-settings/components/funnel-layer-setting.js +22 -30
- package/dist/settings/funnel-settings/data-settings.js +23 -31
- package/dist/settings/funnel-settings/index.js +3 -20
- package/dist/settings/funnel-settings/style-settings.js +11 -19
- package/dist/settings/heat-map-settings/data-settings.js +18 -26
- package/dist/settings/heat-map-settings/index.js +3 -20
- package/dist/settings/heat-map-settings/style-settings.js +18 -26
- package/dist/settings/horizontal-bar-settings/data-settings.js +12 -19
- package/dist/settings/horizontal-bar-settings/index.js +3 -20
- package/dist/settings/horizontal-bar-settings/style-settings.js +12 -19
- package/dist/settings/index.js +57 -70
- package/dist/settings/map-settings/components/location-field-selector.js +10 -17
- package/dist/settings/map-settings/components/map-level-selector.js +11 -18
- package/dist/settings/map-settings/components/map-province-city-selector.js +19 -26
- package/dist/settings/map-settings/index.js +3 -20
- package/dist/settings/map-settings/map-data-settings.js +23 -30
- package/dist/settings/map-settings/map-style-settings.js +27 -35
- package/dist/settings/mirror-settings/data-settings.js +26 -34
- package/dist/settings/mirror-settings/index.js +2 -13
- package/dist/settings/pie-settings/data-settings.js +33 -41
- package/dist/settings/pie-settings/index.js +3 -20
- package/dist/settings/pie-settings/style-settings.js +47 -55
- package/dist/settings/scatter/data-settings.js +27 -34
- package/dist/settings/scatter/index.js +3 -12
- package/dist/settings/stacks-settings/index.js +19 -27
- package/dist/settings/stacks-settings/stack-item-settings.js +19 -27
- package/dist/settings/style-settings.js +65 -73
- package/dist/settings/table-element-settings/components/data-filter.js +49 -58
- package/dist/settings/table-element-settings/data-settings.js +21 -29
- package/dist/settings/table-element-settings/index.css +1 -31
- package/dist/settings/table-element-settings/index.js +2 -13
- package/dist/settings/table-settings/data-settings.js +113 -120
- package/dist/settings/table-settings/index.js +2 -13
- package/dist/settings/time-comparison-settings/data-settings.js +43 -51
- package/dist/settings/time-comparison-settings/index.js +3 -20
- package/dist/settings/time-comparison-settings/style-settings.js +44 -52
- package/dist/settings/trend-settings/data-settings.js +24 -32
- package/dist/settings/trend-settings/index.js +3 -20
- package/dist/settings/trend-settings/style-setting.js +19 -27
- package/dist/settings/widgets/basic-summary/index.js +59 -66
- package/dist/settings/widgets/chart-type/index.js +18 -26
- package/dist/settings/widgets/color-settings/index.js +72 -80
- package/dist/settings/widgets/common-data-settings.js +27 -34
- package/dist/settings/widgets/data-filter/index.js +59 -59
- package/dist/settings/widgets/data-sort.js +16 -24
- package/dist/settings/widgets/date-summary-item.js +26 -34
- package/dist/settings/widgets/display-values-settings/index.js +14 -22
- package/dist/settings/widgets/divider/index.js +8 -16
- package/dist/settings/widgets/font-settings/font-color-settings.js +11 -19
- package/dist/settings/widgets/font-settings/font-size-settings.js +14 -22
- package/dist/settings/widgets/font-settings/font-weight-settings.js +17 -25
- package/dist/settings/widgets/font-settings/index.js +4 -27
- package/dist/settings/widgets/group-by.js +52 -59
- package/dist/settings/widgets/min-max-setting.js +10 -18
- package/dist/settings/widgets/mininum-slice-percent.js +10 -18
- package/dist/settings/widgets/numeric-summary-item.js +25 -33
- package/dist/settings/widgets/select-line-type/index.js +10 -17
- package/dist/settings/widgets/select-table/index.js +9 -16
- package/dist/settings/widgets/select-view/index.js +20 -28
- package/dist/settings/widgets/stack.js +14 -22
- package/dist/settings/widgets/summary-method-setting.js +17 -25
- package/dist/settings/widgets/summary-settings.js +75 -82
- package/dist/settings/widgets/switch/index.js +9 -16
- package/dist/settings/widgets/text-horizontal-settings.js +15 -23
- package/dist/settings/widgets/time-picker.js +29 -37
- package/dist/settings/widgets/title-settings/index.js +29 -37
- package/dist/settings/widgets/title-settings/title-text.js +5 -12
- package/dist/settings/widgets/x-axios.js +0 -1
- package/dist/settings/widgets/y-axis-group-settings.js +65 -72
- package/dist/utils/cell-format-utils.js +25 -33
- package/dist/utils/cell-value-utils.js +4 -11
- package/dist/utils/chart-utils/base-utils.js +467 -367
- package/dist/utils/chart-utils/index.js +29 -40
- package/dist/utils/chart-utils/original-data-utils/basic-chart-calculator.js +78 -85
- package/dist/utils/chart-utils/original-data-utils/card-calculator.js +20 -21
- package/dist/utils/chart-utils/original-data-utils/combination-calculator.js +45 -52
- package/dist/utils/chart-utils/original-data-utils/compare-bar-chart-calculator.js +21 -28
- package/dist/utils/chart-utils/original-data-utils/completeness-calculator.js +33 -40
- package/dist/utils/chart-utils/original-data-utils/dashboard-calculator.js +28 -26
- package/dist/utils/chart-utils/original-data-utils/index.js +50 -57
- package/dist/utils/chart-utils/original-data-utils/mirror-calculator.js +19 -26
- package/dist/utils/chart-utils/original-data-utils/pivot-table-calculator.js +94 -97
- package/dist/utils/chart-utils/original-data-utils/scatter-calculator.js +19 -25
- package/dist/utils/chart-utils/original-data-utils/trend-calculator.js +50 -36
- package/dist/utils/chart-utils/sql-statistics-utils.js +385 -388
- package/dist/utils/chart.js +9 -17
- package/dist/utils/collaborator-manager.js +3 -9
- package/dist/utils/collaborator-utils.js +19 -31
- package/dist/utils/collaborator.js +6 -15
- package/dist/utils/color-utils.js +18 -29
- package/dist/utils/column-utils.js +88 -102
- package/dist/utils/common-utils.js +28 -53
- package/dist/utils/concurrency-manager.js +1 -7
- package/dist/utils/contexts.js +7 -11
- package/dist/utils/date-translate.js +12 -20
- package/dist/utils/digital-sign-utils.js +7 -14
- package/dist/utils/event-bus.js +1 -7
- package/dist/utils/hotkey.js +5 -11
- package/dist/utils/index.js +73 -219
- package/dist/utils/key-generator.js +2 -9
- package/dist/utils/map.js +22 -31
- package/dist/utils/object-utils.js +2 -8
- package/dist/utils/options-utils.js +10 -18
- package/dist/utils/row-record-utils.js +251 -183
- package/dist/utils/row-utils.js +27 -38
- package/dist/utils/search.js +24 -32
- package/dist/utils/sql/chart-data-sql.js +106 -112
- package/dist/utils/sql/column-2-sql-column.js +162 -172
- package/dist/utils/sql/index.js +3 -27
- package/dist/utils/trend-utils.js +50 -45
- package/dist/view/index.css +2 -8
- package/dist/view/index.js +102 -103
- package/dist/view/title/index.js +16 -24
- package/dist/view/wrapper/area-group.js +57 -57
- package/dist/view/wrapper/area.js +43 -51
- package/dist/view/wrapper/bar-compare.js +56 -48
- package/dist/view/wrapper/bar-custom-stack.js +73 -55
- package/dist/view/wrapper/bar-group.js +94 -73
- package/dist/view/wrapper/bar-stack.js +49 -57
- package/dist/view/wrapper/bar.js +40 -48
- package/dist/view/wrapper/basic-number-card.js +50 -34
- package/dist/view/wrapper/chart-component.js +164 -569
- package/dist/view/wrapper/combination.js +55 -63
- package/dist/view/wrapper/completeness-group.js +140 -93
- package/dist/view/wrapper/completeness.js +36 -44
- package/dist/view/wrapper/dashboard.js +104 -59
- package/dist/view/wrapper/funnel.js +40 -43
- package/dist/view/wrapper/heat-map.js +62 -70
- package/dist/view/wrapper/horizontal-bar-group.js +70 -58
- package/dist/view/wrapper/horizontal-bar-stack.js +48 -56
- package/dist/view/wrapper/horizontal-bar.js +41 -49
- package/dist/view/wrapper/index.js +107 -115
- package/dist/view/wrapper/line-group.js +49 -52
- package/dist/view/wrapper/line.js +42 -50
- package/dist/view/wrapper/map-bubble.js +40 -48
- package/dist/view/wrapper/map-world-bubble.js +40 -47
- package/dist/view/wrapper/map-world.js +42 -49
- package/dist/view/wrapper/map.js +42 -50
- package/dist/view/wrapper/mirror.js +41 -49
- package/dist/view/wrapper/pie.js +45 -53
- package/dist/view/wrapper/ring.js +50 -58
- package/dist/view/wrapper/scatter.js +50 -56
- package/dist/view/wrapper/table/index.js +14 -22
- package/dist/view/wrapper/table/one-dimension-table-no-numeric-columns.js +49 -57
- package/dist/view/wrapper/table/one-dimension-table-with-numeric-columns.js +53 -61
- package/dist/view/wrapper/table/pivot-table-display-name.js +82 -90
- package/dist/view/wrapper/table/two-dimension-table.js +85 -92
- package/dist/view/wrapper/table-element/components/dataset-utils.js +23 -36
- package/dist/view/wrapper/table-element/components/formatter.js +90 -99
- package/dist/view/wrapper/table-element/components/formatters/FileFormatter/index.js +23 -32
- package/dist/view/wrapper/table-element/components/formatters/formula-formatter.js +9 -16
- package/dist/view/wrapper/table-element/components/formatters/link-formatter.js +90 -97
- package/dist/view/wrapper/table-element/components/formula-formatter.js +9 -16
- package/dist/view/wrapper/table-element/components/link-formatter.js +90 -97
- package/dist/view/wrapper/table-element/components/record.js +13 -20
- package/dist/view/wrapper/table-element/components/records-body.js +9 -17
- package/dist/view/wrapper/table-element/components/records-header/index.js +7 -16
- package/dist/view/wrapper/table-element/components/records-header/records-header-cell.js +8 -16
- package/dist/view/wrapper/table-element/components/records.js +25 -33
- package/dist/view/wrapper/table-element/components/resize-column-handle/resize-column-handle.js +8 -13
- package/dist/view/wrapper/table-element/components/utils.js +6 -16
- package/dist/view/wrapper/table-element/components/value-display-utils.js +4 -11
- package/dist/view/wrapper/table-element/components/vertical-scrollbar/index.js +6 -13
- package/dist/view/wrapper/table-element/index.js +30 -43
- package/dist/view/wrapper/treemap.js +38 -46
- package/dist/view/wrapper/trend.js +80 -65
- package/package.json +15 -12
package/dist/components/popover/hide-column-popover/hide-column-popover-widgets/hide-column-item.js
CHANGED
|
@@ -1,13 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _DTableSwitch2 = _interopRequireDefault(require("dtable-ui-component/lib/DTableSwitch"));
|
|
9
|
-
var _react = _interopRequireDefault(require("react"));
|
|
10
|
-
class HideColumnItem extends _react.default.PureComponent {
|
|
1
|
+
import _DTableSwitch from "dtable-ui-component/lib/DTableSwitch";
|
|
2
|
+
import _DTableColumnIcon from "dtable-ui-component/lib/DTableColumnIcon";
|
|
3
|
+
import React from 'react';
|
|
4
|
+
class HideColumnItem extends React.PureComponent {
|
|
11
5
|
constructor(props) {
|
|
12
6
|
super(props);
|
|
13
7
|
this.onUpdateFieldSetting = event => {
|
|
@@ -47,12 +41,15 @@ class HideColumnItem extends _react.default.PureComponent {
|
|
|
47
41
|
const {
|
|
48
42
|
readonly
|
|
49
43
|
} = this.props;
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
}
|
|
44
|
+
const {
|
|
45
|
+
column
|
|
46
|
+
} = setting;
|
|
47
|
+
const placeholder = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_DTableColumnIcon, {
|
|
48
|
+
column: column
|
|
49
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
53
50
|
className: "text-truncate"
|
|
54
|
-
},
|
|
55
|
-
return /*#__PURE__*/
|
|
51
|
+
}, column.name));
|
|
52
|
+
return /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
56
53
|
checked: setting.isChecked,
|
|
57
54
|
disabled: readonly,
|
|
58
55
|
placeholder: placeholder,
|
|
@@ -64,4 +61,4 @@ class HideColumnItem extends _react.default.PureComponent {
|
|
|
64
61
|
HideColumnItem.defaultProps = {
|
|
65
62
|
readonly: false
|
|
66
63
|
};
|
|
67
|
-
|
|
64
|
+
export default HideColumnItem;
|
|
@@ -2,8 +2,12 @@
|
|
|
2
2
|
width: 192px;
|
|
3
3
|
display: inline-flex;
|
|
4
4
|
align-items: center;
|
|
5
|
-
margin: 0;
|
|
6
5
|
padding-right: 5px;
|
|
6
|
+
margin: 0;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.hidden-column-popover .field-settings-body .dtable-switch.dropdown-item {
|
|
10
|
+
padding: 0 10px;
|
|
7
11
|
}
|
|
8
12
|
|
|
9
13
|
.hidden-column-popover .custom-switch .dtable-font {
|
|
@@ -1,25 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _reactstrap = require("reactstrap");
|
|
10
|
-
var _isHotkey = _interopRequireDefault(require("is-hotkey"));
|
|
11
|
-
var _dtableUtils = require("dtable-utils");
|
|
12
|
-
var _intl = _interopRequireDefault(require("../../../intl"));
|
|
13
|
-
var _utils = require("../../../utils");
|
|
14
|
-
var _hideColumnItem = _interopRequireDefault(require("./hide-column-popover-widgets/hide-column-item"));
|
|
15
|
-
require("./hide-column-popover.css");
|
|
1
|
+
import React from 'react';
|
|
16
2
|
// import intl from 'react-intl-universal';
|
|
17
|
-
|
|
18
|
-
|
|
3
|
+
import { UncontrolledPopover } from 'reactstrap';
|
|
4
|
+
import isHotkey from 'is-hotkey';
|
|
5
|
+
import intl from '../../../intl';
|
|
6
|
+
import { getEventClassName } from '../../../utils';
|
|
7
|
+
import HideColumnItem from './hide-column-popover-widgets/hide-column-item';
|
|
8
|
+
import './hide-column-popover.css';
|
|
9
|
+
class HideColumnPopover extends React.Component {
|
|
19
10
|
constructor(props) {
|
|
20
11
|
super(props);
|
|
21
12
|
this.hidePopover = e => {
|
|
22
|
-
if (this.popoverRef && !
|
|
13
|
+
if (this.popoverRef && !getEventClassName(e).includes('popover') && !this.popoverRef.contains(e.target)) {
|
|
23
14
|
this.props.onPopoverToggle(e);
|
|
24
15
|
e.preventDefault();
|
|
25
16
|
e.stopPropagation();
|
|
@@ -27,7 +18,7 @@ class HideColumnPopover extends _react.default.Component {
|
|
|
27
18
|
}
|
|
28
19
|
};
|
|
29
20
|
this.onHotKey = e => {
|
|
30
|
-
if ((
|
|
21
|
+
if (isHotkey('esc', e)) {
|
|
31
22
|
e.preventDefault();
|
|
32
23
|
this.props.onPopoverToggle();
|
|
33
24
|
}
|
|
@@ -120,7 +111,7 @@ class HideColumnPopover extends _react.default.Component {
|
|
|
120
111
|
return fieldSettings;
|
|
121
112
|
}
|
|
122
113
|
return fieldSettings.filter(setting => {
|
|
123
|
-
return setting.
|
|
114
|
+
return setting.column.name.toLowerCase().includes(searchVal);
|
|
124
115
|
});
|
|
125
116
|
};
|
|
126
117
|
this.state = {
|
|
@@ -145,8 +136,7 @@ class HideColumnPopover extends _react.default.Component {
|
|
|
145
136
|
return {
|
|
146
137
|
key: column.key,
|
|
147
138
|
isChecked: shownColumnKeys.includes(column.key),
|
|
148
|
-
|
|
149
|
-
columnIcon: _dtableUtils.COLUMNS_ICON_CONFIG[column.type]
|
|
139
|
+
column: column
|
|
150
140
|
};
|
|
151
141
|
});
|
|
152
142
|
// table page cannot hide first column
|
|
@@ -162,7 +152,7 @@ class HideColumnPopover extends _react.default.Component {
|
|
|
162
152
|
} = this.props;
|
|
163
153
|
const fieldSettings = this.getFilteredColumns();
|
|
164
154
|
const isEmpty = fieldSettings.length === 0 ? true : false;
|
|
165
|
-
return /*#__PURE__*/
|
|
155
|
+
return /*#__PURE__*/React.createElement(UncontrolledPopover, {
|
|
166
156
|
placement: "auto-start",
|
|
167
157
|
isOpen: true,
|
|
168
158
|
target: target,
|
|
@@ -170,47 +160,47 @@ class HideColumnPopover extends _react.default.Component {
|
|
|
170
160
|
hideArrow: true,
|
|
171
161
|
className: "hidden-column-popover",
|
|
172
162
|
boundariesElement: document.body
|
|
173
|
-
}, /*#__PURE__*/
|
|
163
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
174
164
|
ref: ref => this.popoverRef = ref,
|
|
175
165
|
onClick: this.onPopoverInsideClick
|
|
176
|
-
}, /*#__PURE__*/
|
|
177
|
-
className:
|
|
178
|
-
}, /*#__PURE__*/
|
|
166
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
167
|
+
className: `field-settings ${isEmpty ? 'empty' : ''}`
|
|
168
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
179
169
|
className: "search-column"
|
|
180
|
-
}, /*#__PURE__*/
|
|
170
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
181
171
|
className: "form-control",
|
|
182
172
|
type: "text",
|
|
183
|
-
placeholder:
|
|
173
|
+
placeholder: intl.get('Search_column'),
|
|
184
174
|
value: this.state.searchVal,
|
|
185
175
|
onChange: this.onChangeSearch
|
|
186
|
-
})), isEmpty && /*#__PURE__*/
|
|
176
|
+
})), isEmpty && /*#__PURE__*/React.createElement("div", {
|
|
187
177
|
className: "empty-hidden-columns-container"
|
|
188
|
-
}, /*#__PURE__*/
|
|
178
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
189
179
|
className: "empty-hidden-columns-list"
|
|
190
|
-
},
|
|
180
|
+
}, intl.get('No_columns_available_to_be_hidden'))), !isEmpty && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
191
181
|
className: "field-settings-body",
|
|
192
182
|
style: {
|
|
193
183
|
maxHeight: window.innerHeight - 200 + 'px'
|
|
194
184
|
}
|
|
195
185
|
}, fieldSettings.map(setting => {
|
|
196
|
-
return /*#__PURE__*/
|
|
186
|
+
return /*#__PURE__*/React.createElement(HideColumnItem, {
|
|
197
187
|
key: setting.key,
|
|
198
188
|
setting: setting,
|
|
199
189
|
onUpdateFieldSetting: this.onUpdateFieldSetting,
|
|
200
190
|
readonly: readonly
|
|
201
191
|
});
|
|
202
|
-
})), !this.state.searchVal && !readonly && /*#__PURE__*/
|
|
192
|
+
})), !this.state.searchVal && !readonly && /*#__PURE__*/React.createElement("div", {
|
|
203
193
|
className: "field-settings-header"
|
|
204
|
-
}, /*#__PURE__*/
|
|
194
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
205
195
|
className: "hide-all px-2",
|
|
206
196
|
onClick: this.onHideAllColumns
|
|
207
|
-
},
|
|
197
|
+
}, intl.get('Hide_all')), /*#__PURE__*/React.createElement("div", {
|
|
208
198
|
className: "show-all px-2",
|
|
209
199
|
onClick: this.onChooseAllColumns
|
|
210
|
-
},
|
|
200
|
+
}, intl.get('Show_all')))))));
|
|
211
201
|
}
|
|
212
202
|
}
|
|
213
203
|
HideColumnPopover.defaultProps = {
|
|
214
204
|
readonly: false
|
|
215
205
|
};
|
|
216
|
-
|
|
206
|
+
export default HideColumnPopover;
|
|
@@ -1,28 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.isSortsEmpty = exports.getDisplaySorts = exports.execSortsOperation = exports.SORT_OPERATION = void 0;
|
|
7
|
-
var _dtableUtils = require("dtable-utils");
|
|
8
|
-
const SORT_OPERATION = exports.SORT_OPERATION = {
|
|
1
|
+
import { SORT_TYPE, isValidSort } from 'dtable-utils';
|
|
2
|
+
export const SORT_OPERATION = {
|
|
9
3
|
ADD_SORT: 'add_sort',
|
|
10
4
|
DELETE_SORT: 'delete_sort',
|
|
11
5
|
MODIFY_SORT_COLUMN: 'modify_sort_column',
|
|
12
6
|
MODIFY_SORT_TYPE: 'modify_sort_type'
|
|
13
7
|
};
|
|
14
|
-
const getDisplaySorts = (sorts, columns) => {
|
|
8
|
+
export const getDisplaySorts = (sorts, columns) => {
|
|
15
9
|
if (!Array.isArray(sorts) || !Array.isArray(columns)) {
|
|
16
10
|
return [];
|
|
17
11
|
}
|
|
18
|
-
return sorts.filter(sort => !sort.column_key ||
|
|
12
|
+
return sorts.filter(sort => !sort.column_key || isValidSort(sort, columns));
|
|
19
13
|
};
|
|
20
|
-
|
|
21
|
-
const isSortsEmpty = sorts => {
|
|
14
|
+
export const isSortsEmpty = sorts => {
|
|
22
15
|
return !sorts || sorts.length === 0;
|
|
23
16
|
};
|
|
24
|
-
|
|
25
|
-
const execSortsOperation = (action, payload) => {
|
|
17
|
+
export const execSortsOperation = (action, payload) => {
|
|
26
18
|
const {
|
|
27
19
|
sorts: updatedSorts
|
|
28
20
|
} = payload;
|
|
@@ -31,7 +23,7 @@ const execSortsOperation = (action, payload) => {
|
|
|
31
23
|
{
|
|
32
24
|
const newSort = {
|
|
33
25
|
column_key: null,
|
|
34
|
-
sort_type:
|
|
26
|
+
sort_type: SORT_TYPE.UP
|
|
35
27
|
};
|
|
36
28
|
updatedSorts.push(newSort);
|
|
37
29
|
return updatedSorts;
|
|
@@ -52,7 +44,7 @@ const execSortsOperation = (action, payload) => {
|
|
|
52
44
|
} = payload;
|
|
53
45
|
const newSort = {
|
|
54
46
|
column_key: column_key,
|
|
55
|
-
sort_type:
|
|
47
|
+
sort_type: SORT_TYPE.UP
|
|
56
48
|
};
|
|
57
49
|
updatedSorts[index] = newSort;
|
|
58
50
|
return updatedSorts;
|
|
@@ -76,5 +68,4 @@ const execSortsOperation = (action, payload) => {
|
|
|
76
68
|
return updatedSorts;
|
|
77
69
|
}
|
|
78
70
|
}
|
|
79
|
-
};
|
|
80
|
-
exports.execSortsOperation = execSortsOperation;
|
|
71
|
+
};
|
|
@@ -1,32 +1,23 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.default = void 0;
|
|
9
|
-
var _DTableCustomizeSelect2 = _interopRequireDefault(require("dtable-ui-component/lib/DTableCustomizeSelect"));
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
var _isHotkey = _interopRequireDefault(require("is-hotkey"));
|
|
12
|
-
var _reactstrap = require("reactstrap");
|
|
13
|
-
var _dtableUtils = require("dtable-utils");
|
|
14
|
-
var _utils = require("../../../utils");
|
|
15
|
-
var _commonAddTool = _interopRequireDefault(require("../../common-add-tool"));
|
|
16
|
-
var _intl = _interopRequireDefault(require("../../../intl"));
|
|
17
|
-
var _sortUtils = require("./sort-popover-widgets/sort-utils");
|
|
18
|
-
require("./sort-popover.css");
|
|
1
|
+
import _DTableCustomizeSelect from "dtable-ui-component/lib/DTableCustomizeSelect";
|
|
2
|
+
import _DTableColumnIcon from "dtable-ui-component/lib/DTableColumnIcon";
|
|
3
|
+
import React, { Component, Fragment } from 'react';
|
|
19
4
|
// import intl from 'react-intl-universal';
|
|
20
|
-
|
|
5
|
+
import isHotkey from 'is-hotkey';
|
|
6
|
+
import { Button, UncontrolledPopover } from 'reactstrap';
|
|
7
|
+
import { SORT_COLUMN_OPTIONS, SORT_TYPE } from 'dtable-utils';
|
|
8
|
+
import { getEventClassName, getColumnByKey } from '../../../utils';
|
|
9
|
+
import CommonAddTool from '../../common-add-tool';
|
|
21
10
|
// import eventBus from '../../utils/event-bus';
|
|
22
11
|
// import { EVENT_BUS_TYPE } from '../../constants';
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
12
|
+
import intl from '../../../intl';
|
|
13
|
+
import { execSortsOperation, getDisplaySorts, isSortsEmpty, SORT_OPERATION } from './sort-popover-widgets/sort-utils';
|
|
14
|
+
import './sort-popover.css';
|
|
15
|
+
const SORT_TYPES = [SORT_TYPE.UP, SORT_TYPE.DOWN];
|
|
16
|
+
class SortPopover extends Component {
|
|
26
17
|
constructor(props) {
|
|
27
18
|
super(props);
|
|
28
19
|
this.hideDTablePopover = e => {
|
|
29
|
-
if (this.sortPopoverRef && !
|
|
20
|
+
if (this.sortPopoverRef && !getEventClassName(e).includes('popover') && !this.sortPopoverRef.contains(e.target)) {
|
|
30
21
|
this.props.onSortComponentToggle(e);
|
|
31
22
|
e.preventDefault();
|
|
32
23
|
e.stopPropagation();
|
|
@@ -37,7 +28,7 @@ class SortPopover extends _react.Component {
|
|
|
37
28
|
return this.props.isNeedSubmit;
|
|
38
29
|
};
|
|
39
30
|
this.onHotKey = e => {
|
|
40
|
-
if ((
|
|
31
|
+
if (isHotkey('esc', e) && !this.isSelectOpen) {
|
|
41
32
|
e.preventDefault();
|
|
42
33
|
this.props.onSortComponentToggle();
|
|
43
34
|
}
|
|
@@ -49,7 +40,7 @@ class SortPopover extends _react.Component {
|
|
|
49
40
|
const {
|
|
50
41
|
sorts
|
|
51
42
|
} = this.state;
|
|
52
|
-
const newSorts =
|
|
43
|
+
const newSorts = execSortsOperation(SORT_OPERATION.ADD_SORT, {
|
|
53
44
|
sorts
|
|
54
45
|
});
|
|
55
46
|
this.updateSorts(newSorts);
|
|
@@ -57,7 +48,7 @@ class SortPopover extends _react.Component {
|
|
|
57
48
|
this.deleteSort = (event, index) => {
|
|
58
49
|
event.nativeEvent.stopImmediatePropagation();
|
|
59
50
|
const sorts = this.state.sorts.slice(0);
|
|
60
|
-
const newSorts =
|
|
51
|
+
const newSorts = execSortsOperation(SORT_OPERATION.DELETE_SORT, {
|
|
61
52
|
sorts,
|
|
62
53
|
index
|
|
63
54
|
});
|
|
@@ -69,7 +60,7 @@ class SortPopover extends _react.Component {
|
|
|
69
60
|
if (newColumnKey === sorts[index].column_key) {
|
|
70
61
|
return;
|
|
71
62
|
}
|
|
72
|
-
const newSorts =
|
|
63
|
+
const newSorts = execSortsOperation(SORT_OPERATION.MODIFY_SORT_COLUMN, {
|
|
73
64
|
sorts,
|
|
74
65
|
index,
|
|
75
66
|
column_key: newColumnKey
|
|
@@ -82,7 +73,7 @@ class SortPopover extends _react.Component {
|
|
|
82
73
|
if (newSortType === sorts[index].sort_type) {
|
|
83
74
|
return;
|
|
84
75
|
}
|
|
85
|
-
const newSorts =
|
|
76
|
+
const newSorts = execSortsOperation(SORT_OPERATION.MODIFY_SORT_TYPE, {
|
|
86
77
|
sorts,
|
|
87
78
|
index,
|
|
88
79
|
sort_type: newSortType
|
|
@@ -125,21 +116,20 @@ class SortPopover extends _react.Component {
|
|
|
125
116
|
};
|
|
126
117
|
this.createColumnsOptions = function () {
|
|
127
118
|
let columns = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
128
|
-
const sortableColumns = columns.filter(column =>
|
|
119
|
+
const sortableColumns = columns.filter(column => SORT_COLUMN_OPTIONS.includes(column.type));
|
|
129
120
|
return sortableColumns.map(column => {
|
|
130
121
|
const {
|
|
131
|
-
type,
|
|
132
122
|
name
|
|
133
123
|
} = column;
|
|
134
124
|
return {
|
|
135
125
|
value: {
|
|
136
126
|
column
|
|
137
127
|
},
|
|
138
|
-
label: /*#__PURE__*/
|
|
128
|
+
label: /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
139
129
|
className: "filter-header-icon"
|
|
140
|
-
}, /*#__PURE__*/
|
|
141
|
-
|
|
142
|
-
})), /*#__PURE__*/
|
|
130
|
+
}, /*#__PURE__*/React.createElement(_DTableColumnIcon, {
|
|
131
|
+
column: column
|
|
132
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
143
133
|
className: "select-option-name"
|
|
144
134
|
}, name))
|
|
145
135
|
};
|
|
@@ -151,9 +141,9 @@ class SortPopover extends _react.Component {
|
|
|
151
141
|
value: {
|
|
152
142
|
sortType
|
|
153
143
|
},
|
|
154
|
-
label: /*#__PURE__*/
|
|
144
|
+
label: /*#__PURE__*/React.createElement("span", {
|
|
155
145
|
className: "select-option-name"
|
|
156
|
-
},
|
|
146
|
+
}, intl.get(sortType))
|
|
157
147
|
};
|
|
158
148
|
});
|
|
159
149
|
};
|
|
@@ -165,24 +155,23 @@ class SortPopover extends _react.Component {
|
|
|
165
155
|
sorts
|
|
166
156
|
} = this.state;
|
|
167
157
|
return sorts.map((sort, index) => {
|
|
168
|
-
const column =
|
|
158
|
+
const column = getColumnByKey(sort.column_key, columns) || {};
|
|
169
159
|
return this.renderSortItem(column, sort, index);
|
|
170
160
|
});
|
|
171
161
|
};
|
|
172
162
|
this.renderSortItem = (column, sort, index) => {
|
|
173
163
|
let {
|
|
174
|
-
name
|
|
175
|
-
type
|
|
164
|
+
name
|
|
176
165
|
} = column;
|
|
177
166
|
const {
|
|
178
167
|
readonly
|
|
179
168
|
} = this.props;
|
|
180
169
|
let selectedColumn = {
|
|
181
|
-
label: /*#__PURE__*/
|
|
170
|
+
label: /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
182
171
|
className: "filter-header-icon"
|
|
183
|
-
}, /*#__PURE__*/
|
|
184
|
-
|
|
185
|
-
})), /*#__PURE__*/
|
|
172
|
+
}, /*#__PURE__*/React.createElement(_DTableColumnIcon, {
|
|
173
|
+
column: column
|
|
174
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
186
175
|
className: "select-option-name",
|
|
187
176
|
title: name,
|
|
188
177
|
"aria-label": name
|
|
@@ -190,33 +179,33 @@ class SortPopover extends _react.Component {
|
|
|
190
179
|
};
|
|
191
180
|
let selectedTypeShow = sort.sort_type;
|
|
192
181
|
let selectedSortType = selectedTypeShow && {
|
|
193
|
-
label: /*#__PURE__*/
|
|
182
|
+
label: /*#__PURE__*/React.createElement("span", {
|
|
194
183
|
className: "select-option-name"
|
|
195
|
-
},
|
|
184
|
+
}, intl.get(selectedTypeShow))
|
|
196
185
|
};
|
|
197
|
-
return /*#__PURE__*/
|
|
186
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
198
187
|
key: 'sort-item-' + index,
|
|
199
188
|
className: "sort-item"
|
|
200
|
-
}, !readonly && /*#__PURE__*/
|
|
189
|
+
}, !readonly && /*#__PURE__*/React.createElement("div", {
|
|
201
190
|
className: "delete-sort",
|
|
202
191
|
onClick: event => this.deleteSort(event, index)
|
|
203
|
-
}, /*#__PURE__*/
|
|
192
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
204
193
|
className: "dtable-font dtable-icon-fork-number"
|
|
205
|
-
})), /*#__PURE__*/
|
|
194
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
206
195
|
className: "condition"
|
|
207
|
-
}, /*#__PURE__*/
|
|
196
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
208
197
|
className: "sort-column"
|
|
209
|
-
}, /*#__PURE__*/
|
|
198
|
+
}, /*#__PURE__*/React.createElement(_DTableCustomizeSelect, {
|
|
210
199
|
isLocked: readonly,
|
|
211
200
|
value: selectedColumn,
|
|
212
201
|
onSelectOption: value => this.onSelectColumn(value, index),
|
|
213
202
|
options: this.columnsOptions,
|
|
214
203
|
searchable: true,
|
|
215
|
-
searchPlaceholder:
|
|
216
|
-
noOptionsPlaceholder:
|
|
217
|
-
})), /*#__PURE__*/
|
|
204
|
+
searchPlaceholder: intl.get('Search_column'),
|
|
205
|
+
noOptionsPlaceholder: intl.get('No_results')
|
|
206
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
218
207
|
className: "sort-predicate ml-2"
|
|
219
|
-
}, /*#__PURE__*/
|
|
208
|
+
}, /*#__PURE__*/React.createElement(_DTableCustomizeSelect, {
|
|
220
209
|
isLocked: readonly,
|
|
221
210
|
value: selectedSortType,
|
|
222
211
|
onSelectOption: value => this.onSelectSortType(value, index),
|
|
@@ -233,7 +222,7 @@ class SortPopover extends _react.Component {
|
|
|
233
222
|
this.sortTypeOptions = this.createSortTypeOptions();
|
|
234
223
|
this.columnsOptions = this.createColumnsOptions(_columns);
|
|
235
224
|
this.state = {
|
|
236
|
-
sorts:
|
|
225
|
+
sorts: getDisplaySorts(_sorts, _columns)
|
|
237
226
|
};
|
|
238
227
|
this.isSelectOpen = false;
|
|
239
228
|
}
|
|
@@ -261,8 +250,8 @@ class SortPopover extends _react.Component {
|
|
|
261
250
|
const {
|
|
262
251
|
sorts
|
|
263
252
|
} = this.state;
|
|
264
|
-
const isEmpty =
|
|
265
|
-
return /*#__PURE__*/
|
|
253
|
+
const isEmpty = isSortsEmpty(sorts);
|
|
254
|
+
return /*#__PURE__*/React.createElement(UncontrolledPopover, {
|
|
266
255
|
placement: "auto-start",
|
|
267
256
|
isOpen: true,
|
|
268
257
|
target: target,
|
|
@@ -270,31 +259,31 @@ class SortPopover extends _react.Component {
|
|
|
270
259
|
hideArrow: true,
|
|
271
260
|
className: "sort-popover",
|
|
272
261
|
boundariesElement: document.body
|
|
273
|
-
}, /*#__PURE__*/
|
|
262
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
274
263
|
ref: ref => this.sortPopoverRef = ref,
|
|
275
264
|
onClick: this.onPopoverInsideClick
|
|
276
|
-
}, /*#__PURE__*/
|
|
277
|
-
className:
|
|
278
|
-
}, isEmpty ? /*#__PURE__*/
|
|
265
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
266
|
+
className: `sorts-list ${isEmpty ? 'empty-sorts-container' : ''}`
|
|
267
|
+
}, isEmpty ? /*#__PURE__*/React.createElement("div", {
|
|
279
268
|
className: "empty-sorts-list"
|
|
280
|
-
},
|
|
269
|
+
}, intl.get('No_sorts')) : this.renderSortsList()), !readonly && /*#__PURE__*/React.createElement(CommonAddTool, {
|
|
281
270
|
callBack: this.addSort,
|
|
282
|
-
footerName:
|
|
271
|
+
footerName: intl.get('Add_sort'),
|
|
283
272
|
className: "popover-add-tool",
|
|
284
273
|
addIconClassName: "popover-add-icon"
|
|
285
|
-
}), this.isNeedSubmit() && !readonly && /*#__PURE__*/
|
|
274
|
+
}), this.isNeedSubmit() && !readonly && /*#__PURE__*/React.createElement("div", {
|
|
286
275
|
className: "sort-popover-footer"
|
|
287
|
-
}, /*#__PURE__*/
|
|
276
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
288
277
|
className: "mr-2",
|
|
289
278
|
onClick: this.onClosePopover
|
|
290
|
-
},
|
|
279
|
+
}, intl.get('Cancel')), /*#__PURE__*/React.createElement(Button, {
|
|
291
280
|
color: "primary",
|
|
292
281
|
disabled: this.state.isSubmitDisabled,
|
|
293
282
|
onClick: this.onSubmitSorts
|
|
294
|
-
},
|
|
283
|
+
}, intl.get('Submit')))));
|
|
295
284
|
}
|
|
296
285
|
}
|
|
297
286
|
SortPopover.defaultProps = {
|
|
298
287
|
readonly: false
|
|
299
288
|
};
|
|
300
|
-
|
|
289
|
+
export default SortPopover;
|
|
@@ -1,13 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _Draggable = _interopRequireDefault(require("../draggable/Draggable"));
|
|
10
|
-
require("../../assets/css/react-data-grid-header.css");
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Draggable from '../draggable/Draggable';
|
|
3
|
+
import '../../assets/css/react-data-grid-header.css';
|
|
11
4
|
const style = {
|
|
12
5
|
position: 'absolute',
|
|
13
6
|
top: 0,
|
|
@@ -16,7 +9,7 @@ const style = {
|
|
|
16
9
|
margin: '3px 0',
|
|
17
10
|
height: '80%'
|
|
18
11
|
};
|
|
19
|
-
class ResizeHandle extends
|
|
12
|
+
class ResizeHandle extends React.Component {
|
|
20
13
|
constructor() {
|
|
21
14
|
super(...arguments);
|
|
22
15
|
this.setResizeHandleLeft = left => {
|
|
@@ -24,7 +17,7 @@ class ResizeHandle extends _react.default.Component {
|
|
|
24
17
|
};
|
|
25
18
|
}
|
|
26
19
|
render() {
|
|
27
|
-
return /*#__PURE__*/
|
|
20
|
+
return /*#__PURE__*/React.createElement(Draggable, Object.assign({}, this.props, {
|
|
28
21
|
ref: ref => this.draggable = ref,
|
|
29
22
|
className: "react-grid-HeaderCell__resizeHandle",
|
|
30
23
|
style: {
|
|
@@ -34,4 +27,4 @@ class ResizeHandle extends _react.default.Component {
|
|
|
34
27
|
}));
|
|
35
28
|
}
|
|
36
29
|
}
|
|
37
|
-
|
|
30
|
+
export default ResizeHandle;
|
|
@@ -1,17 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
10
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
-
var _commonConstants = require("../../constants/common-constants");
|
|
12
|
-
var _eventBus = _interopRequireDefault(require("../../utils/event-bus"));
|
|
13
|
-
var _ResizeHandle = _interopRequireDefault(require("../resize-handle/ResizeHandle"));
|
|
14
|
-
class RowCardHeaderCell extends _react.default.Component {
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import ReactDOM from 'react-dom';
|
|
3
|
+
import classNames from 'classnames';
|
|
4
|
+
import { CommonEventTypes } from '../../constants/common-constants';
|
|
5
|
+
import eventBus from '../../utils/event-bus';
|
|
6
|
+
import ResizeHandle from '../resize-handle/ResizeHandle';
|
|
7
|
+
class RowCardHeaderCell extends React.Component {
|
|
15
8
|
constructor(props) {
|
|
16
9
|
super(props);
|
|
17
10
|
this.getHeaderCellWidth = () => {
|
|
@@ -27,7 +20,7 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
27
20
|
let headerCellWidth = width;
|
|
28
21
|
if (rowCardType === 'link') {
|
|
29
22
|
const tableId = table._id;
|
|
30
|
-
const draggedCellId =
|
|
23
|
+
const draggedCellId = `${tableId}-${key}`;
|
|
31
24
|
const existedWidth = JSON.parse(localStorage.getItem(draggedCellId));
|
|
32
25
|
if (existedWidth) {
|
|
33
26
|
headerCellWidth = existedWidth;
|
|
@@ -55,12 +48,12 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
55
48
|
const {
|
|
56
49
|
_id: tableId
|
|
57
50
|
} = table;
|
|
58
|
-
const draggedCellId =
|
|
51
|
+
const draggedCellId = `${tableId}-${columnKey}`;
|
|
59
52
|
let width = this.getWidthFromMouseEvent(e);
|
|
60
53
|
this.setState({
|
|
61
54
|
resizing: false
|
|
62
55
|
});
|
|
63
|
-
|
|
56
|
+
eventBus.dispatch(CommonEventTypes.CHANGE_HEADER_WIDTH, {
|
|
64
57
|
id: draggedCellId,
|
|
65
58
|
width
|
|
66
59
|
});
|
|
@@ -71,7 +64,7 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
71
64
|
if (e.pageX === 0) {
|
|
72
65
|
right = 0;
|
|
73
66
|
}
|
|
74
|
-
const left =
|
|
67
|
+
const left = ReactDOM.findDOMNode(this.headerCell).getBoundingClientRect().left;
|
|
75
68
|
// add 5px is ResizeHandle component DOM width, and the draggable column minimum width is 50px
|
|
76
69
|
return Math.max(right - left + 5, 50);
|
|
77
70
|
};
|
|
@@ -94,13 +87,13 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
94
87
|
name,
|
|
95
88
|
key
|
|
96
89
|
} = column;
|
|
97
|
-
return /*#__PURE__*/
|
|
98
|
-
className: (
|
|
90
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
91
|
+
className: classNames('row-card-column-name text-truncate position-relative', {
|
|
99
92
|
'row-card-column--resizing': resizing
|
|
100
93
|
}, {
|
|
101
94
|
'row-card-draggable': isDraggable
|
|
102
95
|
})
|
|
103
|
-
}, /*#__PURE__*/
|
|
96
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
104
97
|
ref: ref => this.headerCell = ref,
|
|
105
98
|
className: "row-card-column-name-item position-relative",
|
|
106
99
|
style: {
|
|
@@ -108,9 +101,9 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
108
101
|
},
|
|
109
102
|
key: key,
|
|
110
103
|
title: name
|
|
111
|
-
}, /*#__PURE__*/
|
|
104
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
112
105
|
title: name
|
|
113
|
-
}, name)), isDraggable && /*#__PURE__*/
|
|
106
|
+
}, name)), isDraggable && /*#__PURE__*/React.createElement(ResizeHandle, {
|
|
114
107
|
style: {
|
|
115
108
|
right: 0
|
|
116
109
|
},
|
|
@@ -120,4 +113,4 @@ class RowCardHeaderCell extends _react.default.Component {
|
|
|
120
113
|
}));
|
|
121
114
|
}
|
|
122
115
|
}
|
|
123
|
-
|
|
116
|
+
export default RowCardHeaderCell;
|