dtable-statistic 5.0.10-alpha.4 → 5.0.10-alpha.5
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/components/dialog/chart-edit-dialog.js +8 -1
- package/es/components/dialog/enlarged-chart-dialog.js +1 -3
- package/es/constants/index.js +1 -32
- package/es/dashboard.js +2 -14
- package/es/desktop-dashboard.js +4 -41
- package/es/mobile-dashboard.js +8 -21
- package/es/stat-list/chart-preview.js +4 -4
- package/es/stat-list/index.js +6 -6
- package/es/stat-view/index.js +8 -1
- package/package.json +2 -2
- package/es/components/dialog/statistic-record-dialog/index.css +0 -120
- package/es/components/dialog/statistic-record-dialog/index.js +0 -344
|
@@ -10,6 +10,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
|
|
11
11
|
var _seaChart = require("sea-chart");
|
|
12
12
|
var _reactstrap = require("reactstrap");
|
|
13
|
+
var _constants = require("../../constants");
|
|
13
14
|
class ChartEditDialog extends _react.Component {
|
|
14
15
|
constructor(props) {
|
|
15
16
|
super(props);
|
|
@@ -51,10 +52,12 @@ class ChartEditDialog extends _react.Component {
|
|
|
51
52
|
}
|
|
52
53
|
}
|
|
53
54
|
render() {
|
|
55
|
+
var _window, _window$app, _window$app$state;
|
|
54
56
|
const {
|
|
55
57
|
api,
|
|
56
58
|
colorThemeName,
|
|
57
|
-
theme
|
|
59
|
+
theme,
|
|
60
|
+
eventBus
|
|
58
61
|
} = this.props;
|
|
59
62
|
const {
|
|
60
63
|
chart
|
|
@@ -80,12 +83,16 @@ class ChartEditDialog extends _react.Component {
|
|
|
80
83
|
chart: chart,
|
|
81
84
|
config: window.dtable,
|
|
82
85
|
api: api,
|
|
86
|
+
dtableStoreValue: this.value,
|
|
83
87
|
tables: this.value.tables,
|
|
84
88
|
collaborators: this.value.collaborators,
|
|
89
|
+
departments: ((_window = window) === null || _window === void 0 ? void 0 : (_window$app = _window.app) === null || _window$app === void 0 ? void 0 : (_window$app$state = _window$app.state) === null || _window$app$state === void 0 ? void 0 : _window$app$state.departments) || [],
|
|
85
90
|
dataSources: "view",
|
|
86
91
|
theme: theme,
|
|
87
92
|
chartColorTheme: colorThemeName,
|
|
88
93
|
isCalculateByView: true,
|
|
94
|
+
integratedEventTypes: _constants.CommonEventTypes,
|
|
95
|
+
integratedEventBus: eventBus,
|
|
89
96
|
onChange: this.onSettingChange
|
|
90
97
|
})))));
|
|
91
98
|
}
|
|
@@ -27,7 +27,6 @@ class EnlargeChartDialog extends _react.Component {
|
|
|
27
27
|
colorThemeName,
|
|
28
28
|
statItem,
|
|
29
29
|
getTableById,
|
|
30
|
-
toggleStatisticRecordsDialog,
|
|
31
30
|
api,
|
|
32
31
|
value
|
|
33
32
|
} = this.props;
|
|
@@ -36,8 +35,7 @@ class EnlargeChartDialog extends _react.Component {
|
|
|
36
35
|
statItem,
|
|
37
36
|
api,
|
|
38
37
|
value,
|
|
39
|
-
getTableById
|
|
40
|
-
toggleStatisticRecordsDialog
|
|
38
|
+
getTableById
|
|
41
39
|
};
|
|
42
40
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
43
41
|
className: "view-wrapper",
|
package/es/constants/index.js
CHANGED
|
@@ -12,7 +12,7 @@ Object.defineProperty(exports, "KeyCodes", {
|
|
|
12
12
|
return _keyCodes.default;
|
|
13
13
|
}
|
|
14
14
|
});
|
|
15
|
-
exports.THEME_NAME_MAP = exports.SUMMARY_TYPE = exports.SUMMARY_METHOD_MAP = exports.SUMMARY_METHOD = exports.
|
|
15
|
+
exports.THEME_NAME_MAP = exports.SUMMARY_TYPE = exports.SUMMARY_METHOD_MAP = exports.SUMMARY_METHOD = exports.STATISTICS_COUNT_TYPE = void 0;
|
|
16
16
|
var _keyCodes = _interopRequireDefault(require("./key-codes"));
|
|
17
17
|
var CommonEventTypes = _interopRequireWildcard(require("./event-types"));
|
|
18
18
|
exports.CommonEventTypes = CommonEventTypes;
|
|
@@ -29,37 +29,6 @@ const DASHBOARD_ACTION_TYPE = exports.DASHBOARD_ACTION_TYPE = {
|
|
|
29
29
|
MOVE_CHART_TO_VIEW: 'move_chart_to_view',
|
|
30
30
|
DELETE_CHART: 'delete_chart'
|
|
31
31
|
};
|
|
32
|
-
const STAT_TYPE = exports.STAT_TYPE = {
|
|
33
|
-
MAP: 'map',
|
|
34
|
-
MAP_BUBBLE: 'map_bubble',
|
|
35
|
-
HEAT_MAP: 'heat_map',
|
|
36
|
-
WORLD_MAP: 'world_map',
|
|
37
|
-
WORLD_MAP_BUBBLE: 'world_map_bubble',
|
|
38
|
-
MIRROR: 'mirror',
|
|
39
|
-
BAR: 'chart_bar',
|
|
40
|
-
BAR_GROUP: 'chart_bar_group',
|
|
41
|
-
BAR_STACK: 'chart_bar_stack',
|
|
42
|
-
LINE: 'chart_line',
|
|
43
|
-
GROUP_LINE: 'chart_group_line',
|
|
44
|
-
PIE: 'chart_pie',
|
|
45
|
-
RING: 'chart_ring',
|
|
46
|
-
SCATTER: 'scatter_chart',
|
|
47
|
-
BASIC_NUMBER_CARD: 'basic_number_card',
|
|
48
|
-
HORIZONTAL_BAR: 'horizontal_bar',
|
|
49
|
-
HORIZONTAL_GROUP_BAR: 'horizontal_group_bar',
|
|
50
|
-
STACKED_HORIZONTAL_BAR: 'stacked_horizontal_bar',
|
|
51
|
-
COMBINATION_CHART: 'combination_chart',
|
|
52
|
-
TREND_CHART: 'trend_chart',
|
|
53
|
-
AREA_CHART: 'area_chart',
|
|
54
|
-
AREA_GROUP_CHART: 'area_group_chart',
|
|
55
|
-
COMPARE_BAR: 'compare_bar',
|
|
56
|
-
COMPLETENESS_CHART: 'completeness_chart',
|
|
57
|
-
DASHBOARD: 'dashboard',
|
|
58
|
-
GROUP_COMPLETENESS_CHART: 'group_completeness_chart',
|
|
59
|
-
TREEMAP: 'treemap',
|
|
60
|
-
PIVOT_TABLE: 'pivot_table',
|
|
61
|
-
CUSTOM_BAR: 'custom_bar'
|
|
62
|
-
};
|
|
63
32
|
const SUMMARY_TYPE = exports.SUMMARY_TYPE = {
|
|
64
33
|
COUNT: 'count',
|
|
65
34
|
ADVANCED: 'advanced'
|
package/es/dashboard.js
CHANGED
|
@@ -66,11 +66,6 @@ class DashBoard extends _react.Component {
|
|
|
66
66
|
selectedDashboardIdx
|
|
67
67
|
});
|
|
68
68
|
};
|
|
69
|
-
this.refreshCharts = () => {
|
|
70
|
-
this.setState({
|
|
71
|
-
dtableChangedTime: Date.now()
|
|
72
|
-
});
|
|
73
|
-
};
|
|
74
69
|
this.initDashboard = () => {
|
|
75
70
|
const value = this.value;
|
|
76
71
|
this.dashboardService = new _dashboardService.default({
|
|
@@ -363,8 +358,7 @@ class DashBoard extends _react.Component {
|
|
|
363
358
|
} = this.initDashboard();
|
|
364
359
|
this.state = {
|
|
365
360
|
statistics: _statistics,
|
|
366
|
-
selectedDashboardIdx: _selectedDashboardIdx
|
|
367
|
-
dtableChangedTime: null
|
|
361
|
+
selectedDashboardIdx: _selectedDashboardIdx
|
|
368
362
|
};
|
|
369
363
|
this.isInitDashboard = true;
|
|
370
364
|
this.updatingLocalStatistics = false;
|
|
@@ -377,12 +371,10 @@ class DashBoard extends _react.Component {
|
|
|
377
371
|
} = this.props;
|
|
378
372
|
this.unsubscribeLocalDtableChanged = eventBus.subscribe('local-dtable-changed', this.onLocalDTableChanged);
|
|
379
373
|
this.unsubscribeRemoteDtableChange = eventBus.subscribe('remote-dtable-changed', this.onServerDTableChanged);
|
|
380
|
-
this.unsubscribeRefreshCharts = eventBus.subscribe(_constants.CommonEventTypes.REFRESH_CHARTS, this.refreshCharts);
|
|
381
374
|
}
|
|
382
375
|
componentWillUnmount() {
|
|
383
376
|
this.unsubscribeLocalDtableChanged();
|
|
384
377
|
this.unsubscribeRemoteDtableChange();
|
|
385
|
-
this.unsubscribeRefreshCharts();
|
|
386
378
|
}
|
|
387
379
|
render() {
|
|
388
380
|
const {
|
|
@@ -390,22 +382,19 @@ class DashBoard extends _react.Component {
|
|
|
390
382
|
} = this.props;
|
|
391
383
|
const {
|
|
392
384
|
statistics,
|
|
393
|
-
selectedDashboardIdx
|
|
394
|
-
dtableChangedTime
|
|
385
|
+
selectedDashboardIdx
|
|
395
386
|
} = this.state;
|
|
396
387
|
const isTableReadOnly = this.isTableReadOnly();
|
|
397
388
|
const colorThemeName = this.dashboardService.getColorThemeName();
|
|
398
389
|
return _utils.isMobile ? /*#__PURE__*/_react.default.createElement(_mobileDashboard.default, {
|
|
399
390
|
isTableReadOnly: isTableReadOnly,
|
|
400
391
|
colorThemeName: colorThemeName,
|
|
401
|
-
dtableChangedTime: dtableChangedTime,
|
|
402
392
|
statistics: statistics,
|
|
403
393
|
selectedDashboardIdx: selectedDashboardIdx,
|
|
404
394
|
eventBus: eventBus,
|
|
405
395
|
onCloseDashboard: this.props.onCloseStatistic,
|
|
406
396
|
getViewRows: this.props.getViewRows,
|
|
407
397
|
getTableFormulaResults: this.props.getTableFormulaResults,
|
|
408
|
-
value: this.value,
|
|
409
398
|
selectDashboard: this.selectDashboard,
|
|
410
399
|
addDashboard: this.addDashboard,
|
|
411
400
|
renameDashboard: this.renameDashboard,
|
|
@@ -414,7 +403,6 @@ class DashBoard extends _react.Component {
|
|
|
414
403
|
}) : /*#__PURE__*/_react.default.createElement(_desktopDashboard.default, {
|
|
415
404
|
isTableReadOnly: isTableReadOnly,
|
|
416
405
|
colorThemeName: colorThemeName,
|
|
417
|
-
dtableChangedTime: dtableChangedTime,
|
|
418
406
|
statistics: statistics,
|
|
419
407
|
selectedDashboardIdx: selectedDashboardIdx,
|
|
420
408
|
eventBus: eventBus,
|
package/es/desktop-dashboard.js
CHANGED
|
@@ -15,7 +15,6 @@ var _tabs = _interopRequireDefault(require("./tabs"));
|
|
|
15
15
|
var _statList = _interopRequireDefault(require("./stat-list"));
|
|
16
16
|
var _colorThemeDialog = _interopRequireDefault(require("./components/dialog/color-theme-dialog"));
|
|
17
17
|
var _chartEditDialog = _interopRequireDefault(require("./components/dialog/chart-edit-dialog"));
|
|
18
|
-
var _statisticRecordDialog = _interopRequireDefault(require("./components/dialog/statistic-record-dialog"));
|
|
19
18
|
var _dtableDbApi = _interopRequireDefault(require("./api/dtable-db-api"));
|
|
20
19
|
var _chartService = _interopRequireDefault(require("./service/chart-service"));
|
|
21
20
|
var _constants = require("./constants");
|
|
@@ -23,9 +22,7 @@ var _icon = _interopRequireDefault(require("./assets/images/icon.png"));
|
|
|
23
22
|
const KEY_LOCAL_THEME_MODE = 'statistics-theme-mode';
|
|
24
23
|
class DesktopDashboard extends _react.Component {
|
|
25
24
|
constructor(props) {
|
|
26
|
-
var _this;
|
|
27
25
|
super(props);
|
|
28
|
-
_this = this;
|
|
29
26
|
this.onToggleColorThemeDialog = () => {
|
|
30
27
|
this.setState({
|
|
31
28
|
isShowColorThemeDialog: !this.state.isShowColorThemeDialog
|
|
@@ -95,28 +92,6 @@ class DesktopDashboard extends _react.Component {
|
|
|
95
92
|
const uuidThemeModeMap = this.getThemeModeMap();
|
|
96
93
|
return uuidThemeModeMap[dtableUuid];
|
|
97
94
|
};
|
|
98
|
-
this.toggleStatisticRecordsDialog = function (statisticRecord, chart) {
|
|
99
|
-
let {
|
|
100
|
-
isColumn = false,
|
|
101
|
-
isCurrentView = false,
|
|
102
|
-
isRow = false
|
|
103
|
-
} = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
104
|
-
if (_this.state.chartRecordsParams) {
|
|
105
|
-
_this.setState({
|
|
106
|
-
chartRecordsParams: null
|
|
107
|
-
});
|
|
108
|
-
} else {
|
|
109
|
-
_this.setState({
|
|
110
|
-
chartRecordsParams: {
|
|
111
|
-
statisticRecord,
|
|
112
|
-
chart,
|
|
113
|
-
isColumn,
|
|
114
|
-
isCurrentView,
|
|
115
|
-
isRow
|
|
116
|
-
}
|
|
117
|
-
});
|
|
118
|
-
}
|
|
119
|
-
};
|
|
120
95
|
this.generateChart = chartType => {
|
|
121
96
|
const {
|
|
122
97
|
statistics,
|
|
@@ -150,8 +125,7 @@ class DesktopDashboard extends _react.Component {
|
|
|
150
125
|
isShowChartEditDialog: false,
|
|
151
126
|
isShowChartAddDialog: false,
|
|
152
127
|
isShowColorThemeDialog: false,
|
|
153
|
-
editingChart: null
|
|
154
|
-
chartRecordsParams: null
|
|
128
|
+
editingChart: null
|
|
155
129
|
};
|
|
156
130
|
this.api = {
|
|
157
131
|
sqlQuery: this.sqlQuery,
|
|
@@ -165,10 +139,8 @@ class DesktopDashboard extends _react.Component {
|
|
|
165
139
|
}
|
|
166
140
|
render() {
|
|
167
141
|
const {
|
|
168
|
-
getTableById,
|
|
169
142
|
getValue,
|
|
170
143
|
isTableReadOnly,
|
|
171
|
-
dtableChangedTime,
|
|
172
144
|
colorThemeName,
|
|
173
145
|
statistics,
|
|
174
146
|
selectedDashboardIdx,
|
|
@@ -178,7 +150,6 @@ class DesktopDashboard extends _react.Component {
|
|
|
178
150
|
theme,
|
|
179
151
|
isFullScreen,
|
|
180
152
|
editingChart,
|
|
181
|
-
chartRecordsParams,
|
|
182
153
|
isShowChartAddDialog
|
|
183
154
|
} = this.state;
|
|
184
155
|
const darkMode = theme === _constants.THEME_NAME_MAP.DARK;
|
|
@@ -260,7 +231,6 @@ class DesktopDashboard extends _react.Component {
|
|
|
260
231
|
className: "statistic-main"
|
|
261
232
|
}, /*#__PURE__*/_react.default.createElement(_statList.default, {
|
|
262
233
|
isTableReadOnly: isTableReadOnly,
|
|
263
|
-
dtableChangedTime: dtableChangedTime,
|
|
264
234
|
theme: theme,
|
|
265
235
|
colorThemeName: colorThemeName,
|
|
266
236
|
statItems: statItems,
|
|
@@ -275,20 +245,19 @@ class DesktopDashboard extends _react.Component {
|
|
|
275
245
|
deleteChart: this.props.deleteChart,
|
|
276
246
|
modifyDashboardLayout: this.props.modifyDashboardLayout,
|
|
277
247
|
onToggleEditChart: this.onToggleEditChart,
|
|
278
|
-
onCloseDashboard: this.props.onCloseDashboard
|
|
279
|
-
toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
|
|
248
|
+
onCloseDashboard: this.props.onCloseDashboard
|
|
280
249
|
})), this.state.isShowChartEditDialog && /*#__PURE__*/_react.default.createElement(_chartEditDialog.default, {
|
|
281
250
|
theme: theme,
|
|
282
251
|
colorThemeName: colorThemeName,
|
|
283
252
|
editingChart: editingChart,
|
|
253
|
+
eventBus: eventBus,
|
|
284
254
|
api: this.api,
|
|
285
255
|
getValue: getValue,
|
|
286
256
|
statistics: statistics,
|
|
287
257
|
selectedDashboardIdx: selectedDashboardIdx,
|
|
288
258
|
addChart: this.props.addChart,
|
|
289
259
|
modifyChart: this.props.modifyChart,
|
|
290
|
-
onToggleEditChart: this.onToggleEditChart
|
|
291
|
-
toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
|
|
260
|
+
onToggleEditChart: this.onToggleEditChart
|
|
292
261
|
}), isShowChartAddDialog && /*#__PURE__*/_react.default.createElement(_seaChart.TypesDialog, {
|
|
293
262
|
type: "",
|
|
294
263
|
onToggle: this.onToggleAddChart,
|
|
@@ -297,12 +266,6 @@ class DesktopDashboard extends _react.Component {
|
|
|
297
266
|
colorThemeName: colorThemeName,
|
|
298
267
|
onToggleColorThemeDialog: this.onToggleColorThemeDialog,
|
|
299
268
|
modifyColorTheme: this.props.modifyColorTheme
|
|
300
|
-
}), !!chartRecordsParams && /*#__PURE__*/_react.default.createElement(_statisticRecordDialog.default, {
|
|
301
|
-
eventBus: this.props.eventBus,
|
|
302
|
-
chartRecordsParams: chartRecordsParams,
|
|
303
|
-
getTableById: getTableById,
|
|
304
|
-
getValue: getValue,
|
|
305
|
-
toggleStatisticRecordsDialog: this.toggleStatisticRecordsDialog
|
|
306
269
|
}));
|
|
307
270
|
}
|
|
308
271
|
}
|
package/es/mobile-dashboard.js
CHANGED
|
@@ -8,38 +8,27 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.default = void 0;
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
|
|
11
|
-
var _seaChart = require("sea-chart");
|
|
12
11
|
var _tabs = _interopRequireDefault(require("./tabs"));
|
|
13
12
|
var _statView = _interopRequireDefault(require("./stat-view"));
|
|
14
|
-
var
|
|
13
|
+
var _seaChart = require("sea-chart");
|
|
15
14
|
var _constants = require("./constants");
|
|
16
15
|
var _icon = _interopRequireDefault(require("./assets/images/icon.png"));
|
|
17
16
|
var _mobileDashboardModule = _interopRequireDefault(require("./assets/css/mobile-dashboard.module.css"));
|
|
18
17
|
class MobileDashboard extends _react.Component {
|
|
19
|
-
constructor(
|
|
20
|
-
super(
|
|
18
|
+
constructor() {
|
|
19
|
+
super(...arguments);
|
|
21
20
|
this.onCloseDashboard = () => {
|
|
22
21
|
this.props.onCloseDashboard({
|
|
23
22
|
isFullScreen: true
|
|
24
23
|
});
|
|
25
24
|
};
|
|
26
|
-
this.api = {
|
|
27
|
-
sqlQuery: this.sqlQuery,
|
|
28
|
-
getViewRows: this.props.getViewRows,
|
|
29
|
-
getTableFormulaResults: this.props.getTableFormulaResults,
|
|
30
|
-
queryUsers: window.app.queryUsers || (() => {})
|
|
31
|
-
};
|
|
32
|
-
}
|
|
33
|
-
async sqlQuery(sql) {
|
|
34
|
-
return _dtableDbApi.default.sqlQuery(sql);
|
|
35
25
|
}
|
|
36
26
|
render() {
|
|
37
27
|
const {
|
|
38
28
|
getTableById,
|
|
39
29
|
colorThemeName,
|
|
40
30
|
statistics,
|
|
41
|
-
selectedDashboardIdx
|
|
42
|
-
value
|
|
31
|
+
selectedDashboardIdx
|
|
43
32
|
} = this.props;
|
|
44
33
|
const statistic = statistics[selectedDashboardIdx];
|
|
45
34
|
const {
|
|
@@ -76,13 +65,13 @@ class MobileDashboard extends _react.Component {
|
|
|
76
65
|
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
77
66
|
className: _mobileDashboardModule.default['mobile-statistic-dashboard-wrapper']
|
|
78
67
|
}, statItems.map(statItem => {
|
|
79
|
-
var _style_config$title, _style_config$title$t;
|
|
80
68
|
const {
|
|
81
69
|
_id,
|
|
82
|
-
type
|
|
83
|
-
style_config = {}
|
|
70
|
+
type
|
|
84
71
|
} = statItem.config;
|
|
85
|
-
const
|
|
72
|
+
const {
|
|
73
|
+
name
|
|
74
|
+
} = statItem.style_config.title.text;
|
|
86
75
|
const showStatName = !(type === _seaChart.CHART_TYPE.BASIC_NUMBER_CARD || type === _seaChart.CHART_TYPE.DASHBOARD);
|
|
87
76
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
88
77
|
key: "mobile-statistic-chart-".concat(_id),
|
|
@@ -95,8 +84,6 @@ class MobileDashboard extends _react.Component {
|
|
|
95
84
|
theme: _constants.THEME_NAME_MAP.LIGHT,
|
|
96
85
|
colorThemeName: colorThemeName,
|
|
97
86
|
statItem: statItem,
|
|
98
|
-
value: value,
|
|
99
|
-
api: this.api,
|
|
100
87
|
getTableById: getTableById
|
|
101
88
|
})));
|
|
102
89
|
})));
|
|
@@ -75,8 +75,8 @@ class ChartPreview extends _react.Component {
|
|
|
75
75
|
colorThemeName,
|
|
76
76
|
api,
|
|
77
77
|
value,
|
|
78
|
-
|
|
79
|
-
|
|
78
|
+
eventBus,
|
|
79
|
+
getTableById
|
|
80
80
|
} = this.props;
|
|
81
81
|
return /*#__PURE__*/_react.default.createElement(_statView.default, {
|
|
82
82
|
ref: ref => this.chartView = ref,
|
|
@@ -85,8 +85,8 @@ class ChartPreview extends _react.Component {
|
|
|
85
85
|
statItem: statItem,
|
|
86
86
|
api: api,
|
|
87
87
|
value: value,
|
|
88
|
-
|
|
89
|
-
|
|
88
|
+
eventBus: eventBus,
|
|
89
|
+
getTableById: getTableById
|
|
90
90
|
});
|
|
91
91
|
};
|
|
92
92
|
this.moveChartToView = viewId => {
|
package/es/stat-list/index.js
CHANGED
|
@@ -132,7 +132,7 @@ class StatList extends _react.Component {
|
|
|
132
132
|
|
|
133
133
|
// refresh charts if has updates
|
|
134
134
|
if (Array.isArray(rowIds) && rowIds.length > 0 || Array.isArray(newRows) && newRows.length > 0) {
|
|
135
|
-
|
|
135
|
+
_seaChart.EventBus.dispatch(_constants.CommonEventTypes.REFRESH_CHARTS);
|
|
136
136
|
}
|
|
137
137
|
}
|
|
138
138
|
this.statisticalResult4Update = null;
|
|
@@ -168,7 +168,8 @@ class StatList extends _react.Component {
|
|
|
168
168
|
theme,
|
|
169
169
|
colorThemeName,
|
|
170
170
|
statItems,
|
|
171
|
-
api
|
|
171
|
+
api,
|
|
172
|
+
eventBus
|
|
172
173
|
} = this.props;
|
|
173
174
|
const {
|
|
174
175
|
layout,
|
|
@@ -206,6 +207,7 @@ class StatList extends _react.Component {
|
|
|
206
207
|
colorThemeName: colorThemeName,
|
|
207
208
|
statItem: item,
|
|
208
209
|
api: api,
|
|
210
|
+
eventBus: eventBus,
|
|
209
211
|
value: this.value,
|
|
210
212
|
getOtherStatistics: this.props.getOtherStatistics,
|
|
211
213
|
getTableById: this.props.getTableById,
|
|
@@ -225,8 +227,7 @@ class StatList extends _react.Component {
|
|
|
225
227
|
} = _ref2;
|
|
226
228
|
return this.showSelectTableDialog(index, statisticalResult);
|
|
227
229
|
},
|
|
228
|
-
onToggleEditChart: this.props.onToggleEditChart
|
|
229
|
-
toggleStatisticRecordsDialog: this.props.toggleStatisticRecordsDialog
|
|
230
|
+
onToggleEditChart: this.props.onToggleEditChart
|
|
230
231
|
}));
|
|
231
232
|
})), enlargedChart && /*#__PURE__*/_react.default.createElement(_enlargedChartDialog.default, {
|
|
232
233
|
colorThemeName: colorThemeName,
|
|
@@ -234,8 +235,7 @@ class StatList extends _react.Component {
|
|
|
234
235
|
api: api,
|
|
235
236
|
value: this.value,
|
|
236
237
|
getTableById: this.props.getTableById,
|
|
237
|
-
onEnlargeToggle: this.closeEnlargedChart
|
|
238
|
-
toggleStatisticRecordsDialog: this.props.toggleStatisticRecordsDialog
|
|
238
|
+
onEnlargeToggle: this.closeEnlargedChart
|
|
239
239
|
}), chartExport2Table && /*#__PURE__*/_react.default.createElement(_newTableDialog.default, {
|
|
240
240
|
getTables: this.props.getTables,
|
|
241
241
|
tableName: chartExport2Table.name,
|
package/es/stat-view/index.js
CHANGED
|
@@ -8,6 +8,7 @@ exports.default = void 0;
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _seaChart = require("sea-chart");
|
|
10
10
|
var _dtableUtils = require("dtable-utils");
|
|
11
|
+
var _constants = require("../constants");
|
|
11
12
|
class StatView extends _react.default.Component {
|
|
12
13
|
constructor(props) {
|
|
13
14
|
super(props);
|
|
@@ -40,12 +41,14 @@ class StatView extends _react.default.Component {
|
|
|
40
41
|
this.viewRef = null;
|
|
41
42
|
}
|
|
42
43
|
render() {
|
|
44
|
+
var _window, _window$app, _window$app$state;
|
|
43
45
|
const {
|
|
44
46
|
statItem,
|
|
45
47
|
api,
|
|
46
48
|
value,
|
|
47
49
|
theme,
|
|
48
|
-
colorThemeName
|
|
50
|
+
colorThemeName,
|
|
51
|
+
eventBus
|
|
49
52
|
} = this.props;
|
|
50
53
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
51
54
|
className: "statistic-chart-container"
|
|
@@ -53,12 +56,16 @@ class StatView extends _react.default.Component {
|
|
|
53
56
|
chart: statItem,
|
|
54
57
|
api: api,
|
|
55
58
|
config: window.dtable,
|
|
59
|
+
dtableStoreValue: value,
|
|
56
60
|
tables: value.tables,
|
|
57
61
|
collaborators: value.collaborators,
|
|
62
|
+
departments: ((_window = window) === null || _window === void 0 ? void 0 : (_window$app = _window.app) === null || _window$app === void 0 ? void 0 : (_window$app$state = _window$app.state) === null || _window$app$state === void 0 ? void 0 : _window$app$state.departments) || [],
|
|
58
63
|
hideTitle: true,
|
|
59
64
|
globalTheme: theme,
|
|
60
65
|
chartColorTheme: colorThemeName,
|
|
61
66
|
isCalculateByView: true,
|
|
67
|
+
integratedEventTypes: _constants.CommonEventTypes,
|
|
68
|
+
integratedEventBus: eventBus,
|
|
62
69
|
onViewRef: this.getViewRef
|
|
63
70
|
}));
|
|
64
71
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "dtable-statistic",
|
|
3
|
-
"version": "5.0.10-alpha.
|
|
3
|
+
"version": "5.0.10-alpha.5",
|
|
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": "
|
|
21
|
+
"sea-chart": "0.0.56-alpha.7"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"dtable-ui-component": "~5.0.*",
|
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
.statistic-records-dialog {
|
|
2
|
-
width: 800px;
|
|
3
|
-
max-width: 800px;
|
|
4
|
-
height: calc(100% - 56px);
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.statistic-records-dialog .modal-content {
|
|
8
|
-
width: 100%;
|
|
9
|
-
height: 100%;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
.statistic-records-dialog .search-header {
|
|
13
|
-
height: 46px;
|
|
14
|
-
line-height: 46px;
|
|
15
|
-
display: flex;
|
|
16
|
-
justify-content: space-between;
|
|
17
|
-
border-bottom: 1px solid #e9ecef;
|
|
18
|
-
align-items: center;
|
|
19
|
-
padding: 0 20px;
|
|
20
|
-
font-weight: 500;
|
|
21
|
-
font-size: 16px;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.statistic-records-dialog .no-search-result {
|
|
25
|
-
height: 100%;
|
|
26
|
-
width: 100%;
|
|
27
|
-
text-align: center;
|
|
28
|
-
background-position: 50% 140px;
|
|
29
|
-
background-size: 132px 132px;
|
|
30
|
-
line-height: 600px;
|
|
31
|
-
color: #aaa;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.statistic-records-dialog .search-input-container .close {
|
|
35
|
-
height: 24px !important;
|
|
36
|
-
width: 24px;
|
|
37
|
-
line-height: 24px;
|
|
38
|
-
position: absolute;
|
|
39
|
-
right: 14px;
|
|
40
|
-
top: 22px;
|
|
41
|
-
padding: 0;
|
|
42
|
-
margin: 0;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
.statistic-records-dialog .search-input-container {
|
|
46
|
-
margin-top: 10px;
|
|
47
|
-
padding: 0 20px;
|
|
48
|
-
height: 48px;
|
|
49
|
-
position: relative;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.statistic-records-dialog .search-input-container .search-tables-input {
|
|
53
|
-
height: 38px;
|
|
54
|
-
line-height: 38px;
|
|
55
|
-
padding-left: 30px;
|
|
56
|
-
border-bottom: 0;
|
|
57
|
-
background: #f5f5f5;
|
|
58
|
-
border-radius: 3px;
|
|
59
|
-
border: 1px solid #dedede;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.statistic-records-dialog .search-input-container .search-tables-input:focus {
|
|
63
|
-
outline: none;
|
|
64
|
-
box-shadow: unset;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.statistic-records-dialog .search-input-container .header-search-icon {
|
|
68
|
-
line-height: 38px;
|
|
69
|
-
text-align: center;
|
|
70
|
-
color: #aaa;
|
|
71
|
-
margin-left: 11px;
|
|
72
|
-
position: absolute;
|
|
73
|
-
left: unset;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
.statistic-records-dialog .search-input-container .clear-search-text {
|
|
77
|
-
display: inline-block;
|
|
78
|
-
position: absolute;
|
|
79
|
-
right: 30px;
|
|
80
|
-
top: 10px;
|
|
81
|
-
height: 12px;
|
|
82
|
-
width: 12px;
|
|
83
|
-
line-height: 12px;
|
|
84
|
-
color: #ccc;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
.statistic-records-dialog .search-input-container .clear-search-text .dtable-font {
|
|
88
|
-
font-size: 12px;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.statistic-records-dialog .search-input-container .clear-search-text:hover {
|
|
92
|
-
cursor: pointer;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.statistic-records-dialog .statistic-records-container {
|
|
96
|
-
width: 100%;
|
|
97
|
-
height: 100%;
|
|
98
|
-
padding: 0;
|
|
99
|
-
overflow-y: hidden;
|
|
100
|
-
background-color: #f8f8f8;
|
|
101
|
-
border-bottom-left-radius: 3px;
|
|
102
|
-
border-bottom-right-radius: 3px;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
.statistic-records-dialog.statistic-records-container .records-list {
|
|
106
|
-
height: calc(100% - 47px);
|
|
107
|
-
width: fit-content;
|
|
108
|
-
min-width: 100%;
|
|
109
|
-
padding: 10px 20px;
|
|
110
|
-
overflow-y: auto;
|
|
111
|
-
margin-top: 3px;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
.statistic-records-dialog .statistic-records-container .records-list .records-container {
|
|
115
|
-
height: auto;
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
.statistic-records-dialog .row-card-item-content .grid-cell-type-button .grid-cell-type-button-inner {
|
|
119
|
-
justify-content: flex-start;
|
|
120
|
-
}
|
|
@@ -1,344 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
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 _Loading2 = _interopRequireDefault(require("dtable-ui-component/lib/Loading"));
|
|
10
|
-
var _DTableSearchInput2 = _interopRequireDefault(require("dtable-ui-component/lib/DTableSearchInput"));
|
|
11
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
-
var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
|
|
13
|
-
var _reactstrap = require("reactstrap");
|
|
14
|
-
var _dtableUtils = require("dtable-utils");
|
|
15
|
-
var _dtableDbApi = _interopRequireDefault(require("../../../api/dtable-db-api"));
|
|
16
|
-
var _constants = require("../../../constants");
|
|
17
|
-
require("./index.css");
|
|
18
|
-
// import { searchRows } from '../../../utils';
|
|
19
|
-
// import { getSqlString } from '../../../utils/sql-utils';
|
|
20
|
-
class StatisticRecordDialog extends _react.default.Component {
|
|
21
|
-
constructor(props) {
|
|
22
|
-
super(props);
|
|
23
|
-
this.init = () => {
|
|
24
|
-
const {
|
|
25
|
-
chartRecordsParams
|
|
26
|
-
} = this.props;
|
|
27
|
-
if (!chartRecordsParams) return;
|
|
28
|
-
const {
|
|
29
|
-
statisticRecord,
|
|
30
|
-
chart,
|
|
31
|
-
isColumn,
|
|
32
|
-
isCurrentView,
|
|
33
|
-
isRow
|
|
34
|
-
} = chartRecordsParams || {};
|
|
35
|
-
const {
|
|
36
|
-
rows: records
|
|
37
|
-
} = statisticRecord;
|
|
38
|
-
const {
|
|
39
|
-
getTableById
|
|
40
|
-
} = this.props;
|
|
41
|
-
const {
|
|
42
|
-
table_id,
|
|
43
|
-
view_id
|
|
44
|
-
} = chart;
|
|
45
|
-
this.table = getTableById(table_id);
|
|
46
|
-
this.view = (0, _dtableUtils.getViewById)(this.table.views, view_id);
|
|
47
|
-
this.isArchiveView = (0, _dtableUtils.isArchiveView)(this.view);
|
|
48
|
-
this.unShowColumnKeyList = this.getUnShowColumnKeyList(this.view);
|
|
49
|
-
this.renderedColumns = this.getRenderedColumns(this.table);
|
|
50
|
-
// if (this.isArchiveView || !records) {
|
|
51
|
-
// const { username, userId, userDepartmentIdsMap } = window.dtable || {};
|
|
52
|
-
// const sqlString = getSqlString(chart, statisticRecord, { isColumn, isCurrentView, isRow, getTableById, username, userId, userDepartmentIdsMap });
|
|
53
|
-
// dtableDbAPI.sqlQuery(sqlString).then(res => {
|
|
54
|
-
// const { results: rows } = res.data;
|
|
55
|
-
// this.processDrilledRows(rows);
|
|
56
|
-
// });
|
|
57
|
-
// return;
|
|
58
|
-
// }
|
|
59
|
-
|
|
60
|
-
this.processDrilledRows(records);
|
|
61
|
-
};
|
|
62
|
-
this.processDrilledRows = drilledRows => {
|
|
63
|
-
const {
|
|
64
|
-
statisticRecord
|
|
65
|
-
} = this.props.chartRecordsParams;
|
|
66
|
-
const {
|
|
67
|
-
name
|
|
68
|
-
} = statisticRecord;
|
|
69
|
-
const searchedRowsIds = this.getSearchedRows(drilledRows);
|
|
70
|
-
let idRowMap = {};
|
|
71
|
-
drilledRows.forEach(row => {
|
|
72
|
-
idRowMap[row._id] = row;
|
|
73
|
-
});
|
|
74
|
-
this.initComputedProperties(drilledRows);
|
|
75
|
-
this.setState({
|
|
76
|
-
loading: false,
|
|
77
|
-
title: name,
|
|
78
|
-
rows: drilledRows,
|
|
79
|
-
idRowMap,
|
|
80
|
-
searchedRowsIds
|
|
81
|
-
});
|
|
82
|
-
};
|
|
83
|
-
this.initComputedProperties = drilledRows => {
|
|
84
|
-
if (this.isArchiveView) {
|
|
85
|
-
const formulaColumns = (0, _dtableUtils.getFormulaColumnsContainLinks)(this.table);
|
|
86
|
-
if (formulaColumns.length === 0) return {};
|
|
87
|
-
let formulaRows = {};
|
|
88
|
-
drilledRows.forEach(row => {
|
|
89
|
-
const rowId = row._id;
|
|
90
|
-
formulaRows[rowId] = {};
|
|
91
|
-
formulaColumns.forEach(column => formulaRows[rowId][column.key] = row[column.key]);
|
|
92
|
-
});
|
|
93
|
-
this.formulaRows = formulaRows;
|
|
94
|
-
return;
|
|
95
|
-
}
|
|
96
|
-
const {
|
|
97
|
-
formulaRows
|
|
98
|
-
} = this.getTableViewFormulaRows();
|
|
99
|
-
this.formulaRows = formulaRows;
|
|
100
|
-
};
|
|
101
|
-
this.onSearch = searchVal => {
|
|
102
|
-
const {
|
|
103
|
-
rows
|
|
104
|
-
} = this.state;
|
|
105
|
-
const searchedRowsIds = this.getSearchedRows(rows, searchVal);
|
|
106
|
-
this.setState({
|
|
107
|
-
searchedRowsIds,
|
|
108
|
-
searchVal
|
|
109
|
-
});
|
|
110
|
-
};
|
|
111
|
-
this.clearTimer = () => {
|
|
112
|
-
if (this.timer) {
|
|
113
|
-
clearTimeout(this.timer);
|
|
114
|
-
this.timer = null;
|
|
115
|
-
}
|
|
116
|
-
};
|
|
117
|
-
this.clearSearch = () => {
|
|
118
|
-
const {
|
|
119
|
-
rows
|
|
120
|
-
} = this.state;
|
|
121
|
-
const searchedRowsIds = this.getSearchedRows(rows);
|
|
122
|
-
this.setState({
|
|
123
|
-
searchedRowsIds,
|
|
124
|
-
searchVal: ''
|
|
125
|
-
});
|
|
126
|
-
};
|
|
127
|
-
this.getSearchedRows = (rows, searchVal) => {
|
|
128
|
-
if (!Array.isArray(rows) || rows.length === 0) return [];
|
|
129
|
-
// if (searchVal) {
|
|
130
|
-
// return searchRows(
|
|
131
|
-
// rows,
|
|
132
|
-
// getViewShownColumns(this.view, this.table.columns),
|
|
133
|
-
// searchVal,
|
|
134
|
-
// (row) => {
|
|
135
|
-
// return row;
|
|
136
|
-
// },
|
|
137
|
-
// ).map((row) => row._id);
|
|
138
|
-
// }
|
|
139
|
-
return rows.map(row => row._id);
|
|
140
|
-
};
|
|
141
|
-
this.getRowsByIds = rowsIds => {
|
|
142
|
-
if (!Array.isArray(rowsIds) || rowsIds.length === 0) {
|
|
143
|
-
return [];
|
|
144
|
-
}
|
|
145
|
-
const {
|
|
146
|
-
idRowMap
|
|
147
|
-
} = this.state;
|
|
148
|
-
return rowsIds.map(rowId => idRowMap[rowId]).filter(Boolean);
|
|
149
|
-
};
|
|
150
|
-
this.toggle = () => {
|
|
151
|
-
if (this.valueChanged) {
|
|
152
|
-
this.props.eventBus.dispatch(_constants.CommonEventTypes.REFRESH_CHARTS);
|
|
153
|
-
}
|
|
154
|
-
this.props.toggleStatisticRecordsDialog();
|
|
155
|
-
};
|
|
156
|
-
this.expandRowUpdated = _ref => {
|
|
157
|
-
let {
|
|
158
|
-
table_id,
|
|
159
|
-
updatedRow
|
|
160
|
-
} = _ref;
|
|
161
|
-
// none-matched
|
|
162
|
-
if (table_id !== this.table._id) return;
|
|
163
|
-
const {
|
|
164
|
-
rows,
|
|
165
|
-
searchedRowsIds,
|
|
166
|
-
idRowMap,
|
|
167
|
-
searchVal
|
|
168
|
-
} = this.state;
|
|
169
|
-
let updatedSearchedRowsIds = searchedRowsIds;
|
|
170
|
-
let updatedRows = [...rows];
|
|
171
|
-
let updatedIdRowMap = idRowMap;
|
|
172
|
-
rows.forEach((row, index) => {
|
|
173
|
-
const rowId = row._id;
|
|
174
|
-
if (rowId === updatedRow._id) {
|
|
175
|
-
updatedRows[index] = updatedRow;
|
|
176
|
-
updatedIdRowMap[rowId] = updatedRow;
|
|
177
|
-
}
|
|
178
|
-
});
|
|
179
|
-
if (searchedRowsIds.length > 0) {
|
|
180
|
-
const searchedRows = this.getRowsByIds(searchedRowsIds);
|
|
181
|
-
updatedSearchedRowsIds = this.getSearchedRows(searchedRows, searchVal);
|
|
182
|
-
}
|
|
183
|
-
this.valueChanged = true;
|
|
184
|
-
this.setState({
|
|
185
|
-
rows: updatedRows,
|
|
186
|
-
idRowMap: updatedIdRowMap,
|
|
187
|
-
searchedRowsIds: updatedSearchedRowsIds
|
|
188
|
-
});
|
|
189
|
-
};
|
|
190
|
-
this.expandRowDeleted = _ref2 => {
|
|
191
|
-
let {
|
|
192
|
-
table_id,
|
|
193
|
-
row_id
|
|
194
|
-
} = _ref2;
|
|
195
|
-
// none-matched
|
|
196
|
-
if (table_id !== this.table._id) return;
|
|
197
|
-
const {
|
|
198
|
-
rows,
|
|
199
|
-
searchedRowsIds,
|
|
200
|
-
idRowMap
|
|
201
|
-
} = this.state;
|
|
202
|
-
let updatedSearchedRowsIds = searchedRowsIds;
|
|
203
|
-
let updatedIdRowMap = idRowMap;
|
|
204
|
-
const updatedRows = rows.filter(row => row._id !== row_id);
|
|
205
|
-
delete updatedIdRowMap[row_id];
|
|
206
|
-
if (searchedRowsIds.length > 0) {
|
|
207
|
-
updatedSearchedRowsIds = searchedRowsIds.filter(rowId => rowId !== row_id);
|
|
208
|
-
}
|
|
209
|
-
this.valueChanged = true;
|
|
210
|
-
this.setState({
|
|
211
|
-
rows: updatedRows,
|
|
212
|
-
idRowMap: updatedIdRowMap,
|
|
213
|
-
searchedRowsIds: updatedSearchedRowsIds
|
|
214
|
-
});
|
|
215
|
-
};
|
|
216
|
-
this.getUnShowColumnKeyList = view => {
|
|
217
|
-
const firstColumnKey = '0000';
|
|
218
|
-
const {
|
|
219
|
-
hidden_columns = []
|
|
220
|
-
} = view;
|
|
221
|
-
return [firstColumnKey, ...hidden_columns];
|
|
222
|
-
};
|
|
223
|
-
this.getRenderedColumns = table => {
|
|
224
|
-
const {
|
|
225
|
-
columns
|
|
226
|
-
} = table;
|
|
227
|
-
return columns.filter(column => !this.unShowColumnKeyList.includes(column.key));
|
|
228
|
-
};
|
|
229
|
-
this.getTableViewFormulaRows = () => {
|
|
230
|
-
const {
|
|
231
|
-
table,
|
|
232
|
-
view
|
|
233
|
-
} = this;
|
|
234
|
-
const value = this.props.getValue();
|
|
235
|
-
if (view.formula_rows && Object.keys(view.formula_rows).length > 0) {
|
|
236
|
-
return {
|
|
237
|
-
formulaRows: view.formula_rows
|
|
238
|
-
};
|
|
239
|
-
}
|
|
240
|
-
if (window.app && window.app.cacheFormulaResults) {
|
|
241
|
-
window.app.cacheFormulaResults(table.rows, {
|
|
242
|
-
targetViewId: view._id,
|
|
243
|
-
table,
|
|
244
|
-
value
|
|
245
|
-
});
|
|
246
|
-
}
|
|
247
|
-
return {
|
|
248
|
-
formulaRows: view.formula_rows
|
|
249
|
-
};
|
|
250
|
-
};
|
|
251
|
-
this.renderRowsCards = () => {
|
|
252
|
-
const {
|
|
253
|
-
searchedRowsIds
|
|
254
|
-
} = this.state;
|
|
255
|
-
const searchedRows = this.getRowsByIds(searchedRowsIds);
|
|
256
|
-
if (searchedRows.length === 0) return null;
|
|
257
|
-
if (!window.app || !window.app.renderRowsCards) return null;
|
|
258
|
-
return window.app.renderRowsCards({
|
|
259
|
-
table: this.table,
|
|
260
|
-
renderedColumns: this.renderedColumns,
|
|
261
|
-
unShowColumnKeyList: this.unShowColumnKeyList,
|
|
262
|
-
isShowRowCardHeader: true,
|
|
263
|
-
formulaRows: this.formulaRows,
|
|
264
|
-
columns: this.renderedColumns,
|
|
265
|
-
rows: searchedRows,
|
|
266
|
-
rowCardType: 'statistic'
|
|
267
|
-
});
|
|
268
|
-
};
|
|
269
|
-
this.state = {
|
|
270
|
-
loading: true,
|
|
271
|
-
title: '',
|
|
272
|
-
rows: [],
|
|
273
|
-
idRowMap: {},
|
|
274
|
-
searchVal: '',
|
|
275
|
-
searchedRowsIds: []
|
|
276
|
-
};
|
|
277
|
-
this.table = null;
|
|
278
|
-
this.view = null;
|
|
279
|
-
this.isArchiveView = false;
|
|
280
|
-
this.valueChanged = false;
|
|
281
|
-
this.renderedColumns = [];
|
|
282
|
-
this.formulaRows = null;
|
|
283
|
-
this.unShowColumnKeyList = null;
|
|
284
|
-
}
|
|
285
|
-
componentDidMount() {
|
|
286
|
-
this.unsubscribeExpandRowUpdated = this.props.eventBus.subscribe(_constants.CommonEventTypes.EXPAND_ROW_UPDATED, this.expandRowUpdated);
|
|
287
|
-
this.unsubscribeExpandRowDeleted = this.props.eventBus.subscribe(_constants.CommonEventTypes.EXPAND_ROW_DELETED, this.expandRowDeleted);
|
|
288
|
-
this.init();
|
|
289
|
-
}
|
|
290
|
-
componentWillUnmount() {
|
|
291
|
-
this.unsubscribeExpandRowUpdated();
|
|
292
|
-
this.unsubscribeExpandRowDeleted();
|
|
293
|
-
}
|
|
294
|
-
render() {
|
|
295
|
-
const {
|
|
296
|
-
loading,
|
|
297
|
-
title
|
|
298
|
-
} = this.state;
|
|
299
|
-
return /*#__PURE__*/_react.default.createElement(_reactstrap.Modal, {
|
|
300
|
-
isOpen: true,
|
|
301
|
-
autoFocus: false,
|
|
302
|
-
toggle: this.toggle,
|
|
303
|
-
className: "statistic-records-dialog",
|
|
304
|
-
zIndex: 1048
|
|
305
|
-
}, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
306
|
-
className: "search-header"
|
|
307
|
-
}, /*#__PURE__*/_react.default.createElement("span", null, title), /*#__PURE__*/_react.default.createElement("button", {
|
|
308
|
-
type: "button",
|
|
309
|
-
className: "close",
|
|
310
|
-
"aria-label": "Close",
|
|
311
|
-
onClick: this.toggle
|
|
312
|
-
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
313
|
-
"aria-hidden": "true"
|
|
314
|
-
}, "\xD7"))), /*#__PURE__*/_react.default.createElement("div", {
|
|
315
|
-
className: "search-input-container"
|
|
316
|
-
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
317
|
-
className: "header-search-icon dtable-font dtable-icon-search"
|
|
318
|
-
}), /*#__PURE__*/_react.default.createElement(_DTableSearchInput2.default, {
|
|
319
|
-
autoFocus: true,
|
|
320
|
-
isClearable: true,
|
|
321
|
-
className: "search-tables-input",
|
|
322
|
-
placeholder: _reactIntlUniversal.default.get('Search_records'),
|
|
323
|
-
onChange: this.onSearch,
|
|
324
|
-
clearValue: this.clearSearch,
|
|
325
|
-
components: {
|
|
326
|
-
ClearIndicator: props => {
|
|
327
|
-
return /*#__PURE__*/_react.default.createElement("span", {
|
|
328
|
-
className: "clear-search-text",
|
|
329
|
-
onClick: props.clearValue,
|
|
330
|
-
title: _reactIntlUniversal.default.get('Clear_search_text'),
|
|
331
|
-
"aria-label": _reactIntlUniversal.default.get('Clear_search_text')
|
|
332
|
-
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
333
|
-
className: "dtable-font dtable-icon-x-"
|
|
334
|
-
}));
|
|
335
|
-
}
|
|
336
|
-
}
|
|
337
|
-
})), /*#__PURE__*/_react.default.createElement(_reactstrap.ModalBody, {
|
|
338
|
-
className: "statistic-records-container"
|
|
339
|
-
}, loading ? /*#__PURE__*/_react.default.createElement("div", {
|
|
340
|
-
className: "d-flex py-8"
|
|
341
|
-
}, /*#__PURE__*/_react.default.createElement(_Loading2.default, null)) : this.renderRowsCards())));
|
|
342
|
-
}
|
|
343
|
-
}
|
|
344
|
-
var _default = exports.default = StatisticRecordDialog;
|