From 9d43e7051075f1fc1b2fee680a79f90becddd63f Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期三, 12 一月 2022 17:53:52 +0800
Subject: [PATCH] tab禁用
---
src/pages/internetEquipment/module/realTimeModule.vue | 106 ++++++++++++++++++++++++++++++----------------------
1 files changed, 61 insertions(+), 45 deletions(-)
diff --git a/src/pages/internetEquipment/module/realTimeModule.vue b/src/pages/internetEquipment/module/realTimeModule.vue
index f0d8f92..e8ee553 100644
--- a/src/pages/internetEquipment/module/realTimeModule.vue
+++ b/src/pages/internetEquipment/module/realTimeModule.vue
@@ -1,62 +1,78 @@
<template>
<div class="real-time-module">
- <div class="title">瀹炴椂鎶撴媿棰勮</div>
- <div class="real-time-item"
- v-for="(item,index) in warnArr"
- :key="index">
- <img :src="item.image" alt="" class="warnArea">
- <warnDescription
- :warnDes="{code:item.code,
- time:item.time,
- longitude:item.longitude,
- latitude:item.latitude,
- warn:item.warn}"/>
+ <div class="title">瀹炴椂鎶撴媿棰勮</div>
+ <div class="real-time-list">
+ <div
+ class="real-time-item"
+ v-for="(item, index) in boundArr"
+ :key="index"
+ >
+ <img :src="'/iotdata' + 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>
<script>
-import warnDescription from '@/pages/internetEquipment/components/warnDescription'
+import warnDescription from "@/pages/internetEquipment/components/warnDescription";
export default {
- props :{
- warnArr:{
- type: Array
- }
+ props: {
+ boundArr: {
+ type: Array,
},
- components :{
- warnDescription
- }
-}
+ },
+ components: {
+ warnDescription,
+ },
+};
</script>
<style scoped lang="scss">
.real-time-module {
- display: flex;
- flex-wrap: wrap;
- padding: 20px;
- padding-right: 0px;
- width: 570px;
- height: 292px;
- background-color: #fff;
- box-shadow: 0px 2px 10px rgba(141, 164, 187, 0.25);
- border-radius: 15px;
- overflow-y: scroll;
+ padding: 20px;
+ width: 570px;
+ height: 292px;
+ background-color: #fff;
+ box-shadow: 0px 2px 10px rgba(141, 164, 187, 0.25);
+ border-radius: 15px;
+ overflow-y: scroll;
- .title {
- margin-bottom: 10px;
- font-size: 14px;
- font-weight: 700;
- width: 530px;
- text-align: left;
- }
+ .real-time-list {
+ display: grid;
+ justify-content: space-between;
+ grid-template-columns: repeat(auto-fill, 170px);
+ grid-gap: 10px;
+ }
- .real-time-item {
- margin-right: 14px;
- }
- .warnArea {
- width: 167px;
- height: 104px;
- border-radius: 5px;
- }
+ .title {
+ margin-bottom: 10px;
+ font-size: 14px;
+ font-weight: 700;
+ width: 100%;
+ text-align: left;
+ }
+
+ .real-time-item {
+ margin-right: 10px;
+ }
+
+ .real-time-item:last-child {
+ margin-right: auto;
+ }
+
+ .warnArea {
+ width: 167px;
+ height: 104px;
+ border-radius: 5px;
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0