1.接入signalR 消息推送功能

loulijun2021

2023-07-19 5cf009d5ee7cd782a360848d5c2d7b71aec4d8af

 src/layout/components/Navbar.vue

@@ -64,6 +64,16 @@
          <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>
          <!--        <el-tooltip content="Global Size" effect="dark" placement="bottom">-->
          <!--          <size-select id="size-select" class="right-menu-item hover-effect" />-->
          <!--        </el-tooltip>-->
@@ -95,12 +105,16 @@
            <el-dropdown-item @click.native="editPassword">
              <span style="display:block;">修改密码</span>
            </el-dropdown-item>
            <el-dropdown-item divided @click.native="systemSetting">
              <span style="display:block;">系统配置</span>
            </el-dropdown-item>
            <el-dropdown-item divided @click.native="logout">
              <span style="display:block;font-weight: bolder">退出</span>
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>

      <el-dialog
        v-el-drag-dialog
        title="修改密码"
@@ -133,6 +147,11 @@
      </el-dialog>

    </div>

    <right-panel ref="rightPanel">
      <settings />
    </right-panel>

  </div>

</template>
@@ -150,6 +169,8 @@
import Search from '@/components/HeaderSearch'
import Screenfull from '@/components/Screenfull'
import variables from '@/styles/variables.scss'
import RightPanel from '@/components/RightPanel'
import Settings from '../components/Settings/index'

export default {
  components: {
@@ -157,9 +178,12 @@
    Breadcrumb,
    Hamburger,
    Search,
    Screenfull
    Screenfull,
    Settings,
    RightPanel
  },
  directives: { elDragDialog },

  data() {
    const validatePassword1 = (rule, value, callback) => {
      if (!value) {
@@ -198,7 +222,9 @@
        newpassword: [
          { required: true, validator: validatePassword2, trigger: ['blur', 'change'] }
        ]
      }
      },
      stu_torgname: '',
      show: false
    }
  },
  inject: [
@@ -207,6 +233,19 @@
  created() {
    this.usercode = getCookie('navTabId')
    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([
@@ -238,6 +277,10 @@
    }
  },
  methods: {
    systemSetting() {
      this.$refs.rightPanel.show = !this.$refs.rightPanel.show
      this.$refs.rightPanel.addEventClick()
    },
    pageRefreshClick() {
      this.reload()
      const tabViews = this.$store.state.tagsView.visitedViews.map(item => {
@@ -261,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`)
@@ -298,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;