78 lines
1.8 KiB
Vue
78 lines
1.8 KiB
Vue
<template>
|
|
<div class="CenterBox">
|
|
<div class="title">
|
|
<i>实时数据</i>
|
|
</div>
|
|
<div class="tab-select">
|
|
<span :class="activeTab == 0?'active-span':''" @click="changeActive(0)">实时监控</span>
|
|
<span :class="activeTab == 1?'active-span':''" @click="changeActive(1)">3D模型</span>
|
|
</div>
|
|
<div class="href-content">
|
|
<iframe :src="iframeUrl" frameborder="0" style="width: 100%;height: 100%;"></iframe>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { GlobalStore } from "@/stores";
|
|
import { ref, reactive, onMounted } from "vue";
|
|
const emits = defineEmits(["openDialog"])
|
|
const store = GlobalStore();
|
|
const activeTab = ref(0)
|
|
const iframeUrl = ref('http://jxj.zhgdyun.com:8082/bim/rt-video/srs/srs.html')
|
|
const changeActive = (activeIndex:any) => {
|
|
activeTab.value = activeIndex;
|
|
iframeUrl.value = activeIndex == 0?'http://jxj.zhgdyun.com:8082/bim/rt-video/srs/srs.html':'http://jxjzw.zhgdyun.com:8082/rt-3dmx'
|
|
}
|
|
onMounted(() => {
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.CenterBox {
|
|
width: 100%;
|
|
height: 100%;
|
|
.title {
|
|
height: 7%;
|
|
// line-height: 33px;
|
|
display: flex;
|
|
align-items: center;
|
|
text-align: left;
|
|
font-size: calc(100vw * 18 / 1920);
|
|
color: #ffffff;
|
|
background: url("@/assets/images/titleBig.webp") no-repeat;
|
|
background-size: 100% 100%;
|
|
|
|
i {
|
|
margin-left: 50px;
|
|
font-family: OPPOSansH;
|
|
margin-right: auto;
|
|
}
|
|
}
|
|
.tab-select{
|
|
width: 35%;
|
|
margin: 0 auto;
|
|
margin-top: 20px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
span{
|
|
cursor: pointer;
|
|
color: #7C859C;
|
|
font-size: 15px;
|
|
transition: all 0.5s;
|
|
}
|
|
.active-span{
|
|
color: #fff;
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
.href-content{
|
|
width: 95%;
|
|
height: 490px;
|
|
margin: 0 auto;
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
</style>
|