index.vue 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <template>
  2. <RouterView>
  3. <template #default="{ Component, route }">
  4. <!--<transition
  5. :name="
  6. getTransitionName({
  7. route,
  8. openCache,
  9. enableTransition: getEnableTransition,
  10. cacheTabs: getCaches,
  11. def: getBasicTransition,
  12. })
  13. "
  14. mode="out-in"
  15. appear
  16. >-->
  17. <keep-alive v-if="openCache" :include="getCaches">
  18. <component :is="Component" :key="getPageComponentKey(route)" />
  19. </keep-alive>
  20. <component v-else :is="Component" :key="getPageComponentKey(route)" />
  21. <!--</transition>-->
  22. </template>
  23. </RouterView>
  24. <FrameLayout v-if="getCanEmbedIFramePage" />
  25. </template>
  26. <script lang="ts">
  27. import { computed, defineComponent, unref } from 'vue';
  28. import type { RouteLocationNormalizedLoaded } from 'vue-router';
  29. import FrameLayout from '@jeesite/core/layouts/iframe/index.vue';
  30. import { useRootSetting } from '@jeesite/core/hooks/setting/useRootSetting';
  31. import { useTransitionSetting } from '@jeesite/core/hooks/setting/useTransitionSetting';
  32. import { useMultipleTabSetting } from '@jeesite/core/hooks/setting/useMultipleTabSetting';
  33. import { getTransitionName } from './transition';
  34. import { useMultipleTabStore } from '@jeesite/core/store/modules/multipleTab';
  35. export default defineComponent({
  36. name: 'PageLayout',
  37. components: { FrameLayout },
  38. setup() {
  39. const { getShowMultipleTab } = useMultipleTabSetting();
  40. const tabStore = useMultipleTabStore();
  41. const { getOpenKeepAlive, getCanEmbedIFramePage } = useRootSetting();
  42. const { getBasicTransition, getEnableTransition } = useTransitionSetting();
  43. const openCache = computed(() => unref(getOpenKeepAlive) && unref(getShowMultipleTab));
  44. const getCaches = computed((): string[] => {
  45. if (!unref(getOpenKeepAlive)) {
  46. return [];
  47. }
  48. return tabStore.getCachedTabList;
  49. });
  50. const getPageComponentKey = (route: RouteLocationNormalizedLoaded) => {
  51. const fullPath = route.fullPath || route.path;
  52. return route.path === '/behaviorSpacetime/index' ? route.path : fullPath;
  53. };
  54. return {
  55. getTransitionName,
  56. openCache,
  57. getEnableTransition,
  58. getBasicTransition,
  59. getCaches,
  60. getPageComponentKey,
  61. getCanEmbedIFramePage,
  62. };
  63. },
  64. });
  65. </script>