ubiquitous-computing-geo-timetracking/frontend/src/views/Users.vue

<template>
  <v-container fluid>
    <div v-bind:key="user.username" v-for="user in users">
      <UsersItems v-bind:user="user" v-on:edit-user="edituser" />
    </div>
  </v-container>
</template>

<script>
import { baseUri } from "../variables.js";
import UsersItems from "./UsersItems.vue";
export default {
  components: {
    UsersItems
  },
  data: () => ({
    users: JSON.parse(sessionStorage.getItem("users")),
    dialog: false
  }),
  methods: {
    edituser(userlink) {
     
      sessionStorage.setItem("edituser", userlink);

      window.location.href = "http://localhost:8080/edituser";
    }
  },
  created() {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        var usersInformation = JSON.parse(xhttp.responseText);     
        sessionStorage.setItem(
          "users",
          JSON.stringify(usersInformation._embedded.users)
        );
      }
    };
    xhttp.open("GET", baseUri + "/users", false);

    xhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));

    xhttp.send(null);
    this.users = JSON.parse(sessionStorage.getItem("users"));
  }
};
</script>