rt-sim-training-client/src/views/trainingPlatform/index.vue
2019-09-25 13:05:01 +08:00

89 lines
2.5 KiB
Vue

<template>
<div class="app-wrapper">
<el-scrollbar wrap-class="scrollbar-wrapper">
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
<demon-list ref="demonList" :height="height" />
</div>
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
<transition>
<router-view :style="{ position:'relative', left:widthLeft+'px', width: (width - widthLeft)+'px'}" :product-list="productList" />
</transition>
</el-scrollbar>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import demonList from './demonList';
import drapLeft from '@/views/components/drapLeft/index';
import { launchFullscreen } from '@/utils/screen';
import localStore from 'storejs';
import { getSessionStorage, setSessionStorage } from '@/utils/auth';
export default {
name: 'Exam',
components: {
demonList,
drapLeft
},
data() {
return {
listShow: true,
widthLeft: 450,
productList: []
};
},
computed: {
...mapGetters([
'lessonbar'
]),
height() {
return this.$store.state.app.height - 50;
},
width() {
return this.$store.state.app.width;
}
},
watch: {
'lessonbar.opened': function (val) {
this.listShow = val;
}
},
mounted() {
const againEnter = getSessionStorage('againEnter') || null;
if (!againEnter){
launchFullscreen();
setSessionStorage('againEnter',true);
}
this.widthLeft = Number(localStore.get('LeftWidth'));
},
methods: {
refresh() {
this.$refs && this.$refs.demonList && this.$refs.demonList.refresh();
},
drapWidth(width) {
this.widthLeft = Number(width);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
overflow: hidden;
}
.examList {
/*float: left;*/
position: fixed;
top: 61px;
height: 100%;
}
</style>