hi-ucs/front/src/App.vue

<!--
 * @Author: hisense.wuhongjian
 * @Date: 2022-05-06 11:12:00
 * @LastEditors: hisense.liangjunhua
 * @LastEditTime: 2022-07-26 11:27:50
 * @Description: 告诉大家这是什么
-->
<template>
  <div id="vue-admin-beautiful">
    <a-config-provider :locale="locale">
      <router-view />
    </a-config-provider>
  </div>
</template>
<script setup>
  import zhCN from 'ant-design-vue/es/locale/zh_CN'
  import Cookies from 'js-cookie'
  import { onBeforeUnmount } from 'vue'
  import { useRouter } from 'vue-router'
  import mybus from '@/myplugins/mybus'
  const router = useRouter()

  // export default {
  //   name: 'App',
  //   data() {
  //     return {
  //       ,
  //     }
  //   },
  // }
  const locale = zhCN
  const token = Cookies.get('ucsToken')
  console.log('token=================>', token)
  let ws = new WebSocket(
    `ws://${window.SITE_CONFIG['websocketURL']}/websocket?token=${token}`
  )
  // ws.send()给服务器发送信息
  // 服务器每次返回信息都会执行一次onmessage方法
  ws.onmessage = function (e) {
    console.log('WebSocket服务器返回的信息: ' + e.data)
    mybus.emit('getMynotice')
    // 判断当前路由是否是消息中心
    if (router.currentRoute.value.name === 'mynoticeView') {
      mybus.emit('noticeListInit')
    }
  }
  ws.onerror = function (e) {
    console.log('WebSocket连接异常============================>', e)
    ws = new WebSocket(
      `ws://${window.SITE_CONFIG['websocketURL']}/websocket?token=${token}`
    )
  }
  ws.onclose = function (e) {
    console.log('WebSocket连接断开============================>', e)
  }
  onBeforeUnmount(() => {
    // 4.卸载前, 关闭链接
    ws.close()
  })
</script>
<style lang="less">
  @import '~@/vab/styles/vab.less';
  #vue-admin-beautiful {
    max-width: 1920px;
    // max-height: 1080px;
    margin: auto;
    height: 100%;
    position: relative;
    background-color: #fff;
  }
</style>