lixuefeng/fengjie-datascreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat 监控大屏、安全检测

Browse Source
This commit is contained in:
duanliang
2024-12-18 10:40:53 +08:00
parent 111133ffb4
commit 4a6820831b
25 changed files with 1984 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
src/views/testing/index.vue Normal file
View File

@@ -0,0 +1,98 @@
<template>
<main class="wrapper">
<box1 />
<box5/>
<box3 />
<div class="header">
<ul class="nav-left">
<li class="nav-left-item">奉节县</li>
<li class="nav-left-item">三峡之巅</li>
<li class="nav-left-item">白帝城</li>
<li class="nav-left-item">龙河桥</li>
</ul>
<div class="title">三峡之巅-安全检测</div>
<ul class="nav-right">
<li class="nav-right-item">路段1</li>
<li class="nav-right-item">路段</li>
<li class="nav-right-item">路段</li>
<li class="nav-right-item">路段</li>
</ul>
</div>
<box4 />
</main>
</template>
<script setup>
import box1 from './components/box-1.vue'
import box4 from './components/box-4.vue'
import box3 from './components/box-3.vue'
import box5 from './components/box-5.vue'
onMounted(() => {})
</script>
<style lang="scss" scoped>
.wrapper {
display: flex;
width: 100vw;
height: 100vh;
overflow: hidden;
background-color: #0a254b;
.header {
position: absolute;
left: vw(326);
.title {
width: vw(3133);
height: vh(120);
font-size: vw(48);
font-weight: 800;
text-align: center;
padding-top: vh(20);
color: #fff;
letter-spacing: vw(10);
box-sizing: border-box;
text-shadow: 0px 4px 7px rgba(0, 150, 255, 0.75);
background-image: url('@/assets/images/title.png');
background-size: 100% 100%;
}
.nav-left {
position: absolute;
left: vw(380);
top: vh(34);
display: flex;
&-item {
cursor: pointer;
margin-left: vh(-10);
width: vw(210);
height: vh(56);
padding-top: vh(10);
font-weight: 600;
font-size: vw(28);
text-align: center;
color: rgba(208, 236, 255, 0.9);
background-image: url('@/assets/images/title-2.png');
background-size: 100% 100%;
}
}
.nav-right {
position: absolute;
right: vw(424);
top: vh(34);
display: flex;
&-item {
cursor: pointer;
margin-right: vh(-10);
width: vw(210);
height: vh(56);
padding-top: vh(10);
font-weight: 600;
font-size: vw(28);
text-align: center;
color: rgba(208, 236, 255, 0.9);
background-image: url('@/assets/images/title-3.png');
background-size: 100% 100%;
}
}
}
}
</style>