LeoVasanko/passkey-auth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Basic navigation between auth and user pages.

Browse Source
This commit is contained in:
Leo Vasanko 2025-08-29 20:50:37 -06:00
parent 90f775734a
commit efdfa77fc9
2 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/admin/AdminApp.vue
View File

@ -171,7 +171,7 @@ onMounted(load)
<template> <template>
<div class="container"> <div class="container">
<h1>Passkey Admin</h1> <h1>Passkey Admin <a href="/auth/" class="back-link" title="Back to User App">User</a></h1>
<p class="subtitle">Manage organizations, roles, and permissions</p> <p class="subtitle">Manage organizations, roles, and permissions</p>
<div v-if="loading">Loading…</div> <div v-if="loading">Loading…</div>
@ -301,4 +301,6 @@ onMounted(load)
.pill-x { background: transparent; border: none; color: #900; cursor: pointer } .pill-x { background: transparent; border: none; color: #900; cursor: pointer }
button { padding: .25rem .5rem; border-radius: 6px; border: 1px solid #ddd; background: #fff; cursor: pointer } button { padding: .25rem .5rem; border-radius: 6px; border: 1px solid #ddd; background: #fff; cursor: pointer }
button:hover { background: #f7f7f7 } button:hover { background: #f7f7f7 }
.back-link { font-size: .5em; margin-left: .75rem; text-decoration: none; background: #eee; padding: .25em .6em; border-radius: 999px; border: 1px solid #ccc; vertical-align: middle; line-height: 1.2; }
.back-link:hover { background: #ddd; }
</style> </style>

23
frontend/src/components/ProfileView.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="container"> <div class="container">
<div class="view active"> <div class="view active">
<h1>👋 Welcome!</h1> <h1>👋 Welcome! <a v-if="isAdmin" href="/auth/admin/" class="admin-link" title="Admin Console">Admin</a></h1>
<div v-if="authStore.userInfo?.user" class="user-info"> <div v-if="authStore.userInfo?.user" class="user-info">
<h3>👤 {{ authStore.userInfo.user.user_name }}</h3> <h3>👤 {{ authStore.userInfo.user.user_name }}</h3>
<span><strong>Visits:</strong></span> <span><strong>Visits:</strong></span>
@ -78,7 +78,7 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, onUnmounted } from 'vue' import { ref, onMounted, onUnmounted, computed } from 'vue'
import { useAuthStore } from '@/stores/auth' import { useAuthStore } from '@/stores/auth'
import { formatDate } from '@/utils/helpers' import { formatDate } from '@/utils/helpers'
import passkey from '@/utils/passkey' import passkey from '@/utils/passkey'
@ -145,6 +145,8 @@ const logout = async () => {
await authStore.logout() await authStore.logout()
authStore.currentView = 'login' authStore.currentView = 'login'
} }
const isAdmin = computed(() => !!(authStore.userInfo?.is_global_admin || authStore.userInfo?.is_org_admin))
</script> </script>
<style scoped> <style scoped>
@ -160,3 +162,20 @@ const logout = async () => {
text-align: left; text-align: left;
} }
</style> </style>
<style scoped>
.admin-link {
font-size: 0.6em;
margin-left: 0.75rem;
text-decoration: none;
background: var(--color-background-soft, #eee);
padding: 0.2em 0.6em;
border-radius: 999px;
border: 1px solid var(--color-border, #ccc);
vertical-align: middle;
line-height: 1.2;
}
.admin-link:hover {
background: var(--color-background-mute, #ddd);
}
</style>