monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 137d0a05b1113cca539b416282fb1bc03a8fc43b 2 parents 51d0d755 217b8b29

Merge branch 'master-v32-xwx' into 'master' 

二级页面无数据点击展开Js报错



See merge request !793
Inline Side-by-side
Showing 8 changed files with 59 additions and 33 deletions
... ... @@ -4,7 +4,7 @@
<h3 style="margin-left: 10px;color: #666666;font-size: 18px">APM</h3>
<div style="width: calc(100% - 170px);line-height: 54px;font-size: 14px" class="align-right">
<a class="m-r-20" s @click="">更多</a>
<a v-model="cardName" @click="openOrCloseApm(dialTest.faultFixInfoList)">{{cardName}}</a>
<a v-model="cardName" @click="openOrCloseApm()">{{cardName}}</a>
</div>
</div>
<el-divider/>
... ... @@ -55,32 +55,37 @@
</div>
<div v-if="cardOpen"
style="margin-top:20px;background-color: whitesmoke;display: flex;justify-content: flex-start;flex-wrap: wrap;padding: 26px 26px 0px 26px;">
<div v-for="item in card" style="width: 50%;overflow: hidden;">
<div v-for="item in cardData" style="width: 50%;overflow: hidden;">
<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: white;font-size: 25px;">{{item.resClassName}}</div>
<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: 20px;">应用：<span>{{item.use}}</span></div>
<div style="padding-top: 30px;font-size: 18px;color: #333333">应用：<span class="text-link">{{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: 200px;margin-left: 10px;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: 95px">响应时间:</span>
<span class="text-link">{{item.time ? item.time : 0}}</span>
<span class="text-link">{{item.responseNum}}</span>
</div>
<div style="width: 200px;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: 95px">Fullgc:</span>
<span class="text-link">{{item.count ? item.count : 0}}</span>
<span class="text-link">{{item.FullGcNum}}</span>
</div>
</div>
<div style="text-align: left;display: flex;margin-top: 10px;margin-left: 76px;font-size: 18px;">
<div style="width: 200px;margin-left: 10px;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: 95px">线程总数:</span>
<span class="text-link">{{item.count ? item.count : 0}}</span>
<span class="text-link">{{item.threadNum}}</span>
</div>
<div style="width: 200px;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: 95px">错误率:</span>
<span class="text-link">{{item.error ? item.count : 0}}</span>
<span class="text-link">{{item.errorNum}}</span>
</div>
</div>
</div>
</div>
</div>
... ...
... ... @@ -22,13 +22,17 @@ export default {
let card = Vue.ref({});
let cardData = Vue.ref([]);
let cardOpen = Vue.ref(false);
let openOrCloseApm = (data) => {
let openOrCloseApm = () => {
cardOpen.value = !cardOpen.value;
if (cardOpen.value){
cardName.value='收起';
getDialtestCard(data)
}else {
cardName.value='展开';
if (cardOpen.value) {
cardName.value = '收起';
debugger
if (dialTest.value != '' && dialTest.value != null) {
getDialtestCard(dialTest.value.faultFixInfoList);
}
} else {
cardName.value = '展开';
cardData = Vue.ref([]);
}
}
... ... @@ -50,16 +54,25 @@ export default {
}
let getDialtestCard = (data) => {
for (let i = 0; i < data.length; i++) {
let resItem={
resClassName:'',
FullGcNume:'',
FullGcNum:'',
let resItem = {
resClassName: 0,
FullGcNum: 0,
responseNum: 0,
errorNum: 0,
threadNum:0,
applicationName:0
}
for (let j = 0; j < data[i].length; j++) {
if (data[i][j].kpiId=='KPI3D67301E'){
resItem.FullGcNume=data[i][j].kpiName;
resItem.resClassName=data[i][j].resClassName;
resItem.FullGcNum=data[i][j].diagnosisResult;
resItem.resClassName = data[i][j].resClassName;
resItem.applicationName = data[i][j].applicationName;
if (data[i][j].kpiId == 'KPI3D67301E') {
resItem.FullGcNum = data[i][j].diagnosisResult;
} else if (data[i][j].kpiId == 'KPI7C4BEB26') {
resItem.threadNum = data[i][j].diagnosisResult;
} else if (data[i][j].kpiId == 'KPI678F9FC3') {
resItem.responseNum = data[i][j].diagnosisResult;
} else if (data[i][j].kpiId == 'KPICC063E40') {
resItem.errorNum = data[i][j].diagnosisResult;
}
}
cardData.value.push(resItem);
... ...
... ... @@ -4,7 +4,7 @@
<h3 style="margin-left: 10px;color: #666666;font-size: 18px">业务拨测</h3>
<div style="width: calc(100% - 200px);line-height: 54px" class="align-right">
<a class="m-r-20" @click="">更多</a>
<a v-model="cardName" @click="openOrCloseDialtest(dialTest.faultFixInfoList)">{{cardName}}</a>
<a v-model="cardName" @click="openOrCloseDialtest()">{{cardName}}</a>
</div>
</div>
<el-divider/>
... ...
... ... @@ -22,13 +22,16 @@ export default {
let card = Vue.ref({})
let cardOpen = Vue.ref(false);
let cardName = Vue.ref('展开');
let openOrCloseDialtest = (data) => {
let openOrCloseDialtest = () => {
cardOpen.value = !cardOpen.value;
if (cardOpen.value){
cardName.value='收起';
getDialtestCard(data);
if (dialTest.value!=''&&dialTest.value!=null){
getDialtestCard(dialTest.value.faultFixInfoList);
}
}else {
cardName.value='展开';
cardData = Vue.ref([]);
}
}
... ...
... ... @@ -47,7 +47,7 @@
</div>
<div class="align-center" style="flex: 1;text-align: right;margin-right: 80px;">
<a class="m-r-20" @click="">更多</a>
<a v-model="cardName" @click="openOrCloseCard(cardList.faultFixInfoList)">{{cardName}}</a>
<a v-model="cardName" @click="openOrCloseCard()">{{cardName}}</a>
</div>
</div>
<div v-if="cardOpen"
... ... @@ -119,7 +119,7 @@
<el-col :span="9" style="line-height: 36px;color: gainsboro;">
</el-col>
<el-col :span="1" class="align-center">
<img src="../src/style/img/fault/base/时间-绿.png">
<img src="../src/style/img/fault/base/time-green.png">
</el-col>
<el-col :span="5" class="align-center">
{{item.collTime}}
... ...
... ... @@ -16,13 +16,16 @@ export default {
let cardOpen = Vue.ref(false);
let cardName = Vue.ref('展开');
let alarmColor = Vue.ref();
let openOrCloseCard = (data) => {
let openOrCloseCard = () => {
cardOpen.value = !cardOpen.value;
if (cardOpen.value){
cardName.value='收起';
getDialtestList(data)
if (props.cardList!=''&&props.cardList!=null){
getDialtestList(props.cardList.faultFixInfoList);
}
}else {
cardName.value='展开';
dialTest = Vue.ref([]);
}
}
let getDialtestList = (data) => {
... ...
... ... @@ -4,7 +4,7 @@
<h3 style="margin-left: 10px;color: #666666;font-size: 18px">NPM</h3>
<div style="width: calc(100% - 170px);line-height: 54px" class="align-right">
<a class="m-r-20" @click="">更多</a>
<a v-model="cardName" @click="openOrCloseNpm(dialTest.faultFixInfoList)">{{cardName}}</a>
<a v-model="cardName" @click="openOrCloseNpm()">{{cardName}}</a>
</div>
</div>
<el-divider/>
... ...
... ... @@ -22,14 +22,16 @@ export default {
let cardOpen = Vue.ref(false);
let cardData = Vue.ref([]);
let cardName = Vue.ref('展开');
let openOrCloseNpm = (data) => {
debugger
let openOrCloseNpm = () => {
cardOpen.value = !cardOpen.value;
if (cardOpen.value){
cardName.value='收起';
getDialtestCard(data);
if (dialTest.value!=''&&dialTest.value!=null){
getDialtestCard(dialTest.value.faultFixInfoList);
}
}else {
cardName.value='展开';
cardData = Vue.ref([]);
}
}
let getDialtestCard = (data) => {
... ...