diff --git a/web/src/views/AccessPoints.vue b/web/src/views/AccessPoints.vue
index fbef24c..4cf073f 100644
--- a/web/src/views/AccessPoints.vue
+++ b/web/src/views/AccessPoints.vue
@@ -25,7 +25,6 @@
({
...header,
@@ -36,6 +35,10 @@
mdi-check-all
Todos
+
+ mdi-check-all
+ Padrões
+
@@ -90,6 +93,19 @@
{{ item.updatedAt | conciseDate }}
+
+
+
+
+
+
+
+ mdi-pencil
+
+
+ mdi-eye
+
+
As informações são atualizadas automaticamente
import gql from 'graphql-tag'
+import ApIcon from '../components/ApIcon.vue'
export default {
name: 'AccessPoints',
+ components: { ApIcon },
+
data: () => ({
linesPerPage: 150,
search: '',
+ defaultHeaders: [
+ 'name',
+ 'ip',
+ 'local',
+ 'clients',
+ 'uptime',
+ 'updatedAt',
+ 'actions'
+ ],
allHeaders: [
- { text: 'Nome', value: 'name', active: true },
- { text: 'Hostname', value: 'hostname', active: false },
- { text: 'IP', value: 'ip', active: true, width: 80 },
- { text: 'MAC', value: 'mac', active: false },
- { text: 'Localização', value: 'local', active: true },
+ { text: 'Nome', value: 'name' },
+ { text: 'Hostname', value: 'hostname' },
+ { text: 'IP', value: 'ip', width: 80 },
+ { text: 'MAC', value: 'mac' },
+ { text: 'Localização', value: 'local' },
{
text: 'Clientes',
value: 'clients',
- active: true,
+
width: 140,
align: 'center'
},
- { text: 'Uptime', value: 'uptime', active: true },
- { text: 'Modelo', value: 'model', active: false },
- { text: 'Controladora', value: 'controller', active: false },
- { text: 'Observações', value: 'notes', active: true },
- { text: 'Última atualização', value: 'updatedAt', active: true }
+ { text: 'Uptime', value: 'uptime' },
+ { text: 'Modelo', value: 'model' },
+ {
+ text: 'Controladora',
+ value: 'controller'
+ },
+ { text: 'Observações', value: 'notes' },
+ { text: 'Última atualização', value: 'updatedAt' },
+ {
+ text: 'Ações',
+ value: 'actions',
+ width: 120,
+ align: 'center'
+ }
]
}),
-
+ mounted() {
+ this.resetDefaultHeaders()
+ },
computed: {
headers() {
return this.allHeaders.filter(header => header.active)
@@ -138,12 +177,10 @@ export default {
load(connectedClients) {
const MAX_LOAD = 70
const load = Math.floor((connectedClients / MAX_LOAD) * 100)
-
return load < 100 ? load : 100
},
loadColor(clients) {
const load = this.load(clients)
-
if (load < 20) return 'teal lighten-2'
else if (load < 30) return 'green'
else if (load < 40) return 'light-green'
@@ -156,17 +193,21 @@ export default {
},
loadIcon(clients) {
const load = this.load(clients)
-
if (load < 25) return 'mdi-gauge-empty'
else if (load < 50) return 'mdi-gauge-low'
else if (load < 75) return 'mdi-gauge'
else return 'mdi-gauge-full'
+ },
+ resetDefaultHeaders() {
+ this.allHeaders = this.allHeaders.map(header => ({
+ ...header,
+ active: this.defaultHeaders.includes(header.value)
+ }))
}
},
apollo: {
accessPoints: {
fetchPolicy: 'cache-and-network',
-
query: gql`
query accessPoints {
accessPoints {