mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-27 19:29:04 +08:00
refactor(project): business changed its name to effects, and universal-ui changed its name to common-ui
This commit is contained in:
85
packages/effects/layouts/src/iframe/iframe-router-view.vue
Normal file
85
packages/effects/layouts/src/iframe/iframe-router-view.vue
Normal file
@@ -0,0 +1,85 @@
|
||||
<script lang="ts" setup>
|
||||
import type { RouteLocationNormalized } from 'vue-router';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
import { preferences } from '@vben-core/preferences';
|
||||
import { Spinner } from '@vben-core/shadcn-ui';
|
||||
import { useCoreTabbarStore } from '@vben-core/stores';
|
||||
|
||||
defineOptions({ name: 'IFrameRouterView' });
|
||||
|
||||
const spinningList = ref<boolean[]>([]);
|
||||
const coreTabbarStore = useCoreTabbarStore();
|
||||
const route = useRoute();
|
||||
|
||||
const enableTabbar = computed(() => preferences.tabbar.enable);
|
||||
|
||||
const iframeRoutes = computed(() => {
|
||||
if (!enableTabbar.value) {
|
||||
return route.meta.iframeSrc ? [route] : [];
|
||||
}
|
||||
return coreTabbarStore.getTabs.filter((tab) => !!tab.meta?.iframeSrc);
|
||||
});
|
||||
|
||||
const tabNames = computed(
|
||||
() => new Set(iframeRoutes.value.map((item) => item.name as string)),
|
||||
);
|
||||
|
||||
const showIframe = computed(() => iframeRoutes.value.length > 0);
|
||||
|
||||
function routeShow(tabItem: RouteLocationNormalized) {
|
||||
return tabItem.name === route.name;
|
||||
}
|
||||
|
||||
function canRender(tabItem: RouteLocationNormalized) {
|
||||
const { meta, name } = tabItem;
|
||||
|
||||
if (!name || !coreTabbarStore.renderRouteView) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!enableTabbar.value) {
|
||||
return routeShow(tabItem);
|
||||
}
|
||||
|
||||
// 跟随 keepAlive 状态,与其他tab页保持一致
|
||||
if (
|
||||
!meta?.keepAlive &&
|
||||
tabNames.value.has(name as string) &&
|
||||
name !== route.name
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
return coreTabbarStore.getTabs.some((tab) => tab.name === name);
|
||||
}
|
||||
|
||||
function hideLoading(index: number) {
|
||||
spinningList.value[index] = false;
|
||||
}
|
||||
|
||||
function showSpinning(index: number) {
|
||||
const curSpinning = spinningList.value[index];
|
||||
// 首次加载时显示loading
|
||||
return curSpinning === undefined ? true : curSpinning;
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<template v-if="showIframe">
|
||||
<template v-for="(item, index) in iframeRoutes" :key="item.fullPath">
|
||||
<div
|
||||
v-if="canRender(item)"
|
||||
v-show="routeShow(item)"
|
||||
class="relative size-full"
|
||||
>
|
||||
<Spinner :spinning="showSpinning(index)" />
|
||||
<iframe
|
||||
:src="item.meta.iframeSrc as string"
|
||||
class="size-full"
|
||||
@load="hideLoading(index)"
|
||||
></iframe>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
6
packages/effects/layouts/src/iframe/iframe-view.vue
Normal file
6
packages/effects/layouts/src/iframe/iframe-view.vue
Normal file
@@ -0,0 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
defineOptions({ name: 'IFrameView' });
|
||||
</script>
|
||||
<template>
|
||||
<div></div>
|
||||
</template>
|
2
packages/effects/layouts/src/iframe/index.ts
Normal file
2
packages/effects/layouts/src/iframe/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export { default as IFrameRouterView } from './iframe-router-view.vue';
|
||||
export { default as IFrameView } from './iframe-view.vue';
|
Reference in New Issue
Block a user