|
|
|
1
|
+layui.define(['common', 'swiper', 'admin', 'commonDetail', 'mxClient', 'msgTips', 'laytpl', 'form', 'sessions', 'table', 'sockjs', 'stomp'], function (exports) {
|
|
|
|
2
|
+ var $ = layui.$;
|
|
|
|
3
|
+ var admin = layui.admin;
|
|
|
|
4
|
+ var mxClient = layui.mxClient;
|
|
|
|
5
|
+ var currentBizId = '';//当前业务ID
|
|
|
|
6
|
+ var mxcellNodeDatas = {};//缓存拓扑节点业务数据
|
|
|
|
7
|
+ var nodesTipsDatas = {};//暂存拓扑的悬浮提示信息
|
|
|
|
8
|
+ var mxcellNodesAlarms = [];//缓存拓扑节点的告警信息
|
|
|
|
9
|
+ var mxcellNodesAlarmFlag = {};//节点是否有告警标识
|
|
|
|
10
|
+ var tabsPage = admin.mainTabsPage;
|
|
|
|
11
|
+ var alarmTimerStep = 60 * 1000;
|
|
|
|
12
|
+ var mxcellNodeRessType = {};//拓扑节点绑定资源的资源类型
|
|
|
|
13
|
+ var nodeAlarmTipsDom = {};//拓扑节点的告警提示信息
|
|
|
|
14
|
+ var msgTips = layui.msgTips;
|
|
|
|
15
|
+ var view = layui.view;
|
|
|
|
16
|
+ var table = layui.table;
|
|
|
|
17
|
+
|
|
|
|
18
|
+ //对外暴露的接口
|
|
|
|
19
|
+ exports('main-biz-turn', function () {
|
|
|
|
20
|
+ var common = layui.common;
|
|
|
|
21
|
+ var commonDetail = layui.commonDetail;
|
|
|
|
22
|
+ var form = layui.form;
|
|
|
|
23
|
+ var laytpl = layui.laytpl;
|
|
|
|
24
|
+ var sessions = layui.sessions;
|
|
|
|
25
|
+ var accessToken = common.getMjToken();
|
|
|
|
26
|
+ var access_token = sessions.getToken().access_token;
|
|
|
|
27
|
+
|
|
|
|
28
|
+ var isNewPwd = sessionStorage.getItem("isNewPwd");
|
|
|
|
29
|
+
|
|
|
|
30
|
+ //joke add 20210506
|
|
|
|
31
|
+ //判定是否第一次登录
|
|
|
|
32
|
+ if (localStorage.getItem("lgn") != 'admin') {
|
|
|
|
33
|
+ // checkFirstLogin();
|
|
|
|
34
|
+ // getPwdLevel();
|
|
|
|
35
|
+ }
|
|
|
|
36
|
+
|
|
|
|
37
|
+ //joke add 20210506 获取密码级别
|
|
|
|
38
|
+ function getPwdLevel() {
|
|
|
|
39
|
+ admin.req({
|
|
|
|
40
|
+ url: common.domainName + '/api-web/sysConf/getConfByCode?code=pwd_level'
|
|
|
|
41
|
+ , type: "get"
|
|
|
|
42
|
+ , async: false
|
|
|
|
43
|
+ , done: function (data) {
|
|
|
|
44
|
+ if (data && data.object && data.success === true && data.object.ddicDesc) {
|
|
|
|
45
|
+ checkPassword(data.object.ddicDesc.split(' ')[0], data.str);
|
|
|
|
46
|
+ }
|
|
|
|
47
|
+ }
|
|
|
|
48
|
+ });
|
|
|
|
49
|
+ }
|
|
|
|
50
|
+
|
|
|
|
51
|
+ function checkPassword(pattern, oldPwd) {
|
|
|
|
52
|
+ var msg = "密码安全等级过低，请修改密码";
|
|
|
|
53
|
+ var password = localStorage.getItem("password");
|
|
|
|
54
|
+ //新建用户或重置密码后，会给用户isNewPwd赋值为1，用此字段判定是否要修改密码
|
|
|
|
55
|
+ if (isNewPwd === '1') {
|
|
|
|
56
|
+ msg = "初始密码安全等级过低，请修改密码";
|
|
|
|
57
|
+ }
|
|
|
|
58
|
+ var flag = new RegExp(pattern).test(password);
|
|
|
|
59
|
+ if (!flag || isNewPwd === '1') { //如果不满足，则提示密码弱，需要修改密码
|
|
|
|
60
|
+ localStorage.setItem("showChangePwd", "Y");
|
|
|
|
61
|
+ layer.msg(msg, {
|
|
|
|
62
|
+ offset: '15px'
|
|
|
|
63
|
+ , icon: 7
|
|
|
|
64
|
+ , time: 2000
|
|
|
|
65
|
+ }, function () {
|
|
|
|
66
|
+ view('data-setting-pwd').render('/template/user/password').then(function (res) {
|
|
|
|
67
|
+ layer.open({
|
|
|
|
68
|
+ title: ['修改密码', 'font-size:18px;'],
|
|
|
|
69
|
+ type: 1,
|
|
|
|
70
|
+ area: ['450px', '300px'],
|
|
|
|
71
|
+ content: res.body,
|
|
|
|
72
|
+ closeBtn: 0,
|
|
|
|
73
|
+ success: function (data) {
|
|
|
|
74
|
+
|
|
|
|
75
|
+ },
|
|
|
|
76
|
+ });
|
|
|
|
77
|
+ });
|
|
|
|
78
|
+ // localStorage.removeItem("password");
|
|
|
|
79
|
+ });
|
|
|
|
80
|
+ }
|
|
|
|
81
|
+ }
|
|
|
|
82
|
+
|
|
|
|
83
|
+
|
|
|
|
84
|
+ //加载业务信息
|
|
|
|
85
|
+ loadBizInfo();
|
|
|
|
86
|
+ //加载右下角弹窗
|
|
|
|
87
|
+ // loadRightBottomTips();
|
|
|
|
88
|
+
|
|
|
|
89
|
+
|
|
|
|
90
|
+ //业务健康悬浮提示
|
|
|
|
91
|
+ var subtips;
|
|
|
|
92
|
+ $("#indexTopHealth").hover(function () {
|
|
|
|
93
|
+ openMsg();
|
|
|
|
94
|
+ }, function () {
|
|
|
|
95
|
+ layer.close(subtips);
|
|
|
|
96
|
+ });
|
|
|
|
97
|
+
|
|
|
|
98
|
+ function openMsg() {
|
|
|
|
99
|
+ subtips = layer.tips("<span style='color:#585858;'>所有业务的整体健康情况</br>" +
|
|
|
|
100
|
+ "所有业务为正常状态则整体情况为正常，否则为异常</span>",
|
|
|
|
101
|
+ '#indexTopHealth', {tips: [2, '#F0F0F0']});
|
|
|
|
102
|
+ }
|
|
|
|
103
|
+
|
|
|
|
104
|
+ //轮播
|
|
|
|
105
|
+ function banner() {
|
|
|
|
106
|
+ var timer = null;
|
|
|
|
107
|
+ var STEP = 1000 * 10; // 10s,每十秒轮播一次
|
|
|
|
108
|
+ var indexBannerBtn = $('#indexBannerBtn');
|
|
|
|
109
|
+
|
|
|
|
110
|
+ function run(slide, index) {
|
|
|
|
111
|
+ var item = null;
|
|
|
|
112
|
+ if (index === -1) {
|
|
|
|
113
|
+ item = slide.find('.index-banner-item').first().addClass('active');
|
|
|
|
114
|
+ } else {
|
|
|
|
115
|
+ item = slide.find('.index-banner-item').eq(index).addClass('active');
|
|
|
|
116
|
+ }
|
|
|
|
117
|
+ currentBizId = item.data("id");
|
|
|
|
118
|
+ // 内部 banner 切换调用
|
|
|
|
119
|
+ render(item.data('topoid'));
|
|
|
|
120
|
+ getAlarmCount(currentBizId);
|
|
|
|
121
|
+ getAlarmList(currentBizId);
|
|
|
|
122
|
+
|
|
|
|
123
|
+ function fn() {
|
|
|
|
124
|
+ var target = slide.find('.index-banner-item.active').removeClass('active');
|
|
|
|
125
|
+ if (target.next().length === 0) {
|
|
|
|
126
|
+ target = slide.find('.index-banner-item').first().addClass('active');
|
|
|
|
127
|
+ } else {
|
|
|
|
128
|
+ target = target.next().addClass('active');
|
|
|
|
129
|
+ }
|
|
|
|
130
|
+ currentBizId = target.data("id");
|
|
|
|
131
|
+ // 内部 banner 切换调用
|
|
|
|
132
|
+ render(target.data('topoid'), function () {
|
|
|
|
133
|
+ timer = setTimeout(fn, STEP);
|
|
|
|
134
|
+ });
|
|
|
|
135
|
+
|
|
|
|
136
|
+ getAlarmCount(currentBizId);
|
|
|
|
137
|
+ getAlarmList(currentBizId);
|
|
|
|
138
|
+ }
|
|
|
|
139
|
+
|
|
|
|
140
|
+ timer = setTimeout(fn, STEP);
|
|
|
|
141
|
+ }
|
|
|
|
142
|
+
|
|
|
|
143
|
+ var indexBanner = new Swiper('#indexBanner', {
|
|
|
|
144
|
+ autoplay: false,
|
|
|
|
145
|
+ loop: true,
|
|
|
|
146
|
+ speed: 1000,
|
|
|
|
147
|
+ threshold: 100,
|
|
|
|
148
|
+ // 如果需要前进后退按钮
|
|
|
|
149
|
+ prevButton: '#indexBannerLeft',
|
|
|
|
150
|
+ nextButton: '#indexBannerRight',
|
|
|
|
151
|
+ onSlideChangeStart: function (swiper) {
|
|
|
|
152
|
+ var slide = $(swiper.slides[swiper.activeIndex]);
|
|
|
|
153
|
+ slide.parents('.swiper-wrapper').find('.index-banner-item.active').removeClass('active');
|
|
|
|
154
|
+ },
|
|
|
|
155
|
+ onSlideChangeEnd: function (swiper) {
|
|
|
|
156
|
+ if (indexBannerBtn.hasClass('pause')) {
|
|
|
|
157
|
+ clearTimeout(timer);
|
|
|
|
158
|
+ var slide = $(swiper.slides[swiper.activeIndex]);
|
|
|
|
159
|
+ run(slide, -1);
|
|
|
|
160
|
+ }
|
|
|
|
161
|
+ }
|
|
|
|
162
|
+ });
|
|
|
|
163
|
+
|
|
|
|
164
|
+ indexBannerBtn.click(function () {
|
|
|
|
165
|
+ var target = $(indexBanner.slides[indexBanner.activeIndex]);
|
|
|
|
166
|
+ if ($(this).hasClass('pause')) {
|
|
|
|
167
|
+ $(this).removeClass('pause');
|
|
|
|
168
|
+ clearTimeout(timer);
|
|
|
|
169
|
+ } else {
|
|
|
|
170
|
+ run(target, target.parents('.swiper-wrapper').find('.index-banner-item.active').index());
|
|
|
|
171
|
+ $(this).addClass('pause');
|
|
|
|
172
|
+ }
|
|
|
|
173
|
+ });
|
|
|
|
174
|
+
|
|
|
|
175
|
+ //业务卡片点击事件
|
|
|
|
176
|
+ $('[data-index-banner-item]').click(function (e) {
|
|
|
|
177
|
+ indexBannerBtn.removeClass('pause');
|
|
|
|
178
|
+ clearTimeout(timer);
|
|
|
|
179
|
+ var target = $(indexBanner.slides[indexBanner.activeIndex]);
|
|
|
|
180
|
+ target.parents('.swiper-wrapper').find('.index-banner-item.active').removeClass('active');
|
|
|
|
181
|
+ $(e.currentTarget).addClass('active');
|
|
|
|
182
|
+
|
|
|
|
183
|
+ currentBizId = $(e.currentTarget).data('id');
|
|
|
|
184
|
+ var topoId = $(e.currentTarget).data('topoid');
|
|
|
|
185
|
+
|
|
|
|
186
|
+ // 内部 banner 切换调用
|
|
|
|
187
|
+ render(topoId);
|
|
|
|
188
|
+ getAlarmCount(currentBizId);
|
|
|
|
189
|
+ getAlarmList(currentBizId);
|
|
|
|
190
|
+ });
|
|
|
|
191
|
+ admin.on('hash(*)', function (router) {
|
|
|
|
192
|
+ if (router.href === '/') {
|
|
|
|
193
|
+ if (tabsPage.type === 'tab') {
|
|
|
|
194
|
+ var target = $(indexBanner.slides[indexBanner.activeIndex]);
|
|
|
|
195
|
+ run($(indexBanner.slides[indexBanner.activeIndex]), target.parents('.swiper-wrapper').find('.index-banner-item.active').index());
|
|
|
|
196
|
+ }
|
|
|
|
197
|
+ } else {
|
|
|
|
198
|
+ clearTimeout(timer);
|
|
|
|
199
|
+ clearTimeout(common.alarmTimer);
|
|
|
|
200
|
+ }
|
|
|
|
201
|
+ });
|
|
|
|
202
|
+
|
|
|
|
203
|
+ // 默认点击启动自动轮播
|
|
|
|
204
|
+ setTimeout(function () {
|
|
|
|
205
|
+ indexBannerBtn.trigger('click');
|
|
|
|
206
|
+ }, 100);
|
|
|
|
207
|
+ }
|
|
|
|
208
|
+
|
|
|
|
209
|
+ var layerRes = {};
|
|
|
|
210
|
+
|
|
|
|
211
|
+ function loadRightBottomTips() {
|
|
|
|
212
|
+ var initTips = sessionStorage.getItem("initTips");
|
|
|
|
213
|
+ if (!initTips) {
|
|
|
|
214
|
+ admin.req({
|
|
|
|
215
|
+ url: common.domainName + "/api-web/home/messageRemind",
|
|
|
|
216
|
+ done: function (res) {
|
|
|
|
217
|
+ sessionStorage.setItem("initTips", "1");
|
|
|
|
218
|
+ var alarm = 0, work = 0, notRead = 0, doubleCheck = 0, toTimeOut = 0;
|
|
|
|
219
|
+ var map = res.map;
|
|
|
|
220
|
+ if (map) {
|
|
|
|
221
|
+ alarm = map['totalCountByUser'], work = map['dayNotReport'] + map['weekNotReport'] + map['monthNotReport'], notRead = map['notReadCountByUser'], doubleCheck = map['doubleCheckRes'], toTimeOut = map['toTimeOut'];
|
|
|
|
222
|
+ if (alarm && alarm > 0) {
|
|
|
|
223
|
+ var alarmMsg = new msgTips({
|
|
|
|
224
|
+ dom: ".right-bottom-tips",
|
|
|
|
225
|
+ title: "告警消息",
|
|
|
|
226
|
+ message: `<p style="line-height: 20px">您有【${alarm}】条告警未处理,请及时关注</p>`,
|
|
|
|
227
|
+ duration: 15000,
|
|
|
|
228
|
+ space: 10,
|
|
|
|
229
|
+ firstSpace: 8,
|
|
|
|
230
|
+ limit: 4,
|
|
|
|
231
|
+ margin: 15,
|
|
|
|
232
|
+ direction: 'right bottom',
|
|
|
|
233
|
+ timingFun: 'ease',
|
|
|
|
234
|
+ width: '300px',
|
|
|
|
235
|
+ toastType: 'error',
|
|
|
|
236
|
+ type: 'click',
|
|
|
|
237
|
+ action: function () {
|
|
|
|
238
|
+ location.hash = "/alarm/activewarning";
|
|
|
|
239
|
+ },
|
|
|
|
240
|
+ })
|
|
|
|
241
|
+ }
|
|
|
|
242
|
+ if (work && work > 0) {
|
|
|
|
243
|
+ var date = common.getPreMonth(common.getToday("day"))
|
|
|
|
244
|
+ var content = `<p >自${date}起，您有【${work}】条日志</p><p>未上报,其中</p><p >月报未上报数量为【${map['monthNotReport']}】</p><p >周报未上报数量为【${map['weekNotReport']}】</p><p >日报未上报数量为【${map['dayNotReport']}】</p><p >请及时填报</p>`
|
|
|
|
245
|
+ setTimeout(function () {
|
|
|
|
246
|
+ var workMsg = new msgTips({
|
|
|
|
247
|
+ dom: ".right-bottom-tips",
|
|
|
|
248
|
+ title: "工作日志消息",
|
|
|
|
249
|
+ duration: 15000,
|
|
|
|
250
|
+ message: content,
|
|
|
|
251
|
+ width: '300px',
|
|
|
|
252
|
+ space: -33,
|
|
|
|
253
|
+ toastType: 'warning',
|
|
|
|
254
|
+ type: 'click',
|
|
|
|
255
|
+ action: function () {
|
|
|
|
256
|
+ location.hash = "/iframe/insp/workreport"
|
|
|
|
257
|
+ },
|
|
|
|
258
|
+ })
|
|
|
|
259
|
+ }, 800)
|
|
|
|
260
|
+ }
|
|
|
|
261
|
+ if (notRead > 0) {
|
|
|
|
262
|
+ setTimeout(function () {
|
|
|
|
263
|
+ var notReadMsg = new msgTips({
|
|
|
|
264
|
+ dom: ".right-bottom-tips",
|
|
|
|
265
|
+ title: "工作日志未读消息",
|
|
|
|
266
|
+ duration: 15000,
|
|
|
|
267
|
+ message: `<p style="line-height: 20px">您有【${notRead}】条工作汇报未读,请及时关注</p>`,
|
|
|
|
268
|
+ toastType: 'warning',
|
|
|
|
269
|
+ space: 10,
|
|
|
|
270
|
+ type: 'click',
|
|
|
|
271
|
+ width: '300px',
|
|
|
|
272
|
+ action: function () {
|
|
|
|
273
|
+ location.hash = "/iframe/insp/workview/read=0/type=1"
|
|
|
|
274
|
+ },
|
|
|
|
275
|
+ })
|
|
|
|
276
|
+ }, 500)
|
|
|
|
277
|
+ }
|
|
|
|
278
|
+ // if(doubleCheck && doubleCheck > 0){
|
|
|
|
279
|
+ // setTimeout(function () {
|
|
|
|
280
|
+ // var doubleCheckMsg = new msgTips({
|
|
|
|
281
|
+ // dom:".right-bottom-tips",
|
|
|
|
282
|
+ // title: "重复监控资源提示消息",
|
|
|
|
283
|
+ // duration:15000,
|
|
|
|
284
|
+ // message:`<p style="line-height: 20px">共有【${doubleCheck}】个资源重复监控,请及时处理</p>`,
|
|
|
|
285
|
+ // toastType:'warning',
|
|
|
|
286
|
+ // space:10,
|
|
|
|
287
|
+ // type:'click',
|
|
|
|
288
|
+ // width:'300px',
|
|
|
|
289
|
+ // action: function () {
|
|
|
|
290
|
+ // },
|
|
|
|
291
|
+ // })
|
|
|
|
292
|
+ // },500)
|
|
|
|
293
|
+ // }
|
|
|
|
294
|
+ if (toTimeOut && toTimeOut > 0) {
|
|
|
|
295
|
+ var toTimeOutDay = map['toTimeOutDay'] ? map['toTimeOutDay'] : 5;
|
|
|
|
296
|
+ setTimeout(function () {
|
|
|
|
297
|
+ var toTimeOutMsg = new msgTips({
|
|
|
|
298
|
+ dom: ".right-bottom-tips",
|
|
|
|
299
|
+ title: "监控资源即将过期提示消息",
|
|
|
|
300
|
+ duration: 15000,
|
|
|
|
301
|
+ message: `<p style="line-height: 20px">共有【${toTimeOut}】个资源的监控账号将在${toTimeOutDay}天内过期</p>`,
|
|
|
|
302
|
+ toastType: 'warning',
|
|
|
|
303
|
+ space: 10,
|
|
|
|
304
|
+ type: 'click',
|
|
|
|
305
|
+ width: '300px',
|
|
|
|
306
|
+ action: function () {
|
|
|
|
307
|
+ layerRes = layer.open({
|
|
|
|
308
|
+ title: '监控账号即将过期资源',
|
|
|
|
309
|
+ id: 'ToTimeOutRes',
|
|
|
|
310
|
+ type: 1,
|
|
|
|
311
|
+ area: ['80%', '90%'],
|
|
|
|
312
|
+ success: function () {
|
|
|
|
313
|
+ view(this.id).render('/baseconfig/resmanage/toTimeOutResList');
|
|
|
|
314
|
+ },
|
|
|
|
315
|
+ yes: function (index, layero) {
|
|
|
|
316
|
+
|
|
|
|
317
|
+ },
|
|
|
|
318
|
+
|
|
|
|
319
|
+ })
|
|
|
|
320
|
+ },
|
|
|
|
321
|
+ })
|
|
|
|
322
|
+ }, 500)
|
|
|
|
323
|
+ }
|
|
|
|
324
|
+ }
|
|
|
|
325
|
+ }
|
|
|
|
326
|
+ });
|
|
|
|
327
|
+ }
|
|
|
|
328
|
+ }
|
|
|
|
329
|
+
|
|
|
|
330
|
+
|
|
|
|
331
|
+ //定时获取节点告警信息
|
|
|
|
332
|
+ function refresNodeAlarms(topoId, indexGraph) {
|
|
|
|
333
|
+ if (!topoId) {
|
|
|
|
334
|
+ return false;
|
|
|
|
335
|
+ }
|
|
|
|
336
|
+ admin.req({
|
|
|
|
337
|
+ url: common.domainName + "/api-web/mxgraph/findAlarmInfo",
|
|
|
|
338
|
+ data: {jtopoId: topoId},
|
|
|
|
339
|
+ done: function (res) {
|
|
|
|
340
|
+ if (res.data && res.data.length > 0) {
|
|
|
|
341
|
+ mxcellNodesAlarms = res.data;
|
|
|
|
342
|
+ }
|
|
|
|
343
|
+ //刷新拓扑节点的提示信息
|
|
|
|
344
|
+ refreshTopoNodeTipsInfo(indexGraph);
|
|
|
|
345
|
+ }
|
|
|
|
346
|
+ });
|
|
|
|
347
|
+ }
|
|
|
|
348
|
+
|
|
|
|
349
|
+ //加载业务信息
|
|
|
|
350
|
+ function loadBizInfo() {
|
|
|
|
351
|
+ var loadIdx = layer.load(2); //加载层
|
|
|
|
352
|
+ admin.req({
|
|
|
|
353
|
+ url: common.domainName + '/api-web/home/business/getBusHealthResult'
|
|
|
|
354
|
+ , type: "get"
|
|
|
|
355
|
+ , done: function (data) {
|
|
|
|
356
|
+ layer.close(loadIdx);
|
|
|
|
357
|
+ if (data.code === 0) {
|
|
|
|
358
|
+ var bizMap = data.map;
|
|
|
|
359
|
+ if (bizMap != null && bizMap.health != '3') {//不等于优
|
|
|
|
360
|
+ $(".index-top-health").find("i").removeClass("icon-health-good").addClass("icon-health");
|
|
|
|
361
|
+ }
|
|
|
|
362
|
+ var bizlist = []
|
|
|
|
363
|
+ if (bizMap != null && bizMap.busList.length > 0) {
|
|
|
|
364
|
+ bizlist = bizMap.busList;
|
|
|
|
365
|
+ //将数组分为长度为6的数组段
|
|
|
|
366
|
+ var newGroup = common.splieceGroup(bizlist, 6);
|
|
|
|
367
|
+ layui.use('laytpl', function () {
|
|
|
|
368
|
+ var laytpl = layui.laytpl;
|
|
|
|
369
|
+ var getTpl = document.getElementById("indexbizhealthTpl").innerHTML;
|
|
|
|
370
|
+ laytpl(getTpl).render(newGroup, function (html) {
|
|
|
|
371
|
+ $('#indexbizhealth').html(html);
|
|
|
|
372
|
+ banner();
|
|
|
|
373
|
+ //点击弹出提示框
|
|
|
|
374
|
+ $(".index-banner-item").on("click", function () {
|
|
|
|
375
|
+ var _this = this;
|
|
|
|
376
|
+ var bizId = $(this).data("id");
|
|
|
|
377
|
+ var dialResult = '';
|
|
|
|
378
|
+ var dialResultStart = '<table class="layui-table"> <thead> <tr> <th>拨测场景</th> <th>拨测结果</th> </tr> </thead> <tbody>';
|
|
|
|
379
|
+ var dialResultEnd = '</tbody> </table>';
|
|
|
|
380
|
+ admin.req({
|
|
|
|
381
|
+ url: common.domainName + '/api-web/home/dialtest/indexInfo?busId=' + bizId
|
|
|
|
382
|
+ , type: "get"
|
|
|
|
383
|
+ , done: function (res) {
|
|
|
|
384
|
+ if (res.data && res.data.length > 0) {
|
|
|
|
385
|
+ var dialResultConent = '';
|
|
|
|
386
|
+ $.each(res.data, function (i, v) {
|
|
|
|
387
|
+ var dialtestResult = "正常";
|
|
|
|
388
|
+ if (v.dialtestResult != '200') {
|
|
|
|
389
|
+ dialtestResult = "异常"
|
|
|
|
390
|
+ }
|
|
|
|
391
|
+ dialResultConent += '<tr> <td>' + v.dialtestName + '</td> <td>' + dialtestResult + '</td> </tr> ';
|
|
|
|
392
|
+ });
|
|
|
|
393
|
+ if (dialResultConent && dialResultConent != '') {
|
|
|
|
394
|
+
|
|
|
|
395
|
+ dialResult = dialResultStart + dialResultConent + dialResultEnd;
|
|
|
|
396
|
+ // bizDialTestInfo = layer.tips(dialResult,_this,{tips:[2,'#F5F5F5'],time:0,area: ['auto', 'auto']});
|
|
|
|
397
|
+ layer.open({
|
|
|
|
398
|
+ type: 1,
|
|
|
|
399
|
+ area: ['50%', '40%'],
|
|
|
|
400
|
+ content: dialResult
|
|
|
|
401
|
+ })
|
|
|
|
402
|
+ }
|
|
|
|
403
|
+ }
|
|
|
|
404
|
+ }
|
|
|
|
405
|
+ });
|
|
|
|
406
|
+ });
|
|
|
|
407
|
+ });
|
|
|
|
408
|
+ });
|
|
|
|
409
|
+ } else {
|
|
|
|
410
|
+ $("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
|
|
|
|
411
|
+ }
|
|
|
|
412
|
+ } else {
|
|
|
|
413
|
+ console.log(data.msg);
|
|
|
|
414
|
+ }
|
|
|
|
415
|
+ }
|
|
|
|
416
|
+
|
|
|
|
417
|
+ }).error(function () {
|
|
|
|
418
|
+ layer.close(loadIdx);
|
|
|
|
419
|
+ $("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
|
|
|
|
420
|
+ });
|
|
|
|
421
|
+ }
|
|
|
|
422
|
+ var viewGraphcontainer = document.getElementById('viewGraphContainer');
|
|
|
|
423
|
+ var viewGraph = new mxGraph(viewGraphcontainer);
|
|
|
|
424
|
+ //加载拓扑图
|
|
|
|
425
|
+ function render(topoId, fn) {
|
|
|
|
426
|
+ if (!mxClient.isBrowserSupported()) {
|
|
|
|
427
|
+ mxUtils.error('浏览器不支持：Browser is not supported!', 200, false);
|
|
|
|
428
|
+ } else {
|
|
|
|
429
|
+ //切换时先清除定时器
|
|
|
|
430
|
+ clearTimeout(common.alarmTimer);
|
|
|
|
431
|
+ if (topoId) {
|
|
|
|
432
|
+ admin.req({
|
|
|
|
433
|
+ url: common.domainName + '/api-web/mxgraph/findByJtopoId',
|
|
|
|
434
|
+ data: {flag: false, jtopoId: topoId}
|
|
|
|
435
|
+ }).done(function (res) {
|
|
|
|
436
|
+ if (res.object && res.object.xmlInfo && (new Date(res.object.createTime) < new Date('2021-03-23 17:28'))) {
|
|
|
|
437
|
+ // 旧版拓扑
|
|
|
|
438
|
+ $('#newViewGraphContainer').addClass('hide');
|
|
|
|
439
|
+ $('#viewGraphContainer').removeClass('hide');
|
|
|
|
440
|
+ var xml = res.object.xmlInfo;
|
|
|
|
441
|
+
|
|
|
|
442
|
+ // 拓扑背景及样式
|
|
|
|
443
|
+ viewGraphcontainer.style.position = 'absolute';
|
|
|
|
444
|
+ viewGraphcontainer.style.overflow = 'hidden';
|
|
|
|
445
|
+ viewGraphcontainer.style.background = 'url("/src/lib/mxgraph/editors/images/grid.gif")';
|
|
|
|
446
|
+
|
|
|
|
447
|
+ // 开启方块上的文字编辑功能，解决分组块不能收缩问题
|
|
|
|
448
|
+ viewGraph.setCellsEditable(false);
|
|
|
|
449
|
+ viewGraph.setCellsSelectable(false);
|
|
|
|
450
|
+ viewGraph.setConnectable(false);
|
|
|
|
451
|
+ viewGraph.setCellsMovable(false);
|
|
|
|
452
|
+ viewGraph.setAllowDanglingEdges(false); // 禁止连接线晃动
|
|
|
|
453
|
+
|
|
|
|
454
|
+ // 左键拖动
|
|
|
|
455
|
+ viewGraph.panningHandler.useLeftButtonForPanning = true;
|
|
|
|
456
|
+ viewGraph.panningHandler.ignoreCell = true;
|
|
|
|
457
|
+ viewGraph.container.style.cursor = 'move';
|
|
|
|
458
|
+ viewGraph.setPanning(true);
|
|
|
|
459
|
+
|
|
|
|
460
|
+ //预览时鼠标悬浮到节点时，改变鼠标样式
|
|
|
|
461
|
+ viewGraph.getCursorForCell = function (cell) {
|
|
|
|
462
|
+ return 'pointer';
|
|
|
|
463
|
+ }
|
|
|
|
464
|
+
|
|
|
|
465
|
+ //开启标签支持html
|
|
|
|
466
|
+ viewGraph.setHtmlLabels(true);
|
|
|
|
467
|
+
|
|
|
|
468
|
+ //悬浮提示
|
|
|
|
469
|
+ viewGraph.setTooltips(true);
|
|
|
|
470
|
+ viewGraph.getTooltipForCell = function (cell) {
|
|
|
|
471
|
+ var topoTipsData = mxCellTipsDatas[cell.cellId];
|
|
|
|
472
|
+ var alarmTipsInfo = mxCellAlarmTipsDom[cell.cellId];
|
|
|
|
473
|
+
|
|
|
|
474
|
+ var tipshtml = '';
|
|
|
|
475
|
+ if (topoTipsData && topoTipsData.length > 0) {
|
|
|
|
476
|
+ tipshtml += createMxCellTipsDom(topoTipsData, cell.cellId);
|
|
|
|
477
|
+ }
|
|
|
|
478
|
+ if (alarmTipsInfo) {
|
|
|
|
479
|
+ if (tipshtml !== '') {
|
|
|
|
480
|
+ tipshtml += "<br>" + alarmTipsInfo
|
|
|
|
481
|
+ } else {
|
|
|
|
482
|
+ tipshtml += alarmTipsInfo
|
|
|
|
483
|
+ }
|
|
|
|
484
|
+ }
|
|
|
|
485
|
+
|
|
|
|
486
|
+ return tipshtml;
|
|
|
|
487
|
+ }
|
|
|
|
488
|
+
|
|
|
|
489
|
+
|
|
|
|
490
|
+ // viewGraph.setEnabled(false);//禁止拖动,禁止后无法收缩
|
|
|
|
491
|
+
|
|
|
|
492
|
+ // 恢复createControl，预览状态下删除按钮状态销毁
|
|
|
|
493
|
+ mxCellRenderer.prototype.createControl = function (state) {
|
|
|
|
494
|
+ var graph = state.view.graph;
|
|
|
|
495
|
+ var image = graph.getFoldingImage(state);
|
|
|
|
496
|
+
|
|
|
|
497
|
+ if (graph.foldingEnabled && image != null) {
|
|
|
|
498
|
+ if (state.control == null) {
|
|
|
|
499
|
+ var b = new mxRectangle(0, 0, image.width, image.height);
|
|
|
|
500
|
+ state.control = new mxImageShape(b, image.src);
|
|
|
|
501
|
+ state.control.preserveImageAspect = false;
|
|
|
|
502
|
+ state.control.dialect = graph.dialect;
|
|
|
|
503
|
+
|
|
|
|
504
|
+ this.initControl(state, state.control, true, this.createControlClickHandler(state));
|
|
|
|
505
|
+ }
|
|
|
|
506
|
+ } else if (state.control != null) {
|
|
|
|
507
|
+ state.control.destroy();
|
|
|
|
508
|
+ state.control = null;
|
|
|
|
509
|
+ }
|
|
|
|
510
|
+ };
|
|
|
|
511
|
+
|
|
|
|
512
|
+ viewGraph.getModel().beginUpdate();
|
|
|
|
513
|
+ try {
|
|
|
|
514
|
+ //回显
|
|
|
|
515
|
+ var viewdoc = mxUtils.parseXml(xml);
|
|
|
|
516
|
+ var viewcodec = new mxCodec(viewdoc);
|
|
|
|
517
|
+ viewcodec.decode(viewdoc.documentElement, viewGraph.getModel());
|
|
|
|
518
|
+
|
|
|
|
519
|
+ //节点点击事件
|
|
|
|
520
|
+ viewGraph.addListener(mxEvent.CLICK, function (source, evt) {
|
|
|
|
521
|
+ if (evt.properties.event.button == 0) {//左键菜单
|
|
|
|
522
|
+ var cell = evt.getProperty('cell');
|
|
|
|
523
|
+ if (cell && cell != null && cell.edge != 1 && cell.childTopoId) {
|
|
|
|
524
|
+ $("#topo_view_childtop").attr("lay-href", "/mxgraph/view/from=v/id=" + cell.childTopoId);
|
|
|
|
525
|
+ $("#topo_view_childtop").trigger("click");
|
|
|
|
526
|
+ }
|
|
|
|
527
|
+ }
|
|
|
|
528
|
+ //渲染线条
|
|
|
|
529
|
+ renderCellEdgeStyle();
|
|
|
|
530
|
+ });
|
|
|
|
531
|
+
|
|
|
|
532
|
+ //禁止浏览器自带右键菜单
|
|
|
|
533
|
+ mxEvent.disableContextMenu(viewGraphcontainer);
|
|
|
|
534
|
+ //增加右键及右键菜单事件
|
|
|
|
535
|
+ viewGraph.popupMenuHandler.factoryMethod = function (menu, cell, evt) {
|
|
|
|
536
|
+ var cellId = cell.cellId;
|
|
|
|
537
|
+ var resIds = [];
|
|
|
|
538
|
+ if (nodeInfo[cellId] != null) {
|
|
|
|
539
|
+ $.each(nodeInfo[cellId], function (i, n) {
|
|
|
|
540
|
+ if (n.resId && $.inArray(n.resId, resIds) == -1) {
|
|
|
|
541
|
+ resIds.push(n.resId);//将节点绑定的资源ID放入集合
|
|
|
|
542
|
+ menu.addItem(n.name, null, function () {
|
|
|
|
543
|
+ common.viewMxGraphNodeResInfo(n.resId);
|
|
|
|
544
|
+ });
|
|
|
|
545
|
+ }
|
|
|
|
546
|
+ });
|
|
|
|
547
|
+ }
|
|
|
|
548
|
+
|
|
|
|
549
|
+ menu.addSeparator();//分割线
|
|
|
|
550
|
+ menu.addItem('查看告警信息', null, function () {
|
|
|
|
551
|
+ if (topoNodesAlarmFlag[cell.cellId]) {
|
|
|
|
552
|
+ $("#topo_view_alarm_info").attr("lay-href", "/alarm/activewarning/resId=" + resIds.toString());
|
|
|
|
553
|
+ $("#topo_view_alarm_info").trigger('click');
|
|
|
|
554
|
+ } else {
|
|
|
|
555
|
+ layer.msg('非常健康，暂无告警信息！', {offset: '15px', icon: 1, time: 3000});
|
|
|
|
556
|
+ }
|
|
|
|
557
|
+ });
|
|
|
|
558
|
+ }
|
|
|
|
559
|
+ // 滚轮缩放事件
|
|
|
|
560
|
+ mxEvent.addMouseWheelListener(function (evt, scrollUp) {
|
|
|
|
561
|
+ if (scrollUp) {
|
|
|
|
562
|
+ // 如果是向上滚滚轮，放大
|
|
|
|
563
|
+ viewGraph.zoomIn();
|
|
|
|
564
|
+ } else {
|
|
|
|
565
|
+ // 反之，缩小
|
|
|
|
566
|
+ viewGraph.zoomOut();
|
|
|
|
567
|
+ }
|
|
|
|
568
|
+ // 取消滚轮默认行为
|
|
|
|
569
|
+ if (evt.preventDefault) {
|
|
|
|
570
|
+ evt.preventDefault();
|
|
|
|
571
|
+ } else {
|
|
|
|
572
|
+ evt.returnValue = false;
|
|
|
|
573
|
+ }
|
|
|
|
574
|
+
|
|
|
|
575
|
+ //渲染线条
|
|
|
|
576
|
+ renderCellEdgeStyle();
|
|
|
|
577
|
+
|
|
|
|
578
|
+ }, viewGraphcontainer);
|
|
|
|
579
|
+
|
|
|
|
580
|
+ } finally {
|
|
|
|
581
|
+ viewGraph.getModel().endUpdate();
|
|
|
|
582
|
+
|
|
|
|
583
|
+ viewGraph.fit();//自适应
|
|
|
|
584
|
+ viewGraph.center(true, true, 0.5, 0.5);//将画布放到容器中间
|
|
|
|
585
|
+ var sc = viewGraph.getView().getScale();//获取当前的缩放比例
|
|
|
|
586
|
+ var scale = Math.round(sc / 2);
|
|
|
|
587
|
+ if (scale) {
|
|
|
|
588
|
+ viewGraph.zoomTo(scale);//在缩放一半，否则是满屏状态，不好看
|
|
|
|
589
|
+ }
|
|
|
|
590
|
+ //渲染线条
|
|
|
|
591
|
+ renderCellEdgeStyle();
|
|
|
|
592
|
+
|
|
|
|
593
|
+ //渲染动画效果,延迟三秒执行
|
|
|
|
594
|
+ setTimeout(function () {
|
|
|
|
595
|
+ getMxCellAlarms();
|
|
|
|
596
|
+ }, 2000)
|
|
|
|
597
|
+
|
|
|
|
598
|
+ //实时更新提示信息
|
|
|
|
599
|
+ realtimeRefreshTopsData(topoId);
|
|
|
|
600
|
+ }
|
|
|
|
601
|
+ } else if (res.object && res.object.xmlInfo && (new Date(res.object.createTime) > new Date('2021-03-23 17:28'))) {
|
|
|
|
602
|
+ // 新版拓扑
|
|
|
|
603
|
+ $('#viewGraphContainer').addClass('hide');
|
|
|
|
604
|
+ $('#newViewGraphContainer').removeClass('hide');
|
|
|
|
605
|
+ $('#newViewGraphContainer iframe').attr('src', `/grapheditor-web/jgraph/grapheditor/viewer.html?access_token=${accessToken}&id=${topoId}`);
|
|
|
|
606
|
+ } else {
|
|
|
|
607
|
+ $('#newViewGraphContainer').addClass('hide');
|
|
|
|
608
|
+ $('#viewGraphContainer').removeClass('hide');
|
|
|
|
609
|
+ $("#viewGraphContainer").html("<div style='text-align: center;width: 100%;font-size:18px;'>暂无拓扑</div>");
|
|
|
|
610
|
+ }
|
|
|
|
611
|
+ });
|
|
|
|
612
|
+ } else {
|
|
|
|
613
|
+ $('#newViewGraphContainer').addClass('hide');
|
|
|
|
614
|
+ $('#viewGraphContainer').removeClass('hide');
|
|
|
|
615
|
+ $("#viewGraphContainer").html("<div style='text-align: center;width: 100%;font-size:18px;'>暂无拓扑</div>");
|
|
|
|
616
|
+ }
|
|
|
|
617
|
+ fn && fn();
|
|
|
|
618
|
+ }
|
|
|
|
619
|
+ }
|
|
|
|
620
|
+
|
|
|
|
621
|
+ //渲染线条的样式，虚线效果
|
|
|
|
622
|
+ function renderCellEdgeStyle() {
|
|
|
|
623
|
+ $.each(viewGraph.getModel().cells, function (idx, cell) {
|
|
|
|
624
|
+ var state = viewGraph.view.getState(cell);
|
|
|
|
625
|
+ if (cell.edge === 1) {//如果是线条效果
|
|
|
|
626
|
+ if (cell.lineAnimate === 'lineAnimate') {
|
|
|
|
627
|
+ createLineAnimation(state, "#6684BA");
|
|
|
|
628
|
+ }
|
|
|
|
629
|
+ if (nodeInfo[cell.cellId] && nodeInfo[cell.cellId].length > 0) {
|
|
|
|
630
|
+ var nodelist = nodeInfo[cell.cellId];
|
|
|
|
631
|
+ for (var i = 0; i < nodelist.length; i++) {
|
|
|
|
632
|
+ var mxcellNode = nodelist[i];
|
|
|
|
633
|
+ if (mxcellNode.flag) {
|
|
|
|
634
|
+ if (mxcellNode.flag.indexOf("net-") === 0 || mxcellNode.flag.indexOf("port-") === 0) {
|
|
|
|
635
|
+ createLineAnimation(state, "#6684BA");
|
|
|
|
636
|
+ }
|
|
|
|
637
|
+ }
|
|
|
|
638
|
+ }
|
|
|
|
639
|
+ }
|
|
|
|
640
|
+ }
|
|
|
|
641
|
+ })
|
|
|
|
642
|
+ getMxCellAlarms();
|
|
|
|
643
|
+ }
|
|
|
|
644
|
+
|
|
|
|
645
|
+ //获取线条或者节点的告警信息，并渲染动态效果
|
|
|
|
646
|
+ function getMxCellAlarms() {
|
|
|
|
647
|
+ topoNodesAlarmFlag = {};
|
|
|
|
648
|
+ if (mxcelltopoNodesAlarms && mxcelltopoNodesAlarms.length > 0) {
|
|
|
|
649
|
+ $.each(mxcelltopoNodesAlarms, function (idx, n) {
|
|
|
|
650
|
+ $.each(viewGraph.getModel().cells, function (i, cell) {
|
|
|
|
651
|
+ var state = viewGraph.view.getState(cell);
|
|
|
|
652
|
+
|
|
|
|
653
|
+ //如果有告警信息
|
|
|
|
654
|
+ if (n.nodeId == cell.cellId) {//匹配上，则表示有告警
|
|
|
|
655
|
+
|
|
|
|
656
|
+ topoNodesAlarmFlag[cell.cellId] = true;
|
|
|
|
657
|
+
|
|
|
|
658
|
+ if (cell.edge === 1) {//如果是线条效果
|
|
|
|
659
|
+ createLineAnimation(state, "#ff0000");
|
|
|
|
660
|
+ } else {
|
|
|
|
661
|
+ //给节点增加告警
|
|
|
|
662
|
+ switch (cell.alarmAnimate) {
|
|
|
|
663
|
+ case "alarm" :
|
|
|
|
664
|
+ viewGraph.setCellWarning(cell, '有告警');
|
|
|
|
665
|
+ break;
|
|
|
|
666
|
+ case "fade" :
|
|
|
|
667
|
+ state.shape.node.setAttribute('class', 'fade');
|
|
|
|
668
|
+ break;
|
|
|
|
669
|
+ case "heart" :
|
|
|
|
670
|
+ state.shape.node.setAttribute('class', 'beating');
|
|
|
|
671
|
+ break;
|
|
|
|
672
|
+ case "flash" :
|
|
|
|
673
|
+ state.shape.node.setAttribute('class', 'breathe');
|
|
|
|
674
|
+ break;
|
|
|
|
675
|
+ default:
|
|
|
|
676
|
+ state.shape.node.setAttribute('class', 'fade');//默认渐隐渐显
|
|
|
|
677
|
+ }
|
|
|
|
678
|
+ }
|
|
|
|
679
|
+ }
|
|
|
|
680
|
+ })
|
|
|
|
681
|
+ });
|
|
|
|
682
|
+ }
|
|
|
|
683
|
+ }
|
|
|
|
684
|
+
|
|
|
|
685
|
+ //生成节点提示dom
|
|
|
|
686
|
+ function createMxCellTipsDom(data) {
|
|
|
|
687
|
+ var tipDom = '';
|
|
|
|
688
|
+ if (data && data.length > 0) {
|
|
|
|
689
|
+ var tips = `<h6>节点信息: ${data[0].ip}</h6>`;
|
|
|
|
690
|
+ var spanDom = '';
|
|
|
|
691
|
+ var kpiDoms = "";
|
|
|
|
692
|
+ $.each(data, function (i, v) {
|
|
|
|
693
|
+ var tipsTitle = '<span class="tilte">' + v.resName + '</span>';
|
|
|
|
694
|
+ if (v.kpi) {
|
|
|
|
695
|
+ $.each(v.kpi, function (idx, kpi) {
|
|
|
|
696
|
+ spanDom += '<span>' + kpi.kpiOtherName + '：' + kpi.kpiValue + kpi.kpiUnit + '</span>';
|
|
|
|
697
|
+ });
|
|
|
|
698
|
+ kpiDoms += tipsTitle + spanDom;
|
|
|
|
699
|
+ }
|
|
|
|
700
|
+ });
|
|
|
|
701
|
+ tipDom += tips + kpiDoms;
|
|
|
|
702
|
+ }
|
|
|
|
703
|
+ return tipDom;
|
|
|
|
704
|
+ }
|
|
|
|
705
|
+
|
|
|
|
706
|
+ //渲染线条的样式，虚线效果
|
|
|
|
707
|
+ function renderEdgeStyle(indexGraph) {
|
|
|
|
708
|
+ $.each(indexGraph.getModel().cells, function (idx, cell) {
|
|
|
|
709
|
+ var state = indexGraph.view.getState(cell);
|
|
|
|
710
|
+ if (cell.edge === 1) {//如果是线条效果
|
|
|
|
711
|
+ if (cell.lineAnimate === 'lineAnimate') {
|
|
|
|
712
|
+ createEdgeAnimation(state, "#6684BA");
|
|
|
|
713
|
+ }
|
|
|
|
714
|
+ if (mxcellNodeDatas[cell.cellId] && mxcellNodeDatas[cell.cellId].length > 0) {
|
|
|
|
715
|
+ var nodelist = mxcellNodeDatas[cell.cellId]
|
|
|
|
716
|
+ for (var i = 0; i < nodelist.length; i++) {
|
|
|
|
717
|
+ var mxcellNode = nodelist[i];
|
|
|
|
718
|
+ if (mxcellNode.flag) {
|
|
|
|
719
|
+ if (mxcellNode.flag.indexOf("net") === 0 || mxcellNode.flag.indexOf("port") === 0) {
|
|
|
|
720
|
+ createEdgeAnimation(state, "#6684BA");
|
|
|
|
721
|
+ }
|
|
|
|
722
|
+ }
|
|
|
|
723
|
+ }
|
|
|
|
724
|
+ }
|
|
|
|
725
|
+ }
|
|
|
|
726
|
+ })
|
|
|
|
727
|
+ getMxCellAlarms(indexGraph);
|
|
|
|
728
|
+ }
|
|
|
|
729
|
+
|
|
|
|
730
|
+ //获取线条或者节点的g告警信息，并渲染动态效果
|
|
|
|
731
|
+ function getMxCellAlarms(indexGraph) {
|
|
|
|
732
|
+ mxcellNodesAlarmFlag = {};
|
|
|
|
733
|
+ if (mxcellNodesAlarms && mxcellNodesAlarms.length > 0) {
|
|
|
|
734
|
+ $.each(mxcellNodesAlarms, function (idx, n) {
|
|
|
|
735
|
+ $.each(indexGraph.getModel().cells, function (i, cell) {
|
|
|
|
736
|
+ var state = indexGraph.view.getState(cell);
|
|
|
|
737
|
+ //如果有告警信息
|
|
|
|
738
|
+ if (n.nodeId == cell.cellId) {//匹配上，则表示有告警
|
|
|
|
739
|
+
|
|
|
|
740
|
+ mxcellNodesAlarmFlag[cell.cellId] = true;
|
|
|
|
741
|
+
|
|
|
|
742
|
+ if (cell.edge === 1) {//如果是线条效果
|
|
|
|
743
|
+ createEdgeAnimation(state, "#ff0000");
|
|
|
|
744
|
+ } else {
|
|
|
|
745
|
+ //给节点增加告警
|
|
|
|
746
|
+ switch (cell.alarmAnimate) {
|
|
|
|
747
|
+ case "alarm" :
|
|
|
|
748
|
+ indexGraph.setCellWarning(cell, '有告警');
|
|
|
|
749
|
+ break;
|
|
|
|
750
|
+ case "fade" :
|
|
|
|
751
|
+ state.shape.node.setAttribute('class', 'fade');
|
|
|
|
752
|
+ break;
|
|
|
|
753
|
+ case "heart" :
|
|
|
|
754
|
+ state.shape.node.setAttribute('class', 'beating');
|
|
|
|
755
|
+ break;
|
|
|
|
756
|
+ case "flash" :
|
|
|
|
757
|
+ state.shape.node.setAttribute('class', 'breathe');
|
|
|
|
758
|
+ break;
|
|
|
|
759
|
+ default:
|
|
|
|
760
|
+ state.shape.node.setAttribute('class', 'fade');//默认渐隐渐显
|
|
|
|
761
|
+ }
|
|
|
|
762
|
+ }
|
|
|
|
763
|
+ }
|
|
|
|
764
|
+ })
|
|
|
|
765
|
+ });
|
|
|
|
766
|
+ }
|
|
|
|
767
|
+ }
|
|
|
|
768
|
+
|
|
|
|
769
|
+ //创建连线动画
|
|
|
|
770
|
+ function createEdgeAnimation(state, color) {
|
|
|
|
771
|
+ state.shape.node.getElementsByTagName('path')[0].removeAttribute('visibility');
|
|
|
|
772
|
+ state.shape.node.getElementsByTagName('path')[1].setAttribute('stroke', color);
|
|
|
|
773
|
+ state.shape.node.getElementsByTagName('path')[1].setAttribute('stroke-width', '2');
|
|
|
|
774
|
+ state.shape.node.getElementsByTagName('path')[1].setAttribute('stroke', color);
|
|
|
|
775
|
+ state.shape.node.getElementsByTagName('path')[1].setAttribute('class', 'mxgraphflow');
|
|
|
|
776
|
+ state.shape.node.getElementsByTagName('path')[2].setAttribute('fill', color);
|
|
|
|
777
|
+ state.shape.node.getElementsByTagName('path')[2].setAttribute('stroke', color);
|
|
|
|
778
|
+ }
|
|
|
|
779
|
+
|
|
|
|
780
|
+ /**
|
|
|
|
781
|
+ * @desc 查看资源详细
|
|
|
|
782
|
+ * @author wangfeng
|
|
|
|
783
|
+ * @date 2020/9/1 15:42
|
|
|
|
784
|
+ **/
|
|
|
|
785
|
+ function viewIndexMxGraphNodeResInfo(resId) {
|
|
|
|
786
|
+ admin.req({
|
|
|
|
787
|
+ url: common.domainName + "/api-web/home/resource/findById?resId=" + resId
|
|
|
|
788
|
+ , type: "get"
|
|
|
|
789
|
+ , done: function (res) {
|
|
|
|
790
|
+ var data = res.object;
|
|
|
|
791
|
+ if (data) {
|
|
|
|
792
|
+ var resTypeName = data.resTypeName ? data.resTypeName + " | " : "";
|
|
|
|
793
|
+ var resName = data.resName ? data.resName + " | " : "";
|
|
|
|
794
|
+ var resIp = data.ip ? data.ip + " | " : "";
|
|
|
|
795
|
+ var resPositon = data.resPositon ? data.resPositon + " | " : "";
|
|
|
|
796
|
+ var resLabel = data.resLabel ? data.resLabel + " | " : "";
|
|
|
|
797
|
+ var admin = data.admin ? data.admin : "";
|
|
|
|
798
|
+ var title = resTypeName + resName + resIp + resPositon + resLabel + admin;
|
|
|
|
799
|
+ if (data.pingEnable == '2') { //如果pingEnable为2，则进入ping状态详情页面
|
|
|
|
800
|
+ commonDetail.openNewWin('template/detail/pingIndex', title, {'resId': data.resId}, false);
|
|
|
|
801
|
+ } else { //否则进入监控详情页面
|
|
|
|
802
|
+ commonDetail.openDetail(data.resId, data.resType, data.resName);
|
|
|
|
803
|
+ }
|
|
|
|
804
|
+ } else {
|
|
|
|
805
|
+ layer.msg("获取资源详细信息失败，请稍后再试！", {offset: '15px', icon: 7, time: 2000});
|
|
|
|
806
|
+ }
|
|
|
|
807
|
+ }
|
|
|
|
808
|
+ });
|
|
|
|
809
|
+ }
|
|
|
|
810
|
+
|
|
|
|
811
|
+ //生成节点提示dom
|
|
|
|
812
|
+ function createIndexMxCellTipsDom(data) {
|
|
|
|
813
|
+ var tipDom = '';
|
|
|
|
814
|
+ if (data && data.length > 0) {
|
|
|
|
815
|
+ var tips = '<h6>节点信息</h6>';
|
|
|
|
816
|
+ var spanDom = '';
|
|
|
|
817
|
+ var tipsTitle = "";
|
|
|
|
818
|
+ $.each(data, function (i, v) {
|
|
|
|
819
|
+ if (i === 0) {
|
|
|
|
820
|
+ tipsTitle = '<span class="tilte">' + v.resName + '</span>';
|
|
|
|
821
|
+ }
|
|
|
|
822
|
+ spanDom += '<span>' + v.kpiOtherName + '：' + v.kpiValue + v.kpiUnit + '</span>';
|
|
|
|
823
|
+ });
|
|
|
|
824
|
+ tipDom = tips + tipsTitle + spanDom;
|
|
|
|
825
|
+ }
|
|
|
|
826
|
+ return tipDom;
|
|
|
|
827
|
+ }
|
|
|
|
828
|
+
|
|
|
|
829
|
+ //生成节点的告警信息
|
|
|
|
830
|
+ function createIndexMxcelAlarmTipsDom(nodeId) {
|
|
|
|
831
|
+ var alramTipDom = '';
|
|
|
|
832
|
+ if (mxcellNodesAlarms && mxcellNodesAlarms.length > 0) {
|
|
|
|
833
|
+ var resIds = [];
|
|
|
|
834
|
+ $.each(mxcellNodesAlarms, function (i, n) {
|
|
|
|
835
|
+ if (nodeId == n.nodeId) {
|
|
|
|
836
|
+ if (n.resId && n.resId != null && $.inArray(n.resId, resIds) == -1) {
|
|
|
|
837
|
+ resIds.push(n.resId);
|
|
|
|
838
|
+ }
|
|
|
|
839
|
+ }
|
|
|
|
840
|
+ });
|
|
|
|
841
|
+ if (resIds.length > 0) {
|
|
|
|
842
|
+ admin.req({
|
|
|
|
843
|
+ url: common.domainName + '/api-web/bAlarm/list',
|
|
|
|
844
|
+ data: {resId: resIds.toString()}
|
|
|
|
845
|
+ , done: function (res) {
|
|
|
|
846
|
+ if (res.data && res.data.length > 0) {
|
|
|
|
847
|
+ var tips = '<h6>告警信息</h6>';
|
|
|
|
848
|
+ var spanDom = '';
|
|
|
|
849
|
+ $.each(res.data, function (idx, item) {
|
|
|
|
850
|
+ spanDom += '<span>' + item.alarmContent + '</span>';
|
|
|
|
851
|
+ });
|
|
|
|
852
|
+
|
|
|
|
853
|
+ alramTipDom = tips + spanDom;
|
|
|
|
854
|
+ nodeAlarmTipsDom[nodeId] = alramTipDom;
|
|
|
|
855
|
+ }
|
|
|
|
856
|
+ }
|
|
|
|
857
|
+ });
|
|
|
|
858
|
+ }
|
|
|
|
859
|
+ }
|
|
|
|
860
|
+ }
|
|
|
|
861
|
+
|
|
|
|
862
|
+ //实时刷新接口
|
|
|
|
863
|
+ function realtimeRefreshData(topoId, indexGraph) {
|
|
|
|
864
|
+ //实时刷新业务状态
|
|
|
|
865
|
+ refreshBizHealth();
|
|
|
|
866
|
+ //获取拓扑节点告警数量
|
|
|
|
867
|
+ refresNodeAlarms(topoId, indexGraph);
|
|
|
|
868
|
+ //刷新告警统计
|
|
|
|
869
|
+ getAlarmCount();
|
|
|
|
870
|
+ //刷新实时告警动态
|
|
|
|
871
|
+ getAlarmList();
|
|
|
|
872
|
+ /*common.alarmTimer = setTimeout(function () {
|
|
|
|
873
|
+ realtimeRefreshData(topoId,indexGraph);
|
|
|
|
874
|
+ }, alarmTimerStep);*/
|
|
|
|
875
|
+ }
|
|
|
|
876
|
+
|
|
|
|
877
|
+ //获取告警统计信息
|
|
|
|
878
|
+ function getAlarmCount(bizId) {
|
|
|
|
879
|
+ if (!bizId) {
|
|
|
|
880
|
+ bizId = currentBizId;
|
|
|
|
881
|
+ }
|
|
|
|
882
|
+ admin.req({
|
|
|
|
883
|
+ url: common.domainName + "/api-web/home/alarm/countByAlarmLevel"
|
|
|
|
884
|
+ , type: "get",
|
|
|
|
885
|
+ data: {
|
|
|
|
886
|
+ busId: bizId
|
|
|
|
887
|
+ , flag: true
|
|
|
|
888
|
+ }
|
|
|
|
889
|
+ , done: function (data) {
|
|
|
|
890
|
+ var alarms = data.data;
|
|
|
|
891
|
+ //默认都给0
|
|
|
|
892
|
+ $("#alarm_serious").text(0);
|
|
|
|
893
|
+ $("#alarm_important").text(0);
|
|
|
|
894
|
+ $("#alarm_commonly").text(0);
|
|
|
|
895
|
+ if (data.code == 0) {
|
|
|
|
896
|
+ var alarmTotal = 0;
|
|
|
|
897
|
+ if (alarms.length > 0) {
|
|
|
|
898
|
+ $.each(alarms, function (i, v) {
|
|
|
|
899
|
+ if (v.alarmLevel < 4) {
|
|
|
|
900
|
+ alarmTotal += v.alarmNum;
|
|
|
|
901
|
+ }
|
|
|
|
902
|
+ if (v.alarmLevel == 3) {//严重告警
|
|
|
|
903
|
+ $("#alarm_serious").text(v.alarmNum);
|
|
|
|
904
|
+ }
|
|
|
|
905
|
+ if (v.alarmLevel == 2) {//重要告警
|
|
|
|
906
|
+ $("#alarm_important").text(v.alarmNum);
|
|
|
|
907
|
+ }
|
|
|
|
908
|
+ if (v.alarmLevel == 1) {//一般告警
|
|
|
|
909
|
+ $("#alarm_commonly").text(v.alarmNum);
|
|
|
|
910
|
+ }
|
|
|
|
911
|
+ if (v.alarmLevel == 4) {//升级告警
|
|
|
|
912
|
+ $("#alarm_upgrade").text(v.alarmNum);
|
|
|
|
913
|
+ }
|
|
|
|
914
|
+ });
|
|
|
|
915
|
+ }
|
|
|
|
916
|
+
|
|
|
|
917
|
+ var emptyZero = ["000", "00", "0", ""];
|
|
|
|
918
|
+ var alarmTotalStr = emptyZero[alarmTotal.toString().length - 1] + alarmTotal;
|
|
|
|
919
|
+ var li = "<li>" + alarmTotalStr.substring(0, 1) + "</li>" +
|
|
|
|
920
|
+ "<li>" + alarmTotalStr.substring(1, 2) + "</li>" +
|
|
|
|
921
|
+ "<li>" + alarmTotalStr.substring(2, 3) + "</li>" +
|
|
|
|
922
|
+ "<li>" + alarmTotalStr.substring(3, 4) + "</li>";
|
|
|
|
923
|
+ $("#alarm_total").html(alarmTotal);
|
|
|
|
924
|
+
|
|
|
|
925
|
+ //绑定点击事件
|
|
|
|
926
|
+ $(".gj-detail-info .alarm_levels").on("click", function () {
|
|
|
|
927
|
+ var level = $(this).data("level");
|
|
|
|
928
|
+ toAlarm(bizId,level);
|
|
|
|
929
|
+ });
|
|
|
|
930
|
+ //告警总量点击
|
|
|
|
931
|
+ $("#indexRightGjSum").on("click", function () {
|
|
|
|
932
|
+ toAlarm(bizId);
|
|
|
|
933
|
+ });
|
|
|
|
934
|
+ } else {
|
|
|
|
935
|
+ console.log(data.msg);
|
|
|
|
936
|
+ }
|
|
|
|
937
|
+ }
|
|
|
|
938
|
+ });
|
|
|
|
939
|
+ }
|
|
|
|
940
|
+
|
|
|
|
941
|
+ //活动告警列表
|
|
|
|
942
|
+ function getAlarmList(bizId) {
|
|
|
|
943
|
+ if (!bizId) {
|
|
|
|
944
|
+ bizId = currentBizId;
|
|
|
|
945
|
+ }
|
|
|
|
946
|
+ admin.req({
|
|
|
|
947
|
+ url: common.domainName + '/api-web/home/alarm/alarmListPage'
|
|
|
|
948
|
+ , type: "get"
|
|
|
|
949
|
+ , data: {
|
|
|
|
950
|
+ busId: bizId
|
|
|
|
951
|
+ , page: 1
|
|
|
|
952
|
+ , limit: 5
|
|
|
|
953
|
+ }
|
|
|
|
954
|
+ , done: function (data) {
|
|
|
|
955
|
+ if (data.code === 0) {
|
|
|
|
956
|
+ if (data.data != null && data.data.length > 0) {
|
|
|
|
957
|
+ layui.use('laytpl', function () {
|
|
|
|
958
|
+ var laytpl = layui.laytpl;
|
|
|
|
959
|
+ var getTpl = document.getElementById("indexActiveAlarmListTpl").innerHTML;
|
|
|
|
960
|
+ laytpl(getTpl).render(data.data, function (html) {
|
|
|
|
961
|
+ $('#indexActiveAlarmList').html(html);
|
|
|
|
962
|
+ });
|
|
|
|
963
|
+ });
|
|
|
|
964
|
+ } else {
|
|
|
|
965
|
+ $("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
|
|
|
|
966
|
+ }
|
|
|
|
967
|
+ //给更多绑定事件
|
|
|
|
968
|
+ $("#more_active_alarms").on("click", function () {
|
|
|
|
969
|
+ toAlarm(bizId);
|
|
|
|
970
|
+ });
|
|
|
|
971
|
+ } else {
|
|
|
|
972
|
+ console.log(data.msg);
|
|
|
|
973
|
+ }
|
|
|
|
974
|
+ }
|
|
|
|
975
|
+ }).error(function () {
|
|
|
|
976
|
+ $("#indexActiveAlarmList").html('<li style="width:390px;"><p>无告警</p></li>');
|
|
|
|
977
|
+ });
|
|
|
|
978
|
+ }
|
|
|
|
979
|
+ /**
|
|
|
|
980
|
+ * 跳转到告警管理
|
|
|
|
981
|
+ * bizId 业务id
|
|
|
|
982
|
+ * alarmLevel 告警级别
|
|
|
|
983
|
+ * */
|
|
|
|
984
|
+ function toAlarm(bizId,alarmLevel) {
|
|
|
|
985
|
+ let win = window.parent;
|
|
|
|
986
|
+ if (win) {
|
|
|
|
987
|
+ window.parent.postMessage({
|
|
|
|
988
|
+ type: 'custom-jump-menu-event',
|
|
|
|
989
|
+ message: {
|
|
|
|
990
|
+ 'path':'',
|
|
|
|
991
|
+ 'type':"JumpToAlarmManagement",
|
|
|
|
992
|
+ params:{
|
|
|
|
993
|
+ bizId:bizId,
|
|
|
|
994
|
+ alarmLevel:alarmLevel
|
|
|
|
995
|
+ }
|
|
|
|
996
|
+ }
|
|
|
|
997
|
+ }, '*')
|
|
|
|
998
|
+ }
|
|
|
|
999
|
+ }
|
|
|
|
1000
|
+
|
|
|
|
1001
|
+ //定时更新缓存中的悬浮提示数据
|
|
|
|
1002
|
+ function refreshTopoNodeTipsInfo() {
|
|
|
|
1003
|
+ if (mxcellNodeDatas) {
|
|
|
|
1004
|
+ $.each(mxcellNodeDatas, function (i, v) {
|
|
|
|
1005
|
+ var nodeId = v[0].nodeId;
|
|
|
|
1006
|
+ var resId = v[0].resId;
|
|
|
|
1007
|
+
|
|
|
|
1008
|
+ var configKpiIds = [];//配置的所有指标集合
|
|
|
|
1009
|
+ var configKpiFlags = [];
|
|
|
|
1010
|
+
|
|
|
|
1011
|
+ $.each(v, function (idx, kpi) {
|
|
|
|
1012
|
+ if (kpi.kpiId && kpi.kpiId != null) {
|
|
|
|
1013
|
+ configKpiIds.push(kpi.kpiId);
|
|
|
|
1014
|
+ configKpiFlags.push(kpi.flag);
|
|
|
|
1015
|
+ }
|
|
|
|
1016
|
+ })
|
|
|
|
1017
|
+ //指标信息,如果配置了指标信息，则提示指标信息
|
|
|
|
1018
|
+ if (configKpiIds && configKpiIds.length > 0) {
|
|
|
|
1019
|
+ admin.req({
|
|
|
|
1020
|
+ url: common.domainName + "/api-web/bResultRealtimeCollector/getval?resId=" + resId +
|
|
|
|
1021
|
+ "&kpiId=" + configKpiIds.toString() + "&flag=" + configKpiFlags.toString()
|
|
|
|
1022
|
+ }).done(function (resdata) {
|
|
|
|
1023
|
+ var kpiDatas = resdata.data;
|
|
|
|
1024
|
+ var newKpiDatas = [];
|
|
|
|
1025
|
+ if (kpiDatas && kpiDatas.length > 0) {
|
|
|
|
1026
|
+ $.each(kpiDatas, function (i, kpiitems) {
|
|
|
|
1027
|
+ var kpiOtherName = "";
|
|
|
|
1028
|
+ $.each(v, function (_idx, _items) {
|
|
|
|
1029
|
+ if (_items.kpiId && _items.kpiId != null && _items.kpiId === kpiitems.kpiId
|
|
|
|
1030
|
+ && _items.flag === kpiitems.flag) {
|
|
|
|
1031
|
+ kpiOtherName = _items.kpiOtherName
|
|
|
|
1032
|
+ }
|
|
|
|
1033
|
+ });
|
|
|
|
1034
|
+ kpiitems.kpiOtherName = kpiOtherName
|
|
|
|
1035
|
+ newKpiDatas.push(kpiitems);
|
|
|
|
1036
|
+ })
|
|
|
|
1037
|
+ nodesTipsDatas[nodeId] = newKpiDatas;
|
|
|
|
1038
|
+ mxcellNodeRessType[nodeId] = resdata.data[0].resType;
|
|
|
|
1039
|
+ }
|
|
|
|
1040
|
+
|
|
|
|
1041
|
+ });
|
|
|
|
1042
|
+ } else {
|
|
|
|
1043
|
+ admin.req({
|
|
|
|
1044
|
+ url: common.domainName + "/api-web/home/resource/findById?resId=" + resId
|
|
|
|
1045
|
+ , type: "get"
|
|
|
|
1046
|
+ , sync: true
|
|
|
|
1047
|
+ , done: function (res) {
|
|
|
|
1048
|
+ var data = res.object;
|
|
|
|
1049
|
+ if (data) {
|
|
|
|
1050
|
+ var kpiIds = "";
|
|
|
|
1051
|
+ if (data.resType.indexOf("HOST_MINICOMPUTER_P") != -1) {
|
|
|
|
1052
|
+ kpiIds = common.nodeTipsKpiArr['HOST_MINICOMPUTER_PARTITION'];
|
|
|
|
1053
|
+ } else {
|
|
|
|
1054
|
+ kpiIds = common.nodeTipsKpiArr[data.resType];
|
|
|
|
1055
|
+ }
|
|
|
|
1056
|
+
|
|
|
|
1057
|
+ admin.req({
|
|
|
|
1058
|
+ url: common.domainName + "/api-web/bResultRealtimeCollector/getval?resId=" + resId + "&kpiId=" + kpiIds + "&flag=" + configKpiFlags.toString()
|
|
|
|
1059
|
+ }).done(function (resdata) {
|
|
|
|
1060
|
+ var kpiDatas = resdata.data;
|
|
|
|
1061
|
+ var newKpiDatas = [];
|
|
|
|
1062
|
+ if (kpiDatas && kpiDatas.length > 0) {
|
|
|
|
1063
|
+ $.each(kpiDatas, function (i, kpiitems) {
|
|
|
|
1064
|
+ var kpiOtherName = "";
|
|
|
|
1065
|
+ $.each(v, function (_idx, _items) {
|
|
|
|
1066
|
+ if (_items.kpiId && _items.kpiId != null && _items.kpiId === kpiitems.kpiId
|
|
|
|
1067
|
+ && _items.flag === kpiitems.flag) {
|
|
|
|
1068
|
+ kpiOtherName = _items.kpiOtherName
|
|
|
|
1069
|
+ }
|
|
|
|
1070
|
+ });
|
|
|
|
1071
|
+ kpiitems.kpiOtherName = kpiOtherName
|
|
|
|
1072
|
+ newKpiDatas.push(kpiitems);
|
|
|
|
1073
|
+ })
|
|
|
|
1074
|
+ }
|
|
|
|
1075
|
+ nodesTipsDatas[nodeId] = newKpiDatas;
|
|
|
|
1076
|
+ mxcellNodeRessType[nodeId] = data.resType;
|
|
|
|
1077
|
+ });
|
|
|
|
1078
|
+ }
|
|
|
|
1079
|
+ }
|
|
|
|
1080
|
+ });
|
|
|
|
1081
|
+ }
|
|
|
|
1082
|
+ createIndexMxcelAlarmTipsDom(nodeId);
|
|
|
|
1083
|
+ })
|
|
|
|
1084
|
+ }
|
|
|
|
1085
|
+
|
|
|
|
1086
|
+ }
|
|
|
|
1087
|
+
|
|
|
|
1088
|
+ //刷新业务健康状态
|
|
|
|
1089
|
+ function refreshBizHealth() {
|
|
|
|
1090
|
+ admin.req({
|
|
|
|
1091
|
+ url: common.domainName + '/api-web/home/business/getBusHealthResult'
|
|
|
|
1092
|
+ , type: "get"
|
|
|
|
1093
|
+ , done: function (data) {
|
|
|
|
1094
|
+ if (data.code === 0) {
|
|
|
|
1095
|
+ var bizMap = data.map;
|
|
|
|
1096
|
+ if (bizMap.health != '3') {//不等于优
|
|
|
|
1097
|
+ $(".index-top-health").find("i").removeClass("icon-health-good").addClass("icon-health");
|
|
|
|
1098
|
+ } else {
|
|
|
|
1099
|
+ $(".index-top-health").find("i").removeClass("icon-health").addClass("icon-health-good");
|
|
|
|
1100
|
+ }
|
|
|
|
1101
|
+
|
|
|
|
1102
|
+ if (bizMap != null && data.map.busList.length > 0) {
|
|
|
|
1103
|
+ var bizlist = data.map.busList;
|
|
|
|
1104
|
+ $.each(bizlist, function (i, v) {
|
|
|
|
1105
|
+ var bizClas = 'icon-banner-zc';
|
|
|
|
1106
|
+ var healthDesc = `告警量：${v.alarmNum}`;
|
|
|
|
1107
|
+ ;
|
|
|
|
1108
|
+ if (v.health == 1) {
|
|
|
|
1109
|
+ bizClas = 'icon-banner-bad';
|
|
|
|
1110
|
+ healthDesc = `告警量：${v.alarmNum}`;
|
|
|
|
1111
|
+ }
|
|
|
|
1112
|
+ if (v.health == 2) {
|
|
|
|
1113
|
+ bizClas = 'icon-banner-warning';
|
|
|
|
1114
|
+ healthDesc = `告警量：${v.alarmNum}`;
|
|
|
|
1115
|
+ ;
|
|
|
|
1116
|
+ }
|
|
|
|
1117
|
+ //先移除原来的
|
|
|
|
1118
|
+ $("#" + v.busId).find("i").removeClass("icon-banner-zc").removeClass("icon-banner-bad").removeClass("icon-banner-warning");
|
|
|
|
1119
|
+ $("#" + v.busId).find("i").addClass(bizClas);
|
|
|
|
1120
|
+ $("#" + v.busId).find("span").text(healthDesc);
|
|
|
|
1121
|
+ });
|
|
|
|
1122
|
+ }
|
|
|
|
1123
|
+ } else {
|
|
|
|
1124
|
+ console.log(data.msg);
|
|
|
|
1125
|
+ }
|
|
|
|
1126
|
+ }
|
|
|
|
1127
|
+ });
|
|
|
|
1128
|
+ }
|
|
|
|
1129
|
+
|
|
|
|
1130
|
+ //刚登录查询值班消息
|
|
|
|
1131
|
+ dutyRightBottomTips();
|
|
|
|
1132
|
+ var connectFlg = false;
|
|
|
|
1133
|
+ //右下角值班弹窗长连接监控
|
|
|
|
1134
|
+ var dutyLongLink = function () {
|
|
|
|
1135
|
+ setTimeout(function () {
|
|
|
|
1136
|
+ if (!connectFlg) {
|
|
|
|
1137
|
+ dutyRightBottomTips();
|
|
|
|
1138
|
+ }
|
|
|
|
1139
|
+ }, 3 * 60 * 1000);
|
|
|
|
1140
|
+ }
|
|
|
|
1141
|
+ dutyLongLink();
|
|
|
|
1142
|
+
|
|
|
|
1143
|
+ //值班弹窗
|
|
|
|
1144
|
+ function dutyRightBottomTips() {
|
|
|
|
1145
|
+ var sign = 0;
|
|
|
|
1146
|
+ var ids = [];
|
|
|
|
1147
|
+ admin.req({
|
|
|
|
1148
|
+ url: common.domainName + '/api-web/manage/duty/dutyMessage'
|
|
|
|
1149
|
+ , async: false
|
|
|
|
1150
|
+ , success: function (res) {
|
|
|
|
1151
|
+ var dutyMessage = res;
|
|
|
|
1152
|
+ if (dutyMessage.data && dutyMessage.success) {
|
|
|
|
1153
|
+ //弹窗声音
|
|
|
|
1154
|
+ var url = '../src/style/mp3/咳咳.mp3';
|
|
|
|
1155
|
+ var audio = common.audioPlayer(url);
|
|
|
|
1156
|
+ audio.playclip();
|
|
|
|
1157
|
+ //弹窗
|
|
|
|
1158
|
+ var duty = new msgTips({
|
|
|
|
1159
|
+ dom: ".right-bottom-tips",
|
|
|
|
1160
|
+ title: "值班调换消息",
|
|
|
|
1161
|
+ message: `<p style="line-height: 20px">您有【${dutyMessage.count}】条调换值班信息未处理,请及时关注</p>`,
|
|
|
|
1162
|
+ duration: 3 * 60 * 1000,
|
|
|
|
1163
|
+ space: 10,
|
|
|
|
1164
|
+ firstSpace: 8,
|
|
|
|
1165
|
+ limit: 4,
|
|
|
|
1166
|
+ margin: 15,
|
|
|
|
1167
|
+ direction: 'right bottom',
|
|
|
|
1168
|
+ timingFun: 'ease',
|
|
|
|
1169
|
+ width: '300px',
|
|
|
|
1170
|
+ toastType: 'info',
|
|
|
|
1171
|
+ type: 'click',
|
|
|
|
1172
|
+ action: function () {
|
|
|
|
1173
|
+ var html = '<div class="page-panel" style="min-height: 0;height: auto">\n' +
|
|
|
|
1174
|
+ ' <div class="main">\n' +
|
|
|
|
1175
|
+ ' <div class="layui-card">\n' +
|
|
|
|
1176
|
+ ' <div class="layui-card-header">\n' +
|
|
|
|
1177
|
+ ' </div>\n' +
|
|
|
|
1178
|
+ ' <div class="layui-card-body">\n' +
|
|
|
|
1179
|
+ ' <table id="table-duty-list-message" lay-filter="table-duty-list-message"></table>\n' +
|
|
|
|
1180
|
+ ' </div>\n' +
|
|
|
|
1181
|
+ ' </div>\n' +
|
|
|
|
1182
|
+ ' </div>\n' +
|
|
|
|
1183
|
+ '</div>';
|
|
|
|
1184
|
+ //显示弹窗 页面不关闭
|
|
|
|
1185
|
+ layer.open({
|
|
|
|
1186
|
+ type: 1,
|
|
|
|
1187
|
+ title: '调换信息',
|
|
|
|
1188
|
+ offset: 'rb',
|
|
|
|
1189
|
+ btn: ['取消'],
|
|
|
|
1190
|
+ scrollbar: false,
|
|
|
|
1191
|
+ area: ['960px', '300px'],
|
|
|
|
1192
|
+ content: html,
|
|
|
|
1193
|
+ success: function (layero, index) {
|
|
|
|
1194
|
+ table.render({
|
|
|
|
1195
|
+ elem: '#table-duty-list-message',
|
|
|
|
1196
|
+ data: dutyMessage.data,
|
|
|
|
1197
|
+ page: false,
|
|
|
|
1198
|
+ height: 'auto',
|
|
|
|
1199
|
+ even: true,
|
|
|
|
1200
|
+ cols: [[{
|
|
|
|
1201
|
+ field: 'dutyTime', title: '内容', align: 'left', width: '65%',
|
|
|
|
1202
|
+ templet: function (d) {
|
|
|
|
1203
|
+ //拼接内容
|
|
|
|
1204
|
+ if (d.dutyChangeType == '2') {
|
|
|
|
1205
|
+ //xx请求2021-09-29 18:00-8:00 与您的值班时间2021-09-25 16:00-8:00进行换班，请确认
|
|
|
|
1206
|
+ return d.userName + '请求' + d.dutyTime + ' ' + d.dutyDuration + '与您的值班时间'
|
|
|
|
1207
|
+ + d.changeDutyTime.split(" ")[0] + ' ' + d.changeDutyDuration.split(" ")[0] + '进行换班，请确认';
|
|
|
|
1208
|
+ } else {
|
|
|
|
1209
|
+ //xx请求与您值班时间2021-09-26 18:00-8:00进行替班，请确认!
|
|
|
|
1210
|
+ return d.userName + '请求与您值班时间' + d.dutyTime + ' ' + d.dutyDuration + '进行替班，请确认!';
|
|
|
|
1211
|
+ }
|
|
|
|
1212
|
+ }
|
|
|
|
1213
|
+ }, {
|
|
|
|
1214
|
+ field: 'phone', title: '联系电话', align: 'center', width: '15%',
|
|
|
|
1215
|
+ }, {
|
|
|
|
1216
|
+ field: 'dutyChangeType', title: '类型', align: 'center', width: '8%',
|
|
|
|
1217
|
+ templet: function (d) {
|
|
|
|
1218
|
+ if (d.dutyChangeType == '2') {
|
|
|
|
1219
|
+ return '换班';
|
|
|
|
1220
|
+ } else {
|
|
|
|
1221
|
+ return '替班';
|
|
|
|
1222
|
+ }
|
|
|
|
1223
|
+ }
|
|
|
|
1224
|
+
|
|
|
|
1225
|
+ }, {
|
|
|
|
1226
|
+ title: '操作', align: 'center', fixed: 'right', width: '12%',
|
|
|
|
1227
|
+ toolbar:
|
|
|
|
1228
|
+ '<div>' +
|
|
|
|
1229
|
+ '<button data-dutyTime="{{d.dutyTime}}" data-dutyChangeId="{{d.dutyChangeId}}" data-changeId="{{d.changeId}}" data-dutyChangeType="{{d.dutyChangeType}}" data-id="{{d.id}}" data-userid="{{d.userId}}" data-account="{{d.userAccount}}" data-username="{{d.userName}}" lay-tips="确定" type="button" class="layui-btn layui-btn-xs layui-btn-normal link-duty-confirm"><i class="layui-icon"></i></button>' +
|
|
|
|
1230
|
+ '<button data-dutyTime="{{d.dutyTime}}" data-dutyChangeId="{{d.dutyChangeId}}" data-changeId="{{d.changeId}}" data-dutyChangeType="{{d.dutyChangeType}}" data-id="{{d.id}}" data-userid="{{d.userId}}" data-account="{{d.userAccount}}" data-username="{{d.userName}}" lay-tips="取消" type="button" class="layui-btn layui-btn-xs layui-btn-normal link-duty-cancel"><i class="layui-icon">ဆ</i></button>' +
|
|
|
|
1231
|
+ '</div>'
|
|
|
|
1232
|
+ }]],
|
|
|
|
1233
|
+ done: function (res) {
|
|
|
|
1234
|
+ //三条数据或三条数据以下没有滚动条
|
|
|
|
1235
|
+ // if(dutyMessage.data.length<=3){
|
|
|
|
1236
|
+ // $('.layui-layer-content').css("overflow-y","hidden");
|
|
|
|
1237
|
+ // }else{
|
|
|
|
1238
|
+ // $('.layui-layer-content').css("overflow-y","visible");
|
|
|
|
1239
|
+ // }
|
|
|
|
1240
|
+ //不能重复点击
|
|
|
|
1241
|
+ if (sign != 0) {//只让当前的button不能使用
|
|
|
|
1242
|
+ $.each($('.link-duty-confirm'), function (i, v) {
|
|
|
|
1243
|
+ if (ids.indexOf($(this).attr("data-id")) > -1) {
|
|
|
|
1244
|
+ $(this).addClass("disabled");
|
|
|
|
1245
|
+ }
|
|
|
|
1246
|
+ });
|
|
|
|
1247
|
+ $.each($('.link-duty-cancel'), function (i, v) {
|
|
|
|
1248
|
+ if (ids.indexOf($(this).attr("data-id")) > -1) {
|
|
|
|
1249
|
+ $(this).addClass("disabled");
|
|
|
|
1250
|
+ }
|
|
|
|
1251
|
+ });
|
|
|
|
1252
|
+ }
|
|
|
|
1253
|
+ // 点击调换
|
|
|
|
1254
|
+ $('.link-duty-confirm').on('click', function () {
|
|
|
|
1255
|
+ var $that = $(this);
|
|
|
|
1256
|
+ var duty = {
|
|
|
|
1257
|
+ id: $(this).data("id"),
|
|
|
|
1258
|
+ userId: $(this).data("userid"),
|
|
|
|
1259
|
+ userName: $(this).data("username"),
|
|
|
|
1260
|
+ dutyChangeType: $(this).data("dutychangetype"),
|
|
|
|
1261
|
+ changeId: $(this).data("changeid"),
|
|
|
|
1262
|
+ dutyChangeId: $(this).data("dutychangeid"),
|
|
|
|
1263
|
+ username: $(this).data("account"),
|
|
|
|
1264
|
+ dutyTime: $(this).data("dutytime")
|
|
|
|
1265
|
+ }
|
|
|
|
1266
|
+ admin.req({
|
|
|
|
1267
|
+ url: common.domainName + '/api-web/manage/duty/agreeExchange?access_token=' + access_token,
|
|
|
|
1268
|
+ async: false,
|
|
|
|
1269
|
+ data: duty,
|
|
|
|
1270
|
+ done: function (res) {
|
|
|
|
1271
|
+ if (res.success) {
|
|
|
|
1272
|
+ layer.closeAll();
|
|
|
|
1273
|
+ layer.msg('调换成功!', {icon: 1, time: 3000});
|
|
|
|
1274
|
+ sign = 1;
|
|
|
|
1275
|
+ $that.addClass("disabled");
|
|
|
|
1276
|
+ ids.push($that.data("id"));
|
|
|
|
1277
|
+ //关闭弹窗
|
|
|
|
1278
|
+ closeDuty();
|
|
|
|
1279
|
+ } else {
|
|
|
|
1280
|
+ layer.closeAll();
|
|
|
|
1281
|
+ layer.msg('调换失败!', {icon: 7, time: 3000});
|
|
|
|
1282
|
+ }
|
|
|
|
1283
|
+ }
|
|
|
|
1284
|
+ });
|
|
|
|
1285
|
+ });
|
|
|
|
1286
|
+ //取消调换
|
|
|
|
1287
|
+ $('.link-duty-cancel').on('click', function () {
|
|
|
|
1288
|
+ var $that = $(this);
|
|
|
|
1289
|
+ var duty = {
|
|
|
|
1290
|
+ id: $(this).data("id"),
|
|
|
|
1291
|
+ dutyChangeType: $(this).data("dutychangetype"),
|
|
|
|
1292
|
+ changeId: $(this).data("changeid"),
|
|
|
|
1293
|
+ username: $(this).data("account"),
|
|
|
|
1294
|
+ userName: $(this).data("username"),
|
|
|
|
1295
|
+ dutyTime: $(this).data("dutytime")
|
|
|
|
1296
|
+ }
|
|
|
|
1297
|
+ admin.req({
|
|
|
|
1298
|
+ url: common.domainName + '/api-web/manage/duty/disagreeExchange?access_token=' + access_token,
|
|
|
|
1299
|
+ async: false,
|
|
|
|
1300
|
+ data: duty,
|
|
|
|
1301
|
+ done: function (res) {
|
|
|
|
1302
|
+ if (res.success) {
|
|
|
|
1303
|
+ layer.closeAll();
|
|
|
|
1304
|
+ layer.msg('拒绝调换成功!', {icon: 1, time: 3000});
|
|
|
|
1305
|
+ sign = 1;
|
|
|
|
1306
|
+ $that.addClass("disabled");
|
|
|
|
1307
|
+ ids.push($that.data("id"));
|
|
|
|
1308
|
+ //关闭弹窗
|
|
|
|
1309
|
+ closeDuty();
|
|
|
|
1310
|
+ } else {
|
|
|
|
1311
|
+ layer.closeAll();
|
|
|
|
1312
|
+ layer.msg('拒绝调换失败!', {icon: 7, time: 3000});
|
|
|
|
1313
|
+ }
|
|
|
|
1314
|
+ }
|
|
|
|
1315
|
+ });
|
|
|
|
1316
|
+ });
|
|
|
|
1317
|
+ }
|
|
|
|
1318
|
+ });
|
|
|
|
1319
|
+ },
|
|
|
|
1320
|
+ cancel: function (index, layero) {//取消回调函数
|
|
|
|
1321
|
+ layer.closeAll();
|
|
|
|
1322
|
+ }
|
|
|
|
1323
|
+ });
|
|
|
|
1324
|
+ },
|
|
|
|
1325
|
+ });
|
|
|
|
1326
|
+
|
|
|
|
1327
|
+ function closeDuty() {
|
|
|
|
1328
|
+ //如果全部处理则关闭所有弹窗 除以2是因为layUI加载两次
|
|
|
|
1329
|
+ if (ids.length == $('.link-duty-confirm').length / 2) {
|
|
|
|
1330
|
+ //关闭弹窗
|
|
|
|
1331
|
+ layer.closeAll();
|
|
|
|
1332
|
+ //关闭提示
|
|
|
|
1333
|
+ $.each($('.title.clearfix'), function (i, v) {
|
|
|
|
1334
|
+ var title = $(this).text();
|
|
|
|
1335
|
+ if (title == '值班调换消息') {
|
|
|
|
1336
|
+ $(this).find('.tips_icon_r.close').click();
|
|
|
|
1337
|
+ }
|
|
|
|
1338
|
+ });
|
|
|
|
1339
|
+ }
|
|
|
|
1340
|
+ }
|
|
|
|
1341
|
+ }
|
|
|
|
1342
|
+ }
|
|
|
|
1343
|
+ });
|
|
|
|
1344
|
+ }
|
|
|
|
1345
|
+
|
|
|
|
1346
|
+ });
|
|
|
|
1347
|
+
|
|
|
|
1348
|
+
|
|
|
|
1349
|
+}); |
