Authored by xwx

故障诊断APM弹框

... ... @@ -59,30 +59,30 @@
<div style="width: 566px;min-height: 357px;background: url('../src/style/img/fault/apm/apmCard.png') no-repeat;background-size: 100% 100%;margin: 0px 0px 26px 90px;box-sizing: border-box;text-align: center;margin: 0 auto;padding-top: 65px">
<div style="color: #ffffff;font-size: 24px;">{{item.resClassName}}</div>
<img src="../src/style/img/fault/apm/apmAbout.png" style="padding-top: 30px;">
<div style="padding-top: 30px;font-size: 18px;color: #333333">应用:<span class="text-link">{{item.applicationName}}</span></div>
<div style="padding-top: 30px;font-size: 18px;color: #333333">应用:<span class="text-link" @click="openBusScenarios(item.resClass)">{{item.applicationName}}</span></div>
<hr style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="80%" color=#aed6f4 size=1>
<div style="text-align: left;display: flex;margin-top: 10px;margin-left: 76px;font-size: 18px;">
<div style="width: 230px;display: flex;align-self: center;">
<img src="../src/style/img/fault/base/alarm.png" style="width:22px;height: 22px;">
<span style="margin: 0px 6px;width: 133px;">响应时间告警量:</span>
<span class="text-link">{{item.responseNum}}</span>
<span class="text-link" @click="openAlarm(item.kpiId,item.resClass)">{{item.responseNum}}</span>
</div>
<div style="width: 230px;margin-left: 20px;display: flex;align-self: center;">
<img src="../src/style/img/fault/base/alarm.png" style="width:22px;height: 22px;">
<span style="margin: 0px 6px 0px 6px;width: 115px;">Fullgc告警量:</span>
<span class="text-link">{{item.FullGcNum}}</span>
<span class="text-link" @click="openAlarm(item.kpiId,item.resClass)">{{item.FullGcNum}}</span>
</div>
</div>
<div style="text-align: left;display: flex;margin-top: 10px;margin-left: 76px;font-size: 18px;">
<div style="width: 230px;display: flex;align-self: center;">
<img src="../src/style/img/fault/base/alarm.png" style="width:22px;height: 22px;">
<span style="margin: 0px 6px;width: 133px;">线程总数告警量:</span>
<span class="text-link">{{item.threadNum}}</span>
<span class="text-link" @click="openAlarm(item.kpiId,item.resClass)">{{item.threadNum}}</span>
</div>
<div style="width: 230px;margin-left: 20px;display: flex;align-self: center;">
<img src="../src/style/img/fault/base/alarm.png" style="width:22px;height: 22px;">
<span style="margin: 0px 6px 0px 6px;width: 115px;">错误率告警量:</span>
<span class="text-link">{{item.errorNum}}</span>
<span class="text-link" @click="openAlarm(item.kpiId,item.resClass)">{{item.errorNum}}</span>
</div>
</div>
... ...
... ... @@ -64,11 +64,14 @@ export default {
responseNum: 0,
errorNum: 0,
threadNum:0,
applicationName:0
applicationName:0,
resClass:''
}
for (let j = 0; j < data[i].length; j++) {
resItem.resClass = data[i][j].resClass;
resItem.resClassName = data[i][j].resClassName;
resItem.applicationName = data[i][j].applicationName;
resItem.applicationName = data[i][j].applicationName;
resItem.kpiId = data[i][j].kpiId;
if (data[i][j].kpiId == 'KPI3D67301E') {
resItem.FullGcNum = data[i][j].diagnosisResult;
} else if (data[i][j].kpiId == 'KPI7C4BEB26') {
... ... @@ -83,17 +86,19 @@ export default {
}
console.log(cardData.value)
}
const openAlarm = () => {
const openAlarm = (kpiId,resClass) => {
service.sendEventAlarmDialog(emit, {
faultNo: props.faultNo,
targetType: props.targetType
targetType: props.targetType.toLocaleLowerCase(),
kpiId:kpiId,
resClass:resClass,
});
}
const openMoreDialog = () => {
service.sendEventMoreDialog(emit, proxy.$global, card.value);
}
//诊断应用
const openBusScenarios = () => {
const openBusScenarios = (resClass) => {
let param = [{
prop: 'extendCol3',
label: '名称',
... ... @@ -110,7 +115,7 @@ export default {
prop: 'os',
label: '操作系统',
}]
service.sendEventDiagnoseBusinessScenarios(emit, props.faultNo,props.targetType.toLocaleLowerCase(),param);
service.sendEventDiagnoseBusinessScenarios(emit, props.faultNo,props.targetType.toLocaleLowerCase(),param,resClass);
}
const openKpiList = () => {
service.sendEventDiagnoseKpiList(emit, props.faultNo,props.targetType.toLocaleLowerCase());
... ...
... ... @@ -8,7 +8,7 @@
placement="top-start">
<template #content>
以图标方式展示每个资源类型的告警结果,颜色代表告警结果 <br/>
红色:存在严重告警; 色:存在重要告警; 橙色:存在一般告警; 绿色:无告警
红色:存在严重告警; 色:存在重要告警; 橙色:存在一般告警; 绿色:无告警
</template>
<i class="iconfont icon-tishi" />
</el-tooltip>
... ...
... ... @@ -283,7 +283,6 @@ const faultEvent = () => {
* @param arr [[{指标对象},{指标对象},....].[{指标对象},{指标对象},....]]
*/
const sendEventMoreDialog = (emit, global, arr, title) => {
debugger
if (!arr || arr.length == 0) {
global.showMsg("暂无数据!", "warning");
return;
... ... @@ -361,15 +360,15 @@ const faultEvent = () => {
label: '名称',
}, {
prop: 'kpiName',
width: 120,
width: 230,
label: '指标名称',
}, {
prop: 'diagnosisResult',
width: 80,
width: 200,
label: '诊断值',
}, {
prop: 'isAbnormal',
width: 80,
width: 200,
label: '诊断结果',
render: function (row) {
if (row) {
... ...