<template>
|
<div class="main" style="overflow:hidden">
|
<div class="main_tabs">
|
<el-tabs v-model="activeName" @tab-click="handleClick">
|
<el-tab-pane label="安全监控" name="first">
|
<safe-video ref="Safes"></safe-video>
|
</el-tab-pane>
|
<el-tab-pane label="现场监控" name="second">
|
<scene-video ref="Scenes"></scene-video>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
</div>
|
</template>
|
<script>
|
import SafeVideo from './components/SafeVideo.vue'//安全监控
|
import SceneVideo from './components/SceneVideo.vue'//现场监控
|
export default {
|
components:{
|
SafeVideo,
|
SceneVideo,
|
},
|
data(){
|
return{
|
activeName:'first'
|
}
|
},
|
mounted(){
|
this.$refs.Safes.searchButtonInfo();
|
},
|
methods:{
|
//切换界面
|
handleClick(tab){
|
switch(tab.name){
|
case 'second':
|
this.$refs.Safes.clearInit()
|
this.$refs.Scenes.searchButtonInfo();
|
this.$refs.Scenes.openFullScreen();
|
break;
|
default:
|
this.$refs.Scenes.clearInit()
|
this.$refs.Safes.searchButtonInfo();
|
this.$refs.Safes.openFullScreen();
|
}
|
},
|
}
|
}
|
</script>
|
<style scoped lang="scss">
|
@import'@/style/layout-main.scss';
|
/deep/ .el-tabs__content{
|
position: static;
|
}
|
|
/deep/.main {
|
background: none;
|
}
|
</style>
|
