From b1af0cd06ea107f5761f2d23b5a27730c6fd6a63 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sun, 6 Apr 2025 21:32:44 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E5=A2=9E=E5=8A=A0=20IFrame=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web-antd/src/components/iframe/index.ts  |  3 ++
 .../src/components/iframe/src/IFrame.vue      | 34 +++++++++++++++++++
 2 files changed, 37 insertions(+)
 create mode 100644 apps/web-antd/src/components/iframe/index.ts
 create mode 100644 apps/web-antd/src/components/iframe/src/IFrame.vue

diff --git a/apps/web-antd/src/components/iframe/index.ts b/apps/web-antd/src/components/iframe/index.ts
new file mode 100644
index 000000000..9f8cf24a5
--- /dev/null
+++ b/apps/web-antd/src/components/iframe/index.ts
@@ -0,0 +1,3 @@
+import IFrame from './src/IFrame.vue'
+
+export { IFrame }
diff --git a/apps/web-antd/src/components/iframe/src/IFrame.vue b/apps/web-antd/src/components/iframe/src/IFrame.vue
new file mode 100644
index 000000000..35b056b30
--- /dev/null
+++ b/apps/web-antd/src/components/iframe/src/IFrame.vue
@@ -0,0 +1,34 @@
+<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" />
+  </div>
+</template>