91 lines
1.8 KiB
Vue
91 lines
1.8 KiB
Vue
<script setup>
|
|
definePageMeta({
|
|
middleware: "auth"
|
|
})
|
|
const dataStore = useDataStore()
|
|
const supabase = useSupabaseClient()
|
|
const router = useRouter()
|
|
|
|
const items = [{
|
|
label: 'Profil',
|
|
},{
|
|
label: 'Projekte',
|
|
content: 'This is the content shown for Tab1'
|
|
}, {
|
|
label: 'E-Mail',
|
|
content: 'And, this is the content for Tab2'
|
|
}, {
|
|
label: 'Dokumente'
|
|
}]
|
|
|
|
const colorMode = useColorMode()
|
|
const isLight = computed({
|
|
get() {
|
|
return colorMode.value !== 'dark'
|
|
},
|
|
set() {
|
|
colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'
|
|
}
|
|
})
|
|
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<UDashboardNavbar title="Einstellungen">
|
|
|
|
</UDashboardNavbar>
|
|
<UTabs
|
|
:items="items"
|
|
class="h-100 p-5"
|
|
>
|
|
<template #item="{item}">
|
|
<UCard class="mt-5">
|
|
<div v-if="item.label === 'Profil'">
|
|
|
|
<UDivider
|
|
class="my-3"
|
|
label="Profil"
|
|
/>
|
|
|
|
<InputGroup>
|
|
<UButton
|
|
:icon="!isLight ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
|
|
color="white"
|
|
variant="outline"
|
|
aria-label="Theme"
|
|
@click="isLight = !isLight"
|
|
/>
|
|
</InputGroup>
|
|
|
|
</div>
|
|
<div v-else-if="item.label === 'Projekte'">
|
|
<UDivider
|
|
label="Phasenvorlagen"
|
|
/>
|
|
</div>
|
|
<div v-else-if="item.label === 'Dokumente'">
|
|
<UDivider
|
|
label="Tags"
|
|
class="mb-3"
|
|
/>
|
|
<InputGroup>
|
|
<UBadge
|
|
v-for="tag in dataStore.ownTenant.tags.documents"
|
|
>
|
|
{{tag}}
|
|
</UBadge>
|
|
</InputGroup>
|
|
|
|
|
|
{{dataStore.ownTenant.tags}}
|
|
</div>
|
|
</UCard>
|
|
|
|
</template>
|
|
</UTabs>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |