<template>
|
<div class="home">
|
<div id="cesium"></div>
|
<div class="page-index">
|
<Header/>
|
<router-view></router-view>
|
</div>
|
</div>
|
</template>
|
|
<script setup>
|
import { onMounted } from 'vue';
|
import cesiumOperation from '@/utils/cesium-tsa';
|
import Header from './Header.vue';
|
|
const { _init } = cesiumOperation();
|
|
onMounted(() => {
|
_init('cesium');
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.home {
|
position: relative;
|
height: 100%;
|
width: 100%;
|
overflow: hidden;
|
|
#cesium {
|
height: 100%;
|
width: 100%;
|
|
:deep() {
|
.cesium-viewer {
|
width: 100%;
|
height: 100%;
|
|
.cesium-viewer-cesiumWidgetContainer {
|
width: 100%;
|
height: 100%;
|
|
.cesium-widget {
|
width: 100%;
|
height: 100%;
|
|
canvas {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.page-index {
|
left: 0;
|
top: 0;
|
position: absolute;
|
z-index: 999;
|
height: 100%;
|
width: 100%;
|
background-image: url('../assets/images/bg-new.png');
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
pointer-events: none;
|
|
> * {
|
pointer-events: auto;
|
}
|
}
|
}
|
</style>
|
