- Statistiche
- Menu e Sottomenu - Lista ultimi Movimenti
This commit is contained in:
356
src/layouts/menuone/menuOne copy.vue
Executable file
356
src/layouts/menuone/menuOne copy.vue
Executable file
@@ -0,0 +1,356 @@
|
||||
<template>
|
||||
<div v-if="finishLoading" class="no-border">
|
||||
<q-list class="rounded-borders text-primary">
|
||||
<div v-for="ind1 in getmenu" :key="ind1">
|
||||
<!--<div class="q-list-header">{{replaceUnderlineToSpace(index)}}</div>-->
|
||||
<div v-for="(myitemmenu, ind2) in myroutes" :key="ind2">
|
||||
<div v-if="myitemmenu.active">
|
||||
<div
|
||||
v-if="
|
||||
myitemmenu.routes2 &&
|
||||
myitemmenu.inmenu &&
|
||||
tools.visumenu(myitemmenu)
|
||||
"
|
||||
>
|
||||
<span v-if="myitemmenu.isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-expansion-item
|
||||
:content-inset-level="myitemmenu.level_parent"
|
||||
:header-class="getmymenuclass(myitemmenu)"
|
||||
:header-inset-level="myitemmenu.level_parent"
|
||||
:icon="myitemmenu.materialIcon"
|
||||
:label="tools.getLabelByItem(myitemmenu)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
<div
|
||||
v-for="(child2, index) in myitemmenu.routes2"
|
||||
:key="index"
|
||||
>
|
||||
<div v-if="child2.active && tools.visumenu(child2)">
|
||||
<span v-if="child2.isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-expansion-item
|
||||
v-if="!child2.routes2"
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:header-inset-level="child2.level_child"
|
||||
:icon="child2.materialIcon"
|
||||
:label="tools.getLabelByItem(child2)"
|
||||
:to="getroute(child2)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon="none"
|
||||
expand-icon-class="my-menu-icon-none"
|
||||
>
|
||||
<q-item-section avatar>
|
||||
<q-avatar v-if="child2.img">
|
||||
<div
|
||||
:class="getimgiconclass(child2)"
|
||||
:icon="`img:` + child2.img"
|
||||
style="font-size: 2rem"
|
||||
></div>
|
||||
</q-avatar>
|
||||
<div v-else>
|
||||
<q-avatar
|
||||
:icon="child2.materialIcon"
|
||||
:size="child2.iconsize"
|
||||
class="clicon"
|
||||
color="primary"
|
||||
text-color="white"
|
||||
>
|
||||
</q-avatar>
|
||||
</div>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
{{ tools.getLabelByItem(child2) }}
|
||||
</q-item-section>
|
||||
</q-expansion-item>
|
||||
<q-expansion-item
|
||||
v-else
|
||||
:content-inset-level="child2.level_parent"
|
||||
:header-class="getmymenuclass(child2)"
|
||||
:header-inset-level="child2.level_parent"
|
||||
:icon="child2.materialIcon"
|
||||
:label="tools.getLabelByItem(child2)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
<div
|
||||
v-for="(child3, index) in child2.routes2"
|
||||
:key="index"
|
||||
>
|
||||
<div v-if="child3.active">
|
||||
<q-expansion-item
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:header-inset-level="child3.level_child"
|
||||
:icon="child3.materialIcon"
|
||||
:label="tools.getLabelByItem(child3)"
|
||||
:to="getroute(child3)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-icon-none"
|
||||
>
|
||||
<div
|
||||
v-for="(child4, index) in child3.routes2"
|
||||
:key="index"
|
||||
>
|
||||
<q-expansion-item
|
||||
v-if="!!child3.routes2 && child3.active"
|
||||
:key="index"
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:expand-icon="child4.icon"
|
||||
:header-inset-level="child4.level_child"
|
||||
:icon="child4.materialIcon"
|
||||
:label="tools.getLabelByItem(child4)"
|
||||
:to="getroute(child4)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
v-else-if="
|
||||
myitemmenu.mainMenu &&
|
||||
myitemmenu.inmenu &&
|
||||
tools.visumenu(myitemmenu)
|
||||
"
|
||||
>
|
||||
<span v-if="myitemmenu.isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-expansion-item
|
||||
:content-inset-level="myitemmenu.level_parent + 1"
|
||||
:header-class="getmymenuclass(myitemmenu)"
|
||||
:header-inset-level="myitemmenu.level_parent + 1"
|
||||
:icon="myitemmenu.materialIcon"
|
||||
:label="tools.getLabelByItem(myitemmenu)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
<div
|
||||
v-for="(child2, index) in myitemmenu.sottoMenu"
|
||||
:key="index"
|
||||
>
|
||||
<div
|
||||
v-if="
|
||||
getmenuByPath(child2).active &&
|
||||
tools.visumenu(getmenuByPath(child2))
|
||||
"
|
||||
>
|
||||
<span v-if="getmenuByPath(child2).isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-expansion-item
|
||||
v-if="true"
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:header-inset-level="
|
||||
getmenuByPath(child2).level_child + 3
|
||||
"
|
||||
:icon="getmenuByPath(child2).materialIcon"
|
||||
:label="tools.getLabelByItem(getmenuByPath(child2))"
|
||||
:to="getroute(getmenuByPath(child2))"
|
||||
active-class="my-menu-active"
|
||||
expand-icon="none"
|
||||
expand-icon-class="my-menu-icon-none"
|
||||
>
|
||||
<q-item-section avatar>
|
||||
<q-avatar v-if="getmenuByPath(child2).img">
|
||||
<div
|
||||
:class="getimgiconclass(getmenuByPath(child2))"
|
||||
:icon="`img:` + getmenuByPath(child2).img"
|
||||
style="font-size: 2rem"
|
||||
></div>
|
||||
</q-avatar>
|
||||
<div v-else>
|
||||
<q-avatar
|
||||
:icon="getmenuByPath(child2).materialIcon"
|
||||
:size="getmenuByPath(child2).iconsize"
|
||||
class="clicon"
|
||||
color="primary"
|
||||
text-color="white"
|
||||
>
|
||||
</q-avatar>
|
||||
</div>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
{{ tools.getLabelByItem(getmenuByPath(child2)) }}
|
||||
</q-item-section>
|
||||
</q-expansion-item>
|
||||
<q-expansion-item
|
||||
v-else
|
||||
:content-inset-level="
|
||||
getmenuByPath(child2).level_parent + 1
|
||||
"
|
||||
:header-class="getmymenuclass(getmenuByPath(child2))"
|
||||
:header-inset-level="
|
||||
getmenuByPath(child2).level_parent + 2
|
||||
"
|
||||
:icon="getmenuByPath(child2).materialIcon"
|
||||
:label="tools.getLabelByItem(getmenuByPath(child2))"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
<div
|
||||
v-for="(child3, index) in getmenuByPath(child2)
|
||||
.sottoMenu"
|
||||
:key="index"
|
||||
>
|
||||
<div v-if="getmenuByPath(child3).active">
|
||||
<q-expansion-item
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:header-inset-level="
|
||||
getmenuByPath(child3).level_child + 1
|
||||
"
|
||||
:icon="getmenuByPath(child3).materialIcon"
|
||||
:label="
|
||||
tools.getLabelByItem(getmenuByPath(child3))
|
||||
"
|
||||
:to="getroute(getmenuByPath(child3))"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-icon-none"
|
||||
>
|
||||
<div
|
||||
v-for="(child4, index) in getmenuByPath(
|
||||
child3
|
||||
).sottoMenu"
|
||||
:key="index"
|
||||
>
|
||||
<q-expansion-item
|
||||
v-if="
|
||||
!!getmenuByPath(child3).sottoMenu &&
|
||||
getmenuByPath(child3).active
|
||||
"
|
||||
:key="index"
|
||||
:class="
|
||||
`item item-link drawer-closer cursor-pointer ` +
|
||||
clBase
|
||||
"
|
||||
:duration="300"
|
||||
:expand-icon="child4.icon"
|
||||
:header-inset-level="child4.level_child + 4"
|
||||
:icon="child4.materialIcon"
|
||||
:label="tools.getLabelByItem(child4)"
|
||||
:to="getroute(child4)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat"
|
||||
>
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div
|
||||
v-if="
|
||||
myitemmenu.inmenu &&
|
||||
!myitemmenu.submenu &&
|
||||
tools.visumenu(myitemmenu)
|
||||
"
|
||||
>
|
||||
<q-slide-transition :duration="200">
|
||||
<div v-show="true">
|
||||
<span v-if="myitemmenu.isseparator">
|
||||
<q-separator inset></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-list>
|
||||
<q-item
|
||||
clickable
|
||||
:content-inset-level="myitemmenu.level_parent"
|
||||
:header-inset-level="myitemmenu.level_parent"
|
||||
:to="getroute(myitemmenu)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon="none"
|
||||
>
|
||||
<q-item-section thumbnail>
|
||||
<q-avatar
|
||||
:icon="myitemmenu.materialIcon"
|
||||
:size="
|
||||
!!myitemmenu.iconsize
|
||||
? myitemmenu.iconsize
|
||||
: '2.5rem'
|
||||
"
|
||||
:font-size="
|
||||
!!myitemmenu.iconsize
|
||||
? myitemmenu.iconsize
|
||||
: '2.5rem'
|
||||
"
|
||||
text-color="primary"
|
||||
style="margin-left: 4px"
|
||||
square
|
||||
rounded
|
||||
>
|
||||
</q-avatar>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<span :class="myitemmenu.extraclass">{{
|
||||
tools.getLabelByItem(myitemmenu)
|
||||
}}</span>
|
||||
<span v-if="myitemmenu.subtitle" class="subtitle">{{
|
||||
myitemmenu.subtitle
|
||||
}}</span>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</span>
|
||||
</div>
|
||||
</q-slide-transition>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-list>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./menuOne.ts">
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './menuOne.scss';
|
||||
</style>
|
||||
@@ -1,6 +1,7 @@
|
||||
.prova{
|
||||
.prova {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.q-list-header {
|
||||
min-height: 12px;
|
||||
padding: 5px 8px;
|
||||
@@ -42,13 +43,15 @@
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
|
||||
.my-menu, .my-menu > i{
|
||||
.my-menu,
|
||||
.my-menu>i {
|
||||
min-height: 40px;
|
||||
min-width: 26px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.my-menu-small, .my-menu-small > i{
|
||||
.my-menu-small,
|
||||
.my-menu-small>i {
|
||||
min-height: 40px;
|
||||
min-width: 26px;
|
||||
font-size: 0.75rem;
|
||||
@@ -56,35 +59,39 @@
|
||||
|
||||
.isAdmin {
|
||||
color: red !important;
|
||||
background: linear-gradient(180deg, rgba(255, 0, 0, 0.15), white, rgba(255, 0, 0, 0.15));
|
||||
}
|
||||
|
||||
.isSocioResidente {
|
||||
color: darkgreen;
|
||||
}
|
||||
|
||||
.isCalendar {
|
||||
.isCalendar {}
|
||||
|
||||
.isDoc {
|
||||
background: linear-gradient(180deg, rgba(152, 198, 226, 0.45), white, rgba(152, 198, 226, 0.45));
|
||||
}
|
||||
|
||||
.isManager {
|
||||
color: green !important;
|
||||
background: linear-gradient(180deg, rgba(125, 151, 125, 0.273), white, rgba(0, 128, 0, 0.273));
|
||||
}
|
||||
|
||||
.isFacilitatore {
|
||||
color: #201a80;
|
||||
}
|
||||
|
||||
.my-menu-icon{
|
||||
.my-menu-icon {
|
||||
min-width: 2px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.my-menu-icon > i{
|
||||
.my-menu-icon>i {
|
||||
min-width: 26px;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.clexpansion{
|
||||
.clexpansion {
|
||||
min-width: 0 !important;
|
||||
}
|
||||
|
||||
@@ -92,24 +99,25 @@
|
||||
background-color: rgba(174, 189, 241, 0.71);
|
||||
}
|
||||
|
||||
.my-menu-separat > i{
|
||||
.my-menu-separat>i {
|
||||
min-width: 26px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.my-menu-icon-none > i{
|
||||
.my-menu-icon-none>i {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.clicon img, .clicon {
|
||||
.clicon img,
|
||||
.clicon {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.q-item__section--avatar{
|
||||
.q-item__section--avatar {
|
||||
min-width: 30px;
|
||||
}
|
||||
|
||||
.OLD_q-item__section--side{
|
||||
.OLD_q-item__section--side {
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
@@ -137,6 +145,7 @@
|
||||
font-weight: bold;
|
||||
text-shadow: 0.0512rem 0.052rem .01rem #555;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
@@ -6,16 +6,12 @@ import { useRoute } from 'vue-router'
|
||||
import { static_data } from '@/db/static_data'
|
||||
import { useUserStore } from '@store/UserStore'
|
||||
|
||||
import { CMenuItem } from '../../components/CMenuItem'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MenuOne',
|
||||
props: {
|
||||
clBase: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'my-menu',
|
||||
},
|
||||
},
|
||||
|
||||
components: { CMenuItem },
|
||||
setup(props) {
|
||||
const route = useRoute()
|
||||
const userStore = useUserStore()
|
||||
@@ -29,10 +25,12 @@ export default defineComponent({
|
||||
|
||||
const myroutes = ref(<IListRoutes[]>[])
|
||||
|
||||
const getmenu = computed(() => globalStore.getmenu )
|
||||
const getmenu = computed(() => globalStore.getmenu)
|
||||
|
||||
const islogged = computed(() => userStore.isLogged)
|
||||
|
||||
const clBase = ref('my-menu')
|
||||
|
||||
function setParentVisibilityBasedOnRoute(parent: any) {
|
||||
parent.routes.forEach((item: any) => {
|
||||
if (path.value === item.path) {
|
||||
@@ -51,11 +49,11 @@ export default defineComponent({
|
||||
myroutes.value = static_data.routes
|
||||
}
|
||||
|
||||
watch(() => islogged.value,(to, from) => {
|
||||
watch(() => islogged.value, (to, from) => {
|
||||
updatemenu()
|
||||
})
|
||||
|
||||
watch(() => finishLoading.value,(to, from) => {
|
||||
watch(() => finishLoading.value, (to, from) => {
|
||||
updatemenu()
|
||||
})
|
||||
|
||||
@@ -78,7 +76,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
function getmymenuclass(elem: IListRoutes) {
|
||||
let menu: string = props.clBase
|
||||
let menu: string = clBase.value
|
||||
|
||||
if (elem.color) {
|
||||
menu += ` ${elem.color}`
|
||||
@@ -111,6 +109,12 @@ export default defineComponent({
|
||||
return 'clBase'
|
||||
}
|
||||
|
||||
function getmenuByPath(path: string) {
|
||||
const mymenufind = static_data.routes.find((menu: any) => menu.path === '/' + path)
|
||||
|
||||
return mymenufind
|
||||
}
|
||||
|
||||
myroutes.value = static_data.routes
|
||||
|
||||
return {
|
||||
@@ -124,7 +128,8 @@ export default defineComponent({
|
||||
myroutes,
|
||||
getimgiconclass,
|
||||
getimgiconclass2,
|
||||
|
||||
getmenuByPath,
|
||||
clBase,
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
@@ -1,153 +1,24 @@
|
||||
<template>
|
||||
<div v-if="finishLoading" class="no-border">
|
||||
<q-list class="rounded-borders text-primary">
|
||||
<div v-for="ind1 in getmenu" :key="ind1">
|
||||
<!--<div class="q-list-header">{{replaceUnderlineToSpace(index)}}</div>-->
|
||||
<div v-for="(myitemmenu, ind2) in myroutes" :key="ind2">
|
||||
<div v-if="myitemmenu.active">
|
||||
<div v-if="myitemmenu.routes2 && myitemmenu.inmenu && tools.visumenu(myitemmenu)">
|
||||
|
||||
<span v-if="myitemmenu.isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
|
||||
<q-expansion-item
|
||||
:content-inset-level="myitemmenu.level_parent"
|
||||
:header-class="getmymenuclass(myitemmenu)"
|
||||
:header-inset-level="myitemmenu.level_parent"
|
||||
:icon="myitemmenu.materialIcon"
|
||||
:label="tools.getLabelByItem(myitemmenu)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat">
|
||||
|
||||
<div v-for="(child2, index) in myitemmenu.routes2" :key="index">
|
||||
<div v-if="child2.active && tools.visumenu(child2)">
|
||||
<span v-if="child2.isseparator">
|
||||
<q-separator></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
|
||||
<q-expansion-item
|
||||
v-if="!child2.routes2"
|
||||
:class="`item item-link drawer-closer cursor-pointer ` + clBase"
|
||||
:duration="300"
|
||||
:header-inset-level="child2.level_child"
|
||||
:icon="child2.materialIcon"
|
||||
:label="tools.getLabelByItem(child2)"
|
||||
:to="getroute(child2)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon="none"
|
||||
expand-icon-class="my-menu-icon-none">
|
||||
|
||||
<q-item-section avatar>
|
||||
<q-avatar v-if="child2.img">
|
||||
<div :class="getimgiconclass(child2)" :icon="`img:`+child2.img" style="font-size:2rem;"></div>
|
||||
</q-avatar>
|
||||
<div v-else>
|
||||
<q-avatar
|
||||
:icon="child2.materialIcon" :size="child2.iconsize" class="clicon"
|
||||
color="primary"
|
||||
text-color="white">
|
||||
</q-avatar>
|
||||
</div>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
{{ tools.getLabelByItem(child2) }}
|
||||
</q-item-section>
|
||||
|
||||
</q-expansion-item>
|
||||
<q-expansion-item
|
||||
v-else
|
||||
:content-inset-level="child2.level_parent"
|
||||
:header-class="getmymenuclass(child2)"
|
||||
:header-inset-level="child2.level_parent"
|
||||
:icon="child2.materialIcon"
|
||||
:label="tools.getLabelByItem(child2)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat">
|
||||
|
||||
<div v-for="(child3, index) in child2.routes2" :key="index">
|
||||
<div v-if="child3.active">
|
||||
|
||||
<q-expansion-item
|
||||
:class="`item item-link drawer-closer cursor-pointer ` + clBase"
|
||||
:duration="300"
|
||||
:header-inset-level="child3.level_child"
|
||||
:icon="child3.materialIcon"
|
||||
:label="tools.getLabelByItem(child3)"
|
||||
:to="getroute(child3)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-icon-none">
|
||||
<div v-for="(child4, index) in child3.routes2" :key="index">
|
||||
|
||||
<q-expansion-item
|
||||
v-if="!!child3.routes2 && child3.active"
|
||||
:key="index"
|
||||
:class="`item item-link drawer-closer cursor-pointer ` + clBase"
|
||||
:duration="300"
|
||||
:expand-icon="child4.icon"
|
||||
:header-inset-level="child4.level_child"
|
||||
:icon="child4.materialIcon"
|
||||
:label="tools.getLabelByItem(child4)"
|
||||
:to="getroute(child4)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon-class="my-menu-separat">
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
</span>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="myitemmenu.inmenu && !myitemmenu.submenu && tools.visumenu(myitemmenu)">
|
||||
<q-slide-transition :duration=200>
|
||||
<div v-show="true">
|
||||
<span v-if="myitemmenu.isseparator">
|
||||
<q-separator inset></q-separator>
|
||||
</span>
|
||||
<span v-else>
|
||||
<q-list>
|
||||
<q-item clickable
|
||||
:content-inset-level="myitemmenu.level_parent"
|
||||
:header-inset-level="myitemmenu.level_parent"
|
||||
:to="getroute(myitemmenu)"
|
||||
active-class="my-menu-active"
|
||||
expand-icon="none">
|
||||
|
||||
<q-item-section thumbnail>
|
||||
<q-avatar
|
||||
:icon="myitemmenu.materialIcon" :size="!!myitemmenu.iconsize ? myitemmenu.iconsize: '2.5rem'" :font-size="!!myitemmenu.iconsize ? myitemmenu.iconsize: '2.5rem'"
|
||||
text-color="primary"
|
||||
style="margin-left: 4px"
|
||||
square
|
||||
rounded>
|
||||
</q-avatar>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<span :class="myitemmenu.extraclass">{{ tools.getLabelByItem(myitemmenu) }}</span>
|
||||
<span v-if="myitemmenu.subtitle" class="subtitle">{{ myitemmenu.subtitle }}</span>
|
||||
</q-item-section>
|
||||
|
||||
</q-item>
|
||||
</q-list>
|
||||
</span>
|
||||
</div>
|
||||
</q-slide-transition>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="menuItem in getmenu" :key="menuItem">
|
||||
<template v-for="(route, index) in myroutes" :key="index">
|
||||
<CMenuItem
|
||||
v-if="
|
||||
route.active &&
|
||||
!route.submenu &&
|
||||
route.inmenu &&
|
||||
tools.visumenu(route)
|
||||
"
|
||||
:item="route"
|
||||
:getroute="getroute"
|
||||
:getmymenuclass="getmymenuclass"
|
||||
:getimgiconclass="getimgiconclass"
|
||||
:clBase="clBase"
|
||||
:level="1"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</q-list>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user