Enable to validate a page number

frontend/layouts/annotation.vue

@@ -91,6 +91,7 @@ export default {
     ApproveButton,
     MetadataBox
   },
+
   data() {
     return {
       drawerLeft: null,
@@ -104,10 +105,10 @@ export default {
     ...mapGetters('documents', ['currentDoc', 'approved']),
     page: {
       get() {
-        return parseInt(this.$route.query.page, 10)
+        return Math.min(parseInt(this.$route.query.page, 10), this.total)
       },
       set(newValue) {
-        const value = parseInt(newValue, 10)
+        const value = Math.min(parseInt(newValue, 10), this.total)
         this.$router.push({
           query: {
             isChecked: this.$route.query.isChecked,
@@ -188,10 +189,6 @@ export default {
         filterName: this.getFilterOption
       })
     }
-  },
-
-  validate({ params, query }) {
-    return /^\d+$/.test(params.id) && /^\d+$/.test(query.page)
   }
 }
 </script>

frontend/pages/projects/_id/sequence-labeling/index.vue

@@ -14,6 +14,10 @@ export default {
 
   components: {
     EntityItemBox
+  },
+
+  validate({ params, query }) {
+    return /^\d+$/.test(params.id) && /^\d+$/.test(query.page)
   }
 }
 </script>

frontend/pages/projects/_id/sequence-to-sequence/index.vue

@@ -10,6 +10,10 @@ export default {
 
   components: {
     Seq2seqContainer
+  },
+
+  validate({ params, query }) {
+    return /^\d+$/.test(params.id) && /^\d+$/.test(query.page)
   }
 }
 </script>

frontend/pages/projects/_id/text-classification/index.vue

@@ -10,6 +10,10 @@ export default {
 
   components: {
     TextClassification
+  },
+
+  validate({ params, query }) {
+    return /^\d+$/.test(params.id) && /^\d+$/.test(query.page)
   }
 }
 </script>