1.接入signalR 消息推送功能

loulijun2021

2023-07-19 5cf009d5ee7cd782a360848d5c2d7b71aec4d8af

 src/layout/components/Navbar.vue

@@ -64,6 +64,13 @@
          <el-tooltip class="item" effect="dark" content="全屏" placement="bottom">
            <screenfull id="screenfull" class="right-menu-item hover-effect" />
          </el-tooltip>

          <el-tooltip class="item" effect="dark" content="我的消息" placement="bottom">
            <el-badge :is-dot="$store.state.settings.isDot" class="item right-menu-item hover-effect">
              <i class="el-icon-bell" @click="$message('点击了我的消息！');$store.state.settings.isDot=false" />
            </el-badge>
          </el-tooltip>

          <div style=" font-size: 18px;font-family: 'Microsoft YaHei';color:#AAAAAA;padding:0 8px;cursor: pointer">
            {{ stu_torgname }}
          </div>
@@ -228,6 +235,18 @@
    this.username = getCookie('username')
    this.stu_torgname = getCookie('stu_torgname') === '' ? '系统管理员' : getCookie('stu_torgname')
  },
  mounted() {
    this.$signalr.off('SendAll')
    this.$signalr.on('SendAll', (res) => {
      this.$notify({
        offset: 80,
        type: 'warning',
        title: '消息提醒',
        message: res
      })
      this.$store.state.settings.isDot = true
    })
  },
  computed: {
    ...mapGetters([
      'sidebar',
@@ -285,6 +304,7 @@
      this.$store.dispatch('app/toggleSideBar')
    },
    async logout() {
      this.$signalr.off('SendAll')
      await this.$store.dispatch('user/logout')
      this.$message.success('退出成功！')
      this.$router.push(`/login`)
@@ -322,6 +342,12 @@
}
</script>
<style lang="scss" scoped>
::v-deep .el-badge__content {
  position: absolute !important;
  top: 12px !important;
  right: 10px !important;
}

.display_btw {
  display: flex;
  justify-content: space-between;