chore: update 14.15.5 to 16.14.2

package.json

@@ -8,40 +8,40 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.34",
-    "@fortawesome/free-solid-svg-icons": "^5.15.2",
-    "@fortawesome/vue-fontawesome": "^3.0.0-3",
-    "@zxing/library": "^0.18.6",
-    "axios": "^0.21.4",
-    "core-js": "^3.6.5",
+    "@fortawesome/fontawesome-svg-core": "^6.4.2",
+    "@fortawesome/free-solid-svg-icons": "^6.4.2",
+    "@fortawesome/vue-fontawesome": "^3.0.3",
+    "@zxing/library": "^0.20.0",
+    "axios": "^1.4.0",
+    "core-js": "^3.32.0",
     "lodash": "^4.17.21",
-    "mitt": "^2.1.0",
-    "pdfmake": "^0.1.70",
-    "vue": "^3.0.0",
-    "vue-axios": "^3.2.4",
-    "vue-barcode-reader": "0.0.3",
+    "mitt": "^3.0.1",
+    "pdfmake": "0.2.7",
+    "vue": "^3.3.4",
+    "vue-axios": "^3.5.2",
+    "vue-barcode-reader": "1.0.3",
     "vue-class-component": "^8.0.0-0",
     "vue-property-decorator": "latest",
-    "vue-router": "^4.0.4",
+    "vue-router": "^4.2.4",
     "vue-signature-pad": "^3.0.2"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^2.33.0",
-    "@typescript-eslint/parser": "^2.33.0",
-    "@vue/cli-plugin-babel": "~4.5.0",
-    "@vue/cli-plugin-eslint": "~4.5.0",
-    "@vue/cli-plugin-typescript": "^4.5.11",
-    "@vue/cli-service": "~4.5.0",
-    "@vue/compiler-sfc": "^3.0.0",
-    "@vue/eslint-config-typescript": "^5.0.2",
+    "@typescript-eslint/eslint-plugin": "^6.3.0",
+    "@typescript-eslint/parser": "^6.3.0",
+    "@vue/cli-plugin-babel": "~5.0.8",
+    "@vue/cli-plugin-eslint": "~5.0.8",
+    "@vue/cli-plugin-typescript": "^5.0.8",
+    "@vue/cli-service": "~5.0.8",
+    "@vue/compiler-sfc": "^3.3.4",
+    "@vue/eslint-config-typescript": "^11.0.3",
     "babel-eslint": "^10.1.0",
-    "cypress": "^8.7.0",
-    "eslint": "^6.7.2",
-    "eslint-plugin-vue": "^7.0.0-0",
-    "fork-ts-checker-webpack-plugin": "^3.1.1",
-    "node-sass": "^5.0.0",
-    "sass-loader": "^10.1.1",
-    "typescript": "~3.9.3",
-    "vue-loader": "^15.9.6"
+    "cypress": "12.17.3",
+    "eslint": "^8.47.0",
+    "eslint-plugin-vue": "^9.17.0",
+    "fork-ts-checker-webpack-plugin": "^8.0.0",
+    "node-sass": "^9.0.0",
+    "sass-loader": "^13.3.2",
+    "typescript": "~5.1.6",
+    "vue-loader": "^17.2.2"
   }
 }

src/App.vue

@@ -10,11 +10,10 @@
 
 <script lang="ts">
 import { Vue, Options } from "vue-class-component";
-import Navigationbar from "@/components/Navigationbar.vue";
+import Navigationbar from "@/components/NavigationBar.vue";
 import Modal from "@/views/Modal.vue";
 import { getCurrentInstance } from "vue";
 import { AxiosError } from "axios";
