@zgfe/modules-event 1.0.29-zhongyuan.8 → 1.0.29-zhongyuan1.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.
@@ -1,241 +1,249 @@
1
- .event-mi-table {
2
- margin-top: 16px;
3
- &-loading {
4
- min-height: 300px;
5
- }
6
- &-table-header {
7
- display: flex;
8
- align-items: center;
9
- justify-content: space-between;
10
- height: 50px;
11
- margin-bottom: -1px;
12
- padding: 0 12px;
13
- line-height: 50px;
14
- background: #fafafb;
15
- border: 1px solid #e6e7ea;
16
- border-radius: 8px 8px 0 0;
17
- > :nth-child(2) {
18
- display: flex;
19
- > :nth-child(1) {
20
- margin-right: 16px;
21
- }
22
- div {
23
- height: 32px;
24
- padding: 0 16px;
25
- line-height: 32px;
26
- background: #fff;
27
- border: 1px solid #f2f3f4;
28
- border-radius: 4px;
29
- cursor: pointer;
30
- .xiazai1 {
31
- margin-right: 4px;
32
- font-size: 18px !important;
33
- vertical-align: -2px;
34
- }
35
- }
36
- div:hover {
37
- color: #165dff;
38
- background: #e8efff;
39
- border: 1px solid #165dff;
40
- }
41
- div:active {
42
- color: #1454e5;
43
- background: #e8efff;
44
- border: 1px solid #1454e5;
45
- }
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
- }
82
- }
83
- .ant-table {
84
- border-radius: 0 0 8px 8px;
85
- }
86
- .sourcepanel-table-header {
87
- overflow: hidden;
88
- border-radius: 8px 8px 0 0;
89
- .ant-table {
90
- max-height: none;
91
- }
92
- }
93
- .ant-pagination {
94
- margin-top: 24px !important;
95
- }
96
- .ant-table
97
- .ant-table-thead
98
- .ant-table-cell.ant-table-column-has-sorters
99
- .ant-table-column-sorters {
100
- justify-content: flex-end !important;
101
- }
102
- .ant-table-cell-with-append {
103
- padding-left: 20px;
104
- .ant-table-row-expand-icon {
105
- position: absolute;
106
- left: 0;
107
- margin-top: 0;
108
- }
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
- }
123
- .tooltip-name-box {
124
- display: flex;
125
- &-market {
126
- // max-width: calc(100% - 20px);
127
- margin-right: 8px;
128
- overflow: hidden;
129
- white-space: nowrap;
130
- text-overflow: ellipsis;
131
- cursor: pointer;
132
- -webkit-line-clamp: 1;
133
- -webkit-box-orient: vertical;
134
- .shoucang {
135
- color: #fd9f41;
136
- font-size: 16px !important;
137
- }
138
- .notshoucang {
139
- opacity: 0;
140
- }
141
- }
142
-
143
- .fuzhi1 {
144
- display: none;
145
- font-size: 16px !important;
146
- }
147
- .fuzhi1:hover {
148
- color: #165dff;
149
- }
150
- }
151
- .tooltip-name-box:hover {
152
- .fuzhi1 {
153
- display: block;
154
- }
155
- }
156
-
157
- &-table-empty {
158
- img {
159
- width: 50px !important;
160
- height: auto;
161
- margin-top: 30px;
162
- margin-bottom: 10px;
163
- }
164
- p {
165
- color: rgba(0, 0, 0, 0.25);
166
- }
167
- }
168
-
169
- &-chart-box {
170
- display: flex;
171
- flex-direction: column;
172
- width: 100%;
173
- &-tooltip {
174
- width: 200px;
175
- margin-bottom: 24px;
176
- color: #67727f;
177
- font-size: 12px;
178
- }
179
- }
180
- }
181
- .event-table-sql-modal {
182
- .ant-modal {
183
- width: 720px !important;
184
- }
185
- .ant-modal-header {
186
- position: relative;
187
- z-index: 1;
188
- height: 82px;
189
- background: transparent;
190
- }
191
- .ant-modal-body {
192
- padding: 0 24px 24px 24px;
193
- }
194
- .ant-modal-close-x {
195
- margin-top: 13px;
196
- margin-right: 8px;
197
- }
198
- img {
199
- width: 100%;
200
- }
201
- .qingchu {
202
- font-weight: 500;
203
- font-size: 22px !important;
204
- }
205
- .modal-bg {
206
- position: absolute;
207
- top: 0;
208
- left: 0;
209
- width: 100%;
210
- height: auto;
211
- }
212
- pre {
213
- margin-bottom: 0;
214
- }
215
- .hljs {
216
- height: 400px;
217
- padding: 16px;
218
- padding-bottom: 0;
219
- background: #fafafb;
220
- border-radius: 8px;
221
- }
222
- .copy-box {
223
- position: absolute;
224
- top: 98px;
225
- right: 40px;
226
- padding: 0 8px;
227
- background: #f2f3f4;
228
- border-radius: 4px;
229
- .fuzhi1 {
230
- margin-right: 8px;
231
- }
232
- }
233
- .copy-box:hover {
234
- color: #165dff;
235
- background: #e8efff;
236
- }
237
- .copy-box:active {
238
- color: #1454e5;
239
- background: #e8efff;
240
- }
241
- }
1
+ .event-mi-table {
2
+ margin-top: 16px;
3
+ &-loading {
4
+ min-height: 300px;
5
+ }
6
+ &-table-header {
7
+ display: flex;
8
+ align-items: center;
9
+ justify-content: space-between;
10
+ height: 50px;
11
+ margin-bottom: -1px;
12
+ padding: 0 12px;
13
+ line-height: 50px;
14
+ background: #fafafb;
15
+ border: 1px solid #e6e7ea;
16
+ border-radius: 8px 8px 0 0;
17
+ > :nth-child(2) {
18
+ display: flex;
19
+ > :nth-child(1) {
20
+ margin-right: 16px;
21
+ }
22
+ div {
23
+ height: 32px;
24
+ padding: 0 16px;
25
+ line-height: 32px;
26
+ background: #fff;
27
+ border: 1px solid #f2f3f4;
28
+ border-radius: 4px;
29
+ cursor: pointer;
30
+ .xiazai1 {
31
+ margin-right: 4px;
32
+ font-size: 18px !important;
33
+ vertical-align: -2px;
34
+ }
35
+ }
36
+ div:hover {
37
+ color: #165dff;
38
+ background: #e8efff;
39
+ border: 1px solid #165dff;
40
+ }
41
+ div:active {
42
+ color: #1454e5;
43
+ background: #e8efff;
44
+ border: 1px solid #1454e5;
45
+ }
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
+ }
82
+ }
83
+ .ant-table {
84
+ border-radius: 0 0 8px 8px;
85
+ }
86
+ .sourcepanel-table-header {
87
+ overflow: hidden;
88
+ border-radius: 8px 8px 0 0;
89
+ .ant-table {
90
+ max-height: none;
91
+ }
92
+ }
93
+ .ant-pagination {
94
+ margin-top: 24px !important;
95
+ }
96
+ .ant-table
97
+ .ant-table-thead
98
+ .ant-table-cell.ant-table-column-has-sorters
99
+ .ant-table-column-sorters {
100
+ justify-content: flex-end !important;
101
+ }
102
+ .ant-table-cell-with-append {
103
+ padding-left: 20px;
104
+ .ant-table-row-expand-icon {
105
+ position: absolute;
106
+ left: 0;
107
+ margin-top: 0;
108
+ }
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
+ }
123
+ .tooltip-name-box {
124
+ display: flex;
125
+ &-market {
126
+ // max-width: calc(100% - 20px);
127
+ width: 180px;
128
+ margin-right: 8px;
129
+ overflow: hidden;
130
+ white-space: nowrap;
131
+ text-overflow: ellipsis;
132
+ cursor: pointer;
133
+ -webkit-line-clamp: 1;
134
+ -webkit-box-orient: vertical;
135
+ .shoucang {
136
+ color: #fd9f41;
137
+ font-size: 16px !important;
138
+ }
139
+ .notshoucang {
140
+ opacity: 0;
141
+ }
142
+ }
143
+
144
+ .fuzhi1 {
145
+ display: none;
146
+ font-size: 16px !important;
147
+ }
148
+ .fuzhi1:hover {
149
+ color: #165dff;
150
+ }
151
+ }
152
+ .tooltip-name-box:hover {
153
+ .fuzhi1 {
154
+ display: block;
155
+ }
156
+ }
157
+
158
+ &-table-empty {
159
+ img {
160
+ width: 50px !important;
161
+ height: auto;
162
+ margin-top: 30px;
163
+ margin-bottom: 10px;
164
+ }
165
+ p {
166
+ color: rgba(0, 0, 0, 0.25);
167
+ }
168
+ }
169
+
170
+ &-chart-box {
171
+ display: flex;
172
+ flex-direction: column;
173
+ width: 100%;
174
+ &-tooltip {
175
+ width: 200px;
176
+ margin-bottom: 24px;
177
+ color: #67727f;
178
+ font-size: 12px;
179
+ }
180
+ }
181
+ }
182
+ .event-table-sql-modal {
183
+ .ant-modal {
184
+ width: 720px !important;
185
+ }
186
+ .ant-modal-header {
187
+ position: relative;
188
+ z-index: 1;
189
+ height: 82px;
190
+ background: transparent;
191
+ }
192
+ .ant-modal-body {
193
+ padding: 0 24px 24px 24px;
194
+ }
195
+ .ant-modal-close-x {
196
+ margin-top: 13px;
197
+ margin-right: 8px;
198
+ }
199
+ img {
200
+ width: 100%;
201
+ }
202
+ .qingchu {
203
+ font-weight: 500;
204
+ font-size: 22px !important;
205
+ }
206
+ .modal-bg {
207
+ position: absolute;
208
+ top: 0;
209
+ left: 0;
210
+ width: 100%;
211
+ height: auto;
212
+ }
213
+ pre {
214
+ margin-bottom: 0;
215
+ }
216
+ .hljs {
217
+ height: 400px;
218
+ padding: 16px;
219
+ padding-bottom: 0;
220
+ background: #fafafb;
221
+ border-radius: 8px;
222
+ }
223
+ .copy-box {
224
+ position: absolute;
225
+ top: 98px;
226
+ right: 40px;
227
+ padding: 0 8px;
228
+ background: #f2f3f4;
229
+ border-radius: 4px;
230
+ .fuzhi1 {
231
+ margin-right: 8px;
232
+ }
233
+ }
234
+ .copy-box:hover {
235
+ color: #165dff;
236
+ background: #e8efff;
237
+ }
238
+ .copy-box:active {
239
+ color: #1454e5;
240
+ background: #e8efff;
241
+ }
242
+ }
243
+ .ant-modal-content {
244
+ position: relative;
245
+ .sql-tip {
246
+ position: absolute;
247
+ bottom: 30px;
248
+ }
249
+ }
@@ -1,58 +1,58 @@
1
- @import '~@zgfe/business-lib/es/assets/styles/inner.less';
2
-
3
- .modules-event-topbar {
4
- display: flex;
5
- justify-content: space-between;
6
- margin: 8px 0;
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
- }
30
- &-panel {
31
- margin-right: 16px;
32
- .ant-btn {
33
- background: #fff;
34
- border-color: #f2f3f4;
35
- }
36
- .ant-btn:hover {
37
- border-color: #165dff;
38
- }
39
- }
40
- &-scene {
41
- margin-right: 16px;
42
- .ant-btn {
43
- background: #fff;
44
- border-color: #f2f3f4;
45
- }
46
- .ant-btn:hover {
47
- border-color: #165dff;
48
- }
49
- }
50
- &-earlywarning {
51
- margin-right: 16px;
52
- }
53
- &-platform {
54
- display: flex;
55
- height: 32px;
56
- line-height: 32px;
57
- }
58
- }
1
+ @import '~@zgfe/business-lib/es/assets/styles/inner.less';
2
+
3
+ .modules-event-topbar {
4
+ display: flex;
5
+ justify-content: space-between;
6
+ margin: 8px 0;
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
+ }
30
+ &-panel {
31
+ margin-right: 16px;
32
+ .ant-btn {
33
+ background: #fff;
34
+ border-color: #f2f3f4;
35
+ }
36
+ .ant-btn:hover {
37
+ border-color: #165dff;
38
+ }
39
+ }
40
+ &-scene {
41
+ margin-right: 16px;
42
+ .ant-btn {
43
+ background: #fff;
44
+ border-color: #f2f3f4;
45
+ }
46
+ .ant-btn:hover {
47
+ border-color: #165dff;
48
+ }
49
+ }
50
+ &-earlywarning {
51
+ margin-right: 16px;
52
+ }
53
+ &-platform {
54
+ display: flex;
55
+ height: 32px;
56
+ line-height: 32px;
57
+ }
58
+ }
package/es/index.d.ts CHANGED
@@ -2,4 +2,5 @@
2
2
  import EventChart from './modules/chart';
