From 22d285974b8c6552b4cb5901d613e7d715d18182 Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期一, 23 九月 2024 16:11:58 +0800
Subject: [PATCH] 大屏调整
---
src/views/screen/index.vue | 74 +++++++++++++++++++-----------------
1 files changed, 39 insertions(+), 35 deletions(-)
diff --git a/src/views/screen/index.vue b/src/views/screen/index.vue
index 987a159..4f51f7d 100644
--- a/src/views/screen/index.vue
+++ b/src/views/screen/index.vue
@@ -192,7 +192,7 @@
<script>
import itemSubheading from '../screen/components/subheading.vue' // 鐜舰缁熻鍥�
import lineChart from '../screen/components/lineChart.vue' // 鎶樼嚎缁熻鍥�
-import mapApp from '../screen/components/map.vue' // 鍦板浘
+import mapApp from '../screen/components/map3.vue' // 鍦板浘
import {
getDepartmentData,
getDeviceData,
@@ -405,7 +405,6 @@
item2.color = '#ff7b72'
item2.title = '鏈鐞�'
this.statistics.push(item2)
- console.log( this.statistics)
},
videoData() {
@@ -916,8 +915,8 @@
background-repeat: no-repeat;
display: flex;
flex-direction: column;
- justify-content: center;
- align-items: center;
+ //justify-content: center;
+ //align-items: center;
.item-facility-icon {
margin: 0 auto;
@@ -935,9 +934,9 @@
flex-direction: column;
justify-content: space-around;
text-align: center;
- font-size: 14px;
list-style-type: none;
- padding-left: 0;
+ //font-size: 14px;
+ //padding-left: 0;
li:nth-child(1) {
.value {
@@ -979,7 +978,7 @@
display: flex;
flex-direction: column;
height: 0;
- overflow: hidden;
+ //overflow: hidden;
.title {
width: 100%;
@@ -1020,9 +1019,11 @@
.list-title-container {
width: 100%;
- height: 45px;
- margin: 4px 0 0 0;
- line-height: 45px;
+ //height: 45px;
+ //margin: 4px 0 0 0;
+ //line-height: 45px;
+ height: 4.17vh;
+ line-height: 4.17vh;
list-style-type: none;
display: flex;
flex-direction: row;
@@ -1095,9 +1096,9 @@
.list-content-to {
height: 100%;
- overflow-y: auto;
+ overflow-y: hidden;
overflow-x: hidden;
- padding: 10px 0;
+ //padding: 10px 0;
}
.item-list {
@@ -1106,19 +1107,22 @@
align-items: center;
list-style-type: none;
border-bottom: 1px dashed #223654;
- margin: 10px 0;
+ margin: 8px 0;
li {
width: 25%;
text-align: center;
- font-size: 14px;
+ //font-size: 14px;
+ font-size: 0.72916667vw !important;
color: #dcf8ff;
flex-shrink: 0;
flex-grow: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
- height: 28px;
- line-height: 28px;
+ //height: 28px;
+ //line-height: 28px;
+ height: 2.59vh;
+ line-height: 2.59vh;
}
.name {
@@ -1201,7 +1205,8 @@
}
.footer-container {
- height: 220px;
+ //height: 220px;
+ height: 24.15vh;
box-sizing: border-box;
position: relative;
background-image: url("../../assets/images/footer-bg.png");
@@ -1227,19 +1232,10 @@
position: relative;
background-image: url("../../assets/images/face-bg.png");
- background-size: 500px 200px;
+ //background-size: 500px 200px;
+ background-size: 26.04166vw auto;
background-position: center;
background-repeat: no-repeat;
-
- // .face-bj-img {
- // position: absolute;
- // left: 50%;
- // top: 50%;
- // transform: translate(-50%, -50%);
- // width: 83.1946755%;
- // display: block;
- // z-index: 2;
- // }
.item-face-container {
position: absolute;
@@ -1247,7 +1243,8 @@
width: 22.296173%;
.proportion {
- width: 50px;
+ //width: 50px;
+ width: 2.60416vw;
margin: 0 auto;
color: #00eaff;
text-shadow: 2px 2px 4px #152944;
@@ -1263,13 +1260,14 @@
left: 50%;
top: 53%;
transform: translate(-50%, -50%);
- font-size: 14px;
+ //font-size: 14px;
}
}
.title {
text-align: center;
- font-size: 12px;
+ //font-size: 12px;
+ font-size: 0.625vw;
color: #dcf8ff;
white-space: nowrap; /* 涓嶆崲琛� */
overflow: hidden; /* 闅愯棌瓒呭嚭鐨勫唴瀹� */
@@ -1281,7 +1279,8 @@
.car-container {
position: relative;
background-image: url("../../assets/images/car-bg2.png");
- background-size: 500px 200px;
+ //background-size: 500px 200px;
+ background-size: 26.04166vw auto;
background-position: center;
background-repeat: no-repeat;
@@ -1302,6 +1301,7 @@
font-size: 12px;
line-height: 26px;
padding: 0 15px;
+ font-size: 0.625vw;
position: absolute;
z-index: 5;
@@ -1349,7 +1349,8 @@
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
- font-size: 20px;
+ //font-size: 20px;
+ font-size: 1.04166vw;
font-weight: bold;
color: #00fcff;
text-shadow: 2px 2px 4px #152944;
@@ -1359,10 +1360,13 @@
.item-video-title {
text-align: center;
color: #dcf8ff;
- height: 32px;
- font-size: 13px;
+ //height: 32px;
+ //font-size: 13px;
+ //flex-shrink: 0;
+ //flex-grow: 0;
flex-shrink: 0;
flex-grow: 0;
+ height: 3.51851vh;
display: -webkit-box;
-webkit-line-clamp: 2; /* 鏄剧ず鐨勮鏁� */
-webkit-box-orient: vertical;
--
Gitblit v1.8.0