This commit is contained in:
winixt 2022-01-08 15:32:24 +08:00
commit 6f755c9b01
4 changed files with 24 additions and 8 deletions

View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/plugin-layout",
"version": "4.0.0",
"version": "4.0.1",
"description": "@fesjs/plugin-layout",
"main": "lib/index.js",
"files": [

View File

@ -5,6 +5,7 @@
v-if="routeLayout.sidebar"
v-model:collapsed="collapsed"
:fixed="fixedSideBar"
:width="`${sideWidth}px`"
class="layout-aside"
collapsible
:inverted="theme === 'dark'"
@ -33,6 +34,7 @@
>
<f-header
v-if="routeLayout.header"
ref="headerRef"
class="layout-header"
:fixed="currentFixedHeader"
>
@ -46,7 +48,7 @@
<f-layout
:embedded="!multiTabs"
:fixed="currentFixedHeader"
:style="{ top: currentFixedHeader ? '54px' : 'auto' }"
:style="{ top: currentFixedHeader ? `${headerHeightRef}px` : 'auto' }"
>
<f-main class="layout-main">
<MultiTabProvider :multiTabs="multiTabs" />
@ -60,6 +62,7 @@
<template v-if="navigation === 'top'">
<f-header
v-if="routeLayout.header"
ref="headerRef"
class="layout-header"
:inverted="theme === 'dark'"
:fixed="currentFixedHeader"
@ -84,7 +87,7 @@
<f-layout
:embedded="!multiTabs"
:fixed="currentFixedHeader"
:style="{ top: currentFixedHeader ? '54px' : 'auto' }"
:style="{ top: currentFixedHeader ? `${headerHeightRef}px` : 'auto' }"
>
<f-main class="layout-main">
<MultiTabProvider :multiTabs="multiTabs" />
@ -97,6 +100,7 @@
<template v-if="navigation === 'mixin'">
<f-header
v-if="routeLayout.header"
ref="headerRef"
class="layout-header"
:fixed="currentFixedHeader"
:inverted="theme === 'dark'"
@ -114,12 +118,13 @@
</f-header>
<f-layout
:fixed="currentFixedHeader"
:style="{ top: currentFixedHeader ? '54px' : 'auto' }"
:style="{ top: currentFixedHeader ? `${headerHeightRef}px` : 'auto' }"
>
<f-aside
v-if="routeLayout.sidebar"
v-model:collapsed="collapsed"
:fixed="fixedSideBar"
:width="`${sideWidth}px`"
collapsible
class="layout-aside"
>
@ -155,7 +160,7 @@
</template>
<script>
import { ref, computed } from 'vue';
import { ref, computed, onMounted } from 'vue';
import { useRoute, plugin, ApplyPluginsType } from '@@/core/coreExports';
import {
FLayout, FAside, FMain, FFooter, FHeader
@ -220,6 +225,15 @@ export default {
footer: String
},
setup(props) {
const headerRef = ref();
const headerHeightRef = ref(0);
onMounted(() => {
if (headerRef.value) {
headerHeightRef.value = headerRef.value.$el.offsetHeight;
}
});
const collapsed = ref(false);
const route = useRoute();
const runtimeConfig = plugin.applyPlugins({
@ -261,6 +275,8 @@ export default {
() => props.fixedHeader || props.navigation === 'mixin'
);
return {
headerRef,
headerHeightRef,
route,
routeLayout,
collapsed,

View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/preset-built-in",
"version": "2.0.14",
"version": "2.0.16",
"description": "@fesjs/preset-built-in",
"main": "lib/index.js",
"types": "lib/index.d.ts",

View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/fes",
"version": "2.0.15",
"version": "2.0.16",
"description": "一个好用的前端管理台快速开发框架",
"preferGlobal": true,
"scripts": {
@ -39,7 +39,7 @@
],
"dependencies": {
"@fesjs/compiler": "^2.0.3",
"@fesjs/preset-built-in": "^2.0.14",
"@fesjs/preset-built-in": "^2.0.16",
"@fesjs/runtime": "^2.0.2",
"@fesjs/utils": "^2.0.3",
"resolve-cwd": "^3.0.0"