Skip to content
Snippets Groups Projects
Commit 512fa0a2 authored by Titus Netland's avatar Titus Netland
Browse files

Merge branch 'main' into 'create-group-connect-api' 

# Conflicts:
#   src/utils/apiutil.js
parents eb3fbdce 18fcb49b
No related branches found
No related tags found
1 merge request!39create-group-api
Pipeline #176951 failed with stages
Stage:
    Stage:
      in 1 minute and 10 seconds
      Hide whitespace changes
      Inline Side-by-side
      Showing
      with 297 additions and 231 deletions
      .eslintrc.js
      + 1
      − 0
      View file @ 512fa0a2
      ......@@ -12,6 +12,7 @@ module.exports = {
      parser: "@babel/eslint-parser",
      },
      rules: {
      "linebreak-style": 0,
      "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
      "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
      },
      ......
      .gitlab-ci.yml
      + 28
      − 43
      View file @ 512fa0a2
      # This file is a template, and might need editing before it works on your project.
      # To contribute improvements to CI/CD templates, please follow the Development guide at:
      # https://docs.gitlab.com/ee/development/cicd/templates.html
      # This specific template is located at:
      # https://gitlab.com/gitlab-org/gitlab/-/blob/master/lib/gitlab/ci/templates/Getting-Started.gitlab-ci.yml
      # This is a sample GitLab CI/CD configuration file that should run without any modifications.
      # It demonstrates a basic 3 stage CI/CD pipeline. Instead of real tests or scripts,
      # it uses echo commands to simulate the pipeline execution.
      #
      # A pipeline is composed of independent jobs that run scripts, grouped into stages.
      # Stages run in sequential order, but jobs within stages run in parallel.
      #
      # For more information, see: https://docs.gitlab.com/ee/ci/yaml/index.html#stages
      image: node:16
      stages: # List of stages for jobs, and their order of execution
      - build
      stages:
      - setup
      - test
      image: node:16
      variables:
      npm_config_cache: "$CI_PROJECT_DIR/.npm"
      cache:
      paths:
      - node_modules/
      install_dependencies_job: # This job runs in the build stage, which runs first.
      stage: build
      # Define a hidden job to be used with extends
      # Better than default to avoid activating cache for all jobs
      .dependencies_cache:
      cache:
      key:
      files:
      - package-lock.json
      paths:
      - .npm
      policy: pull
      setup:
      stage: setup
      script:
      - echo "Installing dependencies..."
      - npm install
      - echo "Dependencies installed."
      - npm ci
      extends: .dependencies_cache
      cache:
      policy: pull-push
      artifacts:
      expire_in: 3 days #delete cache after 3 days to conserve space
      paths:
      - node_modules/
      - node_modules
      lint-test-job: # This job also runs in the test stage.
      stage: test # It can run at the same time as unit-test-job (in parallel).
      lint_test:
      stage: test
      script:
      - echo "Linting the code..."
      - npm run lint
      - echo "Code-linting complete."
      artifacts:
      paths:
      - node_modules/
      unit-test-job: # This job runs in the test stage.
      stage: test # It only starts when the job in the build stage completes successfully.
      unit_test:
      stage: test
      script:
      - echo "Running unit tests..."
      - npm run test:unit -- --coverage
      - echo "Unit tests complete."
      artifacts:
      paths:
      - node_modules/
      - npm run test:unit
      public/favicon.ico deleted 100644 → 0
      + 0
      − 0
      View file @ eb3fbdce
      public/favicon.ico

      4.19 KiB

      public/index.html deleted 100644 → 0
      + 0
      − 17
      View file @ eb3fbdce
      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width,initial-scale=1.0">
      <link rel="icon" href="<%= BASE_URL %>favicon.ico">
      <title><%= htmlWebpackPlugin.options.title %></title>
      </head>
      <body>
      <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
      </noscript>
      <div id="app"></div>
      <!-- built files will be auto injected -->
      </body>
      </html>
      src/App.vue
      + 3
      − 3
      View file @ 512fa0a2
      <template>
      <div>
      <NavBar />
      <router-view />
      <NavBar />
      <router-view />
      </div>
      </template>
      ......@@ -19,4 +19,4 @@ export default defineComponent({
      NavBar,
      },
      });
      </script>
      \ No newline at end of file
      </script>
      src/components/AddNewItem.vue
      + 31
      − 34
      View file @ 512fa0a2
      ......@@ -68,24 +68,23 @@
      </div>
      </div>
      <!-- Select Group -->
      <div class="mb-6">
      <label
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-400"
      >Gruppe</label
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-400"
      >Gruppe</label
      >
      <select
      v-model="v$.item.selectGroup.$model"
      class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      v-model="v$.item.selectGroup.$model"
      class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      >
      <option class="text-gray-400" value="" disabled selected>
      Select a Group
      </option>
      <option
      v-for="group in groups"
      :key="group"
      class="text-gray-900 text-sm"
      v-for="group in groups"
      :key="group"
      class="text-gray-900 text-sm"
      >
      {{ group }}
      </option>
      ......@@ -93,9 +92,9 @@
      <!-- error message for select box -->
      <div
      class="text-red"
      v-for="(error, index) of v$.item.selectGroup.$errors"
      :key="index"
      class="text-red"
      v-for="(error, index) of v$.item.selectGroup.$errors"
      :key="index"
      >
      <div class="text-red-600 text-sm">
      {{ error.$message }}
      ......@@ -157,25 +156,25 @@
      </div>
      </div>
      <!-- Address -->
      <div class="mb-6" :class="{ error: v$.item.address.$errors.length }">
      <label
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
      >Adresse</label>
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
      >Adresse</label
      >
      <input
      type="text"
      class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      v-model="v$.item.address.$model"
      id="adress"
      required
      type="text"
      class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      v-model="v$.item.address.$model"
      id="adress"
      required
      />
      <!-- error message for address-->
      <div
      class="text-red"
      v-for="(error, index) of v$.item.address.$errors"
      :key="index"
      class="text-red"
      v-for="(error, index) of v$.item.address.$errors"
      :key="index"
      >
      <div class="text-red-600 text-sm">
      {{ error.$message }}
      ......@@ -183,7 +182,6 @@
      </div>
      </div>
      <!-- Images -->
      <div>
      <label
      ......@@ -252,8 +250,8 @@ export default {
      item: {
      title: {
      required: helpers.withMessage(
      () => "Tittelen kan ikke være tom",
      required
      () => "Tittelen kan ikke være tom",
      required
      ),
      max: helpers.withMessage(
      () => `Tittelen kan inneholde max 50 tegn`,
      ......@@ -262,8 +260,8 @@ export default {
      },
      description: {
      required: helpers.withMessage(
      () => "Beskrivelsen kan ikke være tom",
      required
      () => "Beskrivelsen kan ikke være tom",
      required
      ),
      max: helpers.withMessage(
      () => `Beskrivelsen kan inneholde max 200 tegn`,
      ......@@ -289,12 +287,12 @@ export default {
      },
      address: {
      required: helpers.withMessage(
      () => "Addressen kan ikke være tom",
      required
      () => "Addressen kan ikke være tom",
      required
      ),
      max: helpers.withMessage(
      () => `Addressen kan inneholde max 50 tegn`,
      maxLength(50)
      () => `Addressen kan inneholde max 50 tegn`,
      maxLength(50)
      ),
      },
      },
      ......@@ -365,11 +363,10 @@ export default {
      const postRequest = await postNewItem(itemInfo);
      console.log("posted: " + postRequest);
      }
      },
      checkUser: async function (){
      checkUser: async function () {
      let user = parseUserFromToken(this.$store.state.user.token);
      this.item.userId = parseInt(user.accountId);
      console.log("id: " + this.item.userId);
      ......@@ -380,6 +377,6 @@ export default {
      this.item.images.push(URL.createObjectURL(event.target.files[0]));
      console.log("antall bilder: " + this.item.images.length);
      },
      }
      },
      };
      </script>
      src/components/HomeComponent.vue
      + 3
      − 4
      View file @ 512fa0a2
      ......@@ -6,8 +6,7 @@
      <router-link to="/about" class="m-6">Om BoCo</router-link>
      <div @click="logout" class="m-6 cursor-pointer"><p>Logout</p></div>
      <div @click="logout" class="m-6 cursor-pointer"><p>Logout</p></div>
      </div>
      </template>
      ......@@ -18,9 +17,9 @@ export default {
      data: () => ({}),
      methods: {
      logout (){
      logout() {
      this.$store.commit("logout");
      },
      }
      },
      };
      </script>
      src/components/LoginForm.vue
      + 13
      − 9
      View file @ 512fa0a2
      <template>
      <div class="App">
      <div class="max-w-md p-6 mx-auto rounded-md shadow-lg mt-16">
      <div class="flex justify-center text-2xl ">Logg inn</div>
      <div
      id="emailField"
      class="m-6"
      :class="{ error: v$.user.email.$errors.length }">
      :class="{ error: v$.user.email.$errors.length }"
      >
      <div class="mb-6">
      <label
      for="email"
      ......@@ -44,7 +48,7 @@
      <input
      type="password"
      id="password"
      class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 "
      v-model="v$.user.password.$model"
      required
      @keyup.enter="loginClicked"
      ......@@ -68,20 +72,20 @@
      <div id="buttonsField" class="m-6">
      <div class="align-items: flex-end; mb-6">
      <div class="ml-3 text-sm">
      <router-link to="/resetPassword" class="text-blue-600"
      <router-link to="/resetPassword" class="text-blue-600 flex justify-end"
      >Glemt passord</router-link
      >
      </div>
      </div>
      <button
      @click="loginClicked"
      class="flex justify-center align-items: flex-end; text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
      class="w-full text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5"
      >
      Logg inn
      </button>
      <div class="align-items: flex-end; mb-6 mt-6">
      <div class="ml-3 text-sm">
      <router-link to="register" class="text-blue-600"
      <div class="align-items: flex-end; mb-6 mt-12">
      <div class="text-sm">
      <router-link to="register" class="text-blue-600 flex justify-center"
      >Ny bruker</router-link
      >
      </div>
      ......@@ -153,7 +157,7 @@ export default {
      this.$store.commit("logout");
      } else if (loginResponse.isLoggedIn === true) {
      this.$store.commit("saveToken", loginResponse.token);
      await this.$router.push('/');
      await this.$router.push("/");
      } else {
      console.log("Something went wrong");
      }
      ......
      src/components/MemberList.vue 0 → 100644
      + 36
      − 0
      View file @ 512fa0a2
      <template>
      <ul>
      <li v-for="member in memberlist" :key="member.userId">
      <user-list-item-card :admin="admin" :user="member" />
      </li>
      </ul>
      </template>
      <script>
      import UserListItemCard from "./UserProfileComponents/UserListItemCard.vue";
      export default {
      data() {
      return {
      memberlist: [
      {
      userId: 2,
      firstName: "erik",
      lastName: "hansen",
      },
      {
      userId: 1,
      firstName: "Test",
      lastName: "Testesen",
      },
      ],
      };
      },
      components: {
      UserListItemCard,
      },
      props: {
      admin: Boolean,
      },
      };
      </script>
      src/components/MessagesForm.vue
      + 4
      − 6
      View file @ 512fa0a2
      <template>
      <div> This is a message page</div>
      <div>This is a message page</div>
      </template>
      <script>
      export default {
      name: "MessagesForm"
      }
      name: "MessagesForm",
      };
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      <style scoped></style>
      src/components/NavBar.vue
      + 37
      − 22
      View file @ 512fa0a2
      <template>
      <nav class="flex items-center justify-between bg-white h-20 shadow-2xl">
      <nav class="flex items-center justify-between bg-white h-20 border-1 border-b border-gray-300 border-solid">
      <div class="logo">
      <img class="m-2 cursor-pointer h-16 " src="../assets/logo3.svg" alt="BoCo logo" @click="$router.push('/')"/>
      <img
      class="m-2 cursor-pointer h-16"
      src="../assets/logo3.svg"
      alt="BoCo logo"
      @click="$router.push('/')"
      />
      </div>
      <ul class="flex">
      <li>
      <img class="m-6 cursor-pointer h-8 " src="../assets/additem.png" alt="Legg til" @click="$router.push('/addNewItem')"/>
      <img
      class="m-6 cursor-pointer h-8"
      src="../assets/additem.png"
      alt="Legg til"
      @click="$router.push('/addNewItem')"
      />
      </li>
      <li>
      <img class="m-6 cursor-pointer h-8 " src="../assets/messages.png" alt="Meldinger" @click="$router.push('/messages')"/>
      <img
      class="m-6 cursor-pointer h-8"
      src="../assets/messages.png"
      alt="Meldinger"
      @click="$router.push('/messages')"
      />
      </li>
      <li>
      <img class="m-6 cursor-pointer h-8 " src="../assets/profile.png" alt="Profil" @click="loadProfile"/>
      <img
      class="m-6 cursor-pointer h-8"
      src="../assets/profile.png"
      alt="Profil"
      @click="loadProfile"
      />
      </li>
      </ul>
      </nav>
      </template>
      <script>
      import {parseUserFromToken} from "@/utils/token-utils";
      import { parseUserFromToken } from "@/utils/token-utils";
      export default {
      name: "NavBar.vue",
      methods: {
      async loadProfile() {
      if(this.$store.state.user.token !== null){
      let user = parseUserFromToken(this.$store.state.user.token);
      console.log(user);
      let id = user.accountId;
      console.log(id);
      await this.$router.push("/profile/" + id);
      }
      else {
      if (this.$store.state.user.token !== null) {
      let user = parseUserFromToken(this.$store.state.user.token);
      console.log(user);
      let id = user.accountId;
      console.log(id);
      await this.$router.push("/profile/" + id);
      } else {
      await this.$router.push("/login");
      }
      }
      }
      }
      },
      },
      };
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      <style scoped></style>
      src/components/NewPasswordForm.vue
      + 26
      − 29
      View file @ 512fa0a2
      <template>
      <div
      class="w-full max-w-sm p-6 m-auto bg-white rounded-md shadow-md dark:bg-gray-800"
      class="w-full max-w-sm p-6 m-auto bg-white rounded-md shadow-md dark:bg-gray-800 mt-8 "
      >
      <div id="logoField" class="flex justify-center m-6">
      <img src="../assets/logo3.svg" alt="BoCo logo" />
      </div>
      <div
      id="firstPasswordField"
      :class="{ error: v$.user.password.$errors.length }"
      id="firstPasswordField"
      :class="{ error: v$.user.password.$errors.length }"
      >
      <label
      for="password"
      class="block text-sm text-gray-800 dark:text-gray-200"
      >Nytt passord</label
      for="password"
      class="block text-sm text-gray-800 dark:text-gray-200"
      >Nytt passord</label
      >
      <input
      type="password"
      v-model="v$.user.password.$model"
      class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40"
      type="password"
      v-model="v$.user.password.$model"
      class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40"
      />
      <!-- error message -->
      <div v-for="(error, index) of v$.user.password.$errors" :key="index">
      <div
      class="text-red-600 text-sm"
      v-show="showError"
      id="passwordErrorId"
      class="text-red-600 text-sm"
      v-show="showError"
      id="passwordErrorId"
      >
      {{ error.$message }}
      </div>
      ......@@ -33,29 +30,29 @@
      </div>
      <div
      id="secondPasswordField"
      class="mt-4"
      :class="{ error: v$.user.rePassword.$errors.length }"
      id="secondPasswordField"
      class="mt-4"
      :class="{ error: v$.user.rePassword.$errors.length }"
      >
      <div class="flex items-center justify-between">
      <label
      for="rePassword"
      class="block text-sm text-gray-800 dark:text-gray-200"
      >Gjenta nytt passord</label
      for="rePassword"
      class="block text-sm text-gray-800 dark:text-gray-200"
      >Gjenta nytt passord</label
      >
      </div>
      <input
      type="password"
      v-model="v$.user.rePassword.$model"
      class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40"
      type="password"
      v-model="v$.user.rePassword.$model"
      class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40"
      />
      <!-- error message -->
      <div v-for="(error, index) of v$.user.rePassword.$errors" :key="index">
      <div
      class="text-red-600 text-sm"
      v-show="showError"
      id="rePasswordErrorId"
      class="text-red-600 text-sm"
      v-show="showError"
      id="rePasswordErrorId"
      >
      {{ error.$message }}
      </div>
      ......@@ -64,8 +61,8 @@
      <div id="buttonsField" class="mt-6">
      <button
      @click="setNewPassword"
      class="w-full px-4 py-2 tracking-wide text-white transition-colors duration-200 transform bg-gray-700 rounded-md hover:bg-gray-600 focus:outline-none focus:bg-gray-600"
      @click="setNewPassword"
      class="w-full px-4 py-2 tracking-wide text-white transition-colors duration-200 transform bg-gray-700 rounded-md hover:bg-gray-600 focus:outline-none focus:bg-gray-600"
      >
      Endre passord
      </button>
      ......
      src/components/NotificationsForm.vue
      + 4
      − 6
      View file @ 512fa0a2
      <template>
      <div> This is a notification page</div>
      <div>This is a notification page</div>
      </template>
      <script>
      export default {
      name: "NotificationsForm"
      }
      name: "NotificationsForm",
      };
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      <style scoped></style>
      src/components/ResetPassword.vue
      + 26
      − 25
      View file @ 512fa0a2
      <template>
      <div class="resetPassword">
      <div
      id="emailField"
      class="m-6"
      :class="{ error: v$.email.$errors.length }">
      id="emailField"
      class="m-6"
      :class="{ error: v$.email.$errors.length }"
      >
      <div class="mb-6">
      <label
      for="email"
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
      >E-post</label
      for="email"
      class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
      >E-post</label
      >
      <input
      type="email"
      id="email"
      class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      placeholder="eksempel@eksempel.no"
      v-model="v$.email.$model"
      required
      type="email"
      id="email"
      class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
      placeholder="eksempel@eksempel.no"
      v-model="v$.email.$model"
      required
      />
      <!-- error message -->
      <div v-for="(error, index) of v$.email.$errors" :key="index">
      <div
      class="text-red-600 text-sm"
      v-show="showError"
      id="emailErrorId"
      class="text-red-600 text-sm"
      v-show="showError"
      id="emailErrorId"
      >
      {{ error.$message }}
      </div>
      ......@@ -31,8 +32,8 @@
      </div>
      </div>
      <button
      @click="sendHome"
      class="flex justify-center align-items: flex-end; text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
      @click="sendHome"
      class="flex justify-center align-items: flex-end; text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
      >
      Send e-post
      </button>
      ......@@ -56,14 +57,14 @@ export default {
      },
      validations() {
      return {
      email: {
      required,
      email: helpers.withMessage(`E-posten er ugyldig`, email),
      },
      email: {
      required,
      email: helpers.withMessage(`E-posten er ugyldig`, email),
      },
      };
      },
      methods: {
      sendHome(){
      sendHome() {
      this.showError = true;
      this.v$.email.$touch();
      ......@@ -71,10 +72,10 @@ export default {
      if (this.v$.email.$invalid) {
      console.log("Ugyldig, avslutter...");
      return;
      } else {
      this.$router.push("/");
      }
      else{this.$router.push('/');}
      }
      },
      },
      validate() {
      this.$refs.form.validate();
      ......
      src/components/UserProfileComponents/LargeProfileCard.vue
      + 29
      − 15
      View file @ 512fa0a2
      <template>
      <div
      class="max-w-sm bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700"
      class="min-w-full md:min-w-0 md:w-96 my-4 py-8 bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700"
      >
      <div v-show="isCurrentUser" class="flex justify-end px-4 pt-4">
      <div v-show="isCurrentUser" class="flex absolute justify-end px-4 pt-4">
      <button
      id="dropdownDefault"
      data-dropdown-toggle="dropdown"
      @click="dropdown = !dropdown"
      class="hidden sm:inline-block text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-1.5"
      class="w-10 h-10 text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-1.5"
      type="button"
      >
      <svg
      ......@@ -25,7 +25,6 @@
      <div
      id="dropdown"
      v-show="dropdown"
      zindex="2"
      class="z-10 w-44 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700"
      >
      <ul class="py-1" aria-labelledby="dropdownDefault">
      ......@@ -50,6 +49,13 @@
      >Leiehistorikk</router-link
      >
      </li>
      <li>
      <div
      @click="logout"
      class="cursor-pointer block py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
      >Logg ut
      </div>
      </li>
      <li>
      <router-link
      to="/newPassword"
      ......@@ -67,6 +73,7 @@
      </ul>
      </div>
      </div>
      <div class="flex flex-col items-center pb-10">
      <img
      class="mb-3 w-24 h-24 rounded-full shadow-lg"
      ......@@ -95,8 +102,7 @@
      <script>
      import RatingComponent from "@/components/UserProfileComponents/RatingComponent.vue";
      import { parseCurrentUser } from "@/utils/token-utils";
      import { getUser, getRenterRating, getOwnerRating } from "@/utils/apiutil";
      import router from "@/router";
      import { getUser, getAverageRating } from "@/utils/apiutil";
      export default {
      name: "LargeProfileCard",
      ......@@ -106,8 +112,8 @@ export default {
      currentUser: {},
      id: -1,
      isCurrentUser: false,
      renterRating: -1, //getRenterRating(this.userID),
      ownerRating: -1, //getOwnerRating(this.userID),
      renterRating: -1,
      ownerRating: -1,
      dropdown: false,
      };
      },
      ......@@ -116,23 +122,31 @@ export default {
      },
      methods: {
      async getUser() {
      this.currentUser = parseCurrentUser();
      this.id = router.currentRoute.value.params.id;
      if (this.id == this.currentUser.account_id) {
      this.currentUser = await parseCurrentUser();
      this.id = await this.$router.currentRoute.value.params.id;
      if (this.id === this.currentUser.accountId) {
      this.isCurrentUser = true;
      this.user = this.currentUser;
      return;
      }
      this.user = await getUser(this.id);
      this.renterRating = getRenterRating(this.id);
      this.ownerRating = getOwnerRating(this.id);
      let rating = await getAverageRating(this.id);
      if (rating >= 0 && rating <= 5) {
      this.renterRating = rating;
      this.ownerRating = rating;
      }
      },
      getProfilePicture() {
      /* if (this.user.picture != "") {
      if (this.user.picture !== "") {
      return this.user.picture;
      } */
      }
      return "../assets/defaultUserProfileImage.jpg";
      },
      logout(){
      this.$store.commit('logout');
      this.$router.push('/')
      }
      },
      beforeMount() {
      this.getUser();
      ......
      src/components/UserProfileComponents/RatingComponent.vue
      + 2
      − 7
      View file @ 512fa0a2
      <template>
      <ul v-if="compRating != -1" class="flex justify-center">
      <ul v-if="rating != -1" class="flex justify-center">
      <li>
      <p class="ml-2 text-sm font-medium text-gray-500 dark:text-gray-400">
      {{ ratingType }}:&nbsp;
      ......@@ -19,7 +19,7 @@
      </li>
      <li>
      <p class="ml-2 text-sm font-medium text-gray-500 dark:text-gray-400">
      {{ compRating }} out of 5
      {{ rating }} out of 5
      </p>
      </li>
      </ul>
      ......@@ -40,11 +40,6 @@
      <script>
      export default {
      name: "RatingComponent",
      data() {
      return {
      compRating: this.rating + 0,
      };
      },
      props: {
      rating: Number,
      ratingType: String,
      ......
      src/components/UserProfileComponents/UserListItemCard.vue
      + 35
      − 7
      View file @ 512fa0a2
      <template>
      <div
      class="select-none cursor-pointer hover:bg-gray-50 flex flex-1 items-center p-4"
      class="bg-white shadow dark:bg-gray-800 select-none cursor-pointer hover:bg-gray-50 flex items-center p-4"
      >
      <div class="flex flex-col w-10 h-10 justify-center items-center mr-4">
      <router-link to="">
      <img alt="profil" :src="getProfilePicture" />
      <div class="h-10 w-10 flex flex-col justify-center items-center mr-4">
      <router-link :to="'/profile/' + user.userId">
      <img alt="profil" src="../../assets/defaultUserProfileImage.jpg" />
      </router-link>
      </div>
      <div class="flex-1 pl-1">
      <div class="font-medium dark:text-white">
      {{ user.first_name }} {{ user.last_name }}
      {{ user.firstName }} {{ user.lastName }}
      </div>
      </div>
      <div class="hidden md:block flex-auto">
      <rating-component :rating="rating" :ratingType="'Gjennomsnitts rating'" />
      </div>
      <div class="flex flex-row justify-center">
      <button class="w-10 text-right flex justify-end">Åpne chat</button>
      <button v-if="admin" class="w-10 text-right flex justify-end">
      <button
      v-if="!admin"
      class="px-4 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-200 transform bg-blue-600 rounded-md hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
      >
      Åpne chat
      </button>
      <button
      v-if="admin"
      class="px-4 py-2 font-medium tracking-wide text-white capitalize transition-colors duration-200 transform bg-blue-600 rounded-md hover:bg-blue-500 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-80"
      >
      Fjern bruker
      </button>
      </div>
      ......@@ -22,8 +33,19 @@
      </template>
      <script>
      import { getAverageRating } from "@/utils/apiutil";
      import RatingComponent from "./RatingComponent.vue";
      export default {
      name: "UserListItem",
      data() {
      return {
      rating: this.getRating(),
      };
      },
      components: {
      RatingComponent,
      },
      props: {
      user: Object,
      admin: Boolean,
      ......@@ -35,6 +57,12 @@ export default {
      }
      return "../assets/defaultUserProfileImage.jpg";
      },
      async getRating() {
      this.rating = await getAverageRating(this.user.userId);
      },
      },
      beforeMount() {
      this.getRating();
      },
      };
      </script>
      src/router/index.js
      + 6
      − 2
      View file @ 512fa0a2
      ......@@ -12,8 +12,7 @@ function guardRoute(to, from, next) {
      let isAuthenticated = store.state.user.token != null;
      if (isAuthenticated) {
      next(); // allow to enter route
      }
      else {
      } else {
      next("/login"); // go to '/login';
      }
      }
      ......@@ -65,6 +64,11 @@ const routes = [
      path: "/createNewGroup",
      name: "createNewGroup",
      component: () => import("../views/CreateNewGroupView.vue"),
      },
      {
      path: "/group/:id/memberlist",
      name: "memberlist",
      component: () => import("../views/MemberListView.vue"),
      beforeEnter: guardRoute,
      },
      {
      ......
      src/utils/apiutil.js
      + 12
      − 0
      View file @ 512fa0a2
      ......@@ -72,6 +72,18 @@ export function getOwnerRating(userid) {
      });
      }
      export function getAverageRating(userid) {
      return axios
      .get(API_URL + "rating/" + userid + "/average", {
      headers: tokenHeader(),
      })
      .then((response) => {
      return response.data;
      })
      .catch((error) => {
      console.error(error);
      });
      }
      export function doNewPassword() {
      //m
      //add newPasswordInfo to input
      ......
      src/views/AboutView.vue
      + 1
      − 2
      View file @ 512fa0a2
      ......@@ -10,7 +10,6 @@ import { defineComponent } from "vue";
      export default defineComponent({
      name: "HomeView",
      components: {
      },
      components: {},
      });
      </script>
      0% or .
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment