refactor: 移动 iframe 到 @vben/common-ui

apps/web-antd/src/views/infra/druid/index.vue

@@ -1,10 +1,9 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/druid/index.html`);

apps/web-antd/src/views/infra/server/index.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/admin/applications`);

apps/web-antd/src/views/infra/skywalking/index.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref('http://skywalking.shop.iocoder.cn');

apps/web-antd/src/views/infra/swagger/index.vue

@@ -1,10 +1,9 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/doc.html`); // Knife4j UI

apps/web-antd/src/views/report/goview/index.vue

@@ -1,11 +1,9 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 import { useAccessStore } from '@vben/stores';
 
-import { IFrame } from '#/components/iframe';
-
 defineOptions({ name: 'GoView' });
 
 const accessStore = useAccessStore();

apps/web-antd/src/views/report/jmreport/bi.vue

@@ -1,11 +1,9 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 import { useAccessStore } from '@vben/stores';
 
-import { IFrame } from '#/components/iframe';
-
 defineOptions({ name: 'JimuBI' });
 const accessStore = useAccessStore();
 

apps/web-antd/src/views/report/jmreport/index.vue

@@ -1,11 +1,9 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 import { useAccessStore } from '@vben/stores';
 
-import { IFrame } from '#/components/iframe';
-
 defineOptions({ name: 'JimuReport' });
 const accessStore = useAccessStore();
 

apps/web-ele/src/components/diy-editor/index.vue

@@ -3,6 +3,7 @@ import type { DiyComponent, DiyComponentLibrary, PageConfig } from './util';
 
 import { inject, onMounted, ref, unref, watch } from 'vue';
 
+import { IFrame } from '@vben/common-ui';
 import { IconifyIcon } from '@vben/icons';
 import { cloneDeep, isEmpty, isString } from '@vben/utils';
 

apps/web-ele/src/components/iframe/iframe.vue

@@ -1,38 +0,0 @@
-<script setup lang="ts">
-import { onMounted, ref } from 'vue';
-
-interface IFrameProps {
-  /** iframe 的源地址 */
-  src: string;
-}
-
-const props = defineProps<IFrameProps>();
-
-const loading = ref(true);
-const height = ref('');
-const frameRef = ref<HTMLElement | null>(null);
-
-function init() {
-  height.value = `${document.documentElement.clientHeight - 94.5}px`;
-  loading.value = false;
-}
-
-onMounted(() => {
-  setTimeout(() => {
-    init();
-  }, 300);
-});
-// TODO @芋艿：优化：未来使用 vben 自带的内链实现
-</script>
-
-<template>
-  <div v-loading="loading" :style="`height:${height}`">
-    <iframe
-      ref="frameRef"
-      :src="props.src"
-      style="width: 100%; height: 100%"
-      frameborder="no"
-      scrolling="auto"
-    ></iframe>
-  </div>
-</template>

apps/web-ele/src/components/iframe/index.ts

@@ -1 +0,0 @@
-export { default as IFrame } from './iframe.vue';

apps/web-ele/src/views/infra/druid/index.vue

@@ -1,10 +1,9 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/druid/index.html`);

apps/web-ele/src/views/infra/server/index.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/admin/applications`);

apps/web-ele/src/views/infra/skywalking/index.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref('http://skywalking.shop.iocoder.cn');

apps/web-ele/src/views/infra/swagger/index.vue

@@ -1,10 +1,9 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, IFrame, Page } from '@vben/common-ui';
 
 import { getConfigKey } from '#/api/infra/config';
-import { IFrame } from '#/components/iframe';
 
 const loading = ref(true); // 是否加载中
 const src = ref(`${import.meta.env.VITE_BASE_URL}/doc.html`); // Knife4j UI

packages/effects/common-ui/src/components/index.ts

@@ -5,6 +5,7 @@ export * from './count-to';
 export * from './doc-alert';
 export * from './ellipsis-text';
 export * from './icon-picker';
+export * from './iframe';
 export * from './json-viewer';
 export * from './loading';
 export * from './page';