Legal info

KTUSA PS/ClientApp/src/pages/Home.vue

@@ -1,12 +1,97 @@
 <template>
-  <h1>Hello there</h1>
-  <!-- {{ $store.state.auth.tokenData }} -->
-  {{ $store.getters["auth/isValid"] }}
-  <br />
-  Your name is: {{ $store.getters["auth/name"] }}<br />
-  Your email is: {{ $store.getters["auth/email"] }}<br />
+  <div class="container">
+    <h1>KTU SA Problemų sprendimo sistema</h1>
+    
+    <template v-if="$store.getters['auth/isValid']">
+      <div class="alert alert-success">
+        <h4 class="alert-heading">Tu esi prisijungęs</h4>
+        <p>Kliento aplikacija turi tavo saugos raktą. aplikacija žino, kad tavo el. paštas yra: <b>{{ $store.getters["auth/email"] }}</b></p>
+      </div>
+      <h2>Visi laukai gaunami iš Azure Active Directory</h2>
+      <table class="table">
+        <thead>
+          <tr>
+            <th scope="col">Pavadinimas</th>
+            <th scope="col">Reikšmė</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(value, key) in authDataTable" :key="key">
+            <td>{{ key }}</td>
+            <td>{{ value }}</td>
+          </tr>
+        </tbody>
+      </table>
+      <h3>Techninė duomenų reprezentacija</h3>
+      <a href="https://docs.microsoft.com/en-us/azure/active-directory/develop/access-tokens">Dokumentacija apie laukų reikšmes</a>
+      <pre>{{ $store.state.auth.tokenData }}</pre>
+      <h3>Saugos raktas.</h3>
+      <pre>{{ $store.state.auth.token }}</pre>
+      <h3>Serverio tokeno patikrinimas</h3>
+      <button type="button" class="btn btn-primary" @click="serverVerify">Patikrinti</button>
+      <h5>Verifikacijos atsakas:</h5>
+      <pre>
+        {{ verificationResult }}
+      </pre>
+    </template>
+    <div v-else class="alert alert-danger" role="alert">
+      <h4 class="alert-heading">Tu neprisijungęs</h4>
+      <p>Prašom paspausti prisijungimo mygtuką navigacijos juostoje.</p>
+    </div>      
+  </div>
+  
+  
 </template>
 
 <script>
-export default {};
+import axios from "axios";
+
+const names = {
+  "aud": "AppId (Audience)",
+  "iss": "Išdavėjas",
+  "iat": "Išdavimo momentas",
+  "nbf": "Negalioja anksčiau nei",
+  "exp": "Galiojimo pabaiga",
+  "email": "El. paštas",
+  "nonce": "Aplikacijos sugeneruota nepasikartojanti reikšmė",
+  "sub": "Subjektas (Vartotojo Id)",
+  "tid": "Tenanto Identifikatorius",
+  "ver": "OAuth versija"
+}
+
+function lookupName(key) {
+  if(names[key])
+    return names[key];
+  return key;
+}
+
+export default {
+  
+  data() {
+    return {
+      verificationResult: null
+    }
+  },
+  computed: {
+    authDataTable() {
+      return Object.fromEntries(Object.entries(this.$store.state.auth.tokenData).map(([key, value]) => [lookupName(key), value]))
+    }
+  },
+  methods: {
+    serverVerify() {
+      this.verificationResult = null
+      axios
+        .get("/test/authed", {
+          headers: { Authorization: `Bearer ${this.$store.state.auth.token}` },
+        })
+        .then((response) => {
+          this.verificationResult = response.data;
+        })
+        .catch(function (error) {
+          alert(error);
+        });
+
+    }
+  }
+};
 </script>