UI update

web/src/views/AccessPoints/index.vue

@@ -76,7 +76,6 @@
       hide-default-footer
       disable-pagination
       :group-by="groupBy ? 'campus' : null"
-      @click:row="navigateToAccessPoint"
     >
       <template
         #[`group.header`]="{
@@ -125,9 +124,10 @@
               </v-btn>
             </v-expand-x-transition>
 
-            <span>
+            <v-btn text @click="navigateToAccessPoint(item.id)">
+              <v-icon v-if="hover" left>mdi-open-in-new</v-icon>
               {{ item.name }}
-            </span>
+            </v-btn>
           </span>
         </v-hover>
       </template>
@@ -153,16 +153,21 @@
       <template #[`item.clients`]="{ item }">
         <div class="align-content-end">
           <v-btn
-            :disabled="item.uptime == -1"
             block
             small
             rounded
             :elevation="0"
-            :color="loadColor(item.clients) + ' lighten-5'"
+            :color="
+              item.uptime == -1 ? '' : loadColor(item.clients) + ' lighten-5'
+            "
             light
             :outlined="$vuetify.theme.dark"
+            @click="navigateToAccessPoint(item.id)"
+          >
+            <v-icon
+              left
+              :color="item.uptime == -1 ? '' : loadColor(item.clients)"
             >
-            <v-icon left :color="loadColor(item.clients)">
               {{ loadIcon(item.clients) }}
             </v-icon>
             {{ item.clients }}
@@ -176,7 +181,9 @@
             {{ item.uptime | durationFromSeconds }}
           </small>
         </span>
-        <span v-else><small> Off-line ou não registrado</small> </span>
+        <span v-else>
+          <v-chip small color="error"> Off-line </v-chip>
+        </span>
       </template>
 
       <template #[`item.updatedAt`]="{ item }">
@@ -298,10 +305,10 @@ export default {
   },
 
   methods: {
-    navigateToAccessPoint(accessPoint) {
+    navigateToAccessPoint(id) {
       this.$router.push({
         name: 'access-point-clients',
-        params: { id: accessPoint.id }
+        params: { id }
       })
     },