Commit 4a8129bffa9e3928c56333e29f5874f55a079764

Authored by YunaiV
1 parent 833ac54a

v3.6.0 封装iframe组件

yudao-ui-admin/src/components/iFrame/index.vue 0 → 100644
  1 +<template>
  2 + <div v-loading="loading" :style="'height:' + height">
  3 + <iframe
  4 + :src="src"
  5 + frameborder="no"
  6 + style="width: 100%; height: 100%"
  7 + scrolling="auto"
  8 + />
  9 + </div>
  10 +</template>
  11 +<script>
  12 +export default {
  13 + props: {
  14 + src: {
  15 + type: String,
  16 + required: true
  17 + },
  18 + },
  19 + data() {
  20 + return {
  21 + height: document.documentElement.clientHeight - 94.5 + "px;",
  22 + loading: true,
  23 + url: this.src
  24 + };
  25 + },
  26 + mounted: function () {
  27 + setTimeout(() => {
  28 + this.loading = false;
  29 + }, 300);
  30 + const that = this;
  31 + window.onresize = function temp() {
  32 + that.height = document.documentElement.clientHeight - 94.5 + "px;";
  33 + };
  34 + }
  35 +};
  36 +</script>
... ...
yudao-ui-admin/src/views/infra/druid/index.vue
1 1 <template>
2   - <div v-loading="loading" :style="'height:'+ height">
3   - <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
4   - </div>
  2 + <i-frame :src="url" />
5 3 </template>
6 4 <script>
  5 +import iFrame from "@/components/iFrame/index";
7 6 export default {
8 7 name: "Druid",
  8 + components: { iFrame },
9 9 data() {
10 10 return {
11   - src: process.env.VUE_APP_BASE_API + "/druid/index.html",
12   - height: document.documentElement.clientHeight - 94.5 + "px;",
13   - loading: true
  11 + url: process.env.VUE_APP_BASE_API + "/druid/index.html"
14 12 };
15 13 },
16   - mounted: function() {
17   - setTimeout(() => {
18   - this.loading = false;
19   - }, 230);
20   - const that = this;
21   - window.onresize = function temp() {
22   - that.height = document.documentElement.clientHeight - 94.5 + "px;";
23   - };
24   - }
25 14 };
26 15 </script>
... ...
yudao-ui-admin/src/views/infra/server/index.vue
1 1 <template>
2   - <div v-loading="loading" :style="'height:'+ height">
3   - <iframe ref="iframe" :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
4   - </div>
  2 + <i-frame :src="url" />
5 3 </template>
6 4 <script>
  5 +import iFrame from "@/components/iFrame/index";
7 6 export default {
8   - name: "Server",
  7 + name: "Druid",
  8 + components: { iFrame },
9 9 data() {
10 10 return {
11   - src: process.env.VUE_APP_BASE_API + "/admin",
12   - height: document.documentElement.clientHeight - 94.5 + "px;",
13   - loading: true
  11 + url: process.env.VUE_APP_BASE_API + "/admin"
14 12 };
15 13 },
16   - mounted: function() {
17   - const that = this;
18   -
19   - setTimeout(() => {
20   - // 模拟点击【应用】菜单
21   - // that.$refs["iframe"].contentWindow.document.getElementsByClassName('navbar-item')[2].click(); // TODO 暂时去掉,存在跨域问题
22   - // 取消加载中
23   - this.loading = false;
24   - }, 230);
25   -
26   - // 大小变化的监听
27   - window.onresize = function temp() {
28   - that.height = document.documentElement.clientHeight - 94.5 + "px;";
29   - };
30   - }
31 14 };
32 15 </script>
... ...
yudao-ui-admin/src/views/infra/skywalking/index.vue
1 1 <template>
2   - <div v-loading="loading" :style="'height:'+ height">
3   - <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
4   - </div>
  2 + <i-frame :src="url" />
5 3 </template>
6 4 <script>
  5 +import iFrame from "@/components/iFrame/index";
7 6 export default {
8   - name: "SkyWalking",
  7 + name: "Druid",
  8 + components: { iFrame },
9 9 data() {
10 10 return {
11   - src: "http://skywalking.shop.iocoder.cn/trace", // TODO 芋艿,后续改成配置读取
12   - height: document.documentElement.clientHeight - 94.5 + "px;",
13   - loading: true
  11 + url: "http://skywalking.shop.iocoder.cn/trace", // TODO 芋艿,后续改成配置读取
14 12 };
15 13 },
16   - mounted: function() {
17   - setTimeout(() => {
18   - this.loading = false;
19   - }, 230);
20   - const that = this;
21   - window.onresize = function temp() {
22   - that.height = document.documentElement.clientHeight - 94.5 + "px;";
23   - };
24   - }
25 14 };
26 15 </script>
... ...
yudao-ui-admin/src/views/infra/skywalking/log.vue
1 1 <template>
2   - <div v-loading="loading" :style="'height:'+ height">
3   - <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
4   - </div>
  2 + <i-frame :src="url" />
