Added Phases to Projects
This commit is contained in:
@@ -6,13 +6,15 @@ const colorMode = useColorMode()
|
||||
const userProfile = dataStore.getOwnProfile
|
||||
const supabase = useSupabaseClient()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
dataStore.initializeData((await supabase.auth.getUser()).data.user.id)
|
||||
|
||||
const isLight = computed({
|
||||
get () {
|
||||
get() {
|
||||
return colorMode.value !== 'dark'
|
||||
},
|
||||
set () {
|
||||
set() {
|
||||
colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'
|
||||
}
|
||||
})
|
||||
@@ -52,12 +54,12 @@ const navLinks = [
|
||||
label: "Belege",
|
||||
to: "/receipts",
|
||||
icon: "i-heroicons-document-text"
|
||||
},/*
|
||||
},
|
||||
{
|
||||
label: "Bank",
|
||||
to: "/banking",
|
||||
icon: "i-heroicons-currency-euro"
|
||||
},*/
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
@@ -105,6 +107,11 @@ const navLinks = [
|
||||
to: "/documents",
|
||||
icon: "i-heroicons-document"
|
||||
},
|
||||
{
|
||||
label: "E-Mail",
|
||||
to: "/email",
|
||||
icon: "i-heroicons-envelope"
|
||||
},
|
||||
]
|
||||
},/*
|
||||
{
|
||||
@@ -122,7 +129,7 @@ const navLinks = [
|
||||
icon: "i-heroicons-clock"
|
||||
},
|
||||
{
|
||||
label: "Stechuhr",
|
||||
label: "Anwesenheiten",
|
||||
to: "/workingtimes",
|
||||
icon: "i-heroicons-clock"
|
||||
},
|
||||
@@ -156,6 +163,10 @@ const navLinks = [
|
||||
label: "Fahrzeuge",
|
||||
to: "/vehicles",
|
||||
icon: "i-heroicons-truck"
|
||||
}, {
|
||||
label: "Inventar",
|
||||
to: "/inventoryitems",
|
||||
icon: "i-heroicons-puzzle-piece"
|
||||
},
|
||||
]
|
||||
},
|
||||
@@ -173,6 +184,11 @@ const userMenuItems = ref([
|
||||
icon: "i-heroicons-cog-8-tooth",
|
||||
to: "/settings/numberRanges"
|
||||
},
|
||||
{
|
||||
label: "Einstellungen",
|
||||
icon: "i-heroicons-cog-8-tooth",
|
||||
to: "/settings"
|
||||
},
|
||||
{
|
||||
label: 'Benutzer',
|
||||
icon: 'i-heroicons-user-group',
|
||||
@@ -180,127 +196,255 @@ const userMenuItems = ref([
|
||||
}
|
||||
])
|
||||
|
||||
const links = [[{
|
||||
label: 'Profil',
|
||||
avatar: {
|
||||
alt: userProfile ? userProfile.fullName : "XY"
|
||||
}
|
||||
},{
|
||||
label: "Dashboard",
|
||||
to: "/",
|
||||
icon: "i-heroicons-home"
|
||||
}], [{
|
||||
label: "Aufgaben",
|
||||
to: "/tasks",
|
||||
icon: "i-heroicons-rectangle-stack"
|
||||
},
|
||||
{
|
||||
label: "Plantafel",
|
||||
to: "/calendar/timeline",
|
||||
icon: "i-heroicons-calendar-days"
|
||||
},
|
||||
{
|
||||
label: "Kalender",
|
||||
to: "/calendar/grid",
|
||||
icon: "i-heroicons-calendar-days"
|
||||
},
|
||||
{
|
||||
label: "Dokumente",
|
||||
to: "/documents",
|
||||
icon: "i-heroicons-document"
|
||||
},
|
||||
{
|
||||
label: "E-Mail",
|
||||
to: "/email",
|
||||
icon: "i-heroicons-envelope"
|
||||
}],[{
|
||||
label: "Kunden",
|
||||
to: "/customers",
|
||||
icon: "i-heroicons-user-group"
|
||||
},
|
||||
{
|
||||
label: "Lieferanten",
|
||||
to: "/vendors",
|
||||
icon: "i-heroicons-truck"
|
||||
},
|
||||
{
|
||||
label: "Ansprechpartner",
|
||||
to: "/contacts",
|
||||
icon: "i-heroicons-user-group"
|
||||
}], [{
|
||||
label: "Belege",
|
||||
to: "/receipts",
|
||||
icon: "i-heroicons-document-text"
|
||||
},
|
||||
{
|
||||
label: "Bank",
|
||||
to: "/banking",
|
||||
icon: "i-heroicons-currency-euro"
|
||||
}], [{
|
||||
label: "Projekte",
|
||||
to: "/projects",
|
||||
icon: "i-heroicons-clipboard-document-check"
|
||||
},
|
||||
{
|
||||
label: "Verträge",
|
||||
to: "/contracts",
|
||||
icon: "i-heroicons-clipboard-document"
|
||||
},
|
||||
{
|
||||
label: "Objekte",
|
||||
to: "/plants",
|
||||
icon: "i-heroicons-clipboard-document"
|
||||
}],[{
|
||||
label: "Zeiterfassung",
|
||||
to: "/employees/timetracking",
|
||||
icon: "i-heroicons-clock"
|
||||
},
|
||||
{
|
||||
label: "Anwesenheiten",
|
||||
to: "/workingtimes",
|
||||
icon: "i-heroicons-clock"
|
||||
},
|
||||
{
|
||||
label: "Abwesenheiten",
|
||||
to: "/absenceRequests",
|
||||
icon: "i-heroicons-document-text"
|
||||
}],[{
|
||||
label: "Steuerung",
|
||||
to: "/inventory",
|
||||
icon: "i-heroicons-square-3-stack-3d"
|
||||
},
|
||||
{
|
||||
label: "Artikelstamm",
|
||||
to: "/products",
|
||||
icon: "i-heroicons-puzzle-piece"
|
||||
},
|
||||
{
|
||||
label: "Lagerplätze",
|
||||
to: "/spaces",
|
||||
icon: "i-heroicons-square-3-stack-3d"
|
||||
},
|
||||
{
|
||||
label: "Fahrzeuge",
|
||||
to: "/vehicles",
|
||||
icon: "i-heroicons-truck"
|
||||
}, {
|
||||
label: "Inventar",
|
||||
to: "/inventoryitems",
|
||||
icon: "i-heroicons-puzzle-piece"
|
||||
},]
|
||||
]
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="dataStore.loaded">
|
||||
<UHeader :links="navLinks" :to="null">
|
||||
<template #logo>
|
||||
<div id="logo">
|
||||
<img
|
||||
:src="!isLight ? '/spaces.svg' : '/spaces_hell.svg'"
|
||||
alt="Logo"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="dataStore.loaded" class="flex justify-center flex-row">
|
||||
<!-- <UHeader :links="navLinks" :to="null">
|
||||
<template #logo>
|
||||
<div id="logo">
|
||||
<img
|
||||
:src="!isLight ? '/spaces.svg' : '/spaces_hell.svg'"
|
||||
alt="Logo"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<template #panel>
|
||||
<UNavigationTree :links="navLinks"/>
|
||||
</template>
|
||||
<template #panel>
|
||||
<UNavigationTree :links="navLinks"/>
|
||||
</template>
|
||||
|
||||
<template #right>
|
||||
<template #right>
|
||||
|
||||
<GlobalSearch/>
|
||||
<GlobalSearch/>
|
||||
|
||||
<UButton
|
||||
@click="showUserMenu = true"
|
||||
variant="ghost"
|
||||
color="gray"
|
||||
>
|
||||
<UAvatar
|
||||
:alt="userProfile ? userProfile.firstName + ' ' + userProfile.lastName : '' "
|
||||
icon="i-heroicons-user-20-solid"
|
||||
:chip-color="dataStore.notifications.filter(item => !item.read).length > 0 ? 'primary' : null"
|
||||
<UButton
|
||||
@click="showUserMenu = true"
|
||||
variant="ghost"
|
||||
color="gray"
|
||||
>
|
||||
<UAvatar
|
||||
:alt="userProfile ? userProfile.firstName + ' ' + userProfile.lastName : '' "
|
||||
icon="i-heroicons-user-20-solid"
|
||||
:chip-color="dataStore.notifications.filter(item => !item.read).length > 0 ? 'primary' : null"
|
||||
|
||||
/>
|
||||
</UButton>
|
||||
/>
|
||||
</UButton>
|
||||
|
||||
<USlideover
|
||||
v-model="showUserMenu"
|
||||
>
|
||||
<UCard
|
||||
class="h-full"
|
||||
>
|
||||
<USlideover
|
||||
v-model="showUserMenu"
|
||||
>
|
||||
<UCard
|
||||
class="h-full"
|
||||
>
|
||||
|
||||
<UDivider
|
||||
class="my-3"
|
||||
label="Tenant"
|
||||
/>
|
||||
<div v-if="dataStore.getOwnProfile.tenants.length > 1">
|
||||
<UDivider
|
||||
class="my-3"
|
||||
label="Tenant"
|
||||
/>
|
||||
|
||||
<USelectMenu
|
||||
:options="dataStore.getOwnProfile.tenants"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="dataStore.currentTenant"
|
||||
@change="dataStore.changeTenant()"
|
||||
/>
|
||||
|
||||
<UDivider
|
||||
class="my-3"
|
||||
label="Menü"
|
||||
/>
|
||||
|
||||
<UVerticalNavigation
|
||||
:links="userMenuItems"
|
||||
/>
|
||||
|
||||
<!-- <UDivider
|
||||
class="my-3"
|
||||
label="Benachrichtigungen"
|
||||
/>
|
||||
|
||||
<UAlert
|
||||
class="mb-3"
|
||||
v-for="(notification) in dataStore.notifications"
|
||||
:color="!notification.read ? 'primary' : 'white'"
|
||||
:variant="!notification.read ? 'outline' : 'soft'"
|
||||
:description="notification.text"
|
||||
:title="notification.title"
|
||||
:close-button="!notification.read ? { icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false } : null"
|
||||
@close="async () => {
|
||||
const {error} = await supabase.from('notifications').update({read:true}).eq('id', notification.id)
|
||||
if(error) console.log(error)
|
||||
dataStore.fetchNotifications()
|
||||
}"
|
||||
/>-->
|
||||
<USelectMenu
|
||||
:options="dataStore.getOwnProfile.tenants"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="dataStore.currentTenant"
|
||||
@change="dataStore.changeTenant()"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<template #footer>
|
||||
<InputGroup>
|
||||
<UButton
|
||||
:icon="!isLight ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
|
||||
color="white"
|
||||
variant="outline"
|
||||
aria-label="Theme"
|
||||
@click="isLight = !isLight"
|
||||
<UDivider
|
||||
class="my-3"
|
||||
label="Menü"
|
||||
/>
|
||||
<UButton
|
||||
color="rose"
|
||||
variant="outline"
|
||||
@click="async () => {
|
||||
showUserMenu = false
|
||||
await supabase.auth.signOut()
|
||||
await dataStore.clearStore()
|
||||
await router.push('/login')
|
||||
|
||||
}"
|
||||
>
|
||||
Ausloggen
|
||||
</UButton>
|
||||
</InputGroup>
|
||||
<UVerticalNavigation
|
||||
:links="userMenuItems"
|
||||
/>
|
||||
|
||||
</template>
|
||||
<!– <UDivider
|
||||
class="my-3"
|
||||
label="Benachrichtigungen"
|
||||
/>
|
||||
|
||||
</UCard>
|
||||
</USlideover>
|
||||
<UAlert
|
||||
class="mb-3"
|
||||
v-for="(notification) in dataStore.notifications"
|
||||
:color="!notification.read ? 'primary' : 'white'"
|
||||
:variant="!notification.read ? 'outline' : 'soft'"
|
||||
:description="notification.text"
|
||||
:title="notification.title"
|
||||
:close-button="!notification.read ? { icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false } : null"
|
||||
@close="async () => {
|
||||
const {error} = await supabase.from('notifications').update({read:true}).eq('id', notification.id)
|
||||
if(error) console.log(error)
|
||||
dataStore.fetchNotifications()
|
||||
}"
|
||||
/>–>
|
||||
|
||||
|
||||
|
||||
<template #footer>
|
||||
<InputGroup>
|
||||
<UButton
|
||||
:icon="!isLight ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
|
||||
color="white"
|
||||
variant="outline"
|
||||
aria-label="Theme"
|
||||
@click="isLight = !isLight"
|
||||
/>
|
||||
<UButton
|
||||
color="rose"
|
||||
variant="outline"
|
||||
@click="async () => {
|
||||
showUserMenu = false
|
||||
await supabase.auth.signOut()
|
||||
await dataStore.clearStore()
|
||||
await router.push('/login')
|
||||
|
||||
}"
|
||||
>
|
||||
Ausloggen
|
||||
</UButton>
|
||||
</InputGroup>
|
||||
|
||||
</template>
|
||||
|
||||
</UCard>
|
||||
</USlideover>
|
||||
|
||||
</template>
|
||||
</UHeader>
|
||||
<UDivider />-->
|
||||
<div class="ml-2 mt-3" id="menuLeft">
|
||||
|
||||
<UVerticalNavigation
|
||||
:links="links"
|
||||
>
|
||||
<template #avatar="{link}">
|
||||
<UAvatar
|
||||
v-if="link.avatar"
|
||||
v-bind="link.avatar"
|
||||
|
||||
/>
|
||||
</template>
|
||||
</UVerticalNavigation>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</UHeader>
|
||||
<UDivider />
|
||||
<div class="m-3" id="contentContainer">
|
||||
<slot/>
|
||||
<slot id="content"/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
@@ -317,5 +461,28 @@ const userMenuItems = ref([
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
#menuLeft {
|
||||
height: 95vh;
|
||||
width: 20vw;
|
||||
overflow-y: scroll;
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
#menuLeft::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#contentContainer {
|
||||
width: 77vw;
|
||||
height: 95vh;
|
||||
}
|
||||
/* -ms-overflow-style: none; !* IE and Edge *!
|
||||
scrollbar-width: none; !* Firefox *!
|
||||
}
|
||||
|
||||
#contentContainer::-webkit-scrollbar {
|
||||
display: none;
|
||||
}*/
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user