新增事件处理中心msgbus

src/assets/js/msgBus.js

+import Vue from 'vue'
+export default new Vue({
+  name: 'bus',
+  data () {
+    return {
+      msg: {}
+    }
+  }
+})

src/components/index.vue

@@ -55,6 +55,9 @@ export default {
     this.windowResize()
   },
   mounted () {
+    this.MsgBus.$on('inceptMessage', (msg) => {
+      console.log(msg)
+    })
     const that = this
     window.onresize = () => {
       return (() => {

src/components/pageNav.vue

@@ -55,10 +55,55 @@ export default {
       this.animateClass = 'animated rollOut'
     },
     changeControlState: function (index) {
+      let Name = this.controlMenu[index].Name
+      if (Name === '弹幕') {
+        console.log('dm')
+      } else if (Name === '声音') {
+        console.log('sy')
+        this.mutePage(this.controlMenu[index].state)
+      } else if (Name === '全屏') {
+        console.log('qp')
+        if (!this.controlMenu[index].state) {
+          this.fullScreen()
+        } else {
+          this.exitFullscreen()
+        }
+      }
       this.controlMenu[index].state = !this.controlMenu[index].state
     },
+    setMute: function (elem, t) {
+      elem.muted = t
+      elem.pause()
+    },
+    mutePage: function (t) {
+      document.querySelectorAll('audio').forEach(audio => this.setMute(audio, !t))
+    },
+    fullScreen: function () { // 全屏
+      let element = document.documentElement
+      if (element.requestFullscreen) {
+        element.requestFullscreen()
+      } else if (element.msRequestFullscreen) {
+        element.msRequestFullscreen()
+      } else if (element.mozRequestFullScreen) {
+        element.mozRequestFullScreen()
+      } else if (element.webkitRequestFullscreen) {
+        element.webkitRequestFullscreen()
+      }
+    },
+    exitFullscreen: function () { // 退出全屏
+      if (document.exitFullscreen) {
+        document.exitFullscreen()
+      } else if (document.msExitFullscreen) {
+        document.msExitFullscreen()
+      } else if (document.mozCancelFullScreen) {
+        document.mozCancelFullScreen()
+      } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen()
+      }
+    },
     goPage: function (obj) {
-      if (!obj.children.length) {
+      this.MsgBus.$emit('inceptMessage', '666')
+      if (!obj.children.length && this.$route.name !== obj.Url) {
         this.$router.push({
           name: obj.Url
         })

src/main.js

@@ -6,6 +6,8 @@ import router from './router'
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 import socketio from 'socket.io-client'
+import MsgBus from './assets/js/msgBus'
+Vue.prototype.MsgBus = MsgBus
 Vue.config.productionTip = false
 Vue.use(ElementUI)
 Vue.prototype.$socketio = socketio