zenghuapei
/
cyywl_server
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

v3.6.0 封装iframe组件

pull/2/head
YunaiV 2022-02-15 22:24:48 +08:00
parent 833ac54a2f
commit 4a8129bffa
8 changed files with 66 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
yudao-ui-admin/src/components/iFrame/index.vue Normal file
View File

@ -0,0 +1,36 @@
<template>
<div v-loading="loading" :style="'height:' + height">
<iframe
:src="src"
frameborder="no"
style="width: 100%; height: 100%"
scrolling="auto"
/>
</div>
</template>
<script>
export default {
props: {
src: {
type: String,
required: true
},
},
data() {
return {
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true,
url: this.src
};
},
mounted: function () {
setTimeout(() => {
this.loading = false;
}, 300);
const that = this;
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
};
</script>

19
yudao-ui-admin/src/views/infra/druid/index.vue
View File

@ -1,26 +1,15 @@
<template> <template>
<div v-loading="loading" :style="'height:'+ height"> <i-frame :src="url" />
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</template> </template>
<script> <script>
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "Druid", name: "Druid",
components: { iFrame },
data() { data() {
return { return {
src: process.env.VUE_APP_BASE_API + "/druid/index.html", url: process.env.VUE_APP_BASE_API + "/druid/index.html"
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true
}; };
}, },
mounted: function() {
setTimeout(() => {
this.loading = false;
}, 230);
const that = this;
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
}; };
</script> </script>

27
yudao-ui-admin/src/views/infra/server/index.vue
View File

@ -1,32 +1,15 @@
<template> <template>
<div v-loading="loading" :style="'height:'+ height"> <i-frame :src="url" />
<iframe ref="iframe" :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</template> </template>
<script> <script>
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "Server", name: "Druid",
components: { iFrame },
data() { data() {
return { return {
src: process.env.VUE_APP_BASE_API + "/admin", url: process.env.VUE_APP_BASE_API + "/admin"
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true
}; };
}, },
mounted: function() {
const that = this;
setTimeout(() => {
// 模拟点击【应用】菜单
// that.$refs["iframe"].contentWindow.document.getElementsByClassName('navbar-item')[2].click(); // TODO 暂时去掉，存在跨域问题
// 取消加载中
this.loading = false;
}, 230);
// 大小变化的监听
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
}; };
</script> </script>

21
yudao-ui-admin/src/views/infra/skywalking/index.vue
View File

@ -1,26 +1,15 @@
<template> <template>
<div v-loading="loading" :style="'height:'+ height"> <i-frame :src="url" />
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</template> </template>
<script> <script>
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "SkyWalking", name: "Druid",
components: { iFrame },
data() { data() {
return { return {
src: "http://skywalking.shop.iocoder.cn/trace", // TODO 芋艿，后续改成配置读取 url: "http://skywalking.shop.iocoder.cn/trace", // TODO 芋艿，后续改成配置读取
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true
}; };
}, },
mounted: function() {
setTimeout(() => {
this.loading = false;
}, 230);
const that = this;
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
}; };
</script> </script>

21
yudao-ui-admin/src/views/infra/skywalking/log.vue
View File

@ -1,26 +1,15 @@
<template> <template>
<div v-loading="loading" :style="'height:'+ height"> <i-frame :src="url" />
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</template> </template>
<script> <script>
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "SkyWalking-Log", name: "Druid",
components: { iFrame },
data() { data() {
return { return {
src: "http://skywalking.shop.iocoder.cn/log", // TODO 芋艿，后续改成配置读取 url: "http://skywalking.shop.iocoder.cn/log", // TODO 芋艿，后续改成配置读取
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true
}; };
}, },
mounted: function() {
setTimeout(() => {
this.loading = false;
}, 230);
const that = this;
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
}; };
</script> </script>

4
yudao-ui-admin/src/views/tool/dbDoc/index.vue
View File

@ -10,15 +10,17 @@
<!-- 展示文档 --> <!-- 展示文档 -->
<div v-loading="loading" :style="'height:'+ height"> <div v-loading="loading" :style="'height:'+ height">
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" /> <i-frame :src="src" />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { exportHtml, exportWord, exportMarkdown} from "@/api/tool/dbDoc"; import { exportHtml, exportWord, exportMarkdown} from "@/api/tool/dbDoc";
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "DBDoc", name: "DBDoc",
components: { iFrame },
data() { data() {
return { return {
height: document.documentElement.clientHeight - 94.5 + "px;", height: document.documentElement.clientHeight - 94.5 + "px;",

21
yudao-ui-admin/src/views/tool/swagger/index.vue
View File

@ -1,26 +1,15 @@
<template> <template>
<div v-loading="loading" :style="'height:'+ height"> <i-frame :src="url" />
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</template> </template>
<script> <script>
import iFrame from "@/components/iFrame/index";
export default { export default {
name: "Swagger", name: "Druid",
components: { iFrame },
data() { data() {
return { return {
src: process.env.VUE_APP_BASE_API + "/doc.html", url: process.env.VUE_APP_BASE_API + "/doc.html"
height: document.documentElement.clientHeight - 94.5 + "px;",
loading: true
}; };
}, },
mounted: function() {
setTimeout(() => {
this.loading = false;
}, 230);
const that = this;
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;";
};
}
}; };
</script> </script>

5
更新日志.md
View File

@ -18,7 +18,8 @@
### ⚠️ Warning ### ⚠️ Warning
TODO * 修复各种多 Maven Module 重构带来的 Bug，感谢大量群友的 PR 支持！
* 跟进 ruoyi-vue 3.4.0、3.5.0 版本，感谢这么优秀的开源项目！
### 📈 Statistic ### 📈 Statistic
@ -34,7 +35,7 @@ TODO
* 【新增】前端的表格右侧工具栏组件支持显隐列，具体可见【用户管理】功能 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/20e34e35a3bdc48e6a4c58e3849aa729bd18efe5) * 【新增】前端的表格右侧工具栏组件支持显隐列，具体可见【用户管理】功能 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/20e34e35a3bdc48e6a4c58e3849aa729bd18efe5)
* 【新增】前端的菜单导航显示风格 TopNav（false 为 左侧导航菜单，true 为顶部导航菜单），支持布局的保存与重置 [commit1](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/4bf5b04d542014a49c5a41b20935cef35033a518) [commit2](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/cff4391f2d7830770731c0034085c0f77ea8c68e) * 【新增】前端的菜单导航显示风格 TopNav（false 为 左侧导航菜单，true 为顶部导航菜单），支持布局的保存与重置 [commit1](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/4bf5b04d542014a49c5a41b20935cef35033a518) [commit2](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/cff4391f2d7830770731c0034085c0f77ea8c68e)
* 【新增】前端的网页标题支持根据选择的菜单，动态展示标题 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/7bf9a85263e0c44b2bc88485b83557c129583f5c) * 【新增】前端的网页标题支持根据选择的菜单，动态展示标题 [commit](https://gitee.com/zhijiantianya/ruoyi-vue-pro/commit/7bf9a85263e0c44b2bc88485b83557c129583f5c)
* 【新增】跟进 ruoyi-vue 3.4.0、3.5.0 版本，感谢这么优秀的开源项目！ * 【新增】前端的 iframe 组件，方便内嵌网页 [commit]()
### 🐞 Bug Fixes ### 🐞 Bug Fixes