Rename and fixes

KTUSAPS/ClientApp/src/pages/Home.vue

@@ -0,0 +1,107 @@
+<template>
+  <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>
+        <span>
+          Kliento aplikacija turi tavo saugos raktą. Aplikacija žino, kad tavo
+          el. paštas yra: <b>{{ $store.getters['auth/email'] }}</b>
+        </span>
+      </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>
+              <pre>{{ value }}</pre>
+            </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>
+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>