diff --git a/nezha-fronted/src/components/charts/chart-list.vue b/nezha-fronted/src/components/charts/chart-list.vue index 1d9098703..96daf696e 100644 --- a/nezha-fronted/src/components/charts/chart-list.vue +++ b/nezha-fronted/src/components/charts/chart-list.vue @@ -416,7 +416,7 @@ export default { return bus.timeFormate(newDate, 'yyyy-MM-dd hh:mm:ss'); }, // 删除图表 - removeChart(chartId) { + removeChart(chartId) { //from 区分从哪里点击的删除 1.从图表面板 2.从编辑框 const chart = this.dataList.find(item => item.id === chartId); if (chart) { this.$emit('on-remove-chart', chart); diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js index 223898eb0..c6b2a0ffa 100644 --- a/nezha-fronted/src/components/common/language/en.js +++ b/nezha-fronted/src/components/common/language/en.js @@ -258,6 +258,12 @@ const en = { loginType:'Login type',//'登录类型' password:'Password',//'密码' ssh:'SSH key',//'SSH-Key' + protocol:"Protocol", + sshProtocol:"SSH", + telnetProtocol:"Telnet", + userTip:"UserTip", + passwordTip:"PasswordTip", + reloginPasswordTip:"Relogin", account:'User name',//'用户名' port:'Port',//'端口' upload:'Upload',//'上传' @@ -475,7 +481,7 @@ const en = { param: 'Parameter',//"参数" path: 'Path',//"路径" asset: 'Device',//"设备" - lastUpdate: 'Last update time',//"最后更新时间" + lastUpdate: 'Last Reply',//"最后更新时间" moduleParameter: 'Module',//"组件参数" addGraph: 'View Graph', //添加图标 element: 'Element', diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue index a031157b4..bb4687d0b 100644 --- a/nezha-fronted/src/components/common/rightBox/assetBox.vue +++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue @@ -386,7 +386,7 @@
${metricName}`; + let colorSimpleTemp=`${metricName}`; let metricTip={}; let queryInfos=(this.elementMetricDatas.filter((item)=>{ return item.metric===temp; @@ -1149,20 +1159,37 @@ delete result.metric.__name__; temp+="{"; simpleTemp+="{"; - for (let key in result.metric){ + 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]}',`; } } - temp=temp.charAt(temp.length-1) == ","?temp.substr(0,temp.length-1):temp; - simpleTemp=simpleTemp.charAt(simpleTemp.length-1) == ","?simpleTemp.substr(0,simpleTemp.length-1):simpleTemp; + temp=temp.substr(0,temp.length-1); + simpleTemp=simpleTemp.substr(0,simpleTemp.length-1); + colorTemp=colorTemp.substr(0,colorTemp.length-1); + colorSimpleTemp=colorSimpleTemp.substr(0,colorSimpleTemp.length-1); + temp+="}"; simpleTemp+="}"; + colorTemp+=`}`; + colorSimpleTemp+=`}`; if(!/.+\{.+\}/.test(simpleTemp)){ simpleTemp=simpleTemp.substr(0,simpleTemp.length-2); } - let edpQueryData={element:temp,simpleElement:simpleTemp,value:result.value[1],type:(result.metric.type?result.metric.type:'2'),metricTip:metricTip}; + + 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.showTableData.push(edpQueryData); } this.showTableDataCopy=JSON.stringify(this.showTableData); @@ -1301,53 +1328,60 @@ axios.all(axiosArr).then(res =>{ res.forEach((response,promIndex)=>{ if (response.status == 200) { - let queryData=response.data.data.result[0]; - if(queryData){ - let chartData={ - type:"line", - symbol:'none', //去掉点 - smooth:true, //曲线变平滑 - }; - chartData.name=queryData.metric.__name__; - let alias=queryData.metric.__name__; - delete queryData.metric.__name__; - chartData.name+="{"; - alias+="{"; - Object.keys(queryData.metric).forEach((item,index)=>{ - let label=item; - let value=queryData.metric[label]; - chartData.name+=label +"='"+value+"',"; - if(!this.sameLabels.some((i)=>{return i == label})){ - alias+=label +"='"+value+"',"; + if(response.data.status == 'success'){ + let queryData=response.data.data.result[0]; + if(queryData){ + let chartData={ + type:"line", + symbol:'none', //去掉点 + smooth:true, //曲线变平滑 + }; + chartData.name=queryData.metric.__name__; + let alias=queryData.metric.__name__; + delete queryData.metric.__name__; + chartData.name+="{"; + alias+="{"; + Object.keys(queryData.metric).forEach((item,index)=>{ + let label=item; + let value=queryData.metric[label]; + chartData.name+=label +"='"+value+"',"; + if(!this.sameLabels.some((i)=>{return i == label})){ + alias+=label +"='"+value+"',"; + } + }) + chartData.name=chartData.name.charAt(chartData.name.length-1) == ","?chartData.name.substr(0,chartData.name.length-1):chartData.name; + alias=alias.charAt(alias.length-1) == ","?alias.substr(0,alias.length-1):alias; + chartData.name+="}"; + alias+="}"; + if(!/.+\{.+\}/.test(alias)){ + alias=alias.substr(0,alias.length-2); } - }) - chartData.name=chartData.name.charAt(chartData.name.length-1) == ","?chartData.name.substr(0,chartData.name.length-1):chartData.name; - alias=alias.charAt(alias.length-1) == ","?alias.substr(0,alias.length-1):alias; - chartData.name+="}"; - alias+="}"; - if(!/.+\{.+\}/.test(alias)){ - alias=alias.substr(0,alias.length-2); + let legend={ + name:chartData.name, + alias:alias, + showText:this.formatLegend(chartData.name) + } + this.legend.push(legend); + this.isGrey.push(false); + chartData.data=queryData.values.map((dpsItem, dpsIndex) => { + return [dpsItem[0] * 1000, Number(dpsItem[1])]; + }); + this.chartDatas.push(chartData); } - let legend={ - name:chartData.name, - alias:alias, - showText:this.formatLegend(chartData.name) - } - this.legend.push(legend); - this.isGrey.push(false); - chartData.data=queryData.values.map((dpsItem, dpsIndex) => { - return [dpsItem[0] * 1000, Number(dpsItem[1])]; - }); - this.chartDatas.push(chartData); + }else{ + this.$message.error(response.data.error) + console.error(response.data) } } }) this.$nextTick(()=>{ - this.graphChart.clear(); - this.chartOptions.color=this.bgColorList; - this.chartOptions.series=this.chartDatas; - this.graphChart.setOption(this.chartOptions);//创建图表 - this.$refs.chartScrollbar.update(); + if(this.graphChart){ + this.graphChart.clear(); + this.chartOptions.color=this.bgColorList; + this.chartOptions.series=this.chartDatas; + this.graphChart.setOption(this.chartOptions);//创建图表 + this.$refs.chartScrollbar.update(); + } }); }) },