-import axios from "axios";
 
 @Options({
   components: {
@@ -24,7 +23,7 @@ import axios from "axios";
 })
 export default class App extends Vue {
   public modalVisible: boolean = false;
-  public body: string = "";
+  public body: unknown = "";
   public stayOnExit = true;
   public is401Error = false;
 
@@ -48,13 +47,8 @@ export default class App extends Vue {
 
   async mounted() {
     this.emitter.on("err", (err: AxiosError) => {
-      if(err.response != null){
-        if(err.response.status == 500 || err.response.status == 404 || err.response.status == 400 || err.response.status == 401){
-            this.stayOnExit = false;
-        }
-        else{
-          this.stayOnExit = true;
-        }
+      if(err.response){
+        this.stayOnExit = !(err.response.status == 500 || err.response.status == 404 || err.response.status == 400 || err.response.status == 401);
         this.body = err.response.data;
       }
       else{
@@ -134,7 +128,6 @@ export default class App extends Vue {
 
 #app {
   font-family: $font-family;
-  padding-top: 1em;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-align: center;

src/classes/helpers/DateConverter.ts

@@ -1,11 +1,11 @@
 export default class DateConverter {
     public getDateString(timeStamp: number): string {
-        var date = new Date(timeStamp * 1000);
+        const date = new Date(timeStamp * 1000);
         return date.toLocaleDateString();
     }
 
     public getFullDateString(timeStamp: number): string {
-        var date = new Date(timeStamp * 1000);
+        const date = new Date(timeStamp * 1000);
         return date.toLocaleString();
     }
 }

src/components/MenuItem.vue → src/components/DashboardItem.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="menu-item">
-    <div class="menugeneric">
-      <h2 class="menuText">{{ labelText }}</h2>
+  <div class="dashboard-item">
+    <div class="dashboard-generic">
+      <h2 class="dashboardText">{{ labelText }}</h2>
       <img class="slot" :src="source" alt="icon" />
     </div>
   </div>
@@ -17,13 +17,13 @@ import { Options, Vue } from "vue-class-component";
     source: String
   },
 })
-export default class MenuItem extends Vue {}
+export default class DashboardItem extends Vue {}
 </script>
 
 <style scoped lang="scss">
 @import "src/styling/main.scss";
 
-.menu-item {
+.dashboard-item {
   width: 200px;
   height: 200px;
   display: flex;
@@ -35,11 +35,11 @@ export default class MenuItem extends Vue {}
   cursor: pointer;
 }
 
-.menugeneric {
+.dashboard-generic {
   margin: auto;
 }
 
-.menuText {
+.dashboardText {
   font-size: 1.5em;
   width: 175px;
   margin: auto;

src/components/Menu.vue → src/components/DashboardView.vue

@@ -1,18 +1,18 @@
 <template>
   <div class="m-container">
-    <MenuItem
+    <DashboardItem
       @click="registerClicked()"
       class="item"
       labelText="Registreren"
       :source="getImgUrl('register.png')"
     />
-    <MenuItem
+    <DashboardItem
       @click="searchClicked()"
       class="item"
       labelText="Zoeken"
       :source="getImgUrl('search.png')"
     />
-    <MenuItem
+    <DashboardItem
       @click="locationClicked()"
       class="item"
       labelText="Locaties"
@@ -23,12 +23,12 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
-import MenuItem from "@/components/MenuItem.vue";
+import DashboardItem from "@/components/DashboardItem.vue";
 
 
-const Menu = defineComponent({
+const Dashboard = defineComponent({
   components: {
-    MenuItem,
+    DashboardItem
   },
   data() {
     return {};
@@ -58,7 +58,7 @@ const Menu = defineComponent({
 
   },
 });
-export default Menu;
+export default Dashboard;
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->

src/components/Navigationbar.vue → src/components/NavigationBar.vue

@@ -24,7 +24,7 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 import axios from "axios";
-const Navigationbar = defineComponent({
+const NavigationBar = defineComponent({
     data() {
         return {
             email: String,
@@ -58,15 +58,14 @@ const Navigationbar = defineComponent({
         })
     }
 });
-export default Navigationbar;
+export default NavigationBar;
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
 @import "@/styling/main.scss";
 
 .nav-container {
-  position: -webkit-sticky; /* Safari */
   position: sticky;
   top: 0;
   background-color: #fff;

src/components/Search.vue → src/components/SearchBar.vue

@@ -10,7 +10,7 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 
-const Search = defineComponent({
+const SearchBar = defineComponent({
   data() {
     return {
       inputValue: "",
@@ -22,7 +22,7 @@ const Search = defineComponent({
     },
   },
 });
-export default Search;
+export default SearchBar;
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->

src/components/SearchContainer.vue

@@ -14,7 +14,7 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
-import Search from "./Search.vue";
+import Search from "./SearchBar.vue";
 import ComboBox from "@/components/standardUi/ComboBox.vue";
 
 const SearchContainer = defineComponent({

src/components/SearchContainerBuilding.vue

@@ -35,7 +35,7 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
-import Search from "./Search.vue";
+import Search from "./SearchBar.vue";
 // import ComboBox from "@/components/standardUi/ComboBox.vue";
 
 const SearchContainer = defineComponent({

src/components/SearchContainerCityBuilding.vue

@@ -35,7 +35,7 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
-import Search from "./Search.vue";
+import Search from "./SearchBar.vue";
 // import ComboBox from "@/components/standardUi/ComboBox.vue";
 
 const SearchContainer = defineComponent({

src/components/SearchContainerLocation.vue

@@ -36,7 +36,7 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
-import Search from "./Search.vue";
+import Search from "./SearchBar.vue";
 import ComboBox from "@/components/standardUi/ComboBox.vue";
 
 const SearchContainer = defineComponent({
@@ -138,7 +138,7 @@ export default SearchContainer;
   color: #ffffff;
 
   border-radius: 5px;
-  border: 0px;
+  border: 0;
   box-shadow: $shadow;
 
   font-weight: bold;

src/components/location/BuildingOverviewTable.vue

@@ -43,7 +43,7 @@ import { ColumnType } from "@/classes/table/ColumnType";
 import Room from "@/classes/Room";
 import Building from "@/classes/Building"
 import { roomService } from "@/services/locatieService/roomservice";
-import { getCurrentInstance } from "@vue/runtime-core";
+import { getCurrentInstance } from "vue";
 import { AxiosError } from "axios";
 import LoadingIcon from "@/components/standardUi/LoadingIcon.vue";
 import { TableCell } from "@/classes/table/TableCell";

src/components/location/CityOverviewTable.vue

@@ -43,7 +43,7 @@ import { ColumnType } from "@/classes/table/ColumnType";
 import Room from "@/classes/Room";
 import City from "@/classes/City"
 import { roomService } from "@/services/locatieService/roomservice";
-import { getCurrentInstance } from "@vue/runtime-core";
+import { getCurrentInstance } from "vue";
 import { AxiosError } from "axios";
 import LoadingIcon from "@/components/standardUi/LoadingIcon.vue";
 import { TableCell } from "@/classes/table/TableCell";

src/components/location/LocationOverviewTable.vue

@@ -45,7 +45,7 @@ import LocationModal from "@/components/location/LocationModal.vue";
 import { ColumnType } from "@/classes/table/ColumnType";
 import Room from "@/classes/Room";
 import { roomService } from "@/services/locatieService/roomservice";
-import { getCurrentInstance } from "@vue/runtime-core";
+import { getCurrentInstance } from "vue";
 import { AxiosError } from "axios";
 import LoadingIcon from "@/components/standardUi/LoadingIcon.vue";
 import { TableCell } from "@/classes/table/TableCell";

src/components/locationRegistration/AddBuilding.vue

@@ -27,7 +27,7 @@
         />
         <InputField
           label="Huisnummer:"
-          v-model:input="building.Address.Number"
+          v-model:input="building.Address.Number.toLocaleString()"
           :valid="numberValid"
           @update:input="numberChanged"
         />
@@ -86,7 +86,7 @@ import City from "@/classes/City";
 
 import { buildingService } from "@/services/locatieService/buildingservice";
 import { cityService } from "@/services/locatieService/cityservice";
-import { getCurrentInstance } from "@vue/runtime-core";
+import { getCurrentInstance } from "vue";
 import SelectOption from "@/classes/helpers/SelectOption";
 import LoadingIcon from "@/components/standardUi/LoadingIcon.vue";
 import { AxiosError } from "axios";
@@ -134,7 +134,7 @@ export default class AddBuilding extends Vue {
   private buildingValid: boolean = true;
   private postalCodeValid: boolean = true;
   private numberValid: boolean = true;
-  private error: string = "";
+  private error: unknown = "";
 
 
   async created() {

src/components/locationRegistration/AddCity.vue

@@ -53,7 +53,7 @@ import LoadingIcon from "@/components/standardUi/LoadingIcon.vue";
 import CityRequest from "@/classes/requests/CityRequest";
 import { cityService } from "@/services/locatieService/cityservice";
 import LinkOrStayModal from "@/components/standardUi/LinkOrStayModal.vue";
-import { getCurrentInstance } from "@vue/runtime-core";
+import { getCurrentInstance } from "vue";
 import { AxiosError } from "axios";
 
 @Options({
@@ -72,7 +72,7 @@ export default class AddCity extends Vue {
   private city: CityRequest = new CityRequest("");
   private showModal: boolean = false;
   private nameValid: boolean = true;
-  private error: string = "";
+  private error: unknown = "";
   private isLoading: boolean = false;
   private loadPostRequest: boolean = false;
   private loadDeleteRequest: boolean = false;