fix(dashboard): card display

power state usage error

src/views/dashboard/TenantDashboard.vue

@@ -174,7 +174,6 @@ export default {
       const status = result[2]
       if (status === 'online' || status === 'offline') {
         this.refreshDevices()
-        return
       }
       if (!this.deviceOptions.loaded) {
         return
@@ -186,6 +185,7 @@ export default {
             device.flag = -Date.now()
             break
           default:
+            device.onlineStatus = status === 'online' ? 1 : 2
             break
         }
       }

src/views/dashboard/components/Device.vue

@@ -23,7 +23,7 @@
       </template>
       <template v-if="hasPowerStatus">
         <i
-          v-if="hasPower"
+          v-if="isOnline && hasPower"
           class="l-flex__none c-sibling-item near o-device__status"
           :class="switchStatusClass"
           @click.stop
@@ -217,6 +217,15 @@ export default {
   watch: {
     flag () {
       this.checkStatus()
+    },
+    isOnline (val) {
+      if (this.$hasDisplay) {
+        if (val) {
+          this.intoView()
+        } else {
+          this.onReset()
+        }
+      }
     }
   },
   created () {
@@ -224,22 +233,15 @@ export default {
     this.$refreshTimer = -1
   },
   mounted () {
-    if (this.isOnline) {
-      addListener(this.device.id, this.onMessage)
-      if (this.always) {
-        this.intoView()
-      } else {
-        this.observer(this.$el)
-      }
+    addListener(this.device.id, this.onMessage)
+    if (this.always) {
+      this.intoView()
     } else {
-      this.hasPower = false
-      ScreenshotCache.remove(this.device.id)
+      this.observer(this.$el)
     }
   },
   beforeDestroy () {
-    if (this.isOnline) {
-      removeListener(this.device.id, this.onMessage)
-    }
+    removeListener(this.device.id, this.onMessage)
     if (this.$firstView) {
       ScreenshotCache.unwatch(this.device.id)
       clearTimeout(this.$refreshTimer)
@@ -258,6 +260,7 @@ export default {
       this.switchStatus = multiCard.switchStatus
     },
     intoView () {
+      console.log(this.device.name, 'intoView', this.isOnline)
       this.$hasDisplay = true
       if (!this.isOnline) {
         return
@@ -266,7 +269,6 @@ export default {
         ScreenshotCache.watch(this.device, this.onScreenshotUpdate)
         this.$firstView = true
       }
-      console.log(this.device.name, 'intoView')
       this.$timer = null
       if (!this.loadingTimeline) {
         if (this.timeline && this.$maxDate - Date.now() > 300000) {
@@ -277,19 +279,16 @@ export default {
       }
     },
     outView () {
-      this.$hasDisplay = true
-      if (!this.isOnline) {
-        return
-      }
       console.log(this.device.name, 'outView')
+      this.$hasDisplay = false
+      this.onReset()
+    },
+    onReset () {
       clearTimeout(this.$refreshTimer)
       clearTimeout(this.$timer)
       this.$timer = -1
     },
     checkStatus () {
-      if (!this.isOnline) {
-        return
-      }
       if (this.flag) {
         if (this.flag > 0) {
           this.intoView()