fix 优化
This commit is contained in:
@@ -43,7 +43,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="tree-a">
|
<div class="tree-a">
|
||||||
<span class="name-1">其他</span>
|
<span class="name-1">其他</span>
|
||||||
<div class="tree-b" v-if="false">
|
<div class="tree-b" v-if="true">
|
||||||
<span class="name-2">摄像头1</span>
|
<span class="name-2">摄像头1</span>
|
||||||
<span class="name-2 activee">摄像头1</span>
|
<span class="name-2 activee">摄像头1</span>
|
||||||
<span class="name-2">摄像头1</span>
|
<span class="name-2">摄像头1</span>
|
||||||
|
|||||||
@@ -1,6 +1,21 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div class="n-box-traffic">
|
||||||
|
<!-- nav -->
|
||||||
|
<div class="left-nav">
|
||||||
|
<div class="top-box">
|
||||||
|
|
||||||
|
<div class="ul">
|
||||||
|
<div class="li active">路段1</div>
|
||||||
|
<div class="li">路段1</div>
|
||||||
|
<div class="li">路段1</div>
|
||||||
|
<div class="li">路段1</div>
|
||||||
|
<div class="li">路段1</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="traffic-box-2">
|
<div class="traffic-box-2">
|
||||||
<div class="map-box">
|
<div class="map-box">
|
||||||
|
|
||||||
<Map></Map>
|
<Map></Map>
|
||||||
<!-- 视频 -->
|
<!-- 视频 -->
|
||||||
<div class="video-list">
|
<div class="video-list">
|
||||||
@@ -14,6 +29,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
@@ -48,14 +65,60 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.n-box-traffic{
|
||||||
|
display: flex;
|
||||||
|
margin-top:vh(100);
|
||||||
|
}
|
||||||
|
.left-nav{
|
||||||
|
margin-left:vw(10);
|
||||||
|
// margin-top:vh(35);
|
||||||
|
// width:vw(250);
|
||||||
|
.top-box{
|
||||||
|
text-align: left;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: vw(18);
|
||||||
|
color: rgba(255,255,255,0.7);
|
||||||
|
line-height: 21px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
text-transform: none;
|
||||||
|
.title{
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: vw(15);
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
text-transform: none;
|
||||||
|
height:vh(35);
|
||||||
|
line-height: vh(34);
|
||||||
|
padding-left:vw(20);
|
||||||
|
// background: linear-gradient(90deg, #FFFFFF 0%, #75C1FF 100%);
|
||||||
|
}
|
||||||
|
.ul{
|
||||||
|
.li{
|
||||||
|
background: url('/src/assets/images/m-nav-bg-1.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
width:vw(120);
|
||||||
|
height:vh(58);
|
||||||
|
line-height:vh(58);
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom:vh(15);
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
background: url('/src/assets/images/m-nav-bg-2.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
// width:vw(178);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.traffic-box-2{
|
.traffic-box-2{
|
||||||
width:vw(1517);
|
width:vw(1390);
|
||||||
height:vh(965);
|
height:vh(975);
|
||||||
background-image: url('/src/assets/images/map-bg-2.png');
|
background-image: url('/src/assets/images/map-bg-2.png');
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
margin:0 vw(10);
|
margin:0 vw(10);
|
||||||
padding:vh(35) vw(30);
|
padding:vh(35) vw(30);
|
||||||
margin-top:vh(110);
|
|
||||||
position:relative;
|
position:relative;
|
||||||
z-index:9;
|
z-index:9;
|
||||||
.map-box{
|
.map-box{
|
||||||
|
|||||||
@@ -304,7 +304,7 @@
|
|||||||
margin: 0 vw(10);
|
margin: 0 vw(10);
|
||||||
margin-top: vh(100);
|
margin-top: vh(100);
|
||||||
.content-2{
|
.content-2{
|
||||||
margin-top:vh(10);
|
margin-top:vh(25);
|
||||||
}
|
}
|
||||||
.content-1 {
|
.content-1 {
|
||||||
.chart-item {
|
.chart-item {
|
||||||
|
|||||||
Reference in New Issue
Block a user