Jelajahi Sumber

refactor: remove devices filtered by product

Casper Dai 3 tahun lalu
induk
melakukan
457f3a21e9

+ 33 - 57
src/views/dashboard/index.vue

@@ -1,26 +1,16 @@
 <template>
-  <wrapper
-    class="c-dashboard"
-    margin
-  >
-    <div class="l-flex--row c-dashboard__block c-count">
-      <div class="l-flex__none l-flex--row">
-        设备分类:
-        <schema-select
-          v-model="product"
-          :schema="productSelectSchema"
-          @change="onProductChange"
-        />
-      </div>
-      <div class="l-flex__none c-count__item u-color--black u-text-center">
-        <div>设备总数</div>
+  <wrapper margin>
+    <div class="l-flex--row c-sibling-item--v c-count">
+      <div class="l-flex__none u-color--black u-bold">我的设备</div>
+      <div class="l-flex__none c-count__item u-color--black u-bold u-text-center">
+        <div>总数</div>
         <i
           v-if="monitor.loading"
           class="el-icon-loading"
         />
         <div v-else>{{ monitor.total }}</div>
       </div>
-      <div class="l-flex__none c-count__item u-color--success dark u-text-center">
+      <div class="l-flex__none c-count__item u-color--success dark u-bold u-text-center">
         <div>● 在线</div>
         <i
           v-if="monitor.loading"
@@ -28,7 +18,7 @@
         />
         <div v-else>{{ monitor.online }}</div>
       </div>
-      <div class="l-flex__none c-count__item u-color--error light u-text-center">
+      <div class="l-flex__none c-count__item u-color--error dark u-bold u-text-center">
         <div>● 离线</div>
         <i
           v-if="monitor.loading"
@@ -36,7 +26,7 @@
         />
         <div v-else>{{ monitor.offline }}</div>
       </div>
-      <div class="l-flex__none c-count__item u-color--info u-text-center">
+      <div class="l-flex__none c-count__item u-color--info u-bold u-text-center">
         <div>● 未启用</div>
         <i
           v-if="monitor.loading"
@@ -45,13 +35,13 @@
         <div v-else>{{ monitor.inactive }}</div>
       </div>
       <i
-        class="c-count__refresh el-icon-refresh u-pointer"
+        class="c-count__refresh o-icon--active el-icon-refresh u-pointer"
         @click="onRefresh"
       />
     </div>
     <div
       v-if="__PLACEHOLDER__"
-      class="c-dashboard__block c-cards"
+      class="c-sibling-item--v far c-cards"
     >
       <card
         class="c-cards__item"
@@ -86,7 +76,7 @@
         count="100"
       />
     </div>
-    <div class="l-grid--info c-dashboard__block">
+    <div class="l-grid--info c-sibling-item--v far">
       <device
         v-for="item in deviceOptions.list"
         :key="item.id"
@@ -95,13 +85,13 @@
     </div>
     <div
       v-if="!deviceOptions.loaded"
-      class="c-dashboard__block u-text-center"
+      class="c-sibling-item--v far u-text-center"
     >
       <i class="el-icon-loading" />
     </div>
     <iframe
       v-if="elk"
-      class="c-dashboard__block"
+      class="c-sibling-item--v far"
       style="height: 850px; border: none;"
       :src="elk"
     />
@@ -115,7 +105,6 @@ import {
 } from '@/utils/mqtt'
 import {
   getDevices,
-  getProducts,
   getDeviceStatistics
 } from '@/api/device'
 import Card from './components/Card'
