<template>
  <div id="app">
    <router-view />
    <deomon-topic ref="deomonTopic"/>
  </div>
</template>

<script>
import { handleToken } from '@/utils/auth';
import { creatSubscribe, perpetualTopic } from '@/utils/stomp';
import DeomonTopic from '@/views/demonstration/deomonTopic';
export default {
	name: 'App',
	components: {
		DeomonTopic
		//     QuickMenu
	},
	watch: {
		'$store.state.socket.roomInvite': function (val) {
			if (val.creatorId) {
				this.subscribeMessage(val);
			}
		}
	},
	mounted() {
		this.prohibitSystemContextMenu();
		this.subscribe();
	},
	methods: {
		prohibitSystemContextMenu() {
			window.document.oncontextmenu = function () {
				return false;
			};
		},
		subscribe() {
			this.$nextTick(() => {
				if (!this.$route.path.includes('/login') && this.$route.path != '/404') {
					const header = { group: '', 'X-Token': handleToken() };
					creatSubscribe(perpetualTopic, header);
				}
			});
		},
		subscribeMessage(res) {
			if (this.$refs.deomonTopic) {
				this.$refs.deomonTopic.doShow(res);
				this.$store.dispatch('socket/setRoomInvite');
			}
		}
	}
};

</script>
