dtable-statistic 5.2.4 → 5.2.6
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/es/assets/css/dialog.css +1 -1
- package/es/components/dialog/color-theme-dialog.js +2 -2
- package/es/components/dialog/enlarged-chart-dialog.js +3 -3
- package/es/components/dropdown-menu/statistic-dropdown-menu.js +1 -1
- package/es/components/icon.js +2 -2
- package/es/desktop-dashboard.js +2 -2
- package/es/mobile-dashboard.js +5 -5
- package/es/stat-list/chart-preview.js +5 -5
- package/es/tabs/index.js +7 -7
- package/es/tabs/tab.js +9 -5
- package/es/utils/export-table-utils.js +1 -1
- package/package.json +4 -4
package/es/assets/css/dialog.css
CHANGED
|
@@ -38,9 +38,9 @@ class ColorThemeDialog extends _react.default.Component {
|
|
|
38
38
|
}, colors.map((color, index) => {
|
|
39
39
|
return /*#__PURE__*/_react.default.createElement("span", {
|
|
40
40
|
className: "statistic-color-block",
|
|
41
|
-
key:
|
|
41
|
+
key: `color-theme-${index}`,
|
|
42
42
|
style: {
|
|
43
|
-
background:
|
|
43
|
+
background: `${color}`
|
|
44
44
|
}
|
|
45
45
|
});
|
|
46
46
|
}));
|
|
@@ -53,12 +53,12 @@ class EnlargeChartDialog extends _react.Component {
|
|
|
53
53
|
if (originalElement) {
|
|
54
54
|
const containerWidth = originalElement.scrollWidth + 15 * 2;
|
|
55
55
|
const containerHeight = originalElement.scrollHeight + 15 * 2;
|
|
56
|
-
exportContainer.setAttribute('style',
|
|
56
|
+
exportContainer.setAttribute('style', `width: ${containerWidth}px; height: ${containerHeight}px;`);
|
|
57
57
|
}
|
|
58
58
|
document.body.appendChild(exportContainer);
|
|
59
59
|
_reactDom.default.render(this.renderStatisticView(), exportContainer);
|
|
60
60
|
setTimeout(() => {
|
|
61
|
-
const ele = document.querySelector(
|
|
61
|
+
const ele = document.querySelector(`#${exportContainerID} .statistic-chart-container`);
|
|
62
62
|
if (!ele) return;
|
|
63
63
|
(0, _html2canvas.default)(ele, {
|
|
64
64
|
windowWidth: ele.scrollWidth,
|
|
@@ -66,7 +66,7 @@ class EnlargeChartDialog extends _react.Component {
|
|
|
66
66
|
}).then(canvas => {
|
|
67
67
|
let eleA = document.createElement('a');
|
|
68
68
|
eleA.href = canvas.toDataURL('image/png');
|
|
69
|
-
eleA.download =
|
|
69
|
+
eleA.download = `${this.props.statItem.style_config.title.text || 'image'}.png`;
|
|
70
70
|
eleA.click();
|
|
71
71
|
document.body.removeChild(exportContainer);
|
|
72
72
|
});
|
|
@@ -152,7 +152,7 @@ class StatisticDropdownMenu extends _react.default.Component {
|
|
|
152
152
|
name
|
|
153
153
|
} = view;
|
|
154
154
|
return /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
|
|
155
|
-
key:
|
|
155
|
+
key: `move-to-statistic-view-${_id}`,
|
|
156
156
|
onClick: this.onMoveChartToView.bind(this, _id)
|
|
157
157
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
158
158
|
className: "statistic-view-name text-truncate",
|
package/es/components/icon.js
CHANGED
|
@@ -11,11 +11,11 @@ function Icon(props) {
|
|
|
11
11
|
className,
|
|
12
12
|
symbol
|
|
13
13
|
} = props;
|
|
14
|
-
const iconClass =
|
|
14
|
+
const iconClass = `multicolor-icon multicolor-icon-${symbol} ${className || ''}`;
|
|
15
15
|
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
16
16
|
className: iconClass
|
|
17
17
|
}, /*#__PURE__*/_react.default.createElement("use", {
|
|
18
|
-
xlinkHref:
|
|
18
|
+
xlinkHref: `#${symbol}`
|
|
19
19
|
}));
|
|
20
20
|
}
|
|
21
21
|
var _default = exports.default = Icon;
|
package/es/desktop-dashboard.js
CHANGED
|
@@ -206,7 +206,7 @@ class DesktopDashboard extends _react.Component {
|
|
|
206
206
|
id: "btn-statistic-full-screen",
|
|
207
207
|
onClick: this.onToggleFullScreen
|
|
208
208
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
209
|
-
className:
|
|
209
|
+
className: `op-item-icon dtable-font dtable-icon-full-screen ${isFullScreen ? 'full-screen-active' : ''}`
|
|
210
210
|
}), /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
|
|
211
211
|
placement: "bottom",
|
|
212
212
|
target: "btn-statistic-full-screen"
|
|
@@ -215,7 +215,7 @@ class DesktopDashboard extends _react.Component {
|
|
|
215
215
|
id: "btn-statistic-theme-setting",
|
|
216
216
|
onClick: this.toggleThemeMode
|
|
217
217
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
218
|
-
className:
|
|
218
|
+
className: `op-item-icon dtable-font ${theme === _constants.THEME_NAME_MAP.DARK ? 'dtable-icon-day-mode' : 'dtable-icon-night-mode'}`
|
|
219
219
|
}), /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
|
|
220
220
|
placement: "bottom",
|
|
221
221
|
target: "btn-statistic-theme-setting"
|
package/es/mobile-dashboard.js
CHANGED
|
@@ -46,9 +46,9 @@ class MobileDashboard extends _react.Component {
|
|
|
46
46
|
stat_items: statItems
|
|
47
47
|
} = statistic || {};
|
|
48
48
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
49
|
-
className:
|
|
49
|
+
className: `${_mobileDashboardModule.default['mobile-statistic-container']} statistic-panel mobile-statistic-panel statistic-light`
|
|
50
50
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
51
|
-
className:
|
|
51
|
+
className: `${_mobileDashboardModule.default['mobile-statistic-header']}`
|
|
52
52
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
53
53
|
className: _mobileDashboardModule.default['mobile-statistic-title']
|
|
54
54
|
}, /*#__PURE__*/_react.default.createElement("img", {
|
|
@@ -69,7 +69,7 @@ class MobileDashboard extends _react.Component {
|
|
|
69
69
|
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
70
70
|
className: _mobileDashboardModule.default['mobile-statistic-tool-container']
|
|
71
71
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
72
|
-
className:
|
|
72
|
+
className: `close ${_mobileDashboardModule.default['mobile-statistic-header-button']}`,
|
|
73
73
|
onClick: this.onCloseDashboard
|
|
74
74
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
75
75
|
className: 'dtable-font dtable-icon-x'
|
|
@@ -85,10 +85,10 @@ class MobileDashboard extends _react.Component {
|
|
|
85
85
|
const name = (style_config === null || style_config === void 0 ? void 0 : (_style_config$title = style_config.title) === null || _style_config$title === void 0 ? void 0 : (_style_config$title$t = _style_config$title.text) === null || _style_config$title$t === void 0 ? void 0 : _style_config$title$t.name) || '';
|
|
86
86
|
const showStatName = !(type === _seaChart.CHART_TYPE.BASIC_NUMBER_CARD || type === _seaChart.CHART_TYPE.DASHBOARD);
|
|
87
87
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
88
|
-
key:
|
|
88
|
+
key: `mobile-statistic-chart-${_id}`,
|
|
89
89
|
className: _mobileDashboardModule.default['mobile-statistic-chart-wrapper']
|
|
90
90
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
91
|
-
className:
|
|
91
|
+
className: `${_mobileDashboardModule.default['mobile-statistic-chart-header']} text-truncate`
|
|
92
92
|
}, showStatName && name), /*#__PURE__*/_react.default.createElement("div", {
|
|
93
93
|
className: _mobileDashboardModule.default['mobile-statistic-chart-container']
|
|
94
94
|
}, /*#__PURE__*/_react.default.createElement(_statView.default, {
|
|
@@ -34,16 +34,16 @@ class ChartPreview extends _react.Component {
|
|
|
34
34
|
const {
|
|
35
35
|
_id: id
|
|
36
36
|
} = statItem.config;
|
|
37
|
-
const originalElement = document.querySelector(
|
|
37
|
+
const originalElement = document.querySelector(`#stat-item-${id} .statistic-chart-container > div`);
|
|
38
38
|
if (originalElement) {
|
|
39
39
|
const containerWidth = originalElement.scrollWidth + 15 * 2;
|
|
40
40
|
const containerHeight = originalElement.scrollHeight + 15 * 2;
|
|
41
|
-
exportContainer.setAttribute('style',
|
|
41
|
+
exportContainer.setAttribute('style', `width: ${containerWidth}px; height: ${containerHeight}px;`);
|
|
42
42
|
}
|
|
43
43
|
document.body.appendChild(exportContainer);
|
|
44
44
|
_reactDom.default.render(this.renderChart(statItem), exportContainer);
|
|
45
45
|
setTimeout(() => {
|
|
46
|
-
const ele = document.querySelector(
|
|
46
|
+
const ele = document.querySelector(`#${exportContainerID} .statistic-chart-container`);
|
|
47
47
|
if (!ele) return;
|
|
48
48
|
(0, _html2canvas.default)(ele, {
|
|
49
49
|
windowWidth: ele.scrollWidth,
|
|
@@ -51,7 +51,7 @@ class ChartPreview extends _react.Component {
|
|
|
51
51
|
}).then(canvas => {
|
|
52
52
|
let eleA = document.createElement('a');
|
|
53
53
|
eleA.href = canvas.toDataURL('image/png');
|
|
54
|
-
eleA.download =
|
|
54
|
+
eleA.download = `${statItem.style_config.title.text || 'image'}.png`;
|
|
55
55
|
eleA.click();
|
|
56
56
|
document.body.removeChild(exportContainer);
|
|
57
57
|
});
|
|
@@ -134,7 +134,7 @@ class ChartPreview extends _react.Component {
|
|
|
134
134
|
onNewTableDialogToggle: this.onNewTableDialogToggle,
|
|
135
135
|
onUpdateTableDialogToggle: this.onUpdateTableDialogToggle
|
|
136
136
|
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
137
|
-
id:
|
|
137
|
+
id: `stat-item-${statItemId}`,
|
|
138
138
|
className: "statistic-chart-preview-container"
|
|
139
139
|
}, this.renderChart(statItem)), /*#__PURE__*/_react.default.createElement("div", {
|
|
140
140
|
className: "statistic-chart-preview-container-resize"
|
package/es/tabs/index.js
CHANGED
|
@@ -184,7 +184,7 @@ class DashboardTabs extends _react.Component {
|
|
|
184
184
|
const canDelete = statistics.length > 1;
|
|
185
185
|
return statistics.map((item, index) => {
|
|
186
186
|
return /*#__PURE__*/_react.default.createElement(_tab.default, {
|
|
187
|
-
key:
|
|
187
|
+
key: `statistic-view-${index}`,
|
|
188
188
|
item: item,
|
|
189
189
|
theme: theme,
|
|
190
190
|
canDelete: canDelete,
|
|
@@ -235,27 +235,27 @@ class DashboardTabs extends _react.Component {
|
|
|
235
235
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
236
236
|
className: _statisticTabsModule.default['tabs-container']
|
|
237
237
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
238
|
-
className:
|
|
238
|
+
className: `${_statisticTabsModule.default['views-tabs-scroll']} d-flex pr-1`,
|
|
239
239
|
ref: ref => this.viewsTabsScroll = ref,
|
|
240
240
|
onScroll: this.onViewsScroll
|
|
241
241
|
}, this.renderTabs()), (canScrollPrev || canScrollNext) && !isMobile && /*#__PURE__*/_react.default.createElement("div", {
|
|
242
242
|
className: _statisticTabsModule.default['views-scroll-control']
|
|
243
243
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
244
|
-
className:
|
|
244
|
+
className: `${_statisticTabsModule.default['scroll-control-btn']} ${_statisticTabsModule.default['scroll-prev']} ${canScrollPrev && _statisticTabsModule.default['scroll-active']}`,
|
|
245
245
|
onClick: this.onScrollWithControl.bind(this, SCROLL_TYPE.PREV)
|
|
246
246
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
247
|
-
className:
|
|
247
|
+
className: `dtable-font dtable-icon-left-slide ${_statisticTabsModule.default['btn-scroll-icon']}`
|
|
248
248
|
})), /*#__PURE__*/_react.default.createElement("span", {
|
|
249
|
-
className:
|
|
249
|
+
className: `${_statisticTabsModule.default['scroll-control-btn']} ${_statisticTabsModule.default['scroll-next']} ${canScrollNext && _statisticTabsModule.default['scroll-active']}`,
|
|
250
250
|
onClick: this.onScrollWithControl.bind(this, SCROLL_TYPE.NEXT)
|
|
251
251
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
252
|
-
className:
|
|
252
|
+
className: `dtable-font dtable-icon-right-slide ${_statisticTabsModule.default['btn-scroll-icon']}`
|
|
253
253
|
}))), !isMobile && /*#__PURE__*/_react.default.createElement("div", {
|
|
254
254
|
className: _statisticTabsModule.default['btn-add-view'],
|
|
255
255
|
key: 'btn-add-view',
|
|
256
256
|
onClick: this.onNewViewToggle
|
|
257
257
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
258
|
-
className:
|
|
258
|
+
className: `${_statisticTabsModule.default['add-map-view-icon']} dtable-font dtable-icon-add-table`
|
|
259
259
|
})), isShowNewViewDialog && /*#__PURE__*/_react.default.createElement(_newViewDialog.default, {
|
|
260
260
|
onNewViewConfirm: this.onAddDashboard,
|
|
261
261
|
onNewViewCancel: this.onNewViewCancel
|
package/es/tabs/tab.js
CHANGED
|
@@ -125,21 +125,25 @@ class DashBoardTab extends _react.Component {
|
|
|
125
125
|
onDragOver: this.onDragOver,
|
|
126
126
|
onDragLeave: this.onDragLeave,
|
|
127
127
|
onDrop: this.onDrop,
|
|
128
|
-
className:
|
|
128
|
+
className: `
|
|
129
|
+
${_statisticTabsModule.default['dashboard-tab']}
|
|
130
|
+
${dropRelativePosition === 'before' ? _statisticTabsModule.default['dashboard-tab-can-drop-before'] : ''}
|
|
131
|
+
${dropRelativePosition === 'after' ? _statisticTabsModule.default['dashboard-tab-can-drop-after'] : ''}
|
|
132
|
+
`
|
|
129
133
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
130
134
|
ref: this.props.setViewItem,
|
|
131
135
|
onClick: this.props.onSelectDashboard,
|
|
132
|
-
className:
|
|
136
|
+
className: `${_statisticTabsModule.default['dashboard-tab-content']} ${selected ? _utils.isMobile ? _statisticTabsModule.default['tab-item-active-mobile'] : _statisticTabsModule.default['tab-item-active'] : ''}`
|
|
133
137
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
134
138
|
className: "view-name"
|
|
135
139
|
}, item.name), selected && !_utils.isMobile && /*#__PURE__*/_react.default.createElement("div", {
|
|
136
140
|
onClick: this.onDropdownToggle,
|
|
137
141
|
ref: ref => this.btnViewDropdown = ref,
|
|
138
|
-
className:
|
|
142
|
+
className: `${_statisticTabsModule.default['btn-view-dropdown']}`
|
|
139
143
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
140
|
-
className:
|
|
144
|
+
className: `${_statisticTabsModule.default['icon']} dtable-font dtable-icon-drop-down`
|
|
141
145
|
}), isShowViewDropdown && /*#__PURE__*/_react.default.createElement(_ModalPortal2.default, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
142
|
-
className:
|
|
146
|
+
className: `${theme === _constants.THEME_NAME_MAP.DARK ? 'statistic-tabs-dropdown-dark' : 'statistic-tabs-dropdown-light'} statistic-dropdown-menu dropdown-menu large show`,
|
|
143
147
|
style: {
|
|
144
148
|
...dropdownMenuPosition,
|
|
145
149
|
zIndex: 1500
|
|
@@ -434,7 +434,7 @@ const getTwoDimensionWithSummaryColumns = _ref3 => {
|
|
|
434
434
|
data,
|
|
435
435
|
method
|
|
436
436
|
} = summaryColumn;
|
|
437
|
-
const newColumnName =
|
|
437
|
+
const newColumnName = `${pivotColumnColumnName}-${column_name}`;
|
|
438
438
|
columns.push({
|
|
439
439
|
// just support number column
|
|
440
440
|
type: _dtableUtils.CellType.NUMBER,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "dtable-statistic",
|
|
3
|
-
"version": "5.2.
|
|
3
|
+
"version": "5.2.6",
|
|
4
4
|
"description": "statistics",
|
|
5
5
|
"main": "dist/dtable-statistic.js",
|
|
6
6
|
"author": "seafile",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"react-grid-layout": "^1.2.5",
|
|
19
19
|
"react-intl-universal": "^2.4.8",
|
|
20
20
|
"reactstrap": "8.9.0",
|
|
21
|
-
"sea-chart": "^1.1.
|
|
21
|
+
"sea-chart": "^1.1.49"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"dtable-ui-component": "~5.2.*",
|
|
@@ -52,9 +52,9 @@
|
|
|
52
52
|
"css-minimizer-webpack-plugin": "^3.2.0",
|
|
53
53
|
"dotenv": "^10.0.0",
|
|
54
54
|
"dotenv-expand": "^5.1.0",
|
|
55
|
-
"dtable-store": "
|
|
55
|
+
"dtable-store": "5.2.12",
|
|
56
56
|
"dtable-ui-component": "~5.2.0",
|
|
57
|
-
"dtable-utils": "5.0.
|
|
57
|
+
"dtable-utils": "5.0.10",
|
|
58
58
|
"dtable-web-api": "^5.0.3",
|
|
59
59
|
"eslint": "^8.3.0",
|
|
60
60
|
"eslint-config-react-app": "^7.0.1",
|