summaryrefslogtreecommitdiff
path: root/app
diff options
context:
space:
mode:
authorSanto Cariotti <santo@dcariotti.me>2022-11-14 08:50:38 +0100
committerSanto Cariotti <santo@dcariotti.me>2022-11-14 08:50:38 +0100
commit8731f47b99af3e6890eaab68400464bebd03db03 (patch)
tree57cf7f3b80ea999e3551cafcc049ec827f5c8481 /app
parent5e89ad0836ca38b132d1748603be7d8593b9bcb2 (diff)
User info page
Diffstat (limited to 'app')
-rw-r--r--app/src/router/index.ts6
-rw-r--r--app/src/store/modules/auth.ts42
-rw-r--r--app/src/views/UserInfo.vue45
3 files changed, 91 insertions, 2 deletions
diff --git a/app/src/router/index.ts b/app/src/router/index.ts
index a3dd783..3aebf85 100644
--- a/app/src/router/index.ts
+++ b/app/src/router/index.ts
@@ -2,6 +2,7 @@ import { createRouter, createWebHistory } from "@ionic/vue-router";
import { RouteRecordRaw } from "vue-router";
import HomePage from "../views/HomePage.vue";
import Sign from "../views/Sign.vue";
+import UserInfo from "../views/UserInfo.vue";
const routes: Array<RouteRecordRaw> = [
{ path: "/", redirect: "/home" },
@@ -15,6 +16,11 @@ const routes: Array<RouteRecordRaw> = [
component: Sign,
name: "Sign",
},
+ {
+ path: "/me",
+ component: UserInfo,
+ name: "UserInfo",
+ },
];
const router = createRouter({
diff --git a/app/src/store/modules/auth.ts b/app/src/store/modules/auth.ts
index b511bff..b3e72de 100644
--- a/app/src/store/modules/auth.ts
+++ b/app/src/store/modules/auth.ts
@@ -48,8 +48,6 @@ const auth = {
const res = { status: -1, data: null };
- console.log(credentials);
-
await fetch(`${api}/auth/login`, {
method: "POST",
headers: { "Content-Type": "application/json" },
@@ -71,6 +69,46 @@ const auth = {
return res;
},
+ // Get my information, based on the passed Authorization token
+ async getMe(context: AuthContext) {
+ const api = context.rootState.api;
+
+ await fetch(`${api}/users/me`, {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Authorization: "Bearer " + context.getters.accessToken,
+ },
+ })
+ .then(async (response) => {
+ const data = await response.json();
+ if (response.status != 200) {
+ context.dispatch(
+ "toast",
+ {
+ header: data.error,
+ text: "",
+ color: "danger",
+ },
+ { root: true }
+ );
+ context.commit("deleteAccessToken");
+ } else {
+ context.commit("saveUserInfo", data);
+ }
+ })
+ .catch((e) => {
+ context.dispatch(
+ "toast",
+ {
+ header: e,
+ text: "",
+ color: "danger",
+ },
+ { root: true }
+ );
+ });
+ },
logout(context: AuthContext) {
context.commit("deleteAccessToken");
},
diff --git a/app/src/views/UserInfo.vue b/app/src/views/UserInfo.vue
new file mode 100644
index 0000000..f317cbd
--- /dev/null
+++ b/app/src/views/UserInfo.vue
@@ -0,0 +1,45 @@
+<template>
+ <ion-page>
+ <m6-header />
+ <ion-content :fullscreen="true">
+ <div>
+ <p>ID: {{ me.id }}</p>
+ <p>Name: {{ me.name }}</p>
+ <p>Email: {{ me.email }}</p>
+ <p>Is staff: {{ me.is_staff }}</p>
+ </div>
+ </ion-content>
+
+ <m6-footer />
+ </ion-page>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+import { IonPage, IonContent } from "@ionic/vue";
+import Header from "@/components/Header.vue";
+import Footer from "@/components/Footer.vue";
+
+import { mapGetters, mapActions } from "vuex";
+
+export default defineComponent({
+ name: "UserInfo",
+ components: {
+ IonContent,
+ IonPage,
+ "m6-header": Header,
+ "m6-footer": Footer,
+ },
+ computed: {
+ ...mapGetters("auth", ["isLogged", "me"]),
+ },
+ created() {
+ if (!this.isLogged) window.location.href = "/sign";
+
+ this.getMe();
+ },
+ methods: {
+ ...mapActions("auth", ["getMe"]),
+ },
+});
+</script>