73 lines
2.2 KiB
Vue
73 lines
2.2 KiB
Vue
<template>
|
|
<div>
|
|
<router-view>
|
|
<template v-slot="{ Component, route }">
|
|
<transition
|
|
:name="
|
|
getTransitionName({
|
|
route,
|
|
openCache,
|
|
enableTransition: getEnableTransition,
|
|
cacheTabs: getCaches,
|
|
def: getBasicTransition,
|
|
})
|
|
"
|
|
mode="out-in"
|
|
appear
|
|
>
|
|
<keep-alive v-if="openCache" :include="getCaches">
|
|
<component :is="Component" v-bind="getKey(Component, route)" />
|
|
</keep-alive>
|
|
<component v-else :is="Component" v-bind="getKey(Component, route)" />
|
|
</transition>
|
|
</template>
|
|
</router-view>
|
|
<FrameLayout v-if="getCanEmbedIFramePage" />
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import type { FunctionalComponent } from 'vue';
|
|
import type { RouteLocation } from 'vue-router';
|
|
|
|
import { computed, defineComponent, unref } from 'vue';
|
|
|
|
import FrameLayout from '/@/layouts/iframe/index.vue';
|
|
|
|
import { useRootSetting } from '/@/hooks/setting/useRootSetting';
|
|
|
|
import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting';
|
|
import { useCache } from './useCache';
|
|
import { useMultipleTabSetting } from '/@/hooks/setting/useMultipleTabSetting';
|
|
import { getTransitionName } from './transition';
|
|
|
|
export default defineComponent({
|
|
name: 'PageLayout',
|
|
components: { FrameLayout },
|
|
setup() {
|
|
const { getCaches } = useCache(true);
|
|
const { getShowMultipleTab } = useMultipleTabSetting();
|
|
|
|
const { getOpenKeepAlive, getCanEmbedIFramePage } = useRootSetting();
|
|
|
|
const { getBasicTransition, getEnableTransition } = useTransitionSetting();
|
|
|
|
const openCache = computed(() => unref(getOpenKeepAlive) && unref(getShowMultipleTab));
|
|
|
|
function getKey(component: FunctionalComponent & { type: Indexable }, route: RouteLocation) {
|
|
return !!component?.type.parentView ? {} : { key: route.fullPath };
|
|
}
|
|
|
|
return {
|
|
getTransitionName,
|
|
openCache,
|
|
getEnableTransition,
|
|
getBasicTransition,
|
|
getCaches,
|
|
getCanEmbedIFramePage,
|
|
getKey,
|
|
};
|
|
},
|
|
});
|
|
</script>
|