user-behavior-monitor 2.0.0 → 4.0.1

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.
@@ -2,6 +2,7 @@
2
2
  <div ref="behaviorMonitor" class="user-behavior-monitor">
3
3
  <!-- 提示框 -->
4
4
  <el-dialog
5
+ title="提示"
5
6
  :visible.sync="showWarning"
6
7
  :show-close="false"
7
8
  :modal="true"
@@ -15,16 +16,14 @@
15
16
  </template>
16
17
 
17
18
  <script>
18
- import { io } from "socket.io-client";
19
-
20
19
  export default {
21
20
  name: 'UserBehaviorMonitor',
22
21
  props: {
23
22
  // WebSocket服务器地址
24
- websocketUrl: {
25
- type: String,
26
- required: true
27
- },
23
+ // websocketUrl: {
24
+ // type: String,
25
+ // required: true
26
+ // },
28
27
  // 倒计时时长(分钟)
29
28
  timeoutMinutes: {
30
29
  type: Number,
@@ -43,7 +42,8 @@ export default {
43
42
  countdownTimer: null,
44
43
  warningTimer: null,
45
44
  showWarning: false,
46
- warningMessage: `您已${this.timeoutMinutes}分钟未操作,将在${this.warningMinutes}分钟后自动退出`,
45
+ // warningMinutes
46
+ warningMessage: `您已${this.timeoutMinutes}分钟未操作,将在1分钟后自动退出`,
47
47
  lastActivityTime: null,
48
48
  isMonitoring: false,
49
49
  currentTimeoutMinutes: 10,
@@ -51,12 +51,53 @@ export default {
51
51
  };
52
52
  },
53
53
  mounted() {
54
- this.initMonitor();
54
+ // 检查当前路由是否包含/login,如果不包含则初始化监控
55
+ if (!this.isLoginRoute()) {
56
+ this.initMonitor();
57
+ }
55
58
  },
56
59
  beforeDestroy() {
57
60
  this.destroyMonitor();
58
61
  },
62
+ watch: {
63
+ // 监听路由变化
64
+ '$route'(to, from) {
65
+ // 安全检查 from.href 是否存在
66
+ const isFromLogin = from.path.includes('/login') ||
67
+ (from.href && from.href.includes('/login'));
68
+
69
+ // 检查当前是否为登录路由
70
+ const isToLogin = this.isLoginRoute();
71
+
72
+ // 如果从登录页跳转到非登录页,且监控未启动,则初始化监控
73
+ if (isFromLogin && !isToLogin && !this.isMonitoring) {
74
+ this.initMonitor();
75
+ }
76
+ // 如果从非登录页跳转到登录页,且监控正在运行,则销毁监控
77
+ else if (!isFromLogin && isToLogin && this.isMonitoring) {
78
+ this.destroyMonitor();
79
+ }
80
+ }
81
+ },
59
82
  methods: {
83
+ // 检查当前路由是否为登录页面
84
+ isLoginRoute() {
85
+ // 优先检查 Vue Router 路由
86
+ if (this.$route && this.$route.path) {
87
+ if (this.$route.path.includes('/login')) {
88
+ return true;
89
+ }
90
+ }
91
+
92
+ // 检查浏览器地址栏作为后备
93
+ if (typeof window !== 'undefined') {
94
+ return window.location.pathname.includes('/login') ||
95
+ window.location.href.includes('/login');
96
+ }
97
+
98
+ return false;
99
+ },
100
+
60
101
  updateTimeoutSettings(timeoutMinutes, warningMinutes) {
61
102
  if (timeoutMinutes !== undefined) {
62
103
  this.currentTimeoutMinutes = timeoutMinutes;
@@ -69,23 +110,31 @@ export default {
69
110
  }
70
111
 
71
112
  // 更新警告消息
72
- this.warningMessage = `您已${this.currentTimeoutMinutes}分钟未操作,将在${this.currentWarningMinutes}分钟后自动退出`;
113
+ // ${this.currentWarningMinutes}
114
+ this.warningMessage = `您已${this.currentTimeoutMinutes}分钟未操作,将在1分钟后自动退出`;
73
115
 
74
116
  // 重置计时器
75
117
  this.resetTimer();
76
118
  },
77
119
  // 初始化监控
78
120
  initMonitor() {
121
+ // 再次检查确保不在登录页面
122
+ if (this.isLoginRoute()) {
123
+ // 如果在登录页面,确保清理所有监控资源
124
+ this.destroyMonitor();
125
+ return;
126
+ }
127
+
79
128
  if (this.isMonitoring) return;
80
129
 
81
130
  this.isMonitoring = true;
82
131
  this.lastActivityTime = Date.now();
83
132
 
84
- // 初始化Socket.IO连接
85
- this.initSocketIO();
133
+ // 初始化WebSocket连接
134
+ this.initWebSocket();
86
135
 
87
136
  // 启动倒计时
88
- this.startCountdown();
137
+ // this.startCountdown();
89
138
 
90
139
  // 绑定事件监听器
91
140
  this.bindEventListeners();
@@ -99,9 +148,9 @@ export default {
99
148
  if (this.countdownTimer) clearInterval(this.countdownTimer);
100
149
  if (this.warningTimer) clearTimeout(this.warningTimer);
101
150
 
102
- // 关闭Socket.IO连接
151
+ // 关闭WebSocket连接
103
152
  if (this.socket) {
104
- this.socket.disconnect();
153
+ this.socket.close();
105
154
  this.socket = null;
106
155
  }
107
156
 
@@ -109,15 +158,11 @@ export default {
109
158
  this.unbindEventListeners();
110
159
  },
111
160
 
112
- // 初始化Socket.IO连接
113
- // 初始化Socket.IO连接
114
- initSocketIO() {
161
+ // 初始化WebSocket连接
162
+ initWebSocket() {
115
163
  try {
116
- // 使用正确的WebSocket URL和路径配置
117
- const websocketUrl = 'http://100.150.0.4:30612';
118
-
119
- // 从localStorage获取timeoutMinutes,如果没有默认为10
120
- const storedTimeoutMinutes = localStorage.getItem('timeoutMinutes') || 10;
164
+ // 使用传入的WebSocket URL
165
+ const websocketUrl = `wss://${location.host}/xy-api/auth-server/ws/user-activity`;
121
166
 
122
167
  // 获取token(假设存储在localStorage中)
123
168
  let token = '';
@@ -130,51 +175,42 @@ export default {
130
175
  token = localStorage.getItem('token') || '';
131
176
  }
132
177
 
133
- // 创建Socket.IO连接,添加自定义headers
134
- this.socket = io(websocketUrl, {
135
- transports: ['websocket'],
136
- path: '/ws/user-activity', // 指定正确的路径
137
- extraHeaders: {
138
- 'Authorization': token
139
- },
140
- query: {
141
- timeoutMinutes: storedTimeoutMinutes
142
- },
143
- reconnection: true,
144
- reconnectionAttempts: 5,
145
- reconnectionDelay: 1000,
146
- timeout: 20000
147
- });
178
+ // 创建WebSocket连接
179
+ this.socket = new WebSocket(`${websocketUrl}?token=${encodeURIComponent(token)}`);
148
180
 
149
- this.socket.on('connect', () => {
150
- console.log('Socket.IO连接已建立', this.socket.id);
181
+ // 设置连接成功回调
182
+ this.socket.onopen = () => {
183
+ console.log('WebSocket连接已建立');
184
+ this.sendUserBehavior();
151
185
  this.$emit('websocket-open');
152
- });
153
-
154
- this.socket.on('disconnect', (reason) => {
155
- console.log('Socket.IO连接已断开:', reason);
156
- this.$emit('websocket-close');
157
- });
186
+ };
158
187
 
159
- // 处理后端返回的活动状态信息
160
- this.socket.on('success', (data) => {
161
- console.log('收到用户活动状态消息:', data);
162
- this.handleActivityStatus(data);
163
- this.$emit('websocket-message', data);
164
- });
188
+ // 设置接收消息回调
189
+ this.socket.onmessage = (event) => {
190
+ try {
191
+ const data = JSON.parse(event.data);
192
+ console.log('收到用户活动状态消息:', data);
193
+ this.handleActivityStatus(data);
194
+ this.$emit('websocket-message', data);
195
+ } catch (e) {
196
+ console.error('解析WebSocket消息失败:', e);
197
+ }
198
+ };
165
199
 
166
- this.socket.on('connect_error', (error) => {
167
- console.error('Socket.IO连接错误:', error);
168
- this.$emit('websocket-error', error);
169
- });
200
+ // 设置连接关闭回调
201
+ this.socket.onclose = (event) => {
202
+ console.log('WebSocket连接已断开:', event.reason);
203
+ this.$emit('websocket-close');
204
+ };
170
205
 
171
- this.socket.on('error', (error) => {
172
- console.error('Socket.IO错误:', error);
206
+ // 设置连接错误回调
207
+ this.socket.onerror = (error) => {
208
+ console.error('WebSocket错误:', error);
173
209
  this.$emit('websocket-error', error);
174
- });
210
+ };
175
211
 
176
212
  } catch (error) {
177
- console.error('Socket.IO初始化失败:', error);
213
+ console.error('WebSocket初始化失败:', error);
178
214
  this.$emit('websocket-error', error);
179
215
  }
180
216
  },
@@ -190,17 +226,22 @@ export default {
190
226
 
191
227
  // 更新警告消息
192
228
  this.warningMessage = `您已${this.currentTimeoutMinutes}分钟未操作,将在${this.currentWarningMinutes}分钟后自动退出`;
193
-
194
- // 检查是否需要显示提醒
195
- if (activityData.needReminder) {
196
- this.showWarningWarning();
229
+ if(activityData.needReminder){
230
+ this.showWarningWarning(activityData.remainingMillis);
197
231
  }
198
-
232
+ // remainingMillis
233
+
234
+
199
235
  // 检查是否仍然活跃
200
- if (!activityData.isActive) {
201
- this.handleInactiveStatus();
202
- }
236
+ //if (!activityData.isActive) {
237
+ //this.handleInactiveStatus();
238
+ //}
203
239
  }
240
+ // 检查是否需要显示提醒
241
+ // let dataReminder=data.data;
242
+ // if (dataReminder&&dataReminder.needReminder) {
243
+ // this.showWarningWarning(dataReminder.remainingSeconds);
244
+ // }
204
245
  },
205
246
 
206
247
  // 处理非活跃状态
@@ -210,10 +251,10 @@ export default {
210
251
  sessionStorage.clear();
211
252
 
212
253
  // 跳转到登录页
213
- this.$router.push('/login');
254
+ //this.$router.push('/login');
214
255
 
215
256
  // 或者使用window.location
216
- // window.location.href = '/login';
257
+ window.location.href = '/login';
217
258
 
218
259
  // 触发登出事件
219
260
  this.$emit('logout');
@@ -222,13 +263,14 @@ export default {
222
263
  // 发送用户行为数据到后端
223
264
  sendUserBehavior(data) {
224
265
  console.log('用户行为监测:')
225
- if (this.socket && this.socket.connected) {
266
+ if (this.warningTimer) clearTimeout(this.warningTimer);
267
+ if (this.socket && this.socket.readyState === WebSocket.OPEN) {
226
268
  const message = {
227
269
  "type": "HEARTBEAT",
228
- "message": "心跳"
270
+ "message": "心跳",
229
271
  };
230
272
  console.log('用户行为监测:', JSON.stringify(message));
231
- this.socket.emit('user_behavior', message);
273
+ this.socket.send(JSON.stringify(message));
232
274
  }
233
275
  },
234
276
 
@@ -357,7 +399,7 @@ export default {
357
399
  }
358
400
 
359
401
  // 重新启动倒计时
360
- this.startCountdown();
402
+ // this.startCountdown();
361
403
 
362
404
  this.$emit('user-active');
363
405
  },
@@ -370,7 +412,7 @@ export default {
370
412
  // 设置新的倒计时
371
413
  this.countdownTimer = setInterval(() => {
372
414
  const now = Date.now();
373
- const elapsedMinutes = (now - this.lastActivityTime) / (1000 * 60);
415
+ const elapsedMinutes = (now - this.lastActivityTime) / (1000 * 50);
374
416
 
375
417
  // 检查是否需要显示警告
376
418
  if (elapsedMinutes >= (this.currentTimeoutMinutes - this.currentWarningMinutes) && !this.warningTimer) {
@@ -385,14 +427,16 @@ export default {
385
427
  },
386
428
 
387
429
  // 显示超时警告
388
- showWarningWarning() {
430
+ showWarningWarning(timeoutMinutes) {
431
+ let time=timeoutMinutes||50;
432
+ console.log('Setting showWarning to true');
389
433
  this.showWarning = true;
390
434
  this.$emit('timeout-warning');
391
-
435
+ if (this.warningTimer) clearTimeout(this.warningTimer);
392
436
  // 设置超时处理
393
437
  this.warningTimer = setTimeout(() => {
394
438
  this.handleTimeout();
395
- }, this.currentWarningMinutes * 60 * 1000);
439
+ }, 1 * time * 1000);
396
440
  },
397
441
 
398
442
  // 处理超时
@@ -406,13 +450,21 @@ export default {
406
450
 
407
451
  // 登出操作
408
452
  logout() {
453
+ localStorage.clear();
454
+ sessionStorage.clear();
455
+ location.reload();
456
+ // 跳转到登录页
457
+ //this.$router.push('/login');
458
+
459
+ // 或者使用window.location
460
+ // window.location.href = '/login';
409
461
  // 发送登出消息到后端
410
- if (this.socket && this.socket.connected) {
462
+ if (this.socket && this.socket.readyState === WebSocket.OPEN) {
411
463
  const message = {
412
464
  type: 'logout',
413
465
  timestamp: Date.now()
414
466
  };
415
- this.socket.emit('logout', message);
467
+ this.socket.send(JSON.stringify(message));
416
468
  }
417
469
 
418
470
  // 触发登出事件
@@ -426,39 +478,44 @@ export default {
426
478
  // 处理页面卸载前的操作
427
479
  handleBeforeUnload(event) {
428
480
  // 发送页面关闭消息
429
- if (this.socket && this.socket.connected) {
481
+ if (this.socket && this.socket.readyState === WebSocket.OPEN) {
430
482
  const message = {
431
483
  type: 'page_unload',
432
484
  timestamp: Date.now()
433
485
  };
434
- this.socket.emit('page_unload', message);
486
+ this.socket.send(JSON.stringify(message));
435
487
  }
436
488
  },
437
489
 
438
490
  // 手动重置监控
439
491
  reset() {
492
+ // 检查当前路由,如果在登录页面则销毁监控
493
+ if (this.isLoginRoute()) {
494
+ this.destroyMonitor();
495
+ return;
496
+ }
497
+
440
498
  this.resetTimer();
441
499
  },
442
500
 
443
- // 重新连接Socket.IO
501
+ // 重新连接WebSocket
444
502
  reconnect() {
503
+ // 检查当前路由,如果在登录页面则销毁监控
504
+ if (this.isLoginRoute()) {
505
+ this.destroyMonitor();
506
+ return;
507
+ }
508
+
445
509
  if (this.socket) {
446
- this.socket.disconnect();
510
+ this.socket.close();
447
511
  }
448
- this.initSocketIO();
512
+ this.initWebSocket();
449
513
  }
450
514
  }
451
515
  };
452
516
  </script>
453
-
454
- <style scoped>
455
- .user-behavior-monitor {
456
- display: none;
457
- }
458
-
459
- .behavior-warning-dialog >>> .el-dialog__body {
460
- text-align: center;
461
- font-size: 16px;
462
- padding: 30px 20px;
517
+ <style>
518
+ .behavior-warning-dialog.el-dialog.el-dialog--center{
519
+ text-align: left;
463
520
  }
464
521
  </style>
@@ -1 +0,0 @@
1
- {"version":3,"sources":["webpack://user-behavior-monitor/webpack/bootstrap","webpack://user-behavior-monitor/./node_modules/css-loader/lib/css-base.js","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue?b768","webpack://user-behavior-monitor/./node_modules/vue-style-loader/lib/listToStyles.js","webpack://user-behavior-monitor/./node_modules/vue-style-loader/lib/addStylesClient.js","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue?ad85","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue?2816","webpack://user-behavior-monitor/./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue?198a","webpack://user-behavior-monitor/src/components/UserBehaviorMonitor.vue","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue?8778","webpack://user-behavior-monitor/./node_modules/vue-loader/lib/runtime/componentNormalizer.js","webpack://user-behavior-monitor/./src/components/UserBehaviorMonitor.vue","webpack://user-behavior-monitor/./src/index.js","webpack://user-behavior-monitor/./node_modules/@vue/cli-service/lib/commands/build/entry-lib.js"],"names":[],"mappings":";;QAAA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;;QAEA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;;;QAGA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA,0CAA0C,gCAAgC;QAC1E;QACA;;QAEA;QACA;QACA;QACA,wDAAwD,kBAAkB;QAC1E;QACA,iDAAiD,cAAc;QAC/D;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA,yCAAyC,iCAAiC;QAC1E,gHAAgH,mBAAmB,EAAE;QACrI;QACA;;QAEA;QACA;QACA;QACA,2BAA2B,0BAA0B,EAAE;QACvD,iCAAiC,eAAe;QAChD;QACA;QACA;;QAEA;QACA,sDAAsD,+DAA+D;;QAErH;QACA;;;QAGA;QACA;;;;;;;;AClFA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,mCAAmC,gBAAgB;AACnD,IAAI;AACJ;AACA;AACA,GAAG;AACH;;AAEA;AACA;AACA;AACA;AACA;AACA,gBAAgB,iBAAiB;AACjC;AACA;AACA;AACA;AACA,YAAY,oBAAoB;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA,GAAG;;AAEH;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA,oDAAoD,cAAc;;AAElE;AACA;;;;;;;;;AC3EA;AAAA;AAAA;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACe;AACf;AACA;AACA,iBAAiB,iBAAiB;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmC,wBAAwB;AAC3D,KAAK;AACL;AACA;AACA;AACA;AACA;;;AC1BA;AACA;AACA;AACA;AACA;;AAEyC;;AAEzC;;AAEA;AACA;AACA;AACA;AACA,UAAU,iBAAiB;AAC3B;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA,mBAAmB;AACnB;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEe;AACf;;AAEA;;AAEA,eAAe,YAAY;AAC3B;;AAEA;AACA;AACA,mBAAmB,mBAAmB;AACtC;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,YAAY;AAC3B;AACA,KAAK;AACL;AACA;AACA,mBAAmB,sBAAsB;AACzC;AACA;AACA,uBAAuB,2BAA2B;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,iBAAiB,mBAAmB;AACpC;AACA;AACA;AACA;AACA,qBAAqB,2BAA2B;AAChD;AACA;AACA,YAAY,uBAAuB;AACnC;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA,qBAAqB,uBAAuB;AAC5C;AACA;AACA,8BAA8B;AAC9B;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AACH;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;;AAEA;AACA;AACA,GAAG;AACH;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,yDAAyD;AACzD;;AAEA;AACA;AACA,GAAG;AACH;AACA;AACA;AACA;AACA;AACA;;;;;;;;AC7NA,2BAA2B,mBAAO,CAAC,MAA+C;AAClF;;;AAGA;AACA,cAAc,QAAS,wDAAwD,gBAAgB;;AAE/F;;;;;;;;ACPA;;AAEA;AACA,cAAc,mBAAO,CAAC,MAA0X;AAChZ;AACA,4CAA4C,QAAS;AACrD;AACA;AACA,UAAU,mBAAO,CAAC,MAA6D;AAC/E,6CAA6C,qCAAqC,E;;;;;;;;;;;;;;;ACTlF;;AAEA;AACA,MAAM,KAAuC,EAAE,EAE5C;;AAEH;AACA;AACA,IAAI,qBAAuB;AAC3B;AACA;;AAEA;AACe,sDAAI;;;ACdnB,0BAA0B,aAAa,0BAA0B,wBAAwB,iBAAiB,0DAA0D,kBAAkB,OAAO,0IAA0I,KAAK,kCAAkC,yBAAyB;AACvY;;;;;;;;;;;;;;;;;;;;;;;;ACiBe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC,EAAC;;;AClgByL,CAAgB,oIAAG,EAAC,C;;;;;ACA/M;;AAEA;AACA;AACA;;AAEe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AACH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;;AC/FiG;AAC3B;AACL;AAC8B;;;AAG/F;AAC0F;AAC1F,gBAAgB,kBAAU;AAC1B,EAAE,qDAAM;AACR,EAAE,MAAM;AACR,EAAE,eAAe;AACjB;AACA;AACA;AACA;;AAEA;;AAEe,yE;;ACnBwD;;AAEvE;AACA,mBAAmB;AACnB,gBAAgB,mBAAmB,OAAO,mBAAmB;AAC7D;;AAEA;AACe,2DAAmB,EAAC;;AAEnC;AACA;AACA,EAAE,mBAAmB;AACrB;;AAEA;;;ACfwB;AACA;AACT,kFAAG;AACI","file":"user-behavior-monitor.common.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"fb15\");\n","/*\n\tMIT License http://www.opensource.org/licenses/mit-license.php\n\tAuthor Tobias Koppers @sokra\n*/\n// css base code, injected by the css-loader\nmodule.exports = function(useSourceMap) {\n\tvar list = [];\n\n\t// return the list of modules as css string\n\tlist.toString = function toString() {\n\t\treturn this.map(function (item) {\n\t\t\tvar content = cssWithMappingToString(item, useSourceMap);\n\t\t\tif(item[2]) {\n\t\t\t\treturn \"@media \" + item[2] + \"{\" + content + \"}\";\n\t\t\t} else {\n\t\t\t\treturn content;\n\t\t\t}\n\t\t}).join(\"\");\n\t};\n\n\t// import a list of modules into the list\n\tlist.i = function(modules, mediaQuery) {\n\t\tif(typeof modules === \"string\")\n\t\t\tmodules = [[null, modules, \"\"]];\n\t\tvar alreadyImportedModules = {};\n\t\tfor(var i = 0; i < this.length; i++) {\n\t\t\tvar id = this[i][0];\n\t\t\tif(typeof id === \"number\")\n\t\t\t\talreadyImportedModules[id] = true;\n\t\t}\n\t\tfor(i = 0; i < modules.length; i++) {\n\t\t\tvar item = modules[i];\n\t\t\t// skip already imported module\n\t\t\t// this implementation is not 100% perfect for weird media query combinations\n\t\t\t// when a module is imported multiple times with different media queries.\n\t\t\t// I hope this will never occur (Hey this way we have smaller bundles)\n\t\t\tif(typeof item[0] !== \"number\" || !alreadyImportedModules[item[0]]) {\n\t\t\t\tif(mediaQuery && !item[2]) {\n\t\t\t\t\titem[2] = mediaQuery;\n\t\t\t\t} else if(mediaQuery) {\n\t\t\t\t\titem[2] = \"(\" + item[2] + \") and (\" + mediaQuery + \")\";\n\t\t\t\t}\n\t\t\t\tlist.push(item);\n\t\t\t}\n\t\t}\n\t};\n\treturn list;\n};\n\nfunction cssWithMappingToString(item, useSourceMap) {\n\tvar content = item[1] || '';\n\tvar cssMapping = item[3];\n\tif (!cssMapping) {\n\t\treturn content;\n\t}\n\n\tif (useSourceMap && typeof btoa === 'function') {\n\t\tvar sourceMapping = toComment(cssMapping);\n\t\tvar sourceURLs = cssMapping.sources.map(function (source) {\n\t\t\treturn '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'\n\t\t});\n\n\t\treturn [content].concat(sourceURLs).concat([sourceMapping]).join('\\n');\n\t}\n\n\treturn [content].join('\\n');\n}\n\n// Adapted from convert-source-map (MIT)\nfunction toComment(sourceMap) {\n\t// eslint-disable-next-line no-undef\n\tvar base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));\n\tvar data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;\n\n\treturn '/*# ' + data + ' */';\n}\n","export * from \"-!../../node_modules/vue-style-loader/index.js??ref--6-oneOf-1-0!../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UserBehaviorMonitor.vue?vue&type=style&index=0&id=4f34cec0&prod&lang=css\"","/**\n * Translates the list format produced by css-loader into something\n * easier to manipulate.\n */\nexport default function listToStyles (parentId, list) {\n var styles = []\n var newStyles = {}\n for (var i = 0; i < list.length; i++) {\n var item = list[i]\n var id = item[0]\n var css = item[1]\n var media = item[2]\n var sourceMap = item[3]\n var part = {\n id: parentId + ':' + i,\n css: css,\n media: media,\n sourceMap: sourceMap\n }\n if (!newStyles[id]) {\n styles.push(newStyles[id] = { id: id, parts: [part] })\n } else {\n newStyles[id].parts.push(part)\n }\n }\n return styles\n}\n","/*\n MIT License http://www.opensource.org/licenses/mit-license.php\n Author Tobias Koppers @sokra\n Modified by Evan You @yyx990803\n*/\n\nimport listToStyles from './listToStyles'\n\nvar hasDocument = typeof document !== 'undefined'\n\nif (typeof DEBUG !== 'undefined' && DEBUG) {\n if (!hasDocument) {\n throw new Error(\n 'vue-style-loader cannot be used in a non-browser environment. ' +\n \"Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.\"\n ) }\n}\n\n/*\ntype StyleObject = {\n id: number;\n parts: Array<StyleObjectPart>\n}\n\ntype StyleObjectPart = {\n css: string;\n media: string;\n sourceMap: ?string\n}\n*/\n\nvar stylesInDom = {/*\n [id: number]: {\n id: number,\n refs: number,\n parts: Array<(obj?: StyleObjectPart) => void>\n }\n*/}\n\nvar head = hasDocument && (document.head || document.getElementsByTagName('head')[0])\nvar singletonElement = null\nvar singletonCounter = 0\nvar isProduction = false\nvar noop = function () {}\nvar options = null\nvar ssrIdKey = 'data-vue-ssr-id'\n\n// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>\n// tags it will allow on a page\nvar isOldIE = typeof navigator !== 'undefined' && /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase())\n\nexport default function addStylesClient (parentId, list, _isProduction, _options) {\n isProduction = _isProduction\n\n options = _options || {}\n\n var styles = listToStyles(parentId, list)\n addStylesToDom(styles)\n\n return function update (newList) {\n var mayRemove = []\n for (var i = 0; i < styles.length; i++) {\n var item = styles[i]\n var domStyle = stylesInDom[item.id]\n domStyle.refs--\n mayRemove.push(domStyle)\n }\n if (newList) {\n styles = listToStyles(parentId, newList)\n addStylesToDom(styles)\n } else {\n styles = []\n }\n for (var i = 0; i < mayRemove.length; i++) {\n var domStyle = mayRemove[i]\n if (domStyle.refs === 0) {\n for (var j = 0; j < domStyle.parts.length; j++) {\n domStyle.parts[j]()\n }\n delete stylesInDom[domStyle.id]\n }\n }\n }\n}\n\nfunction addStylesToDom (styles /* Array<StyleObject> */) {\n for (var i = 0; i < styles.length; i++) {\n var item = styles[i]\n var domStyle = stylesInDom[item.id]\n if (domStyle) {\n domStyle.refs++\n for (var j = 0; j < domStyle.parts.length; j++) {\n domStyle.parts[j](item.parts[j])\n }\n for (; j < item.parts.length; j++) {\n domStyle.parts.push(addStyle(item.parts[j]))\n }\n if (domStyle.parts.length > item.parts.length) {\n domStyle.parts.length = item.parts.length\n }\n } else {\n var parts = []\n for (var j = 0; j < item.parts.length; j++) {\n parts.push(addStyle(item.parts[j]))\n }\n stylesInDom[item.id] = { id: item.id, refs: 1, parts: parts }\n }\n }\n}\n\nfunction createStyleElement () {\n var styleElement = document.createElement('style')\n styleElement.type = 'text/css'\n head.appendChild(styleElement)\n return styleElement\n}\n\nfunction addStyle (obj /* StyleObjectPart */) {\n var update, remove\n var styleElement = document.querySelector('style[' + ssrIdKey + '~=\"' + obj.id + '\"]')\n\n if (styleElement) {\n if (isProduction) {\n // has SSR styles and in production mode.\n // simply do nothing.\n return noop\n } else {\n // has SSR styles but in dev mode.\n // for some reason Chrome can't handle source map in server-rendered\n // style tags - source maps in <style> only works if the style tag is\n // created and inserted dynamically. So we remove the server rendered\n // styles and inject new ones.\n styleElement.parentNode.removeChild(styleElement)\n }\n }\n\n if (isOldIE) {\n // use singleton mode for IE9.\n var styleIndex = singletonCounter++\n styleElement = singletonElement || (singletonElement = createStyleElement())\n update = applyToSingletonTag.bind(null, styleElement, styleIndex, false)\n remove = applyToSingletonTag.bind(null, styleElement, styleIndex, true)\n } else {\n // use multi-style-tag mode in all other cases\n styleElement = createStyleElement()\n update = applyToTag.bind(null, styleElement)\n remove = function () {\n styleElement.parentNode.removeChild(styleElement)\n }\n }\n\n update(obj)\n\n return function updateStyle (newObj /* StyleObjectPart */) {\n if (newObj) {\n if (newObj.css === obj.css &&\n newObj.media === obj.media &&\n newObj.sourceMap === obj.sourceMap) {\n return\n }\n update(obj = newObj)\n } else {\n remove()\n }\n }\n}\n\nvar replaceText = (function () {\n var textStore = []\n\n return function (index, replacement) {\n textStore[index] = replacement\n return textStore.filter(Boolean).join('\\n')\n }\n})()\n\nfunction applyToSingletonTag (styleElement, index, remove, obj) {\n var css = remove ? '' : obj.css\n\n if (styleElement.styleSheet) {\n styleElement.styleSheet.cssText = replaceText(index, css)\n } else {\n var cssNode = document.createTextNode(css)\n var childNodes = styleElement.childNodes\n if (childNodes[index]) styleElement.removeChild(childNodes[index])\n if (childNodes.length) {\n styleElement.insertBefore(cssNode, childNodes[index])\n } else {\n styleElement.appendChild(cssNode)\n }\n }\n}\n\nfunction applyToTag (styleElement, obj) {\n var css = obj.css\n var media = obj.media\n var sourceMap = obj.sourceMap\n\n if (media) {\n styleElement.setAttribute('media', media)\n }\n if (options.ssrId) {\n styleElement.setAttribute(ssrIdKey, obj.id)\n }\n\n if (sourceMap) {\n // https://developer.chrome.com/devtools/docs/javascript-debugging\n // this makes source maps inside style tags work properly in Chrome\n css += '\\n/*# sourceURL=' + sourceMap.sources[0] + ' */'\n // http://stackoverflow.com/a/26603875\n css += '\\n/*# sourceMappingURL=data:application/json;base64,' + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + ' */'\n }\n\n if (styleElement.styleSheet) {\n styleElement.styleSheet.cssText = css\n } else {\n while (styleElement.firstChild) {\n styleElement.removeChild(styleElement.firstChild)\n }\n styleElement.appendChild(document.createTextNode(css))\n }\n}\n","exports = module.exports = require(\"../../node_modules/css-loader/lib/css-base.js\")(false);\n// imports\n\n\n// module\nexports.push([module.id, \".behavior-warning-dialog.el-dialog.el-dialog--center{text-align:left}\", \"\"]);\n\n// exports\n","// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UserBehaviorMonitor.vue?vue&type=style&index=0&id=4f34cec0&prod&lang=css\");\nif(content.__esModule) content = content.default;\nif(typeof content === 'string') content = [[module.id, content, '']];\nif(content.locals) module.exports = content.locals;\n// add the styles to the DOM\nvar add = require(\"!../../node_modules/vue-style-loader/lib/addStylesClient.js\").default\nvar update = add(\"1c569d63\", content, true, {\"sourceMap\":false,\"shadowMode\":false});","// This file is imported into lib/wc client bundles.\n\nif (typeof window !== 'undefined') {\n if (process.env.NEED_CURRENTSCRIPT_POLYFILL) {\n require('current-script-polyfill')\n }\n\n var i\n if ((i = window.document.currentScript) && (i = i.src.match(/(.+\\/)[^/]+\\.js(\\?.*)?$/))) {\n __webpack_public_path__ = i[1] // eslint-disable-line\n }\n}\n\n// Indicate to webpack that this file can be concatenated\nexport default null\n","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{ref:\"behaviorMonitor\",staticClass:\"user-behavior-monitor\"},[_c('el-dialog',{attrs:{\"title\":\"提示\",\"visible\":_vm.showWarning,\"show-close\":false,\"modal\":true,\"width\":\"30%\",\"center\":\"\",\"custom-class\":\"behavior-warning-dialog\"},on:{\"update:visible\":function($event){_vm.showWarning=$event}}},[_c('span',[_vm._v(_vm._s(_vm.warningMessage))])])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n <div ref=\"behaviorMonitor\" class=\"user-behavior-monitor\">\r\n <!-- 提示框 -->\r\n <el-dialog\r\n title=\"提示\"\r\n :visible.sync=\"showWarning\"\r\n :show-close=\"false\"\r\n :modal=\"true\"\r\n width=\"30%\"\r\n center\r\n custom-class=\"behavior-warning-dialog\"\r\n >\r\n <span>{{ warningMessage }}</span>\r\n </el-dialog>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n name: 'UserBehaviorMonitor',\r\n props: {\r\n // WebSocket服务器地址\r\n // websocketUrl: {\r\n // type: String,\r\n // required: true\r\n // },\r\n // 倒计时时长(分钟)\r\n timeoutMinutes: {\r\n type: Number,\r\n default: 10\r\n },\r\n // 警告提前时间(分钟)\r\n warningMinutes: {\r\n type: Number,\r\n default: 1\r\n }\r\n },\r\n data() {\r\n return {\r\n mouseMoveThrottled: false,\r\n socket: null,\r\n countdownTimer: null,\r\n warningTimer: null,\r\n showWarning: false,\r\n // warningMinutes\r\n warningMessage: `您已${this.timeoutMinutes}分钟未操作,将在1分钟后自动退出`,\r\n lastActivityTime: null,\r\n isMonitoring: false,\r\n currentTimeoutMinutes: 10,\r\n currentWarningMinutes: 1\r\n };\r\n },\r\n mounted() {\r\n // 检查当前路由是否包含/login,如果不包含则初始化监控\r\n if (!this.isLoginRoute()) {\r\n this.initMonitor();\r\n }\r\n },\r\n beforeDestroy() {\r\n this.destroyMonitor();\r\n },\r\n watch: {\r\n // 监听路由变化\r\n '$route'(to, from) {\r\n // 安全检查 from.href 是否存在\r\n const isFromLogin = from.path.includes('/login') || \r\n (from.href && from.href.includes('/login'));\r\n \r\n // 检查当前是否为登录路由\r\n const isToLogin = this.isLoginRoute();\r\n \r\n // 如果从登录页跳转到非登录页,且监控未启动,则初始化监控\r\n if (isFromLogin && !isToLogin && !this.isMonitoring) {\r\n this.initMonitor();\r\n }\r\n // 如果从非登录页跳转到登录页,且监控正在运行,则销毁监控\r\n else if (!isFromLogin && isToLogin && this.isMonitoring) {\r\n this.destroyMonitor();\r\n }\r\n }\r\n },\r\n methods: {\r\n // 检查当前路由是否为登录页面\r\n isLoginRoute() {\r\n // 优先检查 Vue Router 路由\r\n if (this.$route && this.$route.path) {\r\n if (this.$route.path.includes('/login')) {\r\n return true;\r\n }\r\n }\r\n \r\n // 检查浏览器地址栏作为后备\r\n if (typeof window !== 'undefined') {\r\n return window.location.pathname.includes('/login') || \r\n window.location.href.includes('/login');\r\n }\r\n \r\n return false;\r\n },\r\n \r\n updateTimeoutSettings(timeoutMinutes, warningMinutes) {\r\n if (timeoutMinutes !== undefined) {\r\n this.currentTimeoutMinutes = timeoutMinutes;\r\n localStorage.setItem('userBehavior_timeoutMinutes', timeoutMinutes.toString());\r\n }\r\n \r\n if (warningMinutes !== undefined) {\r\n this.currentWarningMinutes = warningMinutes;\r\n localStorage.setItem('userBehavior_warningMinutes', warningMinutes.toString());\r\n }\r\n \r\n // 更新警告消息\r\n // ${this.currentWarningMinutes}\r\n this.warningMessage = `您已${this.currentTimeoutMinutes}分钟未操作,将在1分钟后自动退出`;\r\n \r\n // 重置计时器\r\n this.resetTimer();\r\n },\r\n // 初始化监控\r\n initMonitor() {\r\n // 再次检查确保不在登录页面\r\n if (this.isLoginRoute()) {\r\n // 如果在登录页面,确保清理所有监控资源\r\n this.destroyMonitor();\r\n return;\r\n }\r\n \r\n if (this.isMonitoring) return;\r\n \r\n this.isMonitoring = true;\r\n this.lastActivityTime = Date.now();\r\n \r\n // 初始化WebSocket连接\r\n this.initWebSocket();\r\n \r\n // 启动倒计时\r\n // this.startCountdown();\r\n \r\n // 绑定事件监听器\r\n this.bindEventListeners();\r\n },\r\n \r\n // 销毁监控\r\n destroyMonitor() {\r\n this.isMonitoring = false;\r\n \r\n // 清除定时器\r\n if (this.countdownTimer) clearInterval(this.countdownTimer);\r\n if (this.warningTimer) clearTimeout(this.warningTimer);\r\n \r\n // 关闭WebSocket连接\r\n if (this.socket) {\r\n this.socket.close();\r\n this.socket = null;\r\n }\r\n \r\n // 解绑事件监听器\r\n this.unbindEventListeners();\r\n },\r\n \r\n // 初始化WebSocket连接\r\n initWebSocket() {\r\n try {\r\n // 使用传入的WebSocket URL\r\n const websocketUrl = `wss://${location.host}/xy-api/auth-server/ws/user-activity`;\r\n \r\n // 获取token(假设存储在localStorage中)\r\n let token = '';\r\n try {\r\n const apiHeader = localStorage.getItem('api_header');\r\n if (apiHeader) {\r\n token = JSON.parse(apiHeader).Authorization || '';\r\n }\r\n } catch (e) {\r\n token = localStorage.getItem('token') || '';\r\n }\r\n \r\n // 创建WebSocket连接\r\n this.socket = new WebSocket(`${websocketUrl}?token=${encodeURIComponent(token)}`);\r\n \r\n // 设置连接成功回调\r\n this.socket.onopen = () => {\r\n console.log('WebSocket连接已建立');\r\n this.sendUserBehavior();\r\n this.$emit('websocket-open');\r\n };\r\n \r\n // 设置接收消息回调\r\n this.socket.onmessage = (event) => {\r\n try {\r\n const data = JSON.parse(event.data);\r\n console.log('收到用户活动状态消息:', data);\r\n this.handleActivityStatus(data);\r\n this.$emit('websocket-message', data);\r\n } catch (e) {\r\n console.error('解析WebSocket消息失败:', e);\r\n }\r\n };\r\n \r\n // 设置连接关闭回调\r\n this.socket.onclose = (event) => {\r\n console.log('WebSocket连接已断开:', event.reason);\r\n this.$emit('websocket-close');\r\n };\r\n \r\n // 设置连接错误回调\r\n this.socket.onerror = (error) => {\r\n console.error('WebSocket错误:', error);\r\n this.$emit('websocket-error', error);\r\n };\r\n \r\n } catch (error) {\r\n console.error('WebSocket初始化失败:', error);\r\n this.$emit('websocket-error', error);\r\n }\r\n },\r\n \r\n // 处理活动状态信息\r\n handleActivityStatus(data) {\r\n if (data.type === 'ACTIVITY_STATUS' && data.data) {\r\n const activityData = data.data;\r\n \r\n // 更新超时和警告时间配置\r\n this.currentTimeoutMinutes = activityData.timeoutMinutes || 10;\r\n this.currentWarningMinutes = activityData.reminderMinutes || 1;\r\n \r\n // 更新警告消息\r\n this.warningMessage = `您已${this.currentTimeoutMinutes}分钟未操作,将在${this.currentWarningMinutes}分钟后自动退出`;\r\n if(activityData.needReminder){\r\n this.showWarningWarning(activityData.remainingMillis);\r\n }\r\n // remainingMillis\r\n\r\n\r\n // 检查是否仍然活跃\r\n //if (!activityData.isActive) {\r\n //this.handleInactiveStatus();\r\n //}\r\n }\r\n // 检查是否需要显示提醒\r\n // let dataReminder=data.data;\r\n // if (dataReminder&&dataReminder.needReminder) {\r\n // this.showWarningWarning(dataReminder.remainingSeconds);\r\n // }\r\n },\r\n \r\n // 处理非活跃状态\r\n handleInactiveStatus() {\r\n // 清空缓存\r\n localStorage.clear();\r\n sessionStorage.clear();\r\n \r\n // 跳转到登录页\r\n //this.$router.push('/login');\r\n \r\n // 或者使用window.location\r\n window.location.href = '/login';\r\n \r\n // 触发登出事件\r\n this.$emit('logout');\r\n },\r\n \r\n // 发送用户行为数据到后端\r\n sendUserBehavior(data) {\r\n console.log('用户行为监测:')\r\n if (this.warningTimer) clearTimeout(this.warningTimer);\r\n if (this.socket && this.socket.readyState === WebSocket.OPEN) {\r\n const message = {\r\n \"type\": \"HEARTBEAT\",\r\n \"message\": \"心跳\",\r\n };\r\n console.log('用户行为监测:', JSON.stringify(message));\r\n this.socket.send(JSON.stringify(message));\r\n }\r\n },\r\n \r\n // 绑定事件监听器\r\n bindEventListeners() {\r\n // 鼠标事件\r\n document.addEventListener('click', this.handleUserActivity, true);\r\n document.addEventListener('dblclick', this.handleUserActivity, true);\r\n document.addEventListener('mousedown', this.handleUserActivity, true);\r\n document.addEventListener('mouseup', this.handleUserActivity, true);\r\n document.addEventListener('mousemove', this.handleMouseMove, true);\r\n document.addEventListener('mouseover', this.handleUserActivity, true);\r\n document.addEventListener('mouseout', this.handleUserActivity, true);\r\n \r\n // 键盘事件\r\n document.addEventListener('keydown', this.handleUserActivity, true);\r\n document.addEventListener('keyup', this.handleUserActivity, true);\r\n \r\n // 表单事件\r\n document.addEventListener('input', this.handleUserActivity, true);\r\n document.addEventListener('change', this.handleUserActivity, true);\r\n document.addEventListener('focus', this.handleUserActivity, true);\r\n document.addEventListener('blur', this.handleUserActivity, true);\r\n \r\n // 滚动事件(防抖处理)\r\n document.addEventListener('scroll', this.debounce(this.handleUserActivity, 300), true);\r\n \r\n // 窗口事件\r\n window.addEventListener('resize', this.handleUserActivity, true);\r\n window.addEventListener('beforeunload', this.handleBeforeUnload);\r\n },\r\n \r\n // 解绑事件监听器\r\n unbindEventListeners() {\r\n document.removeEventListener('click', this.handleUserActivity, true);\r\n document.removeEventListener('dblclick', this.handleUserActivity, true);\r\n document.removeEventListener('mousedown', this.handleUserActivity, true);\r\n document.removeEventListener('mouseup', this.handleUserActivity, true);\r\n document.removeEventListener('mousemove', this.handleMouseMove, true);\r\n document.removeEventListener('mouseover', this.handleUserActivity, true);\r\n document.removeEventListener('mouseout', this.handleUserActivity, true);\r\n \r\n document.removeEventListener('keydown', this.handleUserActivity, true);\r\n document.removeEventListener('keyup', this.handleUserActivity, true);\r\n \r\n document.removeEventListener('input', this.handleUserActivity, true);\r\n document.removeEventListener('change', this.handleUserActivity, true);\r\n document.removeEventListener('focus', this.handleUserActivity, true);\r\n document.removeEventListener('blur', this.handleUserActivity, true);\r\n \r\n document.removeEventListener('scroll', this.debounce(this.handleUserActivity, 300), true);\r\n \r\n window.removeEventListener('resize', this.handleUserActivity, true);\r\n window.removeEventListener('beforeunload', this.handleBeforeUnload);\r\n },\r\n \r\n // 处理用户活动\r\n handleUserActivity(event) {\r\n // 过滤掉自动触发的事件\r\n if (this.isAutomaticEvent(event)) return;\r\n \r\n this.resetTimer();\r\n \r\n // 发送用户行为数据\r\n const behaviorData = {\r\n eventType: event.type,\r\n target: event.target.tagName,\r\n timestamp: Date.now(),\r\n url: window.location.href\r\n };\r\n \r\n // 添加特定事件的额外信息\r\n if (event.type === 'click') {\r\n behaviorData.clientX = event.clientX;\r\n behaviorData.clientY = event.clientY;\r\n } else if (event.type === 'keydown') {\r\n behaviorData.key = event.key;\r\n behaviorData.ctrlKey = event.ctrlKey;\r\n behaviorData.altKey = event.altKey;\r\n behaviorData.shiftKey = event.shiftKey;\r\n }\r\n \r\n this.sendUserBehavior(behaviorData);\r\n },\r\n handleMouseMove(event) {\r\n if (!this.mouseMoveThrottled) {\r\n this.handleUserActivity(event);\r\n this.mouseMoveThrottled = true;\r\n setTimeout(() => {\r\n this.mouseMoveThrottled = false;\r\n }, 500);\r\n }\r\n },\r\n \r\n // 判断是否为自动触发事件\r\n isAutomaticEvent(event) {\r\n // 自动刷新等非用户主动触发的事件\r\n if (event.type === 'scroll' && !this.isUserScrolling) {\r\n return true;\r\n }\r\n return false;\r\n },\r\n \r\n // 防抖函数\r\n debounce(func, wait) {\r\n let timeout;\r\n return function executedFunction(...args) {\r\n const later = () => {\r\n clearTimeout(timeout);\r\n func.apply(this, args);\r\n };\r\n clearTimeout(timeout);\r\n timeout = setTimeout(later, wait);\r\n };\r\n },\r\n \r\n // 重置计时器\r\n resetTimer() {\r\n this.lastActivityTime = Date.now();\r\n this.showWarning = false;\r\n \r\n // 清除警告定时器\r\n if (this.warningTimer) {\r\n clearTimeout(this.warningTimer);\r\n this.warningTimer = null;\r\n }\r\n \r\n // 重新启动倒计时\r\n // this.startCountdown();\r\n \r\n this.$emit('user-active');\r\n },\r\n \r\n // 启动倒计时\r\n startCountdown() {\r\n // 清除现有定时器\r\n if (this.countdownTimer) clearInterval(this.countdownTimer);\r\n \r\n // 设置新的倒计时\r\n this.countdownTimer = setInterval(() => {\r\n const now = Date.now();\r\n const elapsedMinutes = (now - this.lastActivityTime) / (1000 * 50);\r\n \r\n // 检查是否需要显示警告\r\n if (elapsedMinutes >= (this.currentTimeoutMinutes - this.currentWarningMinutes) && !this.warningTimer) {\r\n this.showWarningWarning();\r\n }\r\n \r\n // 检查是否超时\r\n if (elapsedMinutes >= this.currentTimeoutMinutes) {\r\n this.handleTimeout();\r\n }\r\n }, 1000);\r\n },\r\n \r\n // 显示超时警告\r\n showWarningWarning(timeoutMinutes) {\r\n let time=timeoutMinutes||50;\r\n console.log('Setting showWarning to true');\r\n this.showWarning = true;\r\n this.$emit('timeout-warning');\r\n if (this.warningTimer) clearTimeout(this.warningTimer);\r\n // 设置超时处理\r\n this.warningTimer = setTimeout(() => {\r\n this.handleTimeout();\r\n }, 1 * time * 1000);\r\n },\r\n \r\n // 处理超时\r\n handleTimeout() {\r\n this.showWarning = false;\r\n this.$emit('timeout');\r\n \r\n // 执行登出逻辑\r\n this.logout();\r\n },\r\n \r\n // 登出操作\r\n logout() {\r\n localStorage.clear();\r\n sessionStorage.clear();\r\n location.reload();\r\n // 跳转到登录页\r\n //this.$router.push('/login');\r\n \r\n // 或者使用window.location\r\n // window.location.href = '/login';\r\n // 发送登出消息到后端\r\n if (this.socket && this.socket.readyState === WebSocket.OPEN) {\r\n const message = {\r\n type: 'logout',\r\n timestamp: Date.now()\r\n };\r\n this.socket.send(JSON.stringify(message));\r\n }\r\n \r\n // 触发登出事件\r\n this.$emit('logout');\r\n \r\n // 清除定时器\r\n if (this.countdownTimer) clearInterval(this.countdownTimer);\r\n if (this.warningTimer) clearTimeout(this.warningTimer);\r\n },\r\n \r\n // 处理页面卸载前的操作\r\n handleBeforeUnload(event) {\r\n // 发送页面关闭消息\r\n if (this.socket && this.socket.readyState === WebSocket.OPEN) {\r\n const message = {\r\n type: 'page_unload',\r\n timestamp: Date.now()\r\n };\r\n this.socket.send(JSON.stringify(message));\r\n }\r\n },\r\n \r\n // 手动重置监控\r\n reset() {\r\n // 检查当前路由,如果在登录页面则销毁监控\r\n if (this.isLoginRoute()) {\r\n this.destroyMonitor();\r\n return;\r\n }\r\n \r\n this.resetTimer();\r\n },\r\n \r\n // 重新连接WebSocket\r\n reconnect() {\r\n // 检查当前路由,如果在登录页面则销毁监控\r\n if (this.isLoginRoute()) {\r\n this.destroyMonitor();\r\n return;\r\n }\r\n \r\n if (this.socket) {\r\n this.socket.close();\r\n }\r\n this.initWebSocket();\r\n }\r\n }\r\n};\r\n</script>\r\n<style>\r\n.behavior-warning-dialog.el-dialog.el-dialog--center{\r\n text-align: left;\r\n}\r\n</style>","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UserBehaviorMonitor.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UserBehaviorMonitor.vue?vue&type=script&lang=js\"","/* globals __VUE_SSR_CONTEXT__ */\n\n// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).\n// This module is a runtime utility for cleaner component module output and will\n// be included in the final webpack user bundle.\n\nexport default function normalizeComponent(\n scriptExports,\n render,\n staticRenderFns,\n functionalTemplate,\n injectStyles,\n scopeId,\n moduleIdentifier /* server only */,\n shadowMode /* vue-cli only */\n) {\n // Vue.extend constructor export interop\n var options =\n typeof scriptExports === 'function' ? scriptExports.options : scriptExports\n\n // render functions\n if (render) {\n options.render = render\n options.staticRenderFns = staticRenderFns\n options._compiled = true\n }\n\n // functional template\n if (functionalTemplate) {\n options.functional = true\n }\n\n // scopedId\n if (scopeId) {\n options._scopeId = 'data-v-' + scopeId\n }\n\n var hook\n if (moduleIdentifier) {\n // server build\n hook = function (context) {\n // 2.3 injection\n context =\n context || // cached call\n (this.$vnode && this.$vnode.ssrContext) || // stateful\n (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional\n // 2.2 with runInNewContext: true\n if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {\n context = __VUE_SSR_CONTEXT__\n }\n // inject component styles\n if (injectStyles) {\n injectStyles.call(this, context)\n }\n // register component module identifier for async chunk inferrence\n if (context && context._registeredComponents) {\n context._registeredComponents.add(moduleIdentifier)\n }\n }\n // used by ssr in case component is cached and beforeCreate\n // never gets called\n options._ssrRegister = hook\n } else if (injectStyles) {\n hook = shadowMode\n ? function () {\n injectStyles.call(\n this,\n (options.functional ? this.parent : this).$root.$options.shadowRoot\n )\n }\n : injectStyles\n }\n\n if (hook) {\n if (options.functional) {\n // for template-only hot-reload because in that case the render fn doesn't\n // go through the normalizer\n options._injectStyles = hook\n // register for functional component in vue file\n var originalRender = options.render\n options.render = function renderWithStyleInjection(h, context) {\n hook.call(context)\n return originalRender(h, context)\n }\n } else {\n // inject component registration as beforeCreate hook\n var existing = options.beforeCreate\n options.beforeCreate = existing ? [].concat(existing, hook) : [hook]\n }\n }\n\n return {\n exports: scriptExports,\n options: options\n }\n}\n","import { render, staticRenderFns } from \"./UserBehaviorMonitor.vue?vue&type=template&id=4f34cec0\"\nimport script from \"./UserBehaviorMonitor.vue?vue&type=script&lang=js\"\nexport * from \"./UserBehaviorMonitor.vue?vue&type=script&lang=js\"\nimport style0 from \"./UserBehaviorMonitor.vue?vue&type=style&index=0&id=4f34cec0&prod&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n null,\n null\n \n)\n\nexport default component.exports","import UserBehaviorMonitor from './components/UserBehaviorMonitor.vue';\r\n\r\n// 为使用 CDN 方式引入的用户提供组件注册方法\r\nUserBehaviorMonitor.install = function(Vue) {\r\n Vue.component(UserBehaviorMonitor.name, UserBehaviorMonitor);\r\n};\r\n\r\n// 导出组件\r\nexport default UserBehaviorMonitor;\r\n\r\n// 如果是直接引入文件,则自动注册组件\r\nif (typeof window !== 'undefined' && window.Vue) {\r\n UserBehaviorMonitor.install(window.Vue);\r\n}\r\n\r\n// 同时支持按需导入\r\nexport { UserBehaviorMonitor };","import './setPublicPath'\nimport mod from '~entry'\nexport default mod\nexport * from '~entry'\n"],"sourceRoot":""}