diff --git a/nezha-fronted/src/components/common/bottomBox/bottomBox.vue b/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
index b13d8bcfc..2d4e21a53 100644
--- a/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
+++ b/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
@@ -30,7 +30,7 @@
v-if="targetTab == 'assetDetail' && from == 'endpoint'"
@changeTab="changeTab">
-
+
@@ -76,19 +76,26 @@
methods: {
exitFullScreen() {
this.$emit("exitFullScreen");
+ this.$nextTick(this.afterResize());
},
fullScreen() {
this.$emit("fullScreen");
+ this.$nextTick(this.afterResize());
},
closeSubList() {
this.$emit("closeSubList");
},
listResize(e) {
this.$emit('listResize', e);
+ this.$nextTick(this.afterResize());
},
changeTab(tab) {
this.$emit('update:targetTab', tab);
- //this.targetTab = tab;
+ },
+ afterResize() {
+ if (this.from == 'endpoint' && this.targetTab == 'endpointQuery') {
+ this.$refs.endpointQuery.tableReload();
+ }
}
}
}
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
index 77933656f..f83bf34d4 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
@@ -69,7 +69,7 @@
+ @selection-change="selectChange" v-if="tableShow">
{
+ this.tableShow = true;
+ //this.queryEndpoint();
+ }, 300);
+ //this.$nextTick(() => {this.tableShow = true});
+ },
queryEndpoint() {
this.loading = true;
this.queryElementTips();
@@ -270,78 +279,77 @@
this.tableData = [];
this.tableDataCopy = '';
this.$get("/prom/api/v1/query?query={endpoint='" + this.currentEndpoint.id + "'}&time=" + this.formatTime).then(response=>{
- setTimeout(() => {
- this.loading = false;
- if(response.status==="success"){
- let results = response.data.result;
- this.queryData=JSON.parse(JSON.stringify(results));
- for(let result of results) {
- let metricName = result.metric.__name__;
- let temp = metricName;
- let simpleTemp = metricName;//显示简略信息:隐藏same labels后的结果
- let metricColor = "";
- let bracketsColor = "#eb7b18";//#eb7b18
- let labelColor = "#65bbd1";//#66d9ef
- let valueColor = "#61c261";//#74e680
- let colorTemp = `${metricName}`;
- let colorSimpleTemp = `${metricName}`;
- let metricTip = {};
- let queryInfos = (this.elementMetricDatas.filter((item)=> {
- return item.metric === temp;
- }));
- if(queryInfos && queryInfos.length > 0) {
- metricTip = queryInfos[0];
- } else {
- metricTip.metric=temp;
- }
- delete result.metric.__name__;
- temp += "{";
- simpleTemp += "{";
- colorTemp += `{`;
- colorSimpleTemp += `{`;
- let keys = Object.keys(result.metric);
- for (let index in keys){
- let key = keys[index];
- temp += key + "='" + result.metric[key] + "',";
- colorTemp += `${key}='${result.metric[key]}',`;
- if(!this.sameLabels.some((i)=> {return i == key})) {
- simpleTemp += key + "='" + result.metric[key] + "',";
- colorSimpleTemp += `${key}='${result.metric[key]}',`;
- }
- }
- if(temp.indexOf(',') != -1){
- temp = temp.substr(0,temp.length-1);
- }
- if(simpleTemp.indexOf(',') != -1){
- simpleTemp = simpleTemp.substr(0,simpleTemp.length-1);
- }
- if(colorTemp.indexOf(',') != -1){
- colorTemp = colorTemp.substr(0,colorTemp.length-1);
- }
- if(colorSimpleTemp.indexOf(',') != -1){
- colorSimpleTemp = colorSimpleTemp.substr(0,colorSimpleTemp.length-1);
- }
-
-
- temp += "}";
- simpleTemp += "}";
- colorTemp += `}`;
- colorSimpleTemp += `}`;
- if(!/.+\{.+\}/.test(simpleTemp)) {
- simpleTemp = simpleTemp.substr(0,simpleTemp.length-2);
- }
-
- if(!/.+\{<\/span>.+?\}/.test(colorSimpleTemp)){
- let metricReg=new RegExp(""+metricName+"<\/span>")
- colorSimpleTemp=metricReg.exec(colorSimpleTemp)[0];
- }
-
- let edpQueryData={element:temp,simpleElement:simpleTemp,colorElement:colorTemp,colorSimpleElement:colorSimpleTemp, value:result.value[1],type:(result.metric.type?result.metric.type:'2'),metricTip:metricTip};
- this.tableData.push(edpQueryData);
+ this.loading = false;
+ if(response.status==="success"){
+ let results = response.data.result;
+ this.queryData=JSON.parse(JSON.stringify(results));
+ for(let result of results) {
+ let metricName = result.metric.__name__;
+ let temp = metricName;
+ let simpleTemp = metricName;//显示简略信息:隐藏same labels后的结果
+ let metricColor = "";
+ let bracketsColor = "#eb7b18";//#eb7b18
+ let labelColor = "#65bbd1";//#66d9ef
+ let valueColor = "#61c261";//#74e680
+ let colorTemp = `${metricName}`;
+ let colorSimpleTemp = `${metricName}`;
+ let metricTip = {};
+ let queryInfos = (this.elementMetricDatas.filter((item)=> {
+ return item.metric === temp;
+ }));
+ if(queryInfos && queryInfos.length > 0) {
+ metricTip = queryInfos[0];
+ } else {
+ metricTip.metric=temp;
}
- this.tableDataCopy = JSON.stringify(this.tableData);
+ delete result.metric.__name__;
+ temp += "{";
+ simpleTemp += "{";
+ colorTemp += `{`;
+ colorSimpleTemp += `{`;
+ let keys = Object.keys(result.metric);
+ for (let index in keys){
+ let key = keys[index];
+ temp += key + "='" + result.metric[key] + "',";
+ colorTemp += `${key}='${result.metric[key]}',`;
+ if(!this.sameLabels.some((i)=> {return i == key})) {
+ simpleTemp += key + "='" + result.metric[key] + "',";
+ colorSimpleTemp += `${key}='${result.metric[key]}',`;
+ }
+ }
+ if(temp.indexOf(',') != -1){
+ temp = temp.substr(0,temp.length-1);
+ }
+ if(simpleTemp.indexOf(',') != -1){
+ simpleTemp = simpleTemp.substr(0,simpleTemp.length-1);
+ }
+ if(colorTemp.indexOf(',') != -1){
+ colorTemp = colorTemp.substr(0,colorTemp.length-1);
+ }
+ if(colorSimpleTemp.indexOf(',') != -1){
+ colorSimpleTemp = colorSimpleTemp.substr(0,colorSimpleTemp.length-1);
+ }
+
+
+ temp += "}";
+ simpleTemp += "}";
+ colorTemp += `}`;
+ colorSimpleTemp += `}`;
+ if(!/.+\{.+\}/.test(simpleTemp)) {
+ simpleTemp = simpleTemp.substr(0,simpleTemp.length-2);
+ }
+
+ if(!/.+\{<\/span>.+?\}/.test(colorSimpleTemp)){
+ let metricReg=new RegExp(""+metricName+"<\/span>")
+ colorSimpleTemp=metricReg.exec(colorSimpleTemp)[0];
+ }
+
+ let edpQueryData={element:temp,simpleElement:simpleTemp,colorElement:colorTemp,colorSimpleElement:colorSimpleTemp, value:result.value[1],type:(result.metric.type?result.metric.type:'2'),metricTip:metricTip};
+ this.tableData.push(edpQueryData);
}
- }, 300);
+ this.tableDataCopy = JSON.stringify(this.tableData);
+ this.$nextTick(this.$refs.endpointQueryTable.doLayout());
+ }
});
},
clearSelectedMetrics() {
@@ -675,7 +683,8 @@
},
mounted() {
this.getPanelData();
- this.$nextTick(() => {
+ //this.$nextTick(() => {
+ setTimeout(() => {
//绑定滚动条事件,控制top按钮
let el = this.$refs.endpointQueryTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
@@ -693,7 +702,9 @@
this.tableHover = false;
});
}
- });
+ }, 300);
+
+ //});
}
}