5 3 </template>
6 4 <script>
  5 +import iFrame from "@/components/iFrame/index";
7 6 export default {
8   - name: "SkyWalking-Log",
  7 + name: "Druid",
  8 + components: { iFrame },
9 9 data() {
10 10 return {
11   - src: "http://skywalking.shop.iocoder.cn/log", // TODO 芋艿,后续改成配置读取
12   - height: document.documentElement.clientHeight - 94.5 + "px;",
13   - loading: true
  11 + url: "http://skywalking.shop.iocoder.cn/log", // TODO 芋艿,后续改成配置读取
14 12 };
15 13 },
16   - mounted: function() {
17   - setTimeout(() => {
18   - this.loading = false;
19   - }, 230);
20   - const that = this;
21   - window.onresize = function temp() {
22   - that.height = document.documentElement.clientHeight - 94.5 + "px;";
23   - };
24   - }
25 14 };
26 15 </script>
... ...
yudao-ui-admin/src/views/tool/dbDoc/index.vue
... ... @@ -10,15 +10,17 @@
10 10  
11 11 <!-- 展示文档 -->
12 12 <div v-loading="loading" :style="'height:'+ height">
13   - <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
  13 + <i-frame :src="src" />
14 14 </div>
15 15 </div>
16 16 </template>
17 17 <script>
18 18 import { exportHtml, exportWord, exportMarkdown} from "@/api/tool/dbDoc";
  19 +import iFrame from "@/components/iFrame/index";
19 20  
20 21 export default {
21 22 name: "DBDoc",
  23 + components: { iFrame },
22 24 data() {
23 25 return {
24 26 height: document.documentElement.clientHeight - 94.5 + "px;",
... ...
yudao-ui-admin/src/views/tool/swagger/index.vue
1 1 <template>
2   - <div v-loading="loading" :style="'height:'+ height">
3   - <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
4   - </div>
  2 + <i-frame :src="url" />
5 3 </template>
6 4 <script>
  5 +import iFrame from "@/components/iFrame/index";
7 6 export default {
8   - name: "Swagger",
  7 + name: "Druid",
  8 + components: { iFrame },
9 9 data() {
10 10 return {
11   - src: process.env.VUE_APP_BASE_API + "/doc.html",
12   - height: document.documentElement.clientHeight - 94.5 + "px;",
13   - loading: true
  11 + url: process.env.VUE_APP_BASE_API + "/doc.html"
14 12 };
15 13 },
16   - mounted: function() {
17   - setTimeout(() => {
18   - this.loading = false;
19   - }, 230);
20   - const that = this;
21   - window.onresize = function temp() {
22   - that.height = document.documentElement.clientHeight - 94.5 + "px;";
23   - };
24   - }
25 14 };
26 15 </script>
... ...
更新日志.md
... ... @@ -18,7 +18,8 @@
18 18  
19 19 ### ⚠️ Warning
20 20  
21   -TODO
  21 +* 修复各种多 Maven Module 重构带来的 Bug,感谢大量群友的 PR 支持!
  22 +* 跟进 ruoyi-vue 3.4.0、3.5.0 版本,感谢这么优秀的开源项目!
22 23  
23 24 ### 📈 Statistic
24 25  
... ... @@ -34,7 +35,7 @@ TODO
34 35 * 【新增】前端的表格右侧工具栏组件支持显隐列,具体可见【用户管理】功能 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/20e34e35a3bdc48e6a4c58e3849aa729bd18efe5)
35 36 * 【新增】前端的菜单导航显示风格 TopNav(false 为 左侧导航菜单,true 为顶部导航菜单),支持布局的保存与重置 [commit1](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/4bf5b04d542014a49c5a41b20935cef35033a518) [commit2](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/cff4391f2d7830770731c0034085c0f77ea8c68e)
36 37 * 【新增】前端的网页标题支持根据选择的菜单,动态展示标题 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/7bf9a85263e0c44b2bc88485b83557c129583f5c)
37   -* 【新增】跟进 ruoyi-vue 3.4.0、3.5.0 版本,感谢这么优秀的开源项目!
  38 +* 【新增】前端的 iframe 组件,方便内嵌网页 [commit]()
38 39  
39 40 ### 🐞 Bug Fixes
40 41  
... ...