mirror of
https://github.com/ZHANGTIANYAO1/teamspeak-music-bot.git
synced 2026-10-01 20:42:50 +08:00
feat(web): show current user + logout button in nav
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
1 parent
e2e888710a
commit
e148c1556e
1 file changed
+27
@@ -88,6 +88,13 @@
|
||||
<RouterLink to="/settings" class="settings-btn">
|
||||
<Icon icon="mdi:cog" />
|
||||
</RouterLink>
|
||||
|
||||
<div v-if="session.currentUser.value" class="nav-user">
|
||||
<span class="nav-user-name">{{ session.currentUser.value.username }}</span>
|
||||
<button class="nav-user-logout" @click="onLogout" title="退出">
|
||||
<Icon icon="mdi:logout" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -114,10 +121,19 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, onMounted, onUnmounted, nextTick, reactive } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { Icon } from '@iconify/vue';
|
||||
import { usePlayerStore } from '../stores/player.js';
|
||||
import { useSession } from '../composables/useSession.js';
|
||||
|
||||
const store = usePlayerStore();
|
||||
const session = useSession();
|
||||
const navRouter = useRouter();
|
||||
|
||||
async function onLogout() {
|
||||
await session.logout();
|
||||
navRouter.replace({ name: 'login' });
|
||||
}
|
||||
const activeBot = computed(() => store.activeBot);
|
||||
const dropdownOpen = ref(false);
|
||||
const selectorRef = ref<HTMLElement | null>(null);
|
||||
@@ -643,4 +659,15 @@ onUnmounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-user {
|
||||
display: flex; align-items: center; gap: 8px; margin-left: 12px;
|
||||
color: var(--text-secondary); font-size: 13px;
|
||||
}
|
||||
.nav-user-logout {
|
||||
height: 28px; width: 28px; display: grid; place-items: center;
|
||||
border: 0; background: transparent; color: var(--text-secondary); cursor: pointer;
|
||||
border-radius: var(--radius-sm);
|
||||
&:hover { background: var(--bg-secondary); color: var(--text-primary); }
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user