UI updates

web/src/components/DataTables/WifiUsersDataTable.vue

@@ -1,8 +1,23 @@
 <template>
-  <v-data-table :items="items" :headers="headers">
+  <v-data-table
+    :items="items"
+    :headers="headers"
+    v-bind="$attrs"
+    @click:row="
+      e =>
+        $router.push({
+          name: 'wifi-user-single',
+          params: { sAMAccountName: e.sAMAccountName }
+        })
+    "
+  >
     <template #[`item.combinedUser`]="{ item }">
       <UserTD :user="item" />
     </template>
+    <template #[`item.count`]="{ item }">
+      {{ item.onlineWifiDevicesCount }} de
+      {{ item.offlineWifiDevicesCount + item.onlineWifiDevicesCount }}
+    </template>
   </v-data-table>
 </template>
 
@@ -21,12 +36,7 @@ export default {
       { text: 'Usuário', value: 'combinedUser', sortable: false },
       {
         text: 'Dispositivos Online',
-        value: 'onlineWifiDevicesCount',
-        sortable: false
-      },
-      {
-        text: 'Dispositivos Offline',
-        value: 'offlineWifiDevicesCount',
+        value: 'count',
         sortable: false
       }
     ]
@@ -35,7 +45,9 @@ export default {
     items() {
       return this.wifiUsers.map(wifiUser => ({
         ...wifiUser,
-        combinedUser: `${wifiUser.displayName} (${wifiUser.sAMAccountName})`
+        combinedUser: `${wifiUser.displayName} (${wifiUser.sAMAccountName})`,
+        count:
+          wifiUser.offlineWifiDevicesCount + wifiUser.onlineWifiDevicesCount
       }))
     }
   }

web/src/components/ui/signalStrength.vue

@@ -52,7 +52,8 @@ export default {
       if (signalStrength > -50) return 'mdi-signal-cellular-3'
       if (signalStrength > -67) return 'mdi-signal-cellular-2'
       if (signalStrength > -80) return 'mdi-signal-cellular-1'
-      return 'mdi-signal-cellular-outline'
+      if (signalStrength > -90) return 'mdi-signal-cellular-outline'
+      return 'mdi-signal-off'
     },
     signalStrengthColor(signalStrength) {
       if (signalStrength > -30) return 'teal'
@@ -65,13 +66,13 @@ export default {
       else return 'red'
     },
     signalStrengthText(signalStrength) {
-      if (signalStrength > -30) return 'Excelente'
-      else if (signalStrength > -50) return 'Muito bom'
-      else if (signalStrength > -60) return 'Bom'
-      else if (signalStrength > -67) return 'Regular'
-      else if (signalStrength > -70) return 'Fraco'
-      else if (signalStrength > -80) return 'Conexão instável'
-      else if (signalStrength > -90) return 'Extremamente fraco'
+      if (signalStrength >= -30) return 'Excelente'
+      else if (signalStrength >= -50) return 'Muito bom'
+      else if (signalStrength >= -60) return 'Bom'
+      else if (signalStrength >= -67) return 'Regular'
+      else if (signalStrength >= -70) return 'Fraco'
+      else if (signalStrength >= -80) return 'Conexão instável'
+      else if (signalStrength >= -90) return 'Extremamente fraco'
       else return 'Provavelmente sem conexão'
     }
   }

web/src/views/WifiUsers/index.vue

@@ -57,7 +57,11 @@
       </v-chip>
     </div>
 
-    <WifiUsersDataTable v-if="wifiUsers" :wifi-users="wifiUsers.data" />
+    <WifiUsersDataTable
+      v-if="wifiUsers"
+      :wifi-users="wifiUsers.data"
+      :loading="$apollo.queries.wifiUsers.loading"
+    />
 
     <v-pagination
       v-model="page"