diff --git a/nezha-fronted/src/assets/css/common.scss b/nezha-fronted/src/assets/css/common.scss
index b631510aa..a2e9b390f 100644
--- a/nezha-fronted/src/assets/css/common.scss
+++ b/nezha-fronted/src/assets/css/common.scss
@@ -162,3 +162,10 @@
padding-bottom: 10px;
}
}
+.icon {
+ width: 1em;
+ height: 1em;
+ vertical-align: -0.15em;
+ fill: currentColor;
+ overflow: hidden;
+}
diff --git a/nezha-fronted/src/assets/css/font/iconfont.js b/nezha-fronted/src/assets/css/font/iconfont.js
new file mode 100644
index 000000000..d32c0cbe7
--- /dev/null
+++ b/nezha-fronted/src/assets/css/font/iconfont.js
@@ -0,0 +1 @@
+!function(a){var c,h,l,z,o,i='',v=(v=document.getElementsByTagName("script"))[v.length-1].getAttribute("data-injectcss"),t=function(a,c){c.parentNode.insertBefore(a,c)};if(v&&!a.__iconfont__svg__cssinject__){a.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}function m(){o||(o=!0,l())}function p(){try{z.documentElement.doScroll("left")}catch(a){return void setTimeout(p,50)}m()}c=function(){var a,c;(c=document.createElement("div")).innerHTML=i,i=null,(a=c.getElementsByTagName("svg")[0])&&(a.setAttribute("aria-hidden","true"),a.style.position="absolute",a.style.width=0,a.style.height=0,a.style.overflow="hidden",c=a,(a=document.body).firstChild?t(c,a.firstChild):a.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(c,0):(h=function(){document.removeEventListener("DOMContentLoaded",h,!1),c()},document.addEventListener("DOMContentLoaded",h,!1)):document.attachEvent&&(l=c,z=a.document,o=!1,p(),z.onreadystatechange=function(){"complete"==z.readyState&&(z.onreadystatechange=null,m())})}(window);
\ No newline at end of file
diff --git a/nezha-fronted/src/components/common/project/topology.scss b/nezha-fronted/src/components/common/project/topology.scss
index 8b61412f2..c8660b557 100644
--- a/nezha-fronted/src/components/common/project/topology.scss
+++ b/nezha-fronted/src/components/common/project/topology.scss
@@ -545,3 +545,11 @@
.selpop {
cursor: pointer;
}
+.topo-noData /deep/ .icon{
+ width: 5rem;
+ height: 5rem;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%,-50%);
+}
diff --git a/nezha-fronted/src/components/common/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue
index 29114dd1e..2988ca6f4 100644
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -228,6 +228,14 @@
>
+
@@ -393,6 +401,7 @@ export default {
bus.timeFormate(bus.getOffsetTimezoneData(-1), 'yyyy-MM-dd hh:mm:ss'),
bus.timeFormate(bus.getOffsetTimezoneData(), 'yyyy-MM-dd hh:mm:ss')
],
+ showNoData: false,
topologyInfo: {
fontSize: 14,
align: 'left',
@@ -771,6 +780,11 @@ export default {
}
this.$get('monitor/project/topo', { projectId: this.obj.id }).then(res => {
let data = res.data.topo
+ if (!res.data.topo || !res.data.topo.pens.length) {
+ this.showNoData = true
+ } else {
+ this.showNoData = false
+ }
if (this.isPreview) {
data = this.previewData
}
@@ -1816,6 +1830,7 @@ export default {
editTopology (val) {
this.editTopologyFlag = true
+ this.showNoData = false
this.topoScreenState = JSON.parse(JSON.stringify(this.topoScreen))
this.$store.commit('setShowTopoScreen', true)
setTimeout(() => {
diff --git a/nezha-fronted/src/main.js b/nezha-fronted/src/main.js
index 978da3b35..8846b0c5d 100644
--- a/nezha-fronted/src/main.js
+++ b/nezha-fronted/src/main.js
@@ -3,6 +3,7 @@ import 'element-ui/lib/theme-chalk/index.css'
import 'xterm/dist/xterm.css'
import '@/assets/stylus/main.scss'
import '@/assets/css/main.scss'
+import '@/assets/css/font/iconfont.js'
import ElementUI from 'element-ui'
import i18n from './components/common/i18n'