From 1706494087a9f8fd22f691d279e9ef7756cd316d Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期五, 03 十二月 2021 18:15:21 +0800 Subject: [PATCH] 地图 --- src/pages/internetEquipment/module/realTimeModule.vue | 47 +++++++++++++++++++++++++++++++---------------- 1 files changed, 31 insertions(+), 16 deletions(-) diff --git a/src/pages/internetEquipment/module/realTimeModule.vue b/src/pages/internetEquipment/module/realTimeModule.vue index 140629d..80bdda4 100644 --- a/src/pages/internetEquipment/module/realTimeModule.vue +++ b/src/pages/internetEquipment/module/realTimeModule.vue @@ -1,17 +1,23 @@ <template> <div class="real-time-module"> <div class="title">瀹炴椂鎶撴媿棰勮</div> - <div class="real-time-item" v-for="(item, index) in boundArr" :key="index"> - <img :src="item.snap_shot" alt="" class="warnArea" /> - <warnDescription - :warnDes="{ - code: item.device_sn, - time: item.updated_at, - longitude: item.lng, - latitude: item.lat, - warn: '鏈湪鐢靛瓙鍥存爮鍖哄煙', - }" - /> + <div class="real-time-list"> + <div + class="real-time-item" + v-for="(item, index) in boundArr" + :key="index" + > + <img :src="item.snap_shot" alt="" class="warnArea" /> + <warnDescription + :warnDes="{ + code: item.device_sn, + time: item.updated_at, + longitude: item.lng, + latitude: item.lat, + warn: '鏈湪鐢靛瓙鍥存爮鍖哄煙', + }" + /> + </div> </div> </div> </template> @@ -32,10 +38,7 @@ <style scoped lang="scss"> .real-time-module { - display: flex; - flex-wrap: wrap; padding: 20px; - padding-right: 0px; width: 570px; height: 292px; background-color: #fff; @@ -43,17 +46,29 @@ border-radius: 15px; overflow-y: scroll; + .real-time-list { + display: grid; + justify-content: space-between; + grid-template-columns: repeat(auto-fill, 170px); + grid-gap: 10px; + } + .title { margin-bottom: 10px; font-size: 14px; font-weight: 700; - width: 530px; + width: 100%; text-align: left; } .real-time-item { - margin-right: 13px; + margin-right: 10px; } + + .real-time-item:last-child { + margin-right: auto; + } + .warnArea { width: 167px; height: 104px; -- Gitblit v1.8.0