@zgfe/modules-event 1.0.7 → 1.0.29-zhongyuan.0
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/eventFilter/index.js +68 -20
- package/es/components/eventFilter/setCascade.d.ts +3 -0
- package/es/components/eventFilter/setCascade.js +286 -0
- package/es/components/eventFilter/styles/index.less +114 -2
- package/es/components/renderContent/index.js +14 -25
- package/es/components/renderContent/types.d.ts +0 -1
- package/es/components/searchPanel/index.js +19 -6
- package/es/components/searchPanel/styles/index.less +5 -1
- package/es/components/searchPanel/types.d.ts +2 -2
- package/es/components/table/index.js +60 -9
- package/es/components/table/styles/index.less +48 -0
- package/es/components/table/types.d.ts +0 -1
- package/es/components/topBar/index.d.ts +6 -1
- package/es/components/topBar/index.js +39 -22
- package/es/components/topBar/styles/index.less +24 -29
- package/es/components/topBar/types.d.ts +0 -1
- package/es/constants/apis.d.ts +3 -1
- package/es/constants/apis.js +4 -2
- package/es/constants/fields.d.ts +0 -14
- package/es/constants/fields.js +1 -45
- package/es/modules/chart/demo/panel.js +7 -2
- package/es/modules/chart/index.js +105 -36
- package/es/modules/chart/types.d.ts +3 -0
- package/es/modules/content/index.d.ts +1 -1
- package/es/modules/content/index.js +94 -55
- package/es/modules/content/styles/index.less +12 -0
- package/es/modules/content/utils.d.ts +1 -1
- package/es/modules/content/utils.js +19 -18
- package/es/modules/home/demo/edit.js +6 -7
- package/es/modules/home/demo/index.js +1 -1
- package/es/modules/home/index.js +53 -35
- package/es/modules/home/styles/index.less +4 -4
- package/es/modules/topPanel/index.js +36 -8
- package/es/modules/topPanel/styles/index.less +5 -4
- package/es/types.d.ts +6 -0
- package/es/utils/formData.d.ts +2 -1
- package/es/utils/formData.js +39 -9
- package/package.json +24 -20
|
@@ -12,42 +12,46 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
|
|
|
12
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
13
|
import React, { useContext, useEffect, useMemo, useState } from 'react';
|
|
14
14
|
import { Tooltip, Empty } from 'antd';
|
|
15
|
-
import { BizChart, BizGlobalDataContext, ajax, BizLoading } from '@zgfe/business-lib';
|
|
15
|
+
import { BizChart, BizGlobalDataContext, ajax, BizLoading, BizEmpty } from '@zgfe/business-lib';
|
|
16
16
|
import { EventTable } from '../../components';
|
|
17
17
|
import { judgeIsCity } from '../content/utils';
|
|
18
18
|
import { getValue, getMapChartData } from '../../modules/content/utils';
|
|
19
|
-
import {
|
|
19
|
+
import { getShowColor, getUserGroupsCompareData, getSortData, getChartDataEventAliasName, formTableData, sortOriginalData } from '../../utils/formData';
|
|
20
20
|
import _ from 'lodash';
|
|
21
21
|
import moment from 'moment';
|
|
22
22
|
import { Apis, chartColors } from '../../constants';
|
|
23
23
|
var classPrefix = 'event-mi-table';
|
|
24
24
|
var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
25
25
|
var params = props.params;
|
|
26
|
-
var _useState = useState(
|
|
26
|
+
var _useState = useState(props === null || props === void 0 ? void 0 : props.completedSearchData),
|
|
27
27
|
_useState2 = _slicedToArray(_useState, 2),
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
var _useState3 = useState(
|
|
28
|
+
completedSearchData = _useState2[0],
|
|
29
|
+
setCompletedSearchData = _useState2[1];
|
|
30
|
+
var _useState3 = useState(false),
|
|
31
31
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var _useState5 = useState(props.
|
|
32
|
+
isCity = _useState4[0],
|
|
33
|
+
setIsCity = _useState4[1];
|
|
34
|
+
var _useState5 = useState(props.type || 'line'),
|
|
35
35
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
var _useState7 = useState(props.
|
|
36
|
+
chartType = _useState6[0],
|
|
37
|
+
setChartType = _useState6[1];
|
|
38
|
+
var _useState7 = useState(props.showList || []),
|
|
39
39
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
showList = _useState8[0],
|
|
41
|
+
setShowList = _useState8[1];
|
|
42
|
+
var _useState9 = useState(props.dataSource),
|
|
43
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
44
|
+
dataSource = _useState10[0],
|
|
45
|
+
setDataSource = _useState10[1];
|
|
42
46
|
var _useContext = useContext(BizGlobalDataContext),
|
|
43
|
-
currentApp = _useContext.currentApp,
|
|
44
47
|
eventGroupList = _useContext.eventGroupList,
|
|
45
48
|
eventEnvList = _useContext.eventEnvList,
|
|
46
|
-
userPropList = _useContext.userPropList
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
userPropList = _useContext.userPropList,
|
|
50
|
+
currentApp = _useContext.currentApp;
|
|
51
|
+
var _useState11 = useState(false),
|
|
52
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
53
|
+
loading = _useState12[0],
|
|
54
|
+
setLoading = _useState12[1];
|
|
51
55
|
var showColors = useMemo(function () {
|
|
52
56
|
if (!dataSource) return chartColors;
|
|
53
57
|
return getShowColor(dataSource, showList);
|
|
@@ -58,31 +62,46 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
58
62
|
}
|
|
59
63
|
}, [params]);
|
|
60
64
|
useEffect(function () {
|
|
65
|
+
if (!dataSource || !dataSource.series.length) return;
|
|
61
66
|
if (!props.showList || !props.showList.length) {
|
|
62
|
-
|
|
67
|
+
var _dataSource$series$;
|
|
68
|
+
var gLen = (params === null || params === void 0 ? void 0 : params.dimension) ? 1 : 0;
|
|
69
|
+
var _data = formTableData(dataSource, (params === null || params === void 0 ? void 0 : params.userGroup) || [0], gLen);
|
|
70
|
+
var _sortData = sortOriginalData(_data, {
|
|
71
|
+
columnKey: "field".concat(((_dataSource$series$ = dataSource.series[0]) === null || _dataSource$series$ === void 0 ? void 0 : _dataSource$series$.values.length) - 1),
|
|
72
|
+
order: 'descend'
|
|
73
|
+
});
|
|
74
|
+
var _showlist = [];
|
|
75
|
+
_sortData.forEach(function (item, index) {
|
|
76
|
+
if (index < 10) {
|
|
77
|
+
_showlist.push(item.nameGroup);
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
setShowList(_showlist);
|
|
81
|
+
props.onChangeShow && props.onChangeShow(_showlist);
|
|
63
82
|
} else {
|
|
64
83
|
setShowList(props.showList);
|
|
65
84
|
}
|
|
66
|
-
}, [
|
|
85
|
+
}, [dataSource, props.showList]);
|
|
67
86
|
useEffect(function () {
|
|
68
|
-
var
|
|
69
|
-
if (!
|
|
70
|
-
var chartData = ((
|
|
87
|
+
var _completedSearchData$;
|
|
88
|
+
if (!completedSearchData) return;
|
|
89
|
+
var chartData = ((_completedSearchData$ = completedSearchData.chartType) === null || _completedSearchData$ === void 0 ? void 0 : _completedSearchData$.split(',')) || ['line'];
|
|
71
90
|
var type = chartData[0];
|
|
72
91
|
if (!props.dataSource) {
|
|
73
92
|
type = (chartData === null || chartData === void 0 ? void 0 : chartData.length) > 1 ? chartData[chartData.length - 1] : chartData[0];
|
|
74
93
|
}
|
|
75
94
|
setChartType(props.type || type);
|
|
76
|
-
if (
|
|
77
|
-
var dimensions =
|
|
95
|
+
if (completedSearchData.id) {
|
|
96
|
+
var dimensions = completedSearchData.dimension;
|
|
78
97
|
if (type === 'map' && dimensions) {
|
|
79
98
|
var _getValue;
|
|
80
99
|
setIsCity(judgeIsCity((_getValue = getValue(dimensions, eventGroupList, eventEnvList, userPropList)) === null || _getValue === void 0 ? void 0 : _getValue.name));
|
|
81
100
|
}
|
|
82
101
|
}
|
|
83
|
-
}, [
|
|
102
|
+
}, [completedSearchData, props.type]);
|
|
84
103
|
var fetchResult = function fetchResult() {
|
|
85
|
-
var _params$
|
|
104
|
+
var _params$chartType;
|
|
86
105
|
setLoading(true);
|
|
87
106
|
ajax(Apis.dataList, {
|
|
88
107
|
method: 'post',
|
|
@@ -90,9 +109,11 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
90
109
|
appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
|
|
91
110
|
platform: (params === null || params === void 0 ? void 0 : params.platform) || 0
|
|
92
111
|
}, params), {}, {
|
|
93
|
-
chartType: (params === null || params === void 0 ? void 0 : (_params$
|
|
112
|
+
chartType: (params === null || params === void 0 ? void 0 : (_params$chartType = params.chartType) === null || _params$chartType === void 0 ? void 0 : _params$chartType.indexOf(',')) === -1 ? params === null || params === void 0 ? void 0 : params.chartType : 'grid'
|
|
94
113
|
})
|
|
95
114
|
}).then(function (res) {
|
|
115
|
+
var _params$userGroup;
|
|
116
|
+
setCompletedSearchData(params);
|
|
96
117
|
if (!res) {
|
|
97
118
|
setLoading(false);
|
|
98
119
|
return;
|
|
@@ -101,7 +122,7 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
101
122
|
if (['bar', 'pie', 'map'].indexOf(params.chartType) !== -1) {
|
|
102
123
|
_data = getSortData(_data);
|
|
103
124
|
}
|
|
104
|
-
if (params.userGroup.length > 1) {
|
|
125
|
+
if ((params === null || params === void 0 ? void 0 : params.userGroup) && (params === null || params === void 0 ? void 0 : (_params$userGroup = params.userGroup) === null || _params$userGroup === void 0 ? void 0 : _params$userGroup.length) > 1) {
|
|
105
126
|
setDataSource(getUserGroupsCompareData(_data));
|
|
106
127
|
} else {
|
|
107
128
|
setDataSource(_data);
|
|
@@ -117,16 +138,37 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
117
138
|
} else {
|
|
118
139
|
list.splice(index, 1);
|
|
119
140
|
}
|
|
141
|
+
setShowList(list);
|
|
120
142
|
if (props.onChangeShow) props.onChangeShow(list);
|
|
121
143
|
};
|
|
122
|
-
var onChangeShow = function onChangeShow(names) {
|
|
123
|
-
if (props.onChangeShow) props.onChangeShow(names);
|
|
124
|
-
};
|
|
125
144
|
if (loading) {
|
|
126
145
|
return /*#__PURE__*/React.createElement(BizLoading, {
|
|
127
146
|
className: "".concat(classPrefix, "-loading")
|
|
128
147
|
});
|
|
129
148
|
}
|
|
149
|
+
if (dataSource && dataSource.delEvent) {
|
|
150
|
+
if (!props.isHideDel) {
|
|
151
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
152
|
+
style: {
|
|
153
|
+
display: 'flex',
|
|
154
|
+
minHeight: 345,
|
|
155
|
+
justifyContent: 'center',
|
|
156
|
+
alignItems: 'center'
|
|
157
|
+
}
|
|
158
|
+
}, /*#__PURE__*/React.createElement(BizEmpty, {
|
|
159
|
+
imageStyle: {
|
|
160
|
+
height: 58
|
|
161
|
+
},
|
|
162
|
+
description: /*#__PURE__*/React.createElement("span", {
|
|
163
|
+
style: {
|
|
164
|
+
color: '#9AA1A9'
|
|
165
|
+
}
|
|
166
|
+
}, "\u4E8B\u4EF6\u5DF2\u88AB\u5220\u9664\u65E0\u6CD5\u67E5\u770B\uFF0C\u8BF7\u91CD\u65B0\u8BBE\u7F6E")
|
|
167
|
+
}));
|
|
168
|
+
} else {
|
|
169
|
+
return null;
|
|
170
|
+
}
|
|
171
|
+
}
|
|
130
172
|
if (!dataSource || !dataSource.xAxis.length || !dataSource.series.length) {
|
|
131
173
|
return /*#__PURE__*/React.createElement(Empty, {
|
|
132
174
|
image: Empty.PRESENTED_IMAGE_SIMPLE,
|
|
@@ -139,6 +181,33 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
139
181
|
title: '当前图表数据实时更新,约每分钟更新一次'
|
|
140
182
|
}, /*#__PURE__*/React.createElement("div", null, "\u6570\u636E\u66F4\u65B0\u65F6\u95F4\uFF1A", moment().format('YYYY-MM-DD HH:mm')));
|
|
141
183
|
};
|
|
184
|
+
var tooltipFormatter = function tooltipFormatter(params) {
|
|
185
|
+
var xLabel = '';
|
|
186
|
+
var array = params[0].name.split('|');
|
|
187
|
+
if (array.length > 1) {
|
|
188
|
+
xLabel = moment(array[0]).format('MM-DD') + '~' + moment(array[1]).format('MM-DD');
|
|
189
|
+
} else {
|
|
190
|
+
xLabel = moment(array[0]).isValid() ? moment(array[0]).format('MM-DD') : array[0];
|
|
191
|
+
}
|
|
192
|
+
var series = [];
|
|
193
|
+
var seriesMap = {};
|
|
194
|
+
params.forEach(function (item) {
|
|
195
|
+
if (item.value === null || item.value === undefined || seriesMap[item.seriesName] !== null && seriesMap[item.seriesName] !== undefined) return;
|
|
196
|
+
seriesMap[item.seriesName] = item.value;
|
|
197
|
+
var value = item.value;
|
|
198
|
+
var seriesName = item.seriesName || item.axisValueLabel;
|
|
199
|
+
seriesName = [seriesName].join('<br/>');
|
|
200
|
+
series.push({
|
|
201
|
+
text: "<div class='biz-chart-tooltip-item'>\n <div class='biz-chart-tooltip-content'>\n <span class=\"biz-tooltip-marker\" style=\"background:".concat(item.color, "\"></span>\n <div class=\"biz-tooltip-name\">").concat(seriesName, "</div>\n </div> \n <div class='biz-chart-tooltip-value'>\n ").concat(value, "\n </div>\n </div>"),
|
|
202
|
+
value: value
|
|
203
|
+
});
|
|
204
|
+
});
|
|
205
|
+
return "<div class='biz-chart-tooltip-title'>".concat(xLabel, "</div>").concat(series.sort(function (a, b) {
|
|
206
|
+
return parseInt(b.value) - parseInt(a.value);
|
|
207
|
+
}).map(function (item) {
|
|
208
|
+
return item.text;
|
|
209
|
+
}).join(''));
|
|
210
|
+
};
|
|
142
211
|
switch (chartType) {
|
|
143
212
|
case 'line':
|
|
144
213
|
case 'bar':
|
|
@@ -156,7 +225,8 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
156
225
|
colors: showColors,
|
|
157
226
|
xRotate: chartType === 'bar' && dataSource.series.length > 5 ? 40 : 0,
|
|
158
227
|
reverseXAxis: chartType === 'bar',
|
|
159
|
-
isCity: isCity
|
|
228
|
+
isCity: isCity,
|
|
229
|
+
tooltipFormatter: tooltipFormatter
|
|
160
230
|
}));
|
|
161
231
|
case 'grid':
|
|
162
232
|
return /*#__PURE__*/React.createElement(EventTable, {
|
|
@@ -164,7 +234,6 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
164
234
|
sourcePanel: !props.dataSource,
|
|
165
235
|
searchData: params,
|
|
166
236
|
showList: showList,
|
|
167
|
-
changeShow: onChangeShow,
|
|
168
237
|
changeShowByName: onChangeShowByName,
|
|
169
238
|
onSelectEvent: props === null || props === void 0 ? void 0 : props.onSelectEvent
|
|
170
239
|
});
|
|
@@ -3,14 +3,17 @@ import { SearchValue } from '../../types';
|
|
|
3
3
|
export declare namespace eventChartProps {
|
|
4
4
|
interface ChartTypesProps extends ChartTypes.Value {
|
|
5
5
|
xAxis: [];
|
|
6
|
+
delEvent?: number;
|
|
6
7
|
}
|
|
7
8
|
interface Props {
|
|
8
9
|
dataSource?: ChartTypesProps;
|
|
9
10
|
params?: SearchValue;
|
|
11
|
+
completedSearchData?: SearchValue;
|
|
10
12
|
type?: string;
|
|
11
13
|
showList?: string[];
|
|
12
14
|
showColors?: string[];
|
|
13
15
|
onChangeShow?: (data: string[]) => void;
|
|
14
16
|
onSelectEvent?: (id: number, name: string) => void;
|
|
17
|
+
isHideDel?: boolean;
|
|
15
18
|
}
|
|
16
19
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { EventContentProps } from './types';
|
|
3
3
|
import './styles/index.less';
|
|
4
|
-
declare const EventContent: React.
|
|
4
|
+
declare const EventContent: React.ForwardRefExoticComponent<EventContentProps.Props & React.RefAttributes<any>>;
|
|
5
5
|
export default EventContent;
|
|
@@ -12,56 +12,69 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
|
|
|
12
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
13
|
import { ajax, BizGlobalDataContext, BizLayout, BizTargetFromPanelContext } from '@zgfe/business-lib';
|
|
14
14
|
import { message } from 'antd';
|
|
15
|
-
import React, { useContext, useEffect, useRef, useState } from 'react';
|
|
15
|
+
import React, { useContext, useEffect, useRef, useState, useImperativeHandle } from 'react';
|
|
16
16
|
import Request from 'umi-request';
|
|
17
17
|
import TopBar from '../../components/topBar';
|
|
18
18
|
import { EventContext } from '../../types';
|
|
19
19
|
import './styles/index.less';
|
|
20
20
|
import { Apis } from '../../constants';
|
|
21
21
|
import { ContentPanel, SearchPanel } from '../../components';
|
|
22
|
-
import {
|
|
22
|
+
import { getUserGroupsCompareData, getSortData, getChartDataEventAliasName, sortOriginalData, formTableData } from '../../utils/formData';
|
|
23
23
|
import TopPanel from '../topPanel';
|
|
24
24
|
var timer = 0;
|
|
25
25
|
var ajaxFlag = true;
|
|
26
|
+
var refresh = false;
|
|
26
27
|
var CancelToken = Request.CancelToken;
|
|
27
28
|
var cancel;
|
|
28
29
|
var classPrefix = 'event-content';
|
|
29
|
-
var EventContent = function
|
|
30
|
-
var _props$value, _props$value2;
|
|
30
|
+
var EventContent = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
31
|
+
var _props$value, _props$value2, _topPanelRef$current4;
|
|
31
32
|
var _useContext = useContext(BizGlobalDataContext),
|
|
32
|
-
currentApp = _useContext.currentApp,
|
|
33
33
|
authority = _useContext.authority;
|
|
34
34
|
var _useContext2 = useContext(EventContext),
|
|
35
|
+
currentApp = _useContext2.currentApp,
|
|
35
36
|
searchData = _useContext2.searchData,
|
|
36
37
|
setSearchData = _useContext2.setSearchData,
|
|
37
38
|
eventGroupList = _useContext2.eventGroupList,
|
|
38
39
|
loading = _useContext2.loading,
|
|
39
40
|
setLoading = _useContext2.setLoading,
|
|
40
41
|
afterEditTarget = _useContext2.afterEditTarget,
|
|
41
|
-
onChangeUrlParam = _useContext2.onChangeUrlParam
|
|
42
|
+
onChangeUrlParam = _useContext2.onChangeUrlParam,
|
|
43
|
+
panelId = _useContext2.panelId,
|
|
44
|
+
setShowListHome = _useContext2.setShowListHome,
|
|
45
|
+
setRefreshLoading = _useContext2.setRefreshLoading,
|
|
46
|
+
setCompletedSearchData = _useContext2.setCompletedSearchData;
|
|
42
47
|
var _useState = useState(),
|
|
43
48
|
_useState2 = _slicedToArray(_useState, 2),
|
|
44
49
|
eventData = _useState2[0],
|
|
45
50
|
setEventData = _useState2[1];
|
|
46
|
-
var _useState3 = useState(
|
|
51
|
+
var _useState3 = useState(false),
|
|
47
52
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
48
|
-
|
|
49
|
-
|
|
53
|
+
enableSelectChart = _useState4[0],
|
|
54
|
+
setEnableSelectChart = _useState4[1];
|
|
50
55
|
var _useState5 = useState(false),
|
|
51
56
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
var _useState7 = useState(
|
|
57
|
+
isCity = _useState6[0],
|
|
58
|
+
setIsCity = _useState6[1];
|
|
59
|
+
var _useState7 = useState(props.value.id),
|
|
55
60
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
var _useState9 = useState(
|
|
61
|
+
eventId = _useState8[0],
|
|
62
|
+
setEventId = _useState8[1];
|
|
63
|
+
var _useState9 = useState(true),
|
|
59
64
|
_useState10 = _slicedToArray(_useState9, 2),
|
|
60
|
-
|
|
61
|
-
|
|
65
|
+
first = _useState10[0],
|
|
66
|
+
setFirst = _useState10[1];
|
|
62
67
|
var _useContext3 = useContext(BizTargetFromPanelContext),
|
|
63
68
|
handleSearch = _useContext3.handleSearch;
|
|
64
|
-
var
|
|
69
|
+
var topPanelRef = useRef();
|
|
70
|
+
useImperativeHandle(ref, function () {
|
|
71
|
+
return {
|
|
72
|
+
onFormSetFieldsValue: function onFormSetFieldsValue(data) {
|
|
73
|
+
var _topPanelRef$current;
|
|
74
|
+
topPanelRef === null || topPanelRef === void 0 ? void 0 : (_topPanelRef$current = topPanelRef.current) === null || _topPanelRef$current === void 0 ? void 0 : _topPanelRef$current.onFormSetFieldsValue(data);
|
|
75
|
+
}
|
|
76
|
+
};
|
|
77
|
+
});
|
|
65
78
|
var chartRef = useRef();
|
|
66
79
|
var _useState11 = useState('user'),
|
|
67
80
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
@@ -71,17 +84,13 @@ var EventContent = function EventContent(props) {
|
|
|
71
84
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
72
85
|
subDisplay = _useState14[0],
|
|
73
86
|
setSubDisplay = _useState14[1];
|
|
74
|
-
var _useState15 = useState(
|
|
75
|
-
_useState16 = _slicedToArray(_useState15, 2),
|
|
76
|
-
isFirst = _useState16[0],
|
|
77
|
-
setIsFirst = _useState16[1];
|
|
78
|
-
var _useState17 = useState({
|
|
87
|
+
var _useState15 = useState({
|
|
79
88
|
analysisIndex: ((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.analysisIndex) || 'number',
|
|
80
89
|
analysisAttr: (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.analysisAttr
|
|
81
90
|
}),
|
|
82
|
-
|
|
83
|
-
dimension =
|
|
84
|
-
setDimension =
|
|
91
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
92
|
+
dimension = _useState16[0],
|
|
93
|
+
setDimension = _useState16[1];
|
|
85
94
|
useEffect(function () {
|
|
86
95
|
if (timer) clearTimeout(timer);
|
|
87
96
|
var flag = true;
|
|
@@ -120,48 +129,81 @@ var EventContent = function EventContent(props) {
|
|
|
120
129
|
if (flag !== undefined) ajaxFlag = flag;
|
|
121
130
|
if (analysisSubjectType === 'eventProp' && !searchData.analysisSubject) return;
|
|
122
131
|
if (!ajaxFlag) return;
|
|
123
|
-
setLoading(true);
|
|
132
|
+
if (!refresh) setLoading(true);
|
|
124
133
|
setEventData(undefined);
|
|
125
134
|
if (typeof cancel === 'function') {
|
|
126
135
|
cancel();
|
|
127
136
|
}
|
|
128
137
|
ajax(Apis.dataList, {
|
|
129
138
|
method: 'post',
|
|
130
|
-
data: _objectSpread({
|
|
139
|
+
data: _objectSpread(_objectSpread({
|
|
131
140
|
appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
|
|
132
141
|
platform: (searchData === null || searchData === void 0 ? void 0 : searchData.platform) || 0
|
|
133
|
-
}, searchData),
|
|
142
|
+
}, searchData), {}, {
|
|
143
|
+
refresh: refresh
|
|
144
|
+
}),
|
|
134
145
|
cancelToken: new CancelToken(function executor(c) {
|
|
135
146
|
cancel = c;
|
|
136
147
|
})
|
|
137
148
|
}).then(function (res) {
|
|
138
|
-
var _searchData$userGroup
|
|
149
|
+
var _searchData$userGroup;
|
|
150
|
+
setCompletedSearchData && setCompletedSearchData(searchData);
|
|
151
|
+
setRefreshLoading(false);
|
|
139
152
|
if (!res) {
|
|
140
153
|
setLoading(false);
|
|
141
154
|
return;
|
|
142
155
|
}
|
|
143
156
|
var result = res.data;
|
|
157
|
+
if (!result.series.length) {
|
|
158
|
+
setLoading(false);
|
|
159
|
+
return;
|
|
160
|
+
}
|
|
144
161
|
var _data = searchData.dimension ? result : getChartDataEventAliasName(result, eventGroupList);
|
|
162
|
+
var gLen = (searchData === null || searchData === void 0 ? void 0 : searchData.dimension) ? 1 : 0;
|
|
163
|
+
var dataTemp = formTableData(_data, (searchData === null || searchData === void 0 ? void 0 : searchData.userGroup) || [0], gLen);
|
|
164
|
+
var _sortData = [];
|
|
145
165
|
if (['bar', 'pie', 'map'].indexOf(searchData.chartType) !== -1) {
|
|
146
166
|
_data = getSortData(_data);
|
|
167
|
+
} else {
|
|
168
|
+
var _data$series$;
|
|
169
|
+
_sortData = sortOriginalData(dataTemp, {
|
|
170
|
+
columnKey: "field".concat(((_data$series$ = _data.series[0]) === null || _data$series$ === void 0 ? void 0 : _data$series$.values.length) - 1),
|
|
171
|
+
order: 'descend'
|
|
172
|
+
});
|
|
147
173
|
}
|
|
148
174
|
if (searchData && (searchData === null || searchData === void 0 ? void 0 : searchData.userGroup) && (searchData === null || searchData === void 0 ? void 0 : (_searchData$userGroup = searchData.userGroup) === null || _searchData$userGroup === void 0 ? void 0 : _searchData$userGroup.length) > 1) {
|
|
149
175
|
_data = getUserGroupsCompareData(_data);
|
|
150
176
|
}
|
|
151
|
-
if (
|
|
152
|
-
|
|
177
|
+
if (first) {
|
|
178
|
+
setFirst(false);
|
|
153
179
|
} else {
|
|
154
|
-
var
|
|
155
|
-
|
|
156
|
-
|
|
180
|
+
var _showlist = [];
|
|
181
|
+
_sortData.forEach(function (item, index) {
|
|
182
|
+
if (index < 10) {
|
|
183
|
+
_showlist.push(item.nameGroup);
|
|
184
|
+
}
|
|
185
|
+
});
|
|
186
|
+
setShowListHome(_showlist);
|
|
157
187
|
}
|
|
158
188
|
setEventData(_data);
|
|
159
189
|
onChangeUrlParam(searchData);
|
|
160
190
|
setLoading(false);
|
|
161
191
|
});
|
|
162
192
|
};
|
|
193
|
+
var refreshHandle = function refreshHandle() {
|
|
194
|
+
refresh = true;
|
|
195
|
+
setRefreshLoading(true);
|
|
196
|
+
if (timer) clearTimeout(timer);
|
|
197
|
+
timer = setTimeout(function () {
|
|
198
|
+
fetchRequest();
|
|
199
|
+
refresh = false;
|
|
200
|
+
clearTimeout(timer);
|
|
201
|
+
}, 500);
|
|
202
|
+
};
|
|
163
203
|
var onChangeContent = function onChangeContent(data) {
|
|
204
|
+
var _topPanelRef$current2;
|
|
164
205
|
ajaxFlag = true;
|
|
206
|
+
(_topPanelRef$current2 = topPanelRef.current) === null || _topPanelRef$current2 === void 0 ? void 0 : _topPanelRef$current2.submit();
|
|
165
207
|
setSearchData(function (value) {
|
|
166
208
|
return _objectSpread(_objectSpread(_objectSpread({}, value), data), {}, {
|
|
167
209
|
analysisAttr: data.analysisAttr,
|
|
@@ -169,12 +211,10 @@ var EventContent = function EventContent(props) {
|
|
|
169
211
|
});
|
|
170
212
|
});
|
|
171
213
|
};
|
|
172
|
-
var onChangeShow = function onChangeShow(data) {
|
|
173
|
-
setShowList(data);
|
|
174
|
-
props.onChangeShow && props.onChangeShow(data);
|
|
175
|
-
};
|
|
176
214
|
var platformChange = function platformChange(data) {
|
|
215
|
+
var _topPanelRef$current3;
|
|
177
216
|
ajaxFlag = true;
|
|
217
|
+
(_topPanelRef$current3 = topPanelRef.current) === null || _topPanelRef$current3 === void 0 ? void 0 : _topPanelRef$current3.submit();
|
|
178
218
|
setSearchData(function (_searchData) {
|
|
179
219
|
return _objectSpread(_objectSpread({}, _searchData), {}, {
|
|
180
220
|
platform: data
|
|
@@ -215,19 +255,12 @@ var EventContent = function EventContent(props) {
|
|
|
215
255
|
};
|
|
216
256
|
if (afterEditTarget) afterEditTarget('report', params);
|
|
217
257
|
};
|
|
218
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(
|
|
219
|
-
|
|
220
|
-
searchData: searchData,
|
|
221
|
-
platformChange: platformChange,
|
|
222
|
-
enableSelectChart: enableSelectChart,
|
|
223
|
-
showList: showList,
|
|
224
|
-
onClickGenerateReport: onClickGenerateReport
|
|
225
|
-
}), /*#__PURE__*/React.createElement(BizLayout, {
|
|
226
|
-
showTitle: false,
|
|
258
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BizLayout, {
|
|
259
|
+
showTitle: !panelId,
|
|
227
260
|
hasCollapse: true,
|
|
228
|
-
collapseRef:
|
|
261
|
+
collapseRef: topPanelRef === null || topPanelRef === void 0 ? void 0 : (_topPanelRef$current4 = topPanelRef.current) === null || _topPanelRef$current4 === void 0 ? void 0 : _topPanelRef$current4.getCollapseRef(),
|
|
229
262
|
topPanel: /*#__PURE__*/React.createElement(TopPanel, {
|
|
230
|
-
ref:
|
|
263
|
+
ref: topPanelRef,
|
|
231
264
|
onChange: onChangeSearch,
|
|
232
265
|
loading: loading,
|
|
233
266
|
value: searchData,
|
|
@@ -235,6 +268,13 @@ var EventContent = function EventContent(props) {
|
|
|
235
268
|
setIsCity: setIsCity,
|
|
236
269
|
setEnableSelectChart: setEnableSelectChart,
|
|
237
270
|
onChangeSubjectType: onChangeSubjectType
|
|
271
|
+
}),
|
|
272
|
+
toolbar: /*#__PURE__*/React.createElement(TopBar, {
|
|
273
|
+
eventData: eventData,
|
|
274
|
+
searchData: searchData,
|
|
275
|
+
platformChange: platformChange,
|
|
276
|
+
enableSelectChart: enableSelectChart,
|
|
277
|
+
onClickGenerateReport: onClickGenerateReport
|
|
238
278
|
})
|
|
239
279
|
}, /*#__PURE__*/React.createElement("div", {
|
|
240
280
|
className: classPrefix
|
|
@@ -248,14 +288,13 @@ var EventContent = function EventContent(props) {
|
|
|
248
288
|
onChange: onChangeContent,
|
|
249
289
|
dimension: dimension,
|
|
250
290
|
setDimension: setDimension,
|
|
251
|
-
analysisSubjectType: analysisSubjectType
|
|
291
|
+
analysisSubjectType: analysisSubjectType,
|
|
292
|
+
refreshHandle: refreshHandle
|
|
252
293
|
}), /*#__PURE__*/React.createElement(ContentPanel, {
|
|
253
294
|
ref: chartRef,
|
|
254
295
|
isCity: isCity,
|
|
255
296
|
eventData: eventData,
|
|
256
|
-
searchData: searchData
|
|
257
|
-
showList: showList,
|
|
258
|
-
onChangeShow: onChangeShow
|
|
297
|
+
searchData: searchData
|
|
259
298
|
}))));
|
|
260
|
-
};
|
|
299
|
+
});
|
|
261
300
|
export default EventContent;
|
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
.event-content-topBar {
|
|
2
|
+
display: flex;
|
|
3
|
+
align-items: center;
|
|
4
|
+
justify-content: space-between;
|
|
5
|
+
> span {
|
|
6
|
+
color: #021429;
|
|
7
|
+
font-size: 16px;
|
|
8
|
+
}
|
|
9
|
+
.modules-event-topbar {
|
|
10
|
+
padding-right: 0;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
1
13
|
.event-content {
|
|
2
14
|
&-options {
|
|
3
15
|
display: flex;
|
|
@@ -7,7 +7,7 @@ export declare const judgeIsCity: (name: string | undefined) => boolean;
|
|
|
7
7
|
export declare const judgeIsArea: (name: string | undefined) => boolean;
|
|
8
8
|
export declare const getValue: (param: bizAttributeSelectorValueProp, eventGroupList: EventGroup[] | undefined, eventEnvList: EnvProp[] | undefined, userPropList: UserProp[] | undefined) => AttributeSelect.Value | undefined;
|
|
9
9
|
export declare const getNumberPanelData: (data: any) => Promise<unknown>;
|
|
10
|
-
export declare const normalOptions: {
|
|
10
|
+
export declare const normalOptions: (type: any) => {
|
|
11
11
|
label: string;
|
|
12
12
|
value: string;
|
|
13
13
|
}[];
|
|
@@ -48,22 +48,21 @@ export var judgeIsArea = function judgeIsArea(name) {
|
|
|
48
48
|
};
|
|
49
49
|
export var getValue = function getValue(param, eventGroupList, eventEnvList, userPropList) {
|
|
50
50
|
var res = undefined;
|
|
51
|
-
var key = "".concat(param.propCategory, "-").concat(param.value);
|
|
52
51
|
if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'envProp') {
|
|
53
52
|
eventEnvList === null || eventEnvList === void 0 ? void 0 : eventEnvList.forEach(function (attr) {
|
|
54
|
-
if (attr.
|
|
53
|
+
if (attr.id === param.id && attr.name === param.value) res = attr;
|
|
55
54
|
});
|
|
56
55
|
} else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'eventProp') {
|
|
57
56
|
eventGroupList === null || eventGroupList === void 0 ? void 0 : eventGroupList.forEach(function (group) {
|
|
58
57
|
group.eventList.forEach(function (event) {
|
|
59
58
|
event.attrList.forEach(function (attr) {
|
|
60
|
-
if (attr.
|
|
59
|
+
if (attr.id === param.id) res = attr;
|
|
61
60
|
});
|
|
62
61
|
});
|
|
63
62
|
});
|
|
64
63
|
} else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'userProp') {
|
|
65
64
|
userPropList === null || userPropList === void 0 ? void 0 : userPropList.forEach(function (attr) {
|
|
66
|
-
if (attr.
|
|
65
|
+
if (attr.id === param.id && attr.category === param.category && attr.name === param.value) res = attr;
|
|
67
66
|
});
|
|
68
67
|
}
|
|
69
68
|
return res;
|
|
@@ -80,21 +79,23 @@ export var getNumberPanelData = function getNumberPanelData(data) {
|
|
|
80
79
|
});
|
|
81
80
|
});
|
|
82
81
|
};
|
|
83
|
-
export var normalOptions =
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
82
|
+
export var normalOptions = function normalOptions(type) {
|
|
83
|
+
return [{
|
|
84
|
+
label: "".concat(type != 'user' ? '主体数' : '人数'),
|
|
85
|
+
value: 'number'
|
|
86
|
+
}, {
|
|
87
|
+
label: '次数',
|
|
88
|
+
value: 'times'
|
|
89
|
+
}, {
|
|
90
|
+
label: '活跃比',
|
|
91
|
+
value: 'active_ratio'
|
|
92
|
+
}, {
|
|
93
|
+
label: "".concat(type != 'user' ? '主体平均次数' : '人均次数'),
|
|
94
|
+
value: 'per'
|
|
95
|
+
}];
|
|
96
|
+
};
|
|
96
97
|
export var normalEventOptions = [{
|
|
97
|
-
label: '
|
|
98
|
+
label: '口径数',
|
|
98
99
|
value: 'number'
|
|
99
100
|
}, {
|
|
100
101
|
label: '次数',
|
|
@@ -14,21 +14,20 @@ var defaultValue = {
|
|
|
14
14
|
id: 249641,
|
|
15
15
|
name: '事件',
|
|
16
16
|
data: {
|
|
17
|
-
app_id:
|
|
17
|
+
app_id: 503302,
|
|
18
18
|
module: 'event',
|
|
19
|
-
appId: 502391,
|
|
20
|
-
platform: 0,
|
|
21
19
|
userGroup: [0],
|
|
22
20
|
time: {
|
|
23
|
-
begin: '
|
|
24
|
-
end: '2024-
|
|
21
|
+
begin: '2024-08-04',
|
|
22
|
+
end: '2024-09-03',
|
|
25
23
|
relative: [30, 0],
|
|
26
24
|
unit: 'day'
|
|
27
25
|
},
|
|
28
26
|
chartType: 'line',
|
|
29
|
-
analysisIndex: 'number'
|
|
27
|
+
analysisIndex: 'number',
|
|
28
|
+
appId: 503302
|
|
30
29
|
},
|
|
31
|
-
chosen_data: ['
|
|
30
|
+
chosen_data: ['崩溃']
|
|
32
31
|
};
|
|
33
32
|
export default (function () {
|
|
34
33
|
var _useState = useState(false),
|
|
@@ -39,7 +39,7 @@ export default (function () {
|
|
|
39
39
|
};
|
|
40
40
|
return /*#__PURE__*/React.createElement(DemoWrapper, {
|
|
41
41
|
needMeta: true,
|
|
42
|
-
defaultApp:
|
|
42
|
+
defaultApp: 616
|
|
43
43
|
}, isDetail ? /*#__PURE__*/React.createElement("div", null, JSON.stringify(detailParams), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Button, {
|
|
44
44
|
onClick: function onClick() {
|
|
45
45
|
return setIsDetail(false);
|