mirror of
https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git
synced 2025-12-19 02:51:14 +00:00
refactor(editor): Standardize components sections order (no-changelog) (#10540)
This commit is contained in:
@@ -1,58 +1,3 @@
|
||||
<template>
|
||||
<div
|
||||
:class="{
|
||||
['menu-container']: true,
|
||||
[$style.container]: true,
|
||||
[$style.menuCollapsed]: collapsed,
|
||||
[$style.transparentBackground]: transparentBackground,
|
||||
}"
|
||||
>
|
||||
<div v-if="$slots.header" :class="$style.menuHeader">
|
||||
<slot name="header"></slot>
|
||||
</div>
|
||||
<div :class="$style.menuContent">
|
||||
<div :class="{ [$style.upperContent]: true, ['pt-xs']: $slots.menuPrefix }">
|
||||
<div v-if="$slots.menuPrefix" :class="$style.menuPrefix">
|
||||
<slot name="menuPrefix"></slot>
|
||||
</div>
|
||||
<ElMenu :default-active="defaultActive" :collapse="collapsed">
|
||||
<N8nMenuItem
|
||||
v-for="item in upperMenuItems"
|
||||
:key="item.id"
|
||||
:item="item"
|
||||
:compact="collapsed"
|
||||
:tooltip-delay="tooltipDelay"
|
||||
:mode="mode"
|
||||
:active-tab="activeTab"
|
||||
:handle-select="onSelect"
|
||||
/>
|
||||
</ElMenu>
|
||||
</div>
|
||||
<div :class="[$style.lowerContent, 'pb-2xs']">
|
||||
<slot name="beforeLowerMenu"></slot>
|
||||
<ElMenu :default-active="defaultActive" :collapse="collapsed">
|
||||
<N8nMenuItem
|
||||
v-for="item in lowerMenuItems"
|
||||
:key="item.id"
|
||||
:item="item"
|
||||
:compact="collapsed"
|
||||
:tooltip-delay="tooltipDelay"
|
||||
:mode="mode"
|
||||
:active-tab="activeTab"
|
||||
:handle-select="onSelect"
|
||||
/>
|
||||
</ElMenu>
|
||||
<div v-if="$slots.menuSuffix" :class="$style.menuSuffix">
|
||||
<slot name="menuSuffix"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="$slots.footer" :class="$style.menuFooter">
|
||||
<slot name="footer"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
@@ -125,6 +70,61 @@ const onSelect = (item: IMenuItem): void => {
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
:class="{
|
||||
['menu-container']: true,
|
||||
[$style.container]: true,
|
||||
[$style.menuCollapsed]: collapsed,
|
||||
[$style.transparentBackground]: transparentBackground,
|
||||
}"
|
||||
>
|
||||
<div v-if="$slots.header" :class="$style.menuHeader">
|
||||
<slot name="header"></slot>
|
||||
</div>
|
||||
<div :class="$style.menuContent">
|
||||
<div :class="{ [$style.upperContent]: true, ['pt-xs']: $slots.menuPrefix }">
|
||||
<div v-if="$slots.menuPrefix" :class="$style.menuPrefix">
|
||||
<slot name="menuPrefix"></slot>
|
||||
</div>
|
||||
<ElMenu :default-active="defaultActive" :collapse="collapsed">
|
||||
<N8nMenuItem
|
||||
v-for="item in upperMenuItems"
|
||||
:key="item.id"
|
||||
:item="item"
|
||||
:compact="collapsed"
|
||||
:tooltip-delay="tooltipDelay"
|
||||
:mode="mode"
|
||||
:active-tab="activeTab"
|
||||
:handle-select="onSelect"
|
||||
/>
|
||||
</ElMenu>
|
||||
</div>
|
||||
<div :class="[$style.lowerContent, 'pb-2xs']">
|
||||
<slot name="beforeLowerMenu"></slot>
|
||||
<ElMenu :default-active="defaultActive" :collapse="collapsed">
|
||||
<N8nMenuItem
|
||||
v-for="item in lowerMenuItems"
|
||||
:key="item.id"
|
||||
:item="item"
|
||||
:compact="collapsed"
|
||||
:tooltip-delay="tooltipDelay"
|
||||
:mode="mode"
|
||||
:active-tab="activeTab"
|
||||
:handle-select="onSelect"
|
||||
/>
|
||||
</ElMenu>
|
||||
<div v-if="$slots.menuSuffix" :class="$style.menuSuffix">
|
||||
<slot name="menuSuffix"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="$slots.footer" :class="$style.menuFooter">
|
||||
<slot name="footer"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" module>
|
||||
.container {
|
||||
height: 100%;
|
||||
|
||||
Reference in New Issue
Block a user