rt-sim-training-client/src/App.vue

117 lines
3.8 KiB
Vue

<template>
<div id="app">
<router-view />
<deomon-topic ref="deomonTopic" />
<img v-show="loading" :src="loadingImg" class="AppAll">
</div>
</template>
<script>
import { getToken } from '@/utils/auth';
import { getSessionStorage } from '@/utils/auth';
import { loginInfo, ProjectIcon } from '@/scripts/ProjectConfig';
import DeomonTopic from '@/views/demonstration/deomonTopic';
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
import LoadingImg from '@/assets/loading.gif';
import { openIndexedDB } from '@/utils/indexedDb';
export default {
name: 'App',
components: {
DeomonTopic
},
mixins: [
WindowResizeHandler
],
data() {
return {
loadingImg: LoadingImg,
loading: false
};
},
watch: {
'$store.state.socket.simulationInvite': function (val) {
if (val.creator) {
this.subscribeMessage(val);
}
},
'$store.state.socket.roomInvite': function (val) {
if (val.creator) {
this.subscribeMessage(val);
}
},
'$store.state.socket.beLogoutCount': async function(val) {
if (this.$store.state.socket.loggedOutMsg.token === getToken()) {
this.$store.dispatch('disconnect').then(()=>{
this.$alert(this.$t('tip.logoutTips'), this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
callback: action => {
this.$store.dispatch('exit').then(resp => {
this.$router.push({path: loginInfo[getSessionStorage('project')].loginPath});
});
}
});
});
}
},
'$store.state.app.transitionAnimationsCount': function(val) {
this.loading = true;
},
'$store.state.app.animationsCloseCount': function(val) {
this.loading = false;
}
},
created() {
const project = getSessionStorage('project');
if (project) {
document.querySelector("link[rel*='icon']").href = loginInfo[project].linkIcon || ProjectIcon[project];
}
},
mounted() {
this.prohibitSystemContextMenu();
window.addEventListener('beforeunload', async e => {
if (!this.$route.query.noPreLogout) {
await this.$store.dispatch('preLogout');
}
});
this.$nextTick(() => {
this.subscribe();
openIndexedDB();
});
},
methods: {
resizeHandler() {
this.$store.dispatch('app/resize', { width: this._clientWidth, height: this._clientHeight });
},
prohibitSystemContextMenu() {
window.document.oncontextmenu = function () {
return false;
};
},
subscribeMessage(res) {
if (this.$refs.deomonTopic && !window.location.href.includes('trainroom')) {
if (!(getSessionStorage('project').includes('design'))) {
this.$refs.deomonTopic.doShow(res);
}
this.$store.dispatch('socket/setSimulationInvite');
this.$store.dispatch('socket/setRoomInvite');
}
},
subscribe() {
const token = getToken();
const path = window.location.pathname;
if (token && this.$route.path != '/404' && !path.endsWith('login')) {
const header = { group: '', 'X-Token': token };
this.$store.dispatch('subscribe', {header, type: getSessionStorage('project')});
}
}
}
};
</script>
<style lang="scss" scoped>
.AppAll{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2003}
</style>