add app orderer
This commit is contained in:
@@ -1,22 +1,50 @@
|
||||
<template>
|
||||
<NcButton :variant="is(false, false, false) ? 'primary' : 'seconday'" @click="update(false, false, false)">
|
||||
<NcButton
|
||||
:variant="is(false, false, false) ? 'primary' : 'seconday'"
|
||||
@click="update(false, false, false)"
|
||||
>
|
||||
{{ t('side_menu', 'Default') }}
|
||||
</NcButton>
|
||||
<NcButton :variant="is(true, false, false) ? 'primary' : 'seconday'" @click="update(true, false, false)">
|
||||
<NcButton
|
||||
:variant="is(true, false, false) ? 'primary' : 'seconday'"
|
||||
@click="update(true, false, false)"
|
||||
>
|
||||
{{ t('side_menu', 'Always displayed') }}
|
||||
</NcButton>
|
||||
<NcButton :variant="is(false, true, false) ? 'primary' : 'seconday'" @click="update(false, true, false)">
|
||||
<NcButton
|
||||
:variant="is(false, true, false) ? 'primary' : 'seconday'"
|
||||
@click="update(false, true, false)"
|
||||
>
|
||||
{{ t('side_menu', 'Big menu') }}
|
||||
</NcButton>
|
||||
<NcButton :variant="is(false, false, true) ? 'primary' : 'seconday'" @click="update(false, false, true)">
|
||||
<NcButton
|
||||
:variant="is(false, false, true) ? 'primary' : 'seconday'"
|
||||
@click="update(false, false, true)"
|
||||
>
|
||||
{{ t('side_menu', 'With categories') }}
|
||||
</NcButton>
|
||||
|
||||
<p>
|
||||
<img v-if="is(false, false, false)" class="side-menu-display" :src="DefaultImg" />
|
||||
<img v-if="is(true, false, false)" class="side-menu-display" :src="AlwaysDisplayedImg" />
|
||||
<img v-if="is(false, true, false)" class="side-menu-display" :src="TopWideImg" />
|
||||
<img v-if="is(false, false, true)" class="side-menu-display" :src="SideMenuWithCategoriesImg" />
|
||||
<img
|
||||
v-if="is(false, false, false)"
|
||||
class="side-menu-display"
|
||||
:src="DefaultImg"
|
||||
/>
|
||||
<img
|
||||
v-if="is(true, false, false)"
|
||||
class="side-menu-display"
|
||||
:src="AlwaysDisplayedImg"
|
||||
/>
|
||||
<img
|
||||
v-if="is(false, true, false)"
|
||||
class="side-menu-display"
|
||||
:src="TopWideImg"
|
||||
/>
|
||||
<img
|
||||
v-if="is(false, false, true)"
|
||||
class="side-menu-display"
|
||||
:src="SideMenuWithCategoriesImg"
|
||||
/>
|
||||
</p>
|
||||
</template>
|
||||
<script setup>
|
||||
@@ -27,11 +55,7 @@ import TopWideImg from '../../../../img/admin/layout-big-menu.svg'
|
||||
import SideMenuWithCategoriesImg from '../../../../img/admin/layout-side-menu-with-categories.svg'
|
||||
import DefaultImg from '../../../../img/admin/layout-default.svg'
|
||||
|
||||
const emit = defineEmits([
|
||||
'update:alwaysDisplayed',
|
||||
'update:topWideMenu',
|
||||
'update:sideMenuWithCategories',
|
||||
])
|
||||
const emit = defineEmits(['update:alwaysDisplayed', 'update:topWideMenu', 'update:sideMenuWithCategories'])
|
||||
|
||||
const { alwaysDisplayed, topWideMenu, sideMenuWithCategories } = defineProps({
|
||||
alwaysDisplayed: {
|
||||
@@ -55,11 +79,8 @@ const update = (isAlwayDisplayed, isTopWideMenu, isSideMenuWithCategories) => {
|
||||
}
|
||||
|
||||
const is = (isAlwayDisplayed, isTopWideMenu, isSideMenuWithCategories) => {
|
||||
return isAlwayDisplayed === alwaysDisplayed
|
||||
&& isTopWideMenu === topWideMenu
|
||||
&& isSideMenuWithCategories === sideMenuWithCategories
|
||||
return isAlwayDisplayed === alwaysDisplayed && isTopWideMenu === topWideMenu && isSideMenuWithCategories === sideMenuWithCategories
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
Reference in New Issue
Block a user