General improvements #92
|
|
@ -47,7 +47,7 @@ const logoutSupplantedUser = async () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<QLayout view="lHh Lpr lFf">
|
<QLayout view="hhh Lpr fFf">
|
||||||
<QHeader>
|
<QHeader>
|
||||||
<QToolbar>
|
<QToolbar>
|
||||||
<QBtn
|
<QBtn
|
||||||
|
|
@ -57,7 +57,9 @@ const logoutSupplantedUser = async () => {
|
||||||
icon="menu"
|
icon="menu"
|
||||||
aria-label="Menu"
|
aria-label="Menu"
|
||||||
@click="toggleLeftDrawer"
|
@click="toggleLeftDrawer"
|
||||||
|
class="q-mr-md"
|
||||||
/>
|
/>
|
||||||
|
<img class="logo q-mr-lg" src="statics/logo-dark.svg" />
|
||||||
<QToolbarTitle>
|
<QToolbarTitle>
|
||||||
{{ customTitle || menuTitle }}
|
{{ customTitle || menuTitle }}
|
||||||
<div v-if="subtitle" class="subtitle text-caption">
|
<div v-if="subtitle" class="subtitle text-caption">
|
||||||
|
|
@ -77,78 +79,78 @@ const logoutSupplantedUser = async () => {
|
||||||
</QBtn>
|
</QBtn>
|
||||||
</QToolbar>
|
</QToolbar>
|
||||||
</QHeader>
|
</QHeader>
|
||||||
<QDrawer
|
|
||||||
v-model="leftDrawerOpen"
|
|
||||||
:width="250"
|
|
||||||
show-if-above
|
|
||||||
data-testid="layoutMenuDrawer"
|
|
||||||
>
|
|
||||||
<QToolbar class="logo">
|
|
||||||
<img src="statics/logo-dark.svg" />
|
|
||||||
</QToolbar>
|
|
||||||
<div class="user-info">
|
|
||||||
<div>
|
|
||||||
<span id="user-name" data-testid="layoutUserName">
|
|
||||||
{{ mainUser?.nickname }}
|
|
||||||
</span>
|
|
||||||
<QBtn
|
|
||||||
flat
|
|
||||||
icon="logout"
|
|
||||||
alt="_Exit"
|
|
||||||
@click="logout()"
|
|
||||||
data-testid="logoutButton"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-if="supplantedUser"
|
|
||||||
id="supplant"
|
|
||||||
class="supplant"
|
|
||||||
data-testid="layoutSupplantedUserName"
|
|
||||||
>
|
|
||||||
<span id="supplanted">
|
|
||||||
{{ supplantedUser?.nickname }}
|
|
||||||
</span>
|
|
||||||
<QBtn
|
|
||||||
flat
|
|
||||||
icon="logout"
|
|
||||||
alt="_Exit"
|
|
||||||
@click="logoutSupplantedUser()"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<QList v-for="item in filteredMenuItems" :key="item.id">
|
|
||||||
<QItem v-if="!item.childs" :to="`/${item.path}`">
|
|
||||||
<QItemSection>
|
|
||||||
<QItemLabel>{{
|
|
||||||
$t(`menuTitles.${item.description}`)
|
|
||||||
}}</QItemLabel>
|
|
||||||
</QItemSection>
|
|
||||||
</QItem>
|
|
||||||
<QExpansionItem
|
|
||||||
v-if="item.childs"
|
|
||||||
:label="$t(`menuTitles.${item.description}`)"
|
|
||||||
expand-separator
|
|
||||||
>
|
|
||||||
<QList>
|
|
||||||
<QItem
|
|
||||||
v-for="subitem in item.childs"
|
|
||||||
:key="subitem.id"
|
|
||||||
:to="`/${subitem.path}`"
|
|
||||||
class="q-pl-lg"
|
|
||||||
>
|
|
||||||
<QItemSection>
|
|
||||||
<QItemLabel>
|
|
||||||
{{
|
|
||||||
$t(`menuTitles.${subitem.description}`)
|
|
||||||
}}
|
|
||||||
</QItemLabel>
|
|
||||||
</QItemSection>
|
|
||||||
</QItem>
|
|
||||||
</QList>
|
|
||||||
</QExpansionItem>
|
|
||||||
</QList>
|
|
||||||
</QDrawer>
|
|
||||||
<QPageContainer :key="refreshContentKey">
|
<QPageContainer :key="refreshContentKey">
|
||||||
|
<QDrawer
|
||||||
|
v-model="leftDrawerOpen"
|
||||||
|
:width="250"
|
||||||
|
show-if-above
|
||||||
|
data-testid="layoutMenuDrawer"
|
||||||
|
>
|
||||||
|
<div class="user-info">
|
||||||
|
<div>
|
||||||
|
<span id="user-name" data-testid="layoutUserName">
|
||||||
|
{{ mainUser?.nickname }}
|
||||||
|
</span>
|
||||||
|
<QBtn
|
||||||
|
flat
|
||||||
|
icon="logout"
|
||||||
|
alt="_Exit"
|
||||||
|
@click="logout()"
|
||||||
|
data-testid="logoutButton"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-if="supplantedUser"
|
||||||
|
id="supplant"
|
||||||
|
class="supplant"
|
||||||
|
data-testid="layoutSupplantedUserName"
|
||||||
|
>
|
||||||
|
<span id="supplanted">
|
||||||
|
{{ supplantedUser?.nickname }}
|
||||||
|
</span>
|
||||||
|
<QBtn
|
||||||
|
flat
|
||||||
|
icon="logout"
|
||||||
|
alt="_Exit"
|
||||||
|
@click="logoutSupplantedUser()"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<QList v-for="item in filteredMenuItems" :key="item.id">
|
||||||
|
<QItem v-if="!item.childs" :to="`/${item.path}`">
|
||||||
|
<QItemSection>
|
||||||
|
<QItemLabel>{{
|
||||||
|
$t(`menuTitles.${item.description}`)
|
||||||
|
}}</QItemLabel>
|
||||||
|
</QItemSection>
|
||||||
|
</QItem>
|
||||||
|
<QExpansionItem
|
||||||
|
v-if="item.childs"
|
||||||
|
:label="$t(`menuTitles.${item.description}`)"
|
||||||
|
expand-separator
|
||||||
|
>
|
||||||
|
<QList>
|
||||||
|
<QItem
|
||||||
|
v-for="subitem in item.childs"
|
||||||
|
:key="subitem.id"
|
||||||
|
:to="`/${subitem.path}`"
|
||||||
|
class="q-pl-lg"
|
||||||
|
>
|
||||||
|
<QItemSection>
|
||||||
|
<QItemLabel>
|
||||||
|
{{
|
||||||
|
$t(
|
||||||
|
`menuTitles.${subitem.description}`
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</QItemLabel>
|
||||||
|
</QItemSection>
|
||||||
|
</QItem>
|
||||||
|
</QList>
|
||||||
|
</QExpansionItem>
|
||||||
|
</QList>
|
||||||
|
</QDrawer>
|
||||||
<router-view />
|
<router-view />
|
||||||
</QPageContainer>
|
</QPageContainer>
|
||||||
</QLayout>
|
</QLayout>
|
||||||
|
|
@ -158,14 +160,11 @@ const logoutSupplantedUser = async () => {
|
||||||
.q-toolbar {
|
.q-toolbar {
|
||||||
min-height: 64px;
|
min-height: 64px;
|
||||||
}
|
}
|
||||||
.logo {
|
|
||||||
background-color: $primary;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
& > img {
|
.logo {
|
||||||
width: 160px;
|
width: 160px;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-info {
|
.user-info {
|
||||||
margin: 25px;
|
margin: 25px;
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue