verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 77 Releases Wiki Activity

WIP: #8891 enhance LeftMenu with expandable item groups and improved pinning functionality #1693

Draft
jsegarra wants to merge 1 commits from 8891-leftMenu_expansion into dev
pull from: 8891-leftMenu_expansion
merge into: verdnatura:dev
Conversation 0 Commits 1 Files Changed 1 +72 -26
1 changed files with 72 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/components/LeftMenu.vue
View File

@ -225,12 +225,59 @@ const searchModule = () => {
(item.children && !filteredPinnedModules.has(item.name)) (item.children && !filteredPinnedModules.has(item.name))
" "
> >
<QList v-if="item.children.length > 1">
<QExpansionItem
v-ripple
clickable
:content-inset-level="0.5"
@after-show="handleItemExpansion(item.name)"
>
<template #header>
<QItemSection avatar>
<QIcon :name="item.icon" />
</QItemSection>
<QItemSection>
<QItemLabel>{{ t(item.title) }}</QItemLabel>
</QItemSection>
<QBtn
v-if="item.isPinned === true"
@click="togglePinned(item, $event)"
icon="remove_circle"
size="xs"
flat
round
>
<QTooltip>
{{
t('components.leftMenu.removeFromPinned')
}}
</QTooltip>
</QBtn>
<QBtn
v-if="item.isPinned === false"
@click="togglePinned(item, $event)"
icon="push_pin"
size="xs"
flat
round
>
<QTooltip>
{{ t('components.leftMenu.addToPinned') }}
</QTooltip>
</QBtn>
</template>
<LeftMenuItemGroup
:ref="(el) => (expansionItemElements[item.name] = el)"
:item="item"
/>
</QExpansionItem>
</QList>
<LeftMenuItem <LeftMenuItem
v-else
:item="item" :item="item"
group="modules" group="modules"
:class="search && index === 0 ? 'searched' : ''" :class="search && index === 0 ? 'searched' : ''"
> >
<template #side>
<QBtn <QBtn
v-if="item.isPinned === true" v-if="item.isPinned === true"
@click="togglePinned(item, $event)" @click="togglePinned(item, $event)"
@ -255,7 +302,6 @@ const searchModule = () => {
{{ t('components.leftMenu.addToPinned') }} {{ t('components.leftMenu.addToPinned') }}
</QTooltip> </QTooltip>
</QBtn> </QBtn>
</template>
</LeftMenuItem> </LeftMenuItem>
</template> </template>
</template> </template>