fix: create component StorageFileBrowser
This commit is contained in:
@@ -23,8 +23,8 @@
|
||||
<template #footer>
|
||||
<UDropdownMenu :items="userItems" :content="{ align: 'center', collisionPadding: 12 }"
|
||||
:ui="{ content: 'w-(--reka-dropdown-menu-trigger-width) min-w-48' }">
|
||||
<UButton v-bind="userStore.user" :label="userStore.user?.email" trailing-icon="i-lucide-chevrons-up-down" color="neutral"
|
||||
variant="ghost" square class="w-full data-[state=open]:bg-elevated overflow-hidden" :ui="{
|
||||
<UButton v-bind="userStore.user" :label="userStore.user?.email" trailing-icon="i-lucide-chevrons-up-down"
|
||||
color="neutral" variant="ghost" square class="w-full data-[state=open]:bg-elevated overflow-hidden" :ui="{
|
||||
trailingIcon: 'text-dimmed ms-auto'
|
||||
}" />
|
||||
</UDropdownMenu>
|
||||
@@ -34,8 +34,12 @@
|
||||
|
||||
<div class="flex-1 flex flex-col">
|
||||
<div class="flex h-(--ui-header-height) shrink-0 items-center justify-between px-4 border-b border-default">
|
||||
<UButton icon="i-lucide-panel-left" color="neutral" variant="ghost" aria-label="Toggle sidebar"
|
||||
@click="open = !open" />
|
||||
<div class="flex items-center gap-2">
|
||||
<UButton icon="i-lucide-panel-left" color="neutral" variant="ghost" aria-label="Toggle sidebar"
|
||||
@click="open = !open" />
|
||||
<span class="text-[20px] font-medium">{{ pageTitle }}</span>
|
||||
</div>
|
||||
|
||||
<div class="hidden md:flex items-center gap-12">
|
||||
<div class="flex items-center gap-2">
|
||||
<CountryCurrencySwitch />
|
||||
@@ -44,8 +48,9 @@
|
||||
<div class="flex items-center gap-2">
|
||||
<ThemeSwitch />
|
||||
<button v-if="authStore.isAuthenticated" @click="authStore.logout()"
|
||||
class="px-3 py-1.5 text-sm font-medium text-black dark:text-white hover:text-black dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600 rounded-lg transition-colors border border-(--border-light) dark:border-(--border-dark) whitespace-nowrap">
|
||||
class="flex gap-2 items-center px-3 py-1.5 text-sm font-medium text-black dark:text-white hover:text-black dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600 rounded-lg transition-colors border border-(--border-light) dark:border-(--border-dark) whitespace-nowrap">
|
||||
{{ $t('general.logout') }}
|
||||
<UIcon name="ic:baseline-logout" class="text-red-700 dark:text-red-500"/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -68,6 +73,8 @@ import { useAuthStore } from '../stores/customer/auth'
|
||||
const authStore = useAuthStore()
|
||||
const userStore = useUserStore()
|
||||
|
||||
const route = useRoute()
|
||||
const pageTitle = computed(() => route.meta.name ?? 'Default Page')
|
||||
await userStore.getUser()
|
||||
|
||||
const open = ref(true)
|
||||
@@ -157,7 +164,7 @@ function getItems(state: 'collapsed' | 'expanded') {
|
||||
}
|
||||
|
||||
//
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { currentLang } from '@/router/langs'
|
||||
import { useFetchJson } from '@/composable/useFetchJson'
|
||||
import CountryCurrencySwitch from '@/components/inner/CountryCurrencySwitch.vue'
|
||||
@@ -174,7 +181,7 @@ const menu = ref<TopMenuItem[] | null>(null)
|
||||
async function getTopMenu() {
|
||||
try {
|
||||
const { items } = await useFetchJson<TopMenuItem[]>('/api/v1/restricted/menu/get-top-menu')
|
||||
|
||||
|
||||
menu.value = items
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
|
||||
Reference in New Issue
Block a user