@@ -129,14 +118,6 @@ export default {
   },
   data () {
     return {
-      productSelectSchema: {
-        remote: getProducts,
-        pagination: true,
-        placeholder: '全部产品',
-        value: 'id',
-        label: 'name'
-      },
-      product: void 0,
       monitor: { loading: true },
       deviceOptions: {
         list: [],
@@ -165,22 +146,25 @@ export default {
   },
   methods: {
     onMessage (topic) {
-      const result = /^(\d+)\/(\d+)\/(online|offline)$/.exec(topic)
-      if (result && (!this.product || this.product === result[1]) && this.deviceOptions.loaded) {
-        const deviceId = result[2]
-        const device = this.deviceOptions.list.find(({ id }) => id === deviceId)
-        if (device) {
-          const status = result[3]
-          const onlineStatus = device.onlineStatus === 1 ? 'online' : 'offline'
-          if (status === onlineStatus) {
-            return
-          }
+      if (this.deviceOptions.loaded) {
+        return
+      }
+      const result = /^\d+\/(\d+)\/(online|offline)$/.exec(topic)
+      if (!result) {
+        return
+      }
+      const deviceId = result[1]
+      const status = result[2]
+      const device = this.deviceOptions.list.find(({ id }) => id === deviceId)
+      if (device) {
+        const onlineStatus = device.onlineStatus === 1 ? 'online' : 'offline'
+        if (status === onlineStatus) {
+          return
         }
-        this.onRefresh()
+      } else if (status === 'offline') {
+        return
       }
-    },
-    onProductChange () {
-      this.refreshDevices(true)
+      this.refreshDevices()
     },
     onRefresh () {
       this.refreshDevices()
@@ -199,7 +183,7 @@ export default {
       this.monitor = monitor
       clearTimeout(this.$timer)
       this.deviceOptions = { loaded: false }
-      getDeviceStatistics(this.product).then(({ data }) => {
+      getDeviceStatistics().then(({ data }) => {
         const { notEnabledTotal, offLineTotal, onLineTotal, total } = data
         monitor.total = total || 0
         monitor.online = onLineTotal || 0
@@ -228,7 +212,6 @@ export default {
       getDevices({
         pageNum: 1,
         pageSize: total,
-        productId: this.product,
         activate: 2
       }, { custom: true }).then(
         ({ data }) => {
@@ -249,16 +232,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.c-dashboard {
-  &__block + &__block {
-    margin-top: $spacing;
-  }
-}
-
 .c-count {
   justify-content: space-between;
-  padding: 8px 16px;
-  font-weight: bold;
+  padding: 8px $spacing;
   border-radius: $radius;
   background-color: #fff;
 
@@ -267,8 +243,8 @@ export default {
   }
 
   &__refresh {
-    font-size: 24px;
     color: $blue;
+    font-size: 24px;
   }
 }
 

+ 2 - 12
src/views/device/index.vue

@@ -24,8 +24,7 @@ import {
   getDevices,
   getSubDevices,
   activateDevice,
-  deactivateDevice,
-  getProducts
+  deactivateDevice
 } from '@/api/device'
 import { publish } from '@/api/platform'
 import {
@@ -39,26 +38,17 @@ import { toDateStr } from '@/utils/event'
 export default {
   name: 'DeviceList',
   data () {
-    const productSelectSchema = {
-      remote: getProducts,
-      pagination: true,
-      placeholder: '全部产品',
-      value: 'id',
-      label: 'name'
-    }
-
     const canEdit = this.accessSet.has(Access.MANAGE_DEVICE)
 
     return {
       ratio: null,
       schema: {
         keepalive: true,
-        condition: { productId: void 0, name: '' },
+        condition: { name: '' },
         list: getDevices,
         transform: this.transform,
         transformData: this.transformTableData,
         filters: [
-          { key: 'productId', type: 'select', ...productSelectSchema },
           { key: 'name', type: 'search', placeholder: '设备名称' }
         ],
         cols: [

+ 0 - 14
src/views/device/timeline/index.vue

@@ -31,12 +31,6 @@
     >
       <div class="l-flex__none l-flex--row has-bottom-padding">
         <div class="l-flex__auto c-sibling-item" />
-        <schema-select
-          v-model="deviceOptions.params.productId"
-          class="c-sibling-item"
-          placeholder="全部产品"
-          :schema="productSelectSchema"
-        />
         <el-date-picker
           v-model="current"
           class="l-flex__none c-sibling-item u-pointer"
@@ -187,7 +181,6 @@
 
 <script>
 import {
-  getProducts,
   getDevices,
   getTimeline
 } from '@/api/device'
@@ -211,14 +204,7 @@ export default {
   name: 'ScheduleTimeline',
   data () {
     return {
-      productSelectSchema: {
-        remote: getProducts,
-        pagination: true,
-        value: 'id',
-        label: 'name'
-      },
       deviceOptions: createListOptions({
-        productId: '',
         name: '',
         activate: 2,
         pageSize: 5

+ 1 - 12
src/views/realm/assign/Device.vue

@@ -15,7 +15,6 @@
 <script>
 import { getUserGroups } from '@/api/user'
 import {
-  getProducts,
   getDevicesByAdmin,
   getDevicesByRelation,
   bindDeviceToObject,
@@ -63,19 +62,9 @@ export default {
   computed: {
     deviceSchema () {
       return {
-        condition: { productId: void 0, name: '', tenant: this.tenant.path },
+        condition: { name: '', tenant: this.tenant.path },
         list: getDevicesByAdmin,
         filters: [
-          {
-            key: 'productId',
-            type: 'select',
-            placeholder: '全部产品',
-            remote: getProducts,
-            condition: { tenant: this.tenant.path },
-            pagination: true,
-            value: 'id',
-            label: 'name'
-          },
           { key: 'name', type: 'search', placeholder: '设备名称' }
         ],
         cols: [

+ 2 - 12
src/views/realm/device/Group.vue

@@ -19,29 +19,19 @@ import {
   getDevicesByAdmin,
   getSubDevices,
   activateDevice,
-  deactivateDevice,
-  getProducts
+  deactivateDevice
 } from '@/api/device'
 
 export default {
   name: 'GroupDeviceManage',
   data () {
-    const productSelectSchema = {
-      remote: getProducts,
-      pagination: true,
-      placeholder: '全部产品',
-      value: 'id',
-      label: 'name'
-    }
-
     return {
       schema: {
-        condition: { productId: void 0, name: '', tenant: this.$store.getters.tenant },
+        condition: { name: '', tenant: this.$store.getters.tenant },
         list: getDevicesByAdmin,
         transform: this.transform,
         transformData: this.transformTableData,
         filters: [
-          { key: 'productId', type: 'select', ...productSelectSchema },
           { key: 'name', type: 'search', placeholder: '设备名称' }
         ],
         cols: [