From a56d8c70d6dd8f6fedc98aa768c3a2182d54acb8 Mon Sep 17 00:00:00 2001 From: panlinlin <648540858@qq.com> Date: 星期二, 13 四月 2021 11:33:26 +0800 Subject: [PATCH] 优化编码信息信息页面 --- web_src/src/components/UiHeader.vue | 68 +++++++++++++++++++++++++++++++--- 1 files changed, 62 insertions(+), 6 deletions(-) diff --git a/web_src/src/components/UiHeader.vue b/web_src/src/components/UiHeader.vue index 3c264cd..85bb230 100644 --- a/web_src/src/components/UiHeader.vue +++ b/web_src/src/components/UiHeader.vue @@ -2,9 +2,11 @@ <div id="UiHeader"> <el-menu router :default-active="this.$route.path" background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" mode="horizontal"> <el-menu-item index="/">鎺у埗鍙�</el-menu-item> - <el-menu-item index="/videoList">璁惧鍒楄〃</el-menu-item> - <el-menu-item index="/parentPlatformList">鍥芥爣绾ц仈</el-menu-item> - <!-- <el-menu-item index="/videoReplay">褰曞儚鍥炵湅</el-menu-item> --> + <el-menu-item index="/deviceList">璁惧鍒楄〃</el-menu-item> + <el-menu-item index="/pushVideoList">鎺ㄦ祦鍒楄〃</el-menu-item> + <el-menu-item index="/streamProxyList">鎷夋祦浠g悊</el-menu-item> + <el-menu-item index="/parentPlatformList/15/1">鍥芥爣绾ц仈</el-menu-item> + <el-switch v-model="alarmNotify" active-text="鎶ヨ淇℃伅鎺ㄩ��" style="display: block float: right" @change="sseControl"></el-switch> <el-menu-item style="float: right;" @click="loginout">閫�鍑�</el-menu-item> </el-menu> </div> @@ -13,14 +15,68 @@ <script> export default { name: "UiHeader", + components: { Notification }, + data() { + return { + alarmNotify: true, + sseSource: null, + }; + }, methods:{ - loginout(){ // 鍒犻櫎cookie锛屽洖鍒扮櫥褰曢〉闈� this.$cookies.remove("session"); this.$router.push('/login'); + this.sseSource.close(); }, - } -} + beforeunloadHandler() { + this.sseSource.close(); + }, + sseControl() { + let that = this; + if (this.alarmNotify) { + console.log("鐢宠SSE鎺ㄩ�丄PI璋冪敤锛屾祻瑙堝櫒ID: " + this.$browserId); + this.sseSource = new EventSource('/api/emit?browserId=' + this.$browserId); + this.sseSource.addEventListener('message', function(evt) { + that.$notify({ + title: '鏀跺埌鎶ヨ淇℃伅', + dangerouslyUseHTMLString: true, + message: evt.data, + type: 'warning' + }); + console.log("鏀跺埌淇℃伅锛�" + evt.data); + }); + this.sseSource.addEventListener('open', function(e) { + console.log("SSE杩炴帴鎵撳紑."); + }, false); + this.sseSource.addEventListener('error', function(e) { + if (e.target.readyState == EventSource.CLOSED) { + console.log("SSE杩炴帴鍏抽棴"); + } else { + console.log(e.target.readyState); + } + }, false); + } else { + this.sseSource.removeEventListener('open', null); + this.sseSource.removeEventListener('message', null); + this.sseSource.removeEventListener('error', null); + this.sseSource.close(); + } + } + }, + mounted() { + window.addEventListener('beforeunload', e => this.beforeunloadHandler(e)) + // window.addEventListener('unload', e => this.unloadHandler(e)) + this.sseControl(); + }, + destroyed() { + window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e)) + this.sseSource.removeEventListener('open', null); + this.sseSource.removeEventListener('message', null); + this.sseSource.removeEventListener('error', null); + this.sseSource.close(); + // window.removeEventListener('unload', e => this.unloadHandler(e)) + }, + } </script> -- Gitblit v1.8.0