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
|
@@ -1,27 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
var _displayValuesSettings = _interopRequireDefault(require("../widgets/display-values-settings"));
|
|
18
|
-
var _constants = require("../../constants");
|
|
19
|
-
var _intl = _interopRequireDefault(require("../../intl"));
|
|
20
|
-
var _selectLineType = _interopRequireDefault(require("../widgets/select-line-type"));
|
|
21
|
-
var _colorSelector = _interopRequireDefault(require("../../components/chart-color-selector/color-selector"));
|
|
22
|
-
var _colorRules = require("../../constants/color-rules");
|
|
23
|
-
var _utils = require("../../utils");
|
|
24
|
-
var _goalLineSetting = _interopRequireDefault(require("../../components/goal-line-setting"));
|
|
1
|
+
import _CollapsibleSettingLayout from "dtable-ui-component/lib/CollapsibleSettingLayout";
|
|
2
|
+
import _DTableRadioGroup from "dtable-ui-component/lib/DTableRadioGroup";
|
|
3
|
+
import _DTableSwitch from "dtable-ui-component/lib/DTableSwitch";
|
|
4
|
+
import React, { useCallback, useMemo, useState } from 'react';
|
|
5
|
+
import { Label, Input, Row } from 'reactstrap';
|
|
6
|
+
import { CellType } from 'dtable-utils';
|
|
7
|
+
import Divider from '../widgets/divider';
|
|
8
|
+
import MinMaxSetting from '../widgets/min-max-setting';
|
|
9
|
+
import DisplayValuesSettings from '../widgets/display-values-settings';
|
|
10
|
+
import { X_LABEL_POSITIONS, Y_LABEL_POSITIONS, LABEL_POSITION_TYPE_SHOW, SUPPORT_STACK_VALUE_CHART_TYPES, CHART_TYPE, SUPPORT_GOAL_LINE_CHART_TYPES } from '../../constants';
|
|
11
|
+
import intl from '../../intl';
|
|
12
|
+
import SelectLineType from '../widgets/select-line-type';
|
|
13
|
+
import ColorSelector from '../../components/chart-color-selector/color-selector';
|
|
14
|
+
import { SUPPORT_SINGLE_SELECT_THEMES_OPTIONS } from '../../constants/color-rules';
|
|
15
|
+
import { getColumnByKey } from '../../utils';
|
|
16
|
+
import GoalLineSetting from '../../components/goal-line-setting';
|
|
25
17
|
const StyleSettings = _ref => {
|
|
26
18
|
let {
|
|
27
19
|
chart,
|
|
@@ -59,23 +51,24 @@ const StyleSettings = _ref => {
|
|
|
59
51
|
goal_label
|
|
60
52
|
} = style_config || {};
|
|
61
53
|
const table = tables.find(table => table._id === table_id);
|
|
62
|
-
const
|
|
63
|
-
const
|
|
64
|
-
const
|
|
65
|
-
const
|
|
66
|
-
const
|
|
54
|
+
const columns = (table === null || table === void 0 ? void 0 : table.columns) || [];
|
|
55
|
+
const column = getColumnByKey(column_groupby_column_key, columns);
|
|
56
|
+
const isGroupBySingleSelectColumn = (column === null || column === void 0 ? void 0 : column.type) === CellType.SINGLE_SELECT;
|
|
57
|
+
const defaultColorTheme = SUPPORT_SINGLE_SELECT_THEMES_OPTIONS.DEFAULT;
|
|
58
|
+
const [currYaxisTitle, setCurrYaxisTitle] = useState(title_name || '');
|
|
59
|
+
const xAxisLabelOptions = useMemo(() => {
|
|
67
60
|
if (xLabel === 'Vertical_axis') {
|
|
68
|
-
return
|
|
61
|
+
return Y_LABEL_POSITIONS;
|
|
69
62
|
}
|
|
70
|
-
return
|
|
63
|
+
return X_LABEL_POSITIONS;
|
|
71
64
|
}, [xLabel]);
|
|
72
|
-
const yAxisLabelOptions =
|
|
65
|
+
const yAxisLabelOptions = useMemo(() => {
|
|
73
66
|
if (yLabel === 'Horizontal_axis') {
|
|
74
|
-
return
|
|
67
|
+
return X_LABEL_POSITIONS;
|
|
75
68
|
}
|
|
76
|
-
return
|
|
69
|
+
return Y_LABEL_POSITIONS;
|
|
77
70
|
}, [yLabel]);
|
|
78
|
-
const onAxisLabelShowChange =
|
|
71
|
+
const onAxisLabelShowChange = useCallback(labelKey => {
|
|
79
72
|
const {
|
|
80
73
|
config
|
|
81
74
|
} = chart;
|
|
@@ -84,7 +77,7 @@ const StyleSettings = _ref => {
|
|
|
84
77
|
[labelKey]: !value
|
|
85
78
|
});
|
|
86
79
|
}, [chart, onChange]);
|
|
87
|
-
const onAxisLabelPositionChange =
|
|
80
|
+
const onAxisLabelPositionChange = useCallback((position, positionKey) => {
|
|
88
81
|
const {
|
|
89
82
|
config
|
|
90
83
|
} = chart;
|
|
@@ -94,7 +87,7 @@ const StyleSettings = _ref => {
|
|
|
94
87
|
[positionKey]: position
|
|
95
88
|
});
|
|
96
89
|
}, [chart, onChange]);
|
|
97
|
-
const onYAxisAutoRangeChange =
|
|
90
|
+
const onYAxisAutoRangeChange = useCallback(() => {
|
|
98
91
|
const {
|
|
99
92
|
config
|
|
100
93
|
} = chart;
|
|
@@ -105,8 +98,8 @@ const StyleSettings = _ref => {
|
|
|
105
98
|
y_axis_auto_range: !y_axis_auto_range
|
|
106
99
|
});
|
|
107
100
|
}, [chart, onChange]);
|
|
108
|
-
const onYAxisMinChange =
|
|
109
|
-
const newMin =
|
|
101
|
+
const onYAxisMinChange = useCallback(min => {
|
|
102
|
+
const newMin = parseFloat(min);
|
|
110
103
|
if (Number.isNaN(newMin)) return;
|
|
111
104
|
const {
|
|
112
105
|
config
|
|
@@ -119,8 +112,8 @@ const StyleSettings = _ref => {
|
|
|
119
112
|
y_axis_min: newMin
|
|
120
113
|
});
|
|
121
114
|
}, [chart, onChange]);
|
|
122
|
-
const onYAxisMaxChange =
|
|
123
|
-
const newMax =
|
|
115
|
+
const onYAxisMaxChange = useCallback(max => {
|
|
116
|
+
const newMax = parseFloat(max);
|
|
124
117
|
if (Number.isNaN(newMax)) return;
|
|
125
118
|
const {
|
|
126
119
|
config
|
|
@@ -133,10 +126,10 @@ const StyleSettings = _ref => {
|
|
|
133
126
|
y_axis_max: newMax
|
|
134
127
|
});
|
|
135
128
|
}, [chart, onChange]);
|
|
136
|
-
const onDisplayValueChange =
|
|
129
|
+
const onDisplayValueChange = useCallback(update => {
|
|
137
130
|
onChange(update);
|
|
138
131
|
}, [onChange]);
|
|
139
|
-
const onDisplayBlockChange =
|
|
132
|
+
const onDisplayBlockChange = useCallback(value => {
|
|
140
133
|
const {
|
|
141
134
|
config
|
|
142
135
|
} = chart;
|
|
@@ -148,13 +141,13 @@ const StyleSettings = _ref => {
|
|
|
148
141
|
};
|
|
149
142
|
onChange(update);
|
|
150
143
|
}, [chart, onChange]);
|
|
151
|
-
const onChartColorChange =
|
|
144
|
+
const onChartColorChange = useCallback(value => {
|
|
152
145
|
const update = {
|
|
153
146
|
'color_theme': value
|
|
154
147
|
};
|
|
155
148
|
onChange(update);
|
|
156
149
|
}, [onChange]);
|
|
157
|
-
const onKeyDown =
|
|
150
|
+
const onKeyDown = useCallback(event => {
|
|
158
151
|
if (event.key === 'Enter') {
|
|
159
152
|
event.preventDefault();
|
|
160
153
|
event.target.blur();
|
|
@@ -162,45 +155,45 @@ const StyleSettings = _ref => {
|
|
|
162
155
|
}, []);
|
|
163
156
|
const xAxisLabelPosition = x_axis_label_position || xAxisLabelOptions[0];
|
|
164
157
|
const yAxisLabelPosition = y_axis_label_position || yAxisLabelOptions[0];
|
|
165
|
-
const isLineChart = [
|
|
158
|
+
const isLineChart = [CHART_TYPE.LINE, CHART_TYPE.LINE_GROUP, CHART_TYPE.AREA, CHART_TYPE.AREA_GROUP].includes(type);
|
|
166
159
|
const getLabelOptionsDisplay = options => {
|
|
167
160
|
return options.reduce((optionDisplayMap, position) => {
|
|
168
161
|
return {
|
|
169
162
|
...optionDisplayMap,
|
|
170
|
-
[position]:
|
|
163
|
+
[position]: intl.get(LABEL_POSITION_TYPE_SHOW[position])
|
|
171
164
|
};
|
|
172
165
|
}, {});
|
|
173
166
|
};
|
|
174
|
-
return /*#__PURE__*/
|
|
167
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, isLineChart && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectLineType, {
|
|
175
168
|
selectedLineType: line_type,
|
|
176
169
|
onChange: onChange
|
|
177
|
-
}), /*#__PURE__*/
|
|
178
|
-
title:
|
|
179
|
-
children: /*#__PURE__*/
|
|
170
|
+
}), /*#__PURE__*/React.createElement(Divider, null)), /*#__PURE__*/React.createElement(_CollapsibleSettingLayout, {
|
|
171
|
+
title: intl.get(xLabel),
|
|
172
|
+
children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
180
173
|
key: "x_axis_show_label",
|
|
181
174
|
checked: x_axis_show_label || false,
|
|
182
|
-
placeholder:
|
|
175
|
+
placeholder: intl.get('Display_title'),
|
|
183
176
|
onChange: () => onAxisLabelShowChange('x_axis_show_label')
|
|
184
|
-
}), x_axis_show_label && /*#__PURE__*/
|
|
177
|
+
}), x_axis_show_label && /*#__PURE__*/React.createElement(Row, {
|
|
185
178
|
className: "mt-3 ml-0 mr-0 settings-text-horizontal-align sea-chart-select-group"
|
|
186
|
-
}, /*#__PURE__*/
|
|
179
|
+
}, /*#__PURE__*/React.createElement(Label, null, intl.get('Alignment')), /*#__PURE__*/React.createElement(_DTableRadioGroup, {
|
|
187
180
|
activeOption: xAxisLabelPosition,
|
|
188
181
|
options: xAxisLabelOptions,
|
|
189
182
|
optionsDisplay: getLabelOptionsDisplay(xAxisLabelOptions),
|
|
190
183
|
onSelectChanged: position => onAxisLabelPositionChange(position, 'x_axis_label_position')
|
|
191
184
|
})))
|
|
192
|
-
}), /*#__PURE__*/
|
|
193
|
-
title:
|
|
194
|
-
children: /*#__PURE__*/
|
|
185
|
+
}), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(_CollapsibleSettingLayout, {
|
|
186
|
+
title: intl.get(yLabel),
|
|
187
|
+
children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
195
188
|
key: "y_axis_show_label",
|
|
196
189
|
checked: y_axis_show_label || false,
|
|
197
|
-
placeholder:
|
|
190
|
+
placeholder: intl.get('Display_title'),
|
|
198
191
|
onChange: () => onAxisLabelShowChange('y_axis_show_label')
|
|
199
|
-
}), y_axis_show_label && [
|
|
192
|
+
}), y_axis_show_label && [CHART_TYPE.BAR_STACK].includes(type) && /*#__PURE__*/React.createElement("div", {
|
|
200
193
|
className: "mt-3"
|
|
201
|
-
}, /*#__PURE__*/
|
|
194
|
+
}, /*#__PURE__*/React.createElement(Label, {
|
|
202
195
|
for: "y-axis-custom-title-input"
|
|
203
|
-
},
|
|
196
|
+
}, intl.get('Custom_title')), /*#__PURE__*/React.createElement(Input, {
|
|
204
197
|
id: "y-axis-custom-title-input",
|
|
205
198
|
type: "text",
|
|
206
199
|
value: currYaxisTitle,
|
|
@@ -211,47 +204,47 @@ const StyleSettings = _ref => {
|
|
|
211
204
|
},
|
|
212
205
|
onChange: event => setCurrYaxisTitle(event.target.value),
|
|
213
206
|
onKeyDown: onKeyDown
|
|
214
|
-
})), y_axis_show_label && /*#__PURE__*/
|
|
207
|
+
})), y_axis_show_label && /*#__PURE__*/React.createElement(Row, {
|
|
215
208
|
className: "mt-3 ml-0 mr-0 settings-text-horizontal-align sea-chart-select-group"
|
|
216
|
-
}, /*#__PURE__*/
|
|
209
|
+
}, /*#__PURE__*/React.createElement(Label, null, intl.get('Alignment')), /*#__PURE__*/React.createElement(_DTableRadioGroup, {
|
|
217
210
|
activeOption: yAxisLabelPosition,
|
|
218
211
|
options: yAxisLabelOptions,
|
|
219
212
|
optionsDisplay: getLabelOptionsDisplay(yAxisLabelOptions),
|
|
220
213
|
onSelectChanged: position => onAxisLabelPositionChange(position, 'y_axis_label_position')
|
|
221
|
-
})), ![
|
|
214
|
+
})), ![CHART_TYPE.BAR_CUSTOM].includes(type) && /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
222
215
|
key: "y_axis_auto_range",
|
|
223
216
|
switchClassName: "mt-3",
|
|
224
217
|
checked: y_axis_auto_range,
|
|
225
|
-
placeholder:
|
|
218
|
+
placeholder: intl.get('Auto_range'),
|
|
226
219
|
onChange: onYAxisAutoRangeChange
|
|
227
|
-
}), !y_axis_auto_range && /*#__PURE__*/
|
|
220
|
+
}), !y_axis_auto_range && /*#__PURE__*/React.createElement("div", {
|
|
228
221
|
className: "mt-3"
|
|
229
|
-
}, /*#__PURE__*/
|
|
222
|
+
}, /*#__PURE__*/React.createElement(MinMaxSetting, {
|
|
230
223
|
min: y_axis_min,
|
|
231
224
|
max: y_axis_max,
|
|
232
225
|
onMinChange: onYAxisMinChange,
|
|
233
226
|
onMaxChange: onYAxisMaxChange
|
|
234
227
|
})))
|
|
235
|
-
}), isGroupBySingleSelectColumn && /*#__PURE__*/
|
|
228
|
+
}), isGroupBySingleSelectColumn && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(ColorSelector, {
|
|
236
229
|
colorTheme: color_theme || defaultColorTheme,
|
|
237
230
|
onChange: onChartColorChange
|
|
238
|
-
})), /*#__PURE__*/
|
|
231
|
+
})), /*#__PURE__*/React.createElement(Divider, null), SUPPORT_GOAL_LINE_CHART_TYPES.includes(type) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GoalLineSetting, {
|
|
239
232
|
displayGoalLine: display_goal_line,
|
|
240
233
|
goalLabel: goal_label,
|
|
241
234
|
goalValue: goal_value,
|
|
242
235
|
onChange: onStyleChange
|
|
243
|
-
}), /*#__PURE__*/
|
|
236
|
+
}), /*#__PURE__*/React.createElement(Divider, null)), ![CHART_TYPE.BAR_CUSTOM].includes(type) && /*#__PURE__*/React.createElement(DisplayValuesSettings, {
|
|
244
237
|
isShowValueKey: "y_axis_show_value",
|
|
245
238
|
isShowValue: y_axis_show_value,
|
|
246
239
|
fontSizeKey: "label_font_size",
|
|
247
240
|
fontSize: label_font_size,
|
|
248
241
|
onChange: onDisplayValueChange
|
|
249
|
-
}),
|
|
242
|
+
}), SUPPORT_STACK_VALUE_CHART_TYPES.includes(type) && /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
250
243
|
switchClassName: "display-value-settings",
|
|
251
244
|
checked: display_each_block_data,
|
|
252
245
|
disabled: false,
|
|
253
|
-
placeholder:
|
|
246
|
+
placeholder: intl.get('Display_value_of_each_block'),
|
|
254
247
|
onChange: onDisplayBlockChange
|
|
255
248
|
}));
|
|
256
249
|
};
|
|
257
|
-
|
|
250
|
+
export default StyleSettings;
|
|
@@ -1,22 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var _intl = _interopRequireDefault(require("../../intl"));
|
|
13
|
-
var _commonDataSettings = _interopRequireDefault(require("../widgets/common-data-settings"));
|
|
14
|
-
var _divider = _interopRequireDefault(require("../widgets/divider"));
|
|
15
|
-
var _groupBy = _interopRequireDefault(require("../widgets/group-by"));
|
|
16
|
-
var _basicSummary = _interopRequireDefault(require("../widgets/basic-summary"));
|
|
17
|
-
var _dataSort = _interopRequireDefault(require("../widgets/data-sort"));
|
|
18
|
-
var _columnUtils = require("../../utils/column-utils");
|
|
19
|
-
var _constants = require("../../constants");
|
|
1
|
+
import _DTableSwitch from "dtable-ui-component/lib/DTableSwitch";
|
|
2
|
+
import React, { useCallback } from 'react';
|
|
3
|
+
import { CellType, DATE_COLUMN_OPTIONS } from 'dtable-utils';
|
|
4
|
+
import intl from '../../intl';
|
|
5
|
+
import CommonDataSettings from '../widgets/common-data-settings';
|
|
6
|
+
import Divider from '../widgets/divider';
|
|
7
|
+
import GroupBy from '../widgets/group-by';
|
|
8
|
+
import BasicSummary from '../widgets/basic-summary';
|
|
9
|
+
import DataSort from '../widgets/data-sort';
|
|
10
|
+
import { isDateFormulaColumn } from '../../utils/column-utils';
|
|
11
|
+
import { CHART_SUMMARY_TYPE, SUPPORT_DATA_SORT_CHART_TYPES, CHART_SUMMARY_TYPES, GEOLOCATION_FORMAT_CITY, GEOLOCATION_FORMAT_MAP, CHART_TYPE } from '../../constants';
|
|
20
12
|
const DataSettings = _ref => {
|
|
21
13
|
let {
|
|
22
14
|
chart,
|
|
@@ -26,7 +18,7 @@ const DataSettings = _ref => {
|
|
|
26
18
|
yLabel = 'Y_axis',
|
|
27
19
|
onChange
|
|
28
20
|
} = _ref;
|
|
29
|
-
const onXAxisColumnChange =
|
|
21
|
+
const onXAxisColumnChange = useCallback(column => {
|
|
30
22
|
const {
|
|
31
23
|
config
|
|
32
24
|
} = chart;
|
|
@@ -46,18 +38,18 @@ const DataSettings = _ref => {
|
|
|
46
38
|
update['x_axis_date_granularity'] = null;
|
|
47
39
|
update['x_axis_geolocation_granularity'] = null;
|
|
48
40
|
} else {
|
|
49
|
-
if (
|
|
50
|
-
update['x_axis_date_granularity'] =
|
|
41
|
+
if (DATE_COLUMN_OPTIONS.includes(type) || isDateFormulaColumn(column)) {
|
|
42
|
+
update['x_axis_date_granularity'] = CHART_SUMMARY_TYPE.MONTH;
|
|
51
43
|
update['x_axis_geolocation_granularity'] = null;
|
|
52
|
-
} else if (type ===
|
|
44
|
+
} else if (type === CellType.GEOLOCATION) {
|
|
53
45
|
const {
|
|
54
46
|
geo_format
|
|
55
47
|
} = column.data || {};
|
|
56
|
-
if (geo_format ===
|
|
57
|
-
update['x_axis_geolocation_granularity'] =
|
|
58
|
-
} else if (geo_format ===
|
|
59
|
-
update['x_axis_geolocation_granularity'] =
|
|
60
|
-
} else if (geo_format ===
|
|
48
|
+
if (geo_format === GEOLOCATION_FORMAT_MAP.PROVINCE) {
|
|
49
|
+
update['x_axis_geolocation_granularity'] = GEOLOCATION_FORMAT_MAP.PROVINCE;
|
|
50
|
+
} else if (geo_format === GEOLOCATION_FORMAT_MAP.PROVINCE_CITY) {
|
|
51
|
+
update['x_axis_geolocation_granularity'] = GEOLOCATION_FORMAT_CITY;
|
|
52
|
+
} else if (geo_format === GEOLOCATION_FORMAT_MAP.GEOLOCATION || !geo_format) {
|
|
61
53
|
update['x_axis_geolocation_granularity'] = 'district';
|
|
62
54
|
} else {
|
|
63
55
|
update['x_axis_geolocation_granularity'] = null;
|
|
@@ -67,7 +59,7 @@ const DataSettings = _ref => {
|
|
|
67
59
|
}
|
|
68
60
|
onChange && onChange(update);
|
|
69
61
|
}, [chart, onChange]);
|
|
70
|
-
const onGroupbyDateGranularityChange =
|
|
62
|
+
const onGroupbyDateGranularityChange = useCallback(option => {
|
|
71
63
|
const {
|
|
72
64
|
config
|
|
73
65
|
} = chart;
|
|
@@ -80,7 +72,7 @@ const DataSettings = _ref => {
|
|
|
80
72
|
x_axis_date_granularity: value
|
|
81
73
|
});
|
|
82
74
|
}, [chart, onChange]);
|
|
83
|
-
const onGroupbyGeolocationGranularityChange =
|
|
75
|
+
const onGroupbyGeolocationGranularityChange = useCallback(option => {
|
|
84
76
|
const {
|
|
85
77
|
config
|
|
86
78
|
} = chart;
|
|
@@ -93,7 +85,7 @@ const DataSettings = _ref => {
|
|
|
93
85
|
x_axis_geolocation_granularity: value
|
|
94
86
|
});
|
|
95
87
|
}, [chart, onChange]);
|
|
96
|
-
const onIncludeEmptyChange =
|
|
88
|
+
const onIncludeEmptyChange = useCallback(event => {
|
|
97
89
|
const {
|
|
98
90
|
config
|
|
99
91
|
} = chart;
|
|
@@ -104,14 +96,14 @@ const DataSettings = _ref => {
|
|
|
104
96
|
x_axis_include_empty_cells: !x_axis_include_empty_cells
|
|
105
97
|
});
|
|
106
98
|
}, [chart, onChange]);
|
|
107
|
-
const renderDataSort =
|
|
99
|
+
const renderDataSort = useCallback(() => {
|
|
108
100
|
const {
|
|
109
101
|
config
|
|
110
102
|
} = chart;
|
|
111
|
-
if (!
|
|
112
|
-
return /*#__PURE__*/
|
|
103
|
+
if (!SUPPORT_DATA_SORT_CHART_TYPES.includes(config.type)) return null;
|
|
104
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
|
|
113
105
|
className: "mt-4"
|
|
114
|
-
}), /*#__PURE__*/
|
|
106
|
+
}), /*#__PURE__*/React.createElement(DataSort, {
|
|
115
107
|
chart: chart,
|
|
116
108
|
onChange: onChange
|
|
117
109
|
}));
|
|
@@ -127,15 +119,15 @@ const DataSettings = _ref => {
|
|
|
127
119
|
x_axis_geolocation_granularity,
|
|
128
120
|
x_axis_include_empty_cells
|
|
129
121
|
} = config;
|
|
130
|
-
return /*#__PURE__*/
|
|
122
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CommonDataSettings, {
|
|
131
123
|
dataSources: dataSources,
|
|
132
124
|
chart: chart,
|
|
133
125
|
tables: tables,
|
|
134
126
|
onChange: onChange
|
|
135
|
-
}), /*#__PURE__*/
|
|
127
|
+
}), /*#__PURE__*/React.createElement(GroupBy, {
|
|
136
128
|
tables: tables,
|
|
137
129
|
className: "selected-x-axis",
|
|
138
|
-
label:
|
|
130
|
+
label: intl.get(xLabel),
|
|
139
131
|
selectedTableId: table_id,
|
|
140
132
|
selectedColumnKey: x_axis_column_key,
|
|
141
133
|
selectedDateGranularity: x_axis_date_granularity,
|
|
@@ -143,25 +135,25 @@ const DataSettings = _ref => {
|
|
|
143
135
|
onGroupByChange: onXAxisColumnChange,
|
|
144
136
|
onGroupbyDateGranularityChange: onGroupbyDateGranularityChange,
|
|
145
137
|
onGroupbyGeolocationGranularityChange: onGroupbyGeolocationGranularityChange
|
|
146
|
-
}), /*#__PURE__*/
|
|
138
|
+
}), /*#__PURE__*/React.createElement(_DTableSwitch, {
|
|
147
139
|
checked: x_axis_include_empty_cells,
|
|
148
|
-
placeholder:
|
|
140
|
+
placeholder: intl.get('Include_empty'),
|
|
149
141
|
onChange: onIncludeEmptyChange
|
|
150
|
-
}), /*#__PURE__*/
|
|
142
|
+
}), /*#__PURE__*/React.createElement(Divider, {
|
|
151
143
|
className: "mt-4"
|
|
152
|
-
}), /*#__PURE__*/
|
|
144
|
+
}), /*#__PURE__*/React.createElement(BasicSummary, {
|
|
153
145
|
className: "selected-y-axis",
|
|
154
|
-
label:
|
|
155
|
-
showSummaryTypes: type ===
|
|
146
|
+
label: intl.get(yLabel),
|
|
147
|
+
showSummaryTypes: type === CHART_TYPE.BAR_CUSTOM ? false : true,
|
|
156
148
|
summaryTypeKey: 'y_axis_summary_type',
|
|
157
149
|
summaryMethodKey: 'y_axis_summary_method',
|
|
158
150
|
summaryColumnKey: 'y_axis_summary_column_key',
|
|
159
151
|
chart: chart,
|
|
160
152
|
selectedTableId: table_id,
|
|
161
153
|
tables: tables,
|
|
162
|
-
supportColumnTypes: [
|
|
163
|
-
summaryTypeOptions:
|
|
154
|
+
supportColumnTypes: [CellType.NUMBER],
|
|
155
|
+
summaryTypeOptions: CHART_SUMMARY_TYPES,
|
|
164
156
|
onChange: onChange
|
|
165
157
|
}), renderDataSort());
|
|
166
158
|
};
|
|
167
|
-
|
|
159
|
+
export default DataSettings;
|
|
@@ -1,20 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
Object.defineProperty(exports, "BarDataSettings", {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
-
return _dataSettings.default;
|
|
11
|
-
}
|
|
12
|
-
});
|
|
13
|
-
Object.defineProperty(exports, "BarStyleSettings", {
|
|
14
|
-
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
-
return _styleSettings.default;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
var _dataSettings = _interopRequireDefault(require("./data-settings"));
|
|
20
|
-
var _styleSettings = _interopRequireDefault(require("./style-settings"));
|
|
1
|
+
import BarDataSettings from './data-settings';
|
|
2
|
+
import BarStyleSettings from './style-settings';
|
|
3
|
+
export { BarDataSettings, BarStyleSettings };
|