From b9346c0dad8727fce46482c5ed29009717a902d0 Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期三, 25 九月 2024 14:20:39 +0800 Subject: [PATCH] 标线调整 --- src/views/screen/index.vue | 85 +++++++++++++++++++++++++----------------- 1 files changed, 51 insertions(+), 34 deletions(-) diff --git a/src/views/screen/index.vue b/src/views/screen/index.vue index 93572eb..5080d2e 100644 --- a/src/views/screen/index.vue +++ b/src/views/screen/index.vue @@ -46,7 +46,7 @@ <div class="map-container" ref="isMap"> <img src="@/assets/map/texture/rotating-point2.png" alt="Rotating Image" class="rotating-image"> <img src="@/assets/map/texture/rotatingAperture.png" alt="Rotating Image" class="rotating-image-in"> - <mapApp @clickMap="getDeptId" :geoCoordinates=scoreData></mapApp> + <mapApp @clickMap="getDeptId" :geoCoordinates=scoreData :platformData = platformData></mapApp> <div class="btn-container"> <img src="@/assets/images/btn-bg.png" class="bg-img"/> <div class="btn-list" v-model="activerBtnType"> @@ -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, @@ -202,7 +202,8 @@ checkFace, checkCar, checkVideo, - checkScore + checkScore, + getPlatform } from "@/api/newpage"; export default { @@ -217,6 +218,7 @@ faceList: [], workOrderData: [], workOrderRegion: [], + platformData: null, scoreData: { 鑷祦浜曞尯: [ { @@ -370,6 +372,14 @@ }) .catch((err) => { }); + getPlatform(this.activerBtnType, this.deptId) + .then((res) => { + if(res.data && Object.keys(res.data).length > 0){ + this.platformData = res.data; + } + }) + .catch((err) => { + }); }, returnPath() { this.$router.push("/index"); @@ -405,7 +415,6 @@ item2.color = '#ff7b72' item2.title = '鏈鐞�' this.statistics.push(item2) - console.log( this.statistics) }, videoData() { @@ -916,6 +925,8 @@ background-repeat: no-repeat; display: flex; flex-direction: column; + //justify-content: center; + //align-items: center; .item-facility-icon { margin: 0 auto; @@ -933,8 +944,9 @@ flex-direction: column; justify-content: space-around; text-align: center; - font-size: 14px; list-style-type: none; + //font-size: 14px; + //padding-left: 0; li:nth-child(1) { .value { @@ -976,7 +988,7 @@ display: flex; flex-direction: column; height: 0; - overflow: hidden; + //overflow: hidden; .title { width: 100%; @@ -1017,9 +1029,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; @@ -1092,9 +1106,9 @@ .list-content-to { height: 100%; - overflow-y: auto; + overflow-y: hidden; overflow-x: hidden; - padding: 10px 0; + //padding: 10px 0; } .item-list { @@ -1103,19 +1117,22 @@ align-items: center; list-style-type: none; border-bottom: 1px dashed #223654; - margin: 10px 0; + margin: 7px 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 { @@ -1198,7 +1215,8 @@ } .footer-container { - height: 220px; + //height: 220px; + height: 24.15vh; box-sizing: border-box; position: relative; background-image: url("../../assets/images/footer-bg.png"); @@ -1224,19 +1242,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; @@ -1244,7 +1253,8 @@ width: 22.296173%; .proportion { - width: 50px; + //width: 50px; + width: 2.60416vw; margin: 0 auto; color: #00eaff; text-shadow: 2px 2px 4px #152944; @@ -1260,13 +1270,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; /* 闅愯棌瓒呭嚭鐨勫唴瀹� */ @@ -1278,7 +1289,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; @@ -1299,6 +1311,7 @@ font-size: 12px; line-height: 26px; padding: 0 15px; + font-size: 0.625vw; position: absolute; z-index: 5; @@ -1346,7 +1359,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; @@ -1356,10 +1370,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