Merge branch '123-query-all-pages-when-more-than-20-entries-are-present' into 'master'

Resolve "Query all pages when more than 20 entries are present"

Closes #123

See merge request marcel.schwarz/2020ss-qbc-geofence-timetracking!95

frontend/src/views/TimeRecords.vue

@@ -7,6 +7,20 @@
         v-on:edit-timeRecord="editTimeRecord"
       />
     </div>
+    <v-row>
+      <v-col cols="5"></v-col>
+       <v-col cols="1">
+        <v-btn v-if="havePrevPage == true" @click="prevPage()">
+          <v-icon>mdi-arrow-left</v-icon>
+        </v-btn>
+      </v-col>
+      <v-col cols="1">
+        <v-btn v-if="haveNextPage == true" @click="nextPage()">
+          <v-icon>mdi-arrow-right</v-icon>
+        </v-btn>
+      </v-col>     
+      <v-col cols="5"></v-col>
+    </v-row>
     <v-row>
       <v-col cols="6"></v-col>
       <v-col cols="1">
@@ -14,6 +28,7 @@
           <v-icon>mdi-plus</v-icon>
         </v-btn>
       </v-col>
+
       <v-col cols="5"></v-col>
     </v-row>
   </v-container>
@@ -30,7 +45,10 @@ export default {
   },
   data() {
     return {
-      timeRecords: ""
+      timeRecords: "",
+      page: sessionStorage.getItem("page"),
+      haveNextPage: "",
+      havePrevPage: ""
     };
   },
   methods: {
@@ -63,16 +81,33 @@ export default {
       sessionStorage.setItem("timeRecordEditSelfLink", selfLink);
 
       this.$router.push("/createtimerecord");
+    },
+    nextPage() {
+      var pageTMP = parseInt(this.page) + 1;
+      sessionStorage.setItem("page", pageTMP);
+      location.reload();
+    },
+    prevPage() {
+      var pageTMP = parseInt(this.page) - 1;
+      sessionStorage.setItem("page", pageTMP);
+      location.reload();
     }
   },
   created() {
     var xhttp = new XMLHttpRequest();
     var records;
+    var recordLinks;
+
+    if (this.page == null) {
+      this.page = 0;
+    }
+    sessionStorage.removeItem("page");
     xhttp.onreadystatechange = function() {
       if (this.readyState == 4 && this.status == 200) {
         var recordsDB = JSON.parse(xhttp.responseText);
 
         records = recordsDB._embedded.records;
+        recordLinks = recordsDB._links;
       }
     };
     xhttp.open(
@@ -80,6 +115,8 @@ export default {
       baseUri +
         "/records/search/allForUser?username=" +
         sessionStorage.getItem("username") +
+        "&sort=startdate,desc&page=" +
+        this.page +
         "&projection=overview",
       false
     );
@@ -87,6 +124,12 @@ export default {
     xhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));
 
     xhttp.send(null);
+    if (recordLinks.next != undefined) {
+      this.haveNextPage = true;
+    }
+    if (recordLinks.prev != undefined) {
+      this.havePrevPage = true;
+    }
 
     for (let index = 0; index < records.length; index++) {
       var record = records[index];
@@ -97,7 +140,7 @@ export default {
       var min = time % 60;
       record.duration = hours + "h " + min + "min";
       var start = record.startdate;
-       records[index].completeStartDate = start;  
+      records[index].completeStartDate = start;
       start = start.split("T");
       records[index].startdate = start[1];
       records[index].date = start[0];
@@ -110,11 +153,7 @@ export default {
         records[index].enddate = "pending";
       }
     }
-   records.sort(function(a, b) {
+
-    a = new Date(a.completeStartDate);
-    b = new Date(b.completeStartDate);
-    return a>b ? -1 : a<b ? 1 : 0;
-});
     this.timeRecords = records;
   }
 };