Added const pageSize

web/src/views/UserPresence.vue

@@ -65,7 +65,7 @@
           "
           large
           icon
-          @click="resultSize += 12"
+          @click="resultSize += pageSize"
         >
           <v-icon>mdi-plus</v-icon>
         </v-btn>
@@ -77,10 +77,10 @@
             !userPresence ||
             resultSize >= userPresence.length ||
             $apollo.queries.userPresence.loading ||
-            resultSize <= 12
+            resultSize <= pageSize
           "
           large
-          @click="resultSize -= 12"
+          @click="resultSize -= pageSize"
         >
           <v-icon>mdi-minus</v-icon>
         </v-btn>
@@ -90,9 +90,8 @@
         <v-col cols="12" md="6">
           <v-alert
             class="fill-height"
-            color="info darken-2"
+            color="primary darken-1"
             icon="mdi-alert"
-            outlined
             dark
           >
             A lista de pessoas mostrada aqui é obtida através do uso da rede
@@ -105,9 +104,8 @@
         <v-col cols="12" md="6">
           <v-alert
             class="fill-height"
-            color="info darken-2"
+            color="primary darken-1"
             icon="mdi-update"
-            outlined
             dark
           >
             A lista é atualizada automaticamente. Não é necessário
@@ -126,10 +124,14 @@ import UserPresenceStatusList from '../components/UserPresenceStatusList'
 export default {
   name: 'UserPresence',
   components: { UserPresenceStatusList },
-  data: () => ({
-    search: '',
-    resultSize: 12
-  }),
+  data: () => {
+    const pageSize = 16
+    return {
+      pageSize,
+      search: '',
+      resultSize: pageSize
+    }
+  },
   apollo: {
     userPresence: {
       fetchPolicy: 'cache-and-network',