@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
|
@@ -10,7 +10,8 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
10
10
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
11
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
12
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
-
import {
|
|
13
|
+
import { BizSelect, BizTargetDimension, useChanged, IconFont, BizDatePickerV2 } from '@zgfe/business-lib';
|
|
14
|
+
import { Button } from 'antd';
|
|
14
15
|
import React, { useContext, useEffect, useState } from 'react';
|
|
15
16
|
import { chartTypeOptions, getInitDate } from '../../constants';
|
|
16
17
|
import { EventContext } from '../../types';
|
|
@@ -20,7 +21,9 @@ var classPrefix = 'search-panel';
|
|
|
20
21
|
var SearchPanel = function SearchPanel(props) {
|
|
21
22
|
var _useContext = useContext(EventContext),
|
|
22
23
|
includeToday = _useContext.includeToday,
|
|
23
|
-
searchData = _useContext.searchData
|
|
24
|
+
searchData = _useContext.searchData,
|
|
25
|
+
currentApp = _useContext.currentApp,
|
|
26
|
+
refreshLoading = _useContext.refreshLoading;
|
|
24
27
|
var analysisSubjectType = props.analysisSubjectType,
|
|
25
28
|
dimension = props.dimension,
|
|
26
29
|
setDimension = props.setDimension;
|
|
@@ -32,7 +35,7 @@ var SearchPanel = function SearchPanel(props) {
|
|
|
32
35
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
33
36
|
chart = _useState4[0],
|
|
34
37
|
setChart = _useState4[1];
|
|
35
|
-
var currentNormalOptions = analysisSubjectType === 'user' ? normalOptions : normalEventOptions;
|
|
38
|
+
var currentNormalOptions = analysisSubjectType === 'user' ? normalOptions(currentApp === null || currentApp === void 0 ? void 0 : currentApp.type) : normalEventOptions;
|
|
36
39
|
useEffect(function () {
|
|
37
40
|
if (searchData.chartType && searchData.chartType !== chart.value) {
|
|
38
41
|
if (searchData.chartType.indexOf(',') !== -1) {
|
|
@@ -89,10 +92,11 @@ var SearchPanel = function SearchPanel(props) {
|
|
|
89
92
|
style: {
|
|
90
93
|
display: 'flex'
|
|
91
94
|
}
|
|
92
|
-
}, /*#__PURE__*/React.createElement(
|
|
95
|
+
}, /*#__PURE__*/React.createElement(BizDatePickerV2, {
|
|
93
96
|
defaultValue: time,
|
|
94
97
|
onChange: onChangeTime,
|
|
95
|
-
selectRange: 365
|
|
98
|
+
selectRange: 365,
|
|
99
|
+
selectRangeUnit: "days"
|
|
96
100
|
}), /*#__PURE__*/React.createElement(BizTargetDimension, {
|
|
97
101
|
normalOptions: currentNormalOptions,
|
|
98
102
|
value: dimension,
|
|
@@ -101,7 +105,16 @@ var SearchPanel = function SearchPanel(props) {
|
|
|
101
105
|
onChange: onDimensionChange
|
|
102
106
|
})), /*#__PURE__*/React.createElement("div", {
|
|
103
107
|
className: "".concat(classPrefix, "-search-right")
|
|
104
|
-
},
|
|
108
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
109
|
+
className: "".concat(classPrefix, "-search-right-refresh"),
|
|
110
|
+
icon: /*#__PURE__*/React.createElement(IconFont, {
|
|
111
|
+
type: "zhongxinjiazai"
|
|
112
|
+
}),
|
|
113
|
+
loading: refreshLoading,
|
|
114
|
+
onClick: function onClick() {
|
|
115
|
+
return props.refreshHandle();
|
|
116
|
+
}
|
|
117
|
+
}, "\u5237\u65B0"), /*#__PURE__*/React.createElement(BizSelect, {
|
|
105
118
|
className: "".concat(classPrefix, "-select"),
|
|
106
119
|
options: chartTypeOptions,
|
|
107
120
|
defaultValue: chart,
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { DatePickerTypes } from '@zgfe/business-lib/es/datePicker/types';
|
|
2
2
|
import { EventChartTypes } from '../../types';
|
|
3
|
-
import { ReactNode } from 'react';
|
|
4
3
|
import { TargetConditionTypes } from '@zgfe/business-lib';
|
|
5
4
|
export interface AnalysisSubject {
|
|
6
5
|
subjectId?: number;
|
|
@@ -11,13 +10,13 @@ export interface AnalysisSubject {
|
|
|
11
10
|
subjectName?: string;
|
|
12
11
|
}
|
|
13
12
|
export interface SearchPanelProps {
|
|
13
|
+
refreshHandle: Function;
|
|
14
14
|
analysisIndex?: string;
|
|
15
15
|
analysisAttr?: string;
|
|
16
16
|
enableSelectChart?: boolean;
|
|
17
17
|
time?: DatePickerTypes.Value;
|
|
18
18
|
eventId?: number;
|
|
19
19
|
chartType?: EventChartTypes;
|
|
20
|
-
optionNode?: ReactNode;
|
|
21
20
|
onChange?: (data: SearchPanelProps) => void;
|
|
22
21
|
setIsCity?: Function;
|
|
23
22
|
setEnableSelectChart?: Function;
|
|
@@ -25,4 +24,5 @@ export interface SearchPanelProps {
|
|
|
25
24
|
analysisSubject?: AnalysisSubject;
|
|
26
25
|
dimension?: TargetConditionTypes.DimensionValue;
|
|
27
26
|
setDimension?: Function;
|
|
27
|
+
optionNode?: any;
|
|
28
28
|
}
|
|
@@ -4,6 +4,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
4
4
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
5
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
6
6
|
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
8
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
10
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
7
11
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
12
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
13
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
@@ -17,7 +21,7 @@ import { CopyToClipboard } from 'react-copy-to-clipboard';
|
|
|
17
21
|
import 'highlight.js/styles/vs.css';
|
|
18
22
|
import base64 from '../../utils/base64';
|
|
19
23
|
import { Apis } from '../../constants';
|
|
20
|
-
import { Modal, message, Table, ConfigProvider, Empty } from 'antd';
|
|
24
|
+
import { Modal, message, Table, ConfigProvider, Empty, Tooltip } from 'antd';
|
|
21
25
|
import { formTableData, getColumns } from '../../utils/formData';
|
|
22
26
|
import './styles/index.less';
|
|
23
27
|
import { getValue } from '../../modules/content/utils';
|
|
@@ -34,17 +38,18 @@ var EventTable = function EventTable(props) {
|
|
|
34
38
|
tableData = _useState2[0],
|
|
35
39
|
setTableData = _useState2[1];
|
|
36
40
|
var _useContext = useContext(BizGlobalDataContext),
|
|
37
|
-
currentApp = _useContext.currentApp,
|
|
38
41
|
_useContext$eventGrou = _useContext.eventGroupList,
|
|
39
42
|
eventGroupList = _useContext$eventGrou === void 0 ? [] : _useContext$eventGrou,
|
|
40
43
|
eventEnvList = _useContext.eventEnvList,
|
|
41
44
|
userPropList = _useContext.userPropList,
|
|
45
|
+
userGroupList = _useContext.userGroupList,
|
|
42
46
|
authority = _useContext.authority;
|
|
43
47
|
var _useContext2 = useContext(EventContext),
|
|
44
48
|
onUserDrill = _useContext2.onUserDrill,
|
|
45
49
|
_useContext2$defaultS = _useContext2.defaultSearch,
|
|
46
50
|
defaultSearch = _useContext2$defaultS === void 0 ? {} : _useContext2$defaultS,
|
|
47
|
-
panelName = _useContext2.panelName
|
|
51
|
+
panelName = _useContext2.panelName,
|
|
52
|
+
currentApp = _useContext2.currentApp;
|
|
48
53
|
var _useState3 = useState(false),
|
|
49
54
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
50
55
|
sqlModal = _useState4[0],
|
|
@@ -65,11 +70,37 @@ var EventTable = function EventTable(props) {
|
|
|
65
70
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
66
71
|
total = _useState12[0],
|
|
67
72
|
setTotal = _useState12[1];
|
|
73
|
+
var _useState13 = useState(),
|
|
74
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
75
|
+
pvTitle = _useState14[0],
|
|
76
|
+
setPvTitle = _useState14[1];
|
|
68
77
|
useEffect(function () {
|
|
69
78
|
var gLen = (searchData === null || searchData === void 0 ? void 0 : searchData.dimension) ? 1 : 0;
|
|
70
79
|
var _data = formTableData(dataSource, searchData.userGroup || [0], gLen);
|
|
71
80
|
setTotal(_data.length);
|
|
72
|
-
|
|
81
|
+
var dataAll = [];
|
|
82
|
+
if (dataSource.userGroupEventTimeSum) {
|
|
83
|
+
dataSource.userGroupEventTimeSum.map(function (item) {
|
|
84
|
+
var data = {
|
|
85
|
+
eventName: '总计',
|
|
86
|
+
dimension: '总计',
|
|
87
|
+
isAdd: true,
|
|
88
|
+
id: Math.random(),
|
|
89
|
+
name: '总计',
|
|
90
|
+
nameGroup: '总计',
|
|
91
|
+
originalName: '总计',
|
|
92
|
+
userGroup: Object.keys(item)[0]
|
|
93
|
+
};
|
|
94
|
+
Object.values(item)[0].forEach(function (item, index) {
|
|
95
|
+
data["field".concat(index)] = item;
|
|
96
|
+
});
|
|
97
|
+
dataAll.push(data);
|
|
98
|
+
});
|
|
99
|
+
setPvTitle(dataSource.eventPvTitle.split(';').map(function (item) {
|
|
100
|
+
return item.split(' ');
|
|
101
|
+
}));
|
|
102
|
+
}
|
|
103
|
+
setTableData([].concat(dataAll, _toConsumableArray(_data)));
|
|
73
104
|
}, []);
|
|
74
105
|
var columns = useMemo(function () {
|
|
75
106
|
var _searchData$userGroup = searchData.userGroup,
|
|
@@ -79,6 +110,14 @@ var EventTable = function EventTable(props) {
|
|
|
79
110
|
};
|
|
80
111
|
var onClickToDetail = function onClickToDetail(item, time, count) {
|
|
81
112
|
var _searchData$filters;
|
|
113
|
+
var userGroupData = userGroup[0] == null ? [] : [userGroup[0]];
|
|
114
|
+
if ((userGroup === null || userGroup === void 0 ? void 0 : userGroup.length) > 1) {
|
|
115
|
+
userGroupList && userGroupList.forEach(function (user) {
|
|
116
|
+
if (user.name === item.userGroup) {
|
|
117
|
+
userGroupData = [user.id];
|
|
118
|
+
}
|
|
119
|
+
});
|
|
120
|
+
}
|
|
82
121
|
var _time = time.split('|');
|
|
83
122
|
var groupValue = '';
|
|
84
123
|
if (searchData.dimension && item.dimension) {
|
|
@@ -100,7 +139,7 @@ var EventTable = function EventTable(props) {
|
|
|
100
139
|
params: {
|
|
101
140
|
groupValue: groupValue,
|
|
102
141
|
id: searchData.id,
|
|
103
|
-
userGroup:
|
|
142
|
+
userGroup: userGroupData,
|
|
104
143
|
chartType: searchData.chartType,
|
|
105
144
|
conditions: (_searchData$filters = searchData.filters) === null || _searchData$filters === void 0 ? void 0 : _searchData$filters.conditions,
|
|
106
145
|
dimension: searchData.dimension,
|
|
@@ -128,7 +167,7 @@ var EventTable = function EventTable(props) {
|
|
|
128
167
|
method: 'post',
|
|
129
168
|
data: _objectSpread({
|
|
130
169
|
appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
|
|
131
|
-
platform: (
|
|
170
|
+
platform: (searchData === null || searchData === void 0 ? void 0 : searchData.platform) || 0,
|
|
132
171
|
service: !searchData.dimension ? 'event/overview_sql' : 'event_sql'
|
|
133
172
|
}, searchData)
|
|
134
173
|
}).then(function (res) {
|
|
@@ -140,7 +179,7 @@ var EventTable = function EventTable(props) {
|
|
|
140
179
|
};
|
|
141
180
|
var download = function download() {
|
|
142
181
|
var seriesNames = [];
|
|
143
|
-
if (searchData.userGroup && searchData.userGroup.length > 1) {
|
|
182
|
+
if (searchData.userGroup && (searchData.userGroup.length > 1 || searchData.userGroup[0] !== 0)) {
|
|
144
183
|
seriesNames.push(base64.encode('用户群'));
|
|
145
184
|
}
|
|
146
185
|
if (searchData.dimension) {
|
|
@@ -152,7 +191,7 @@ var EventTable = function EventTable(props) {
|
|
|
152
191
|
var fname = "\u4E8B\u4EF6\u5206\u6790-".concat((searchData === null || searchData === void 0 ? void 0 : searchData.name) ? getEventAliasName(searchData === null || searchData === void 0 ? void 0 : searchData.name, eventGroupList) : '事件概览');
|
|
153
192
|
var params = _objectSpread(_objectSpread({
|
|
154
193
|
appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
|
|
155
|
-
platform: (
|
|
194
|
+
platform: (searchData === null || searchData === void 0 ? void 0 : searchData.platform) || 0
|
|
156
195
|
}, searchData), {}, {
|
|
157
196
|
down: {
|
|
158
197
|
fname: base64.encode(fname),
|
|
@@ -183,7 +222,18 @@ var EventTable = function EventTable(props) {
|
|
|
183
222
|
className: classPrefix
|
|
184
223
|
}, !sourcePanel && /*#__PURE__*/React.createElement("div", {
|
|
185
224
|
className: "".concat(classPrefix, "-table-header")
|
|
186
|
-
}, /*#__PURE__*/React.createElement("span",
|
|
225
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
226
|
+
className: "".concat(classPrefix, "-table-header-left")
|
|
227
|
+
}, "\u6307\u6807\u8BE6\u60C5", pvTitle && pvTitle.length ? /*#__PURE__*/React.createElement("div", {
|
|
228
|
+
className: "".concat(classPrefix, "-table-header-left-box")
|
|
229
|
+
}, "\uFF08\u4E8B\u4EF6\u603B\u91CF\uFF1A", /*#__PURE__*/React.createElement("div", {
|
|
230
|
+
className: "".concat(classPrefix, "-table-header-left-content")
|
|
231
|
+
}, pvTitle.map(function (item, index) {
|
|
232
|
+
return /*#__PURE__*/React.createElement(Tooltip, {
|
|
233
|
+
title: item[0] + ':' + item[1],
|
|
234
|
+
key: index
|
|
235
|
+
}, /*#__PURE__*/React.createElement("span", null, item[0], "\uFF1A"), /*#__PURE__*/React.createElement("span", null, item[1], index === pvTitle.length - 1 ? '' : ' | '));
|
|
236
|
+
}), "\uFF09")) : null), /*#__PURE__*/React.createElement("div", null, authority[100051] && /*#__PURE__*/React.createElement("div", {
|
|
187
237
|
onClick: seeSql
|
|
188
238
|
}, "\u67E5\u770BSQL"), authority[100050] && /*#__PURE__*/React.createElement("div", {
|
|
189
239
|
onClick: download
|
|
@@ -203,6 +253,7 @@ var EventTable = function EventTable(props) {
|
|
|
203
253
|
},
|
|
204
254
|
pagination: {
|
|
205
255
|
showQuickJumper: true,
|
|
256
|
+
showSizeChanger: true,
|
|
206
257
|
total: total,
|
|
207
258
|
defaultPageSize: 10,
|
|
208
259
|
defaultCurrent: 1,
|
|
@@ -44,6 +44,41 @@
|
|
|
44
44
|
border: 1px solid #1454e5;
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
|
+
&-left {
|
|
48
|
+
display: flex;
|
|
49
|
+
flex: 1;
|
|
50
|
+
flex-direction: row;
|
|
51
|
+
overflow: hidden;
|
|
52
|
+
&-box {
|
|
53
|
+
display: flex;
|
|
54
|
+
flex: 1;
|
|
55
|
+
flex-direction: row;
|
|
56
|
+
overflow: hidden;
|
|
57
|
+
color: #67727f;
|
|
58
|
+
}
|
|
59
|
+
&-content {
|
|
60
|
+
display: flex;
|
|
61
|
+
flex: 1;
|
|
62
|
+
flex-direction: row;
|
|
63
|
+
overflow: hidden;
|
|
64
|
+
color: #67727f;
|
|
65
|
+
> span {
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: row;
|
|
68
|
+
max-width: 33.33%;
|
|
69
|
+
overflow: hidden;
|
|
70
|
+
:first-child {
|
|
71
|
+
overflow: hidden;
|
|
72
|
+
white-space: nowrap;
|
|
73
|
+
text-overflow: ellipsis;
|
|
74
|
+
}
|
|
75
|
+
:nth-child(2) {
|
|
76
|
+
flex: 1;
|
|
77
|
+
white-space: nowrap;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
47
82
|
}
|
|
48
83
|
.ant-table {
|
|
49
84
|
border-radius: 0 0 8px 8px;
|
|
@@ -72,6 +107,19 @@
|
|
|
72
107
|
margin-top: 0;
|
|
73
108
|
}
|
|
74
109
|
}
|
|
110
|
+
.tooltip-userGroup-box {
|
|
111
|
+
display: flex;
|
|
112
|
+
max-width: 330px;
|
|
113
|
+
overflow: hidden;
|
|
114
|
+
white-space: nowrap;
|
|
115
|
+
text-overflow: ellipsis;
|
|
116
|
+
div {
|
|
117
|
+
max-width: 330px;
|
|
118
|
+
overflow: hidden;
|
|
119
|
+
white-space: nowrap;
|
|
120
|
+
text-overflow: ellipsis;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
75
123
|
.tooltip-name-box {
|
|
76
124
|
display: flex;
|
|
77
125
|
&-market {
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
2
|
import './styles/index.less';
|
|
3
3
|
import { TopBarProps } from './types';
|
|
4
|
+
export interface platItemProp {
|
|
5
|
+
key: number;
|
|
6
|
+
value: string;
|
|
7
|
+
icon?: ReactNode;
|
|
8
|
+
}
|
|
4
9
|
declare const TopBar: React.FC<TopBarProps>;
|
|
5
10
|
export default TopBar;
|
|
@@ -12,14 +12,16 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
|
|
|
12
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
13
|
import { Button } from 'antd';
|
|
14
14
|
import React, { useContext, useState, useEffect } from 'react';
|
|
15
|
-
import { BizAddToPanel, BizAddToScene, BizGlobalDataContext } from '@zgfe/business-lib';
|
|
15
|
+
import { BizAddToPanel, BizAddToScene, BizGlobalDataContext, BizPlatformSelector, IconFont } from '@zgfe/business-lib';
|
|
16
16
|
import './styles/index.less';
|
|
17
17
|
import { EventContext } from '../../types';
|
|
18
|
-
import { chartTypes
|
|
18
|
+
import { chartTypes } from '../../constants/fields';
|
|
19
19
|
import { getWarningId } from '../../utils/formData';
|
|
20
20
|
var classPrefix = 'modules-event-topbar';
|
|
21
21
|
var TopBar = function TopBar(props) {
|
|
22
22
|
var _useContext = useContext(EventContext),
|
|
23
|
+
currentApp = _useContext.currentApp,
|
|
24
|
+
showListHome = _useContext.showListHome,
|
|
23
25
|
panelId = _useContext.panelId,
|
|
24
26
|
afterEditTarget = _useContext.afterEditTarget,
|
|
25
27
|
loading = _useContext.loading,
|
|
@@ -35,11 +37,11 @@ var TopBar = function TopBar(props) {
|
|
|
35
37
|
showScene = _useState4[0],
|
|
36
38
|
setShowScene = _useState4[1];
|
|
37
39
|
var _useContext2 = useContext(BizGlobalDataContext),
|
|
38
|
-
currentApp = _useContext2.currentApp,
|
|
39
40
|
eventGroupList = _useContext2.eventGroupList,
|
|
40
|
-
authority = _useContext2.authority
|
|
41
|
+
authority = _useContext2.authority,
|
|
42
|
+
router = _useContext2.router,
|
|
43
|
+
routes = _useContext2.routes;
|
|
41
44
|
var searchData = props.searchData,
|
|
42
|
-
showList = props.showList,
|
|
43
45
|
platformChange = props.platformChange,
|
|
44
46
|
eventData = props.eventData,
|
|
45
47
|
onClickGenerateReport = props.onClickGenerateReport,
|
|
@@ -48,14 +50,14 @@ var TopBar = function TopBar(props) {
|
|
|
48
50
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
49
51
|
options = _useState6[0],
|
|
50
52
|
setOptions = _useState6[1];
|
|
51
|
-
var _useState7 = useState(
|
|
53
|
+
var _useState7 = useState(-1),
|
|
52
54
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
var _useState9 = useState(
|
|
55
|
+
warningId = _useState8[0],
|
|
56
|
+
setWarningId = _useState8[1];
|
|
57
|
+
var _useState9 = useState((searchData === null || searchData === void 0 ? void 0 : searchData.platform) === undefined ? 0 : searchData.platform),
|
|
56
58
|
_useState10 = _slicedToArray(_useState9, 2),
|
|
57
|
-
|
|
58
|
-
|
|
59
|
+
selectPlatform = _useState10[0],
|
|
60
|
+
setselectPlatform = _useState10[1];
|
|
59
61
|
useEffect(function () {
|
|
60
62
|
setWarningId(getWarningId(searchData, eventData, eventGroupList));
|
|
61
63
|
}, [searchData, eventData, eventGroupList]);
|
|
@@ -89,6 +91,24 @@ var TopBar = function TopBar(props) {
|
|
|
89
91
|
};
|
|
90
92
|
return /*#__PURE__*/React.createElement("div", {
|
|
91
93
|
className: classPrefix
|
|
94
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
95
|
+
className: "".concat(classPrefix, "-title")
|
|
96
|
+
}, !panelId && enableGenerateReport && /*#__PURE__*/React.createElement(IconFont, {
|
|
97
|
+
type: "fanhuiicon",
|
|
98
|
+
onClick: function onClick() {
|
|
99
|
+
if (!router) return;
|
|
100
|
+
var params = new URLSearchParams(window.location.search);
|
|
101
|
+
var _reportId = params.get('reportId');
|
|
102
|
+
router.push({
|
|
103
|
+
name: routes.report,
|
|
104
|
+
query: {
|
|
105
|
+
reportId: _reportId,
|
|
106
|
+
isEdit: 1
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
}, "\u8FD4\u56DE"), /*#__PURE__*/React.createElement("span", null, "\u4E8B\u4EF6\u5206\u6790")), /*#__PURE__*/React.createElement("div", {
|
|
111
|
+
className: "".concat(classPrefix, "-right")
|
|
92
112
|
}, !panelId && /*#__PURE__*/React.createElement("div", {
|
|
93
113
|
className: "".concat(classPrefix, "-panel")
|
|
94
114
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
@@ -104,7 +124,7 @@ var TopBar = function TopBar(props) {
|
|
|
104
124
|
module: 'event'
|
|
105
125
|
}, searchData),
|
|
106
126
|
styleOptions: options,
|
|
107
|
-
showList: (searchData === null || searchData === void 0 ? void 0 : searchData.chartType) !== 'map' ?
|
|
127
|
+
showList: (searchData === null || searchData === void 0 ? void 0 : searchData.chartType) !== 'map' ? showListHome : [],
|
|
108
128
|
onCancel: function onCancel() {
|
|
109
129
|
return closeHandle('panel');
|
|
110
130
|
},
|
|
@@ -143,15 +163,12 @@ var TopBar = function TopBar(props) {
|
|
|
143
163
|
}
|
|
144
164
|
}, "\u8BBE\u7F6E\u6D41\u5931\u9884\u8B66"), /*#__PURE__*/React.createElement("div", {
|
|
145
165
|
className: "".concat(classPrefix, "-platform")
|
|
146
|
-
},
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
}
|
|
154
|
-
}, item.value);
|
|
155
|
-
})));
|
|
166
|
+
}, /*#__PURE__*/React.createElement(BizPlatformSelector, {
|
|
167
|
+
value: selectPlatform,
|
|
168
|
+
onChange: function onChange(val) {
|
|
169
|
+
setselectPlatform(val.key);
|
|
170
|
+
platformChange(val.key);
|
|
171
|
+
}
|
|
172
|
+
}))));
|
|
156
173
|
};
|
|
157
174
|
export default TopBar;
|
|
@@ -2,9 +2,31 @@
|
|
|
2
2
|
|
|
3
3
|
.modules-event-topbar {
|
|
4
4
|
display: flex;
|
|
5
|
-
justify-content:
|
|
5
|
+
justify-content: space-between;
|
|
6
6
|
margin: 8px 0;
|
|
7
|
-
padding
|
|
7
|
+
padding: 0 16px;
|
|
8
|
+
&-title {
|
|
9
|
+
display: flex;
|
|
10
|
+
align-items: center;
|
|
11
|
+
.fanhuiicon {
|
|
12
|
+
margin-right: 8px;
|
|
13
|
+
color: #5f6085;
|
|
14
|
+
cursor: pointer;
|
|
15
|
+
}
|
|
16
|
+
> span {
|
|
17
|
+
color: var(--io-N-, #021429);
|
|
18
|
+
font-weight: 500;
|
|
19
|
+
font-size: 16px;
|
|
20
|
+
font-family: 'PingFang SC';
|
|
21
|
+
font-style: normal;
|
|
22
|
+
line-height: 20px; /* 125% */
|
|
23
|
+
letter-spacing: 0.016px;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
&-right {
|
|
27
|
+
display: flex;
|
|
28
|
+
justify-content: flex-end;
|
|
29
|
+
}
|
|
8
30
|
&-panel {
|
|
9
31
|
margin-right: 16px;
|
|
10
32
|
.ant-btn {
|
|
@@ -32,32 +54,5 @@
|
|
|
32
54
|
display: flex;
|
|
33
55
|
height: 32px;
|
|
34
56
|
line-height: 32px;
|
|
35
|
-
> div {
|
|
36
|
-
position: relative;
|
|
37
|
-
padding: 0 16px;
|
|
38
|
-
background: #fff;
|
|
39
|
-
border: 1px solid #ecedf0;
|
|
40
|
-
cursor: pointer;
|
|
41
|
-
}
|
|
42
|
-
> div:hover,
|
|
43
|
-
.active {
|
|
44
|
-
z-index: 1;
|
|
45
|
-
color: #165dff;
|
|
46
|
-
background: #e8efff;
|
|
47
|
-
border: 1px solid #165dff;
|
|
48
|
-
}
|
|
49
|
-
> :nth-child(1) {
|
|
50
|
-
border-radius: 4px 0 0 4px;
|
|
51
|
-
}
|
|
52
|
-
> :nth-child(2) {
|
|
53
|
-
margin-left: -1px;
|
|
54
|
-
}
|
|
55
|
-
> :nth-child(3) {
|
|
56
|
-
margin-left: -1px;
|
|
57
|
-
}
|
|
58
|
-
> :nth-child(4) {
|
|
59
|
-
margin-left: -1px;
|
|
60
|
-
border-radius: 0 4px 4px 0;
|
|
61
|
-
}
|
|
62
57
|
}
|
|
63
58
|
}
|
package/es/constants/apis.d.ts
CHANGED
|
@@ -2,7 +2,9 @@ declare const Apis: {
|
|
|
2
2
|
dataList: string;
|
|
3
3
|
getEventDataSql: string;
|
|
4
4
|
eventDownloadReport: string;
|
|
5
|
-
queryAllSubjectApi: string;
|
|
6
5
|
querySubDisplayApi: string;
|
|
6
|
+
relationSaveConfig: string;
|
|
7
|
+
queryRelationConfig: string;
|
|
8
|
+
getEventSwitch: string;
|
|
7
9
|
};
|
|
8
10
|
export default Apis;
|
package/es/constants/apis.js
CHANGED
|
@@ -2,7 +2,9 @@ var Apis = {
|
|
|
2
2
|
dataList: '/zg/web/v2/data/eventDataList',
|
|
3
3
|
getEventDataSql: '/zg/web/v2/dataSql/getEventDataSql',
|
|
4
4
|
eventDownloadReport: '/zg/web/v2/data/eventDownloadReport',
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
querySubDisplayApi: '/zg/web/v2/analysisSubject/querySubDisplay',
|
|
6
|
+
relationSaveConfig: '/zg/web/v2/event/relation/saveConfig',
|
|
7
|
+
queryRelationConfig: '/zg/web/v2/event/queryRelationConfig',
|
|
8
|
+
getEventSwitch: '/zg/web/v2/event/getEventSwitch'
|
|
7
9
|
};
|
|
8
10
|
export default Apis;
|
package/es/constants/fields.d.ts
CHANGED
|
@@ -249,17 +249,3 @@ export declare const addSceneFields: ({
|
|
|
249
249
|
options?: undefined;
|
|
250
250
|
fieldNames?: undefined;
|
|
251
251
|
})[];
|
|
252
|
-
export declare const indexObject: {
|
|
253
|
-
[key: string]: string;
|
|
254
|
-
};
|
|
255
|
-
export declare const BuiltinIndicators: {
|
|
256
|
-
id: number;
|
|
257
|
-
name: string;
|
|
258
|
-
eventList: {
|
|
259
|
-
name: string;
|
|
260
|
-
id: number;
|
|
261
|
-
type: string;
|
|
262
|
-
isBuiltIn: boolean;
|
|
263
|
-
attrList: never[];
|
|
264
|
-
}[];
|
|
265
|
-
};
|
package/es/constants/fields.js
CHANGED
|
@@ -174,48 +174,4 @@ export var addSceneFields = [{
|
|
|
174
174
|
required: true,
|
|
175
175
|
message: '请输入场景名称'
|
|
176
176
|
}]
|
|
177
|
-
}];
|
|
178
|
-
export var indexObject = {
|
|
179
|
-
number: '人数',
|
|
180
|
-
times: '次数',
|
|
181
|
-
per: '人均次数',
|
|
182
|
-
sum: '总和',
|
|
183
|
-
avg: '均值',
|
|
184
|
-
duration_times: '分布',
|
|
185
|
-
median: '中位数'
|
|
186
|
-
};
|
|
187
|
-
export var BuiltinIndicators = {
|
|
188
|
-
id: -2,
|
|
189
|
-
name: '整体',
|
|
190
|
-
eventList: [{
|
|
191
|
-
name: '新增用户',
|
|
192
|
-
id: -201,
|
|
193
|
-
type: 'add',
|
|
194
|
-
isBuiltIn: true,
|
|
195
|
-
attrList: []
|
|
196
|
-
}, {
|
|
197
|
-
name: '活跃用户',
|
|
198
|
-
id: -202,
|
|
199
|
-
type: 'active',
|
|
200
|
-
isBuiltIn: true,
|
|
201
|
-
attrList: []
|
|
202
|
-
}, {
|
|
203
|
-
name: '访问次数',
|
|
204
|
-
id: -203,
|
|
205
|
-
type: 'times',
|
|
206
|
-
isBuiltIn: true,
|
|
207
|
-
attrList: []
|
|
208
|
-
}, {
|
|
209
|
-
name: '平均使用时长',
|
|
210
|
-
id: -204,
|
|
211
|
-
type: 'duration_avg',
|
|
212
|
-
isBuiltIn: true,
|
|
213
|
-
attrList: []
|
|
214
|
-
}, {
|
|
215
|
-
name: '使用时长分布',
|
|
216
|
-
id: -205,
|
|
217
|
-
type: 'duration',
|
|
218
|
-
isBuiltIn: true,
|
|
219
|
-
attrList: []
|
|
220
|
-
}]
|
|
221
|
-
};
|
|
177
|
+
}];
|
|
@@ -4,8 +4,13 @@ import { searchData, totalResult, totalSearchData } from './data';
|
|
|
4
4
|
export default (function () {
|
|
5
5
|
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h2", null, "\u8D8B\u52BF\u56FE\u8868\u683C"), /*#__PURE__*/React.createElement(EventChart, {
|
|
6
6
|
params: searchData
|
|
7
|
-
}), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h2", null, "\u6C47\u603B\u56FE\u8868\u683C"), /*#__PURE__*/React.createElement(
|
|
7
|
+
}), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h2", null, "\u6C47\u603B\u56FE\u8868\u683C"), /*#__PURE__*/React.createElement("div", {
|
|
8
|
+
style: {
|
|
9
|
+
width: 500,
|
|
10
|
+
height: 500
|
|
11
|
+
}
|
|
12
|
+
}, /*#__PURE__*/React.createElement(EventChart, {
|
|
8
13
|
dataSource: totalResult,
|
|
9
14
|
params: totalSearchData
|
|
10
|
-
}));
|
|
15
|
+
})));
|
|
11
16
|
});
|