3
3
  import ModuleEvent from './modules/home';
4
4
  import { getNumberPanelData } from './modules/content/utils';
5
- export { ModuleEvent, EventChart, getNumberPanelData };
5
+ import EventFilter from './components/eventFilter';
6
+ export { ModuleEvent, EventChart, getNumberPanelData, EventFilter };
package/es/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import EventChart from './modules/chart';
2
2
  import ModuleEvent from './modules/home';
3
3
  import { getNumberPanelData } from './modules/content/utils';
4
- export { ModuleEvent, EventChart, getNumberPanelData };
4
+ import EventFilter from './components/eventFilter';
5
+ export { ModuleEvent, EventChart, getNumberPanelData, EventFilter };
@@ -181,13 +181,19 @@ var EventChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
181
181
  title: '当前图表数据实时更新,约每分钟更新一次'
182
182
  }, /*#__PURE__*/React.createElement("div", null, "\u6570\u636E\u66F4\u65B0\u65F6\u95F4\uFF1A", moment().format('YYYY-MM-DD HH:mm')));
183
183
  };
184
- var tooltipFormatter = function tooltipFormatter(params) {
184
+ var tooltipFormatter = function tooltipFormatter(data) {
185
185
  var xLabel = '';
186
+ var params = data[0] ? data : [data];
186
187
  var array = params[0].name.split('|');
187
188
  if (array.length > 1) {
188
189
  xLabel = moment(array[0]).format('MM-DD') + '~' + moment(array[1]).format('MM-DD');
189
190
  } else {
190
- xLabel = moment(array[0]).isValid() ? moment(array[0]).format('MM-DD') : array[0];
191
+ var _props$params, _props$params$time, _props$params2, _props$params2$time;
192
+ if ((props === null || props === void 0 ? void 0 : (_props$params = props.params) === null || _props$params === void 0 ? void 0 : (_props$params$time = _props$params.time) === null || _props$params$time === void 0 ? void 0 : _props$params$time.unit) == 'hour') {
193
+ xLabel = moment(array[0]).isValid() ? moment(array[0]).format('MM-DD HH') : array[0];
194
+ } else if ((props === null || props === void 0 ? void 0 : (_props$params2 = props.params) === null || _props$params2 === void 0 ? void 0 : (_props$params2$time = _props$params2.time) === null || _props$params2$time === void 0 ? void 0 : _props$params2$time.unit) == 'minute') {
195
+ xLabel = moment(array[0]).isValid() ? moment(array[0]).format('MM-DD HH:mm') : array[0];
196
+ } else xLabel = moment(array[0]).isValid() ? moment(array[0]).format('MM-DD') : array[0];
191
197
  }
192
198
  var series = [];
193
199
  var seriesMap = {};
@@ -1,19 +1,19 @@
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
- }
13
- .event-content {
14
- &-options {
15
- display: flex;
16
- justify-content: flex-end;
17
- margin-bottom: 16px;
18
- }
19
- }
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
+ }
13
+ .event-content {
14
+ &-options {
15
+ display: flex;
16
+ justify-content: flex-end;
17
+ margin-bottom: 16px;
18
+ }
19
+ }