From 2ba9c46befb03bfa52f65bf65ca64b4d6cba8da9 Mon Sep 17 00:00:00 2001
From: Douglas Barone <douglasvbarone@gmail.com>
Date: Thu, 11 Aug 2022 14:30:38 -0400
Subject: [PATCH] Added search query

---
 server/package-lock.json             |  4 ++--
 server/package.json                  |  2 +-
 web/package-lock.json                |  4 ++--
 web/package.json                     |  2 +-
 web/src/views/AccessPoints/index.vue | 31 +++++++++++++++++++++++++++-
 5 files changed, 36 insertions(+), 7 deletions(-)

diff --git a/server/package-lock.json b/server/package-lock.json
index af7749a..649dab0 100755
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ifms-pti-svr",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ifms-pti-svr",
-      "version": "3.1.3",
+      "version": "3.1.4",
       "license": "ISC",
       "dependencies": {
         "@prisma/client": "^3.15.2",
diff --git a/server/package.json b/server/package.json
index 67ac74c..a92b72b 100755
--- a/server/package.json
+++ b/server/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ifms-pti-svr",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "description": "Servidor do Portal de TI do IFMS",
   "main": "src/index.js",
   "prisma": {
diff --git a/web/package-lock.json b/web/package-lock.json
index 189df22..32decf1 100755
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ifms-pti",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ifms-pti",
-      "version": "3.1.3",
+      "version": "3.1.4",
       "dependencies": {
         "@mdi/font": "^6.6.96",
         "apollo-link-ws": "^1.0.20",
diff --git a/web/package.json b/web/package.json
index 0b6ecbf..5f83051 100755
--- a/web/package.json
+++ b/web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ifms-pti",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
diff --git a/web/src/views/AccessPoints/index.vue b/web/src/views/AccessPoints/index.vue
index 9ace819..b26e7ac 100644
--- a/web/src/views/AccessPoints/index.vue
+++ b/web/src/views/AccessPoints/index.vue
@@ -65,7 +65,7 @@
       :search="search"
       calculate-widths
       class="elevation-2 mb-2"
-      sort-by="name"
+      :sort-by.sync="sortBy"
       hide-default-footer
       disable-pagination
       :group-by="groupBy ? 'campus' : null"
@@ -201,6 +201,7 @@ export default {
   data: () => ({
     search: '',
     groupBy: true,
+    sortBy: 'name',
     defaultHeaders: [
       'name',
       'ip',
@@ -249,9 +250,30 @@ export default {
       }))
     }
   },
+  watch: {
+    search(newValue) {
+      if (!newValue)
+        this.$router.push({
+          query: { ...this.$route.query, search: undefined }
+        })
+      else if (this.$route.query.search != newValue)
+        this.$router.push({ query: { ...this.$route.query, search: newValue } })
+    },
+    sortBy(newValue) {
+      if (!newValue)
+        this.$router.push({
+          query: { ...this.$route.query, sortBy: undefined }
+        })
+      else if (this.$route.query.sortBy != newValue)
+        this.$router.push({ query: { ...this.$route.query, sortBy: newValue } })
+    }
+  },
   mounted() {
     this.resetDefaultHeaders()
+    this.search = this.$route.query.search || ''
+    this.sortBy = this.$route.query.sortBy || 'name'
   },
+
   methods: {
     navigateToAccessPoint(accessPoint) {
       this.$router.push({
@@ -259,14 +281,17 @@ export default {
         params: { id: accessPoint.id }
       })
     },
+
     readableUptime(uptime) {
       return Math.floor(uptime / 3600)
     },
+
     load(connectedClients) {
       const MAX_LOAD = 80
       const load = Math.floor((connectedClients / MAX_LOAD) * 100)
       return load < 100 ? load : 100
     },
+
     loadColor(clients) {
       const load = this.load(clients)
       if (load < 10) return 'teal'
@@ -278,6 +303,7 @@ export default {
       else if (load < 90) return 'deep-orange'
       else return 'red'
     },
+
     loadIcon(clients) {
       const load = this.load(clients)
       if (load < 25) return 'mdi-gauge-empty'
@@ -285,6 +311,7 @@ export default {
       else if (load < 75) return 'mdi-gauge'
       else return 'mdi-gauge-full'
     },
+
     resetDefaultHeaders() {
       this.groupBy = true
       this.allHeaders = this.allHeaders.map(header => ({
@@ -293,9 +320,11 @@ export default {
       }))
     }
   },
+
   apollo: {
     accessPoints: {
       fetchPolicy: 'cache-and-network',
+      debounce: 200,
       query: gql`
         query accessPoints {
           accessPoints {