monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by wangtao
Commit 51d0d75579687c3b5520ef7b2a6db18f5a5cfbcd 1 parent 86a54b6d

故障调整

Inline Side-by-side
Showing 6 changed files with 74 additions and 17 deletions
... ... @@ -44,7 +44,7 @@
<body>
<div id="app">
<router-view></router-view>
<router-view v-f-tips></router-view>
<!-- <div id="nav">
<p>
<router-link to="/vue3/test/">首页</router-link>&nbsp;&nbsp;&nbsp;
... ...
... ... @@ -204,4 +204,16 @@ a {
margin-top: 6px;
}
/* 文本超长胜率好*/
.text-overflow{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/*下划线*/
.text-link{
text-decoration: underline;
cursor: pointer;
}
... ...
... ... @@ -65,7 +65,48 @@ Promise.all([
// }
// })
app.config.globalProperties.$global = res[3].default
var __global = res[3].default;
// created：在绑定元素的属性前，或者事件监听器应用前调用
// beforeMount：在元素被插入到DOM前调用，例如我们想要实现输入框的自动聚焦，就不能在beforeMount钩子中实现
// mounted：在绑定元素的父组件以及自己的所有子节点都挂载完毕后调用，这个时候DOM已经渲染出来，我们实现输入框自动聚焦也是在这个钩子函数中实现
// beforeUpdate：绑定元素的父组件更新前调用
// updated：在绑定元素的父组件以及自己的所有子节点都更新完毕后调用
// beforeUnmount：绑定元素的父组件卸载前调用
// unmounted：绑定元素的父组件卸载后调用
// 自定义指令
app.directive('f-tips', {
// 当被绑定的元素插入到 DOM 中时……
mounted(el, binding, vnode) {
var hash = window.top.location.hash
// 获取所有子元素
let getChild = (elm,callback) =>{
var list = elm.childNodes;
if(list && list.length > 0){
list.forEach(function(elItem){
getChild(elItem,callback);
callback(elItem)
});
}
}
getChild(el,function (elItem){
$(elItem).attr('wwwwwwwwwwwwww',$(elItem).text());
});
// var contextmenuEl = '<ul id="tipContextmenu" class="contextmenu-style" style="color:#fff;">';
// contextmenuEl += '<li>测试提示</li>';
// contextmenuEl += '</ul>';
// __global.layer.tips(contextmenuEl, el, {
// time: 0,
// tips: [3, '#1e9fff'],
// success() {
// }
// })
}
})
app.config.globalProperties.$global = __global
app.config.globalProperties.$http = res[4].default
app.mount('#app'); // 挂载Vue的app实例
})
... ...
... ... @@ -15,32 +15,32 @@
<div style="width: 230px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px">
<img src="../src/style/img/fault/npm/npmLink.png">
<span style="margin: 0px 6px 0px 6px;width: 105px">诊断应用</span>
<h>{{dialTest && dialTest.diagnosticResources ?dialTest.diagnosticResources:0}}</h>
<h class="text-link">{{dialTest && dialTest.diagnosticResources ?dialTest.diagnosticResources:0}}</h>
</div>
|
<div style="width: 200px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px">
<img src="../src/style/img/fault/disKpi.png">
<span style="margin: 0px 6px 0px 6px;width: 105px">诊断指标</span>
<h>{{dialTest && dialTest.diagnosticIndicators ?dialTest.diagnosticIndicators:0}}</h>
<h class="text-link">{{dialTest && dialTest.diagnosticIndicators ?dialTest.diagnosticIndicators:0}}</h>
</div>
|
<div style="width: 200px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px">
<img src="../src/style/img/fault/disItem.png">
<span style="margin: 0px 6px 0px 6px;width: 105px"> 诊断项</span>
<h>{{dialTest && dialTest.diagnosticItem ?dialTest.diagnosticItem:0}}</h>
<h class="text-link">{{dialTest && dialTest.diagnosticItem ?dialTest.diagnosticItem:0}}</h>
</div>
</div>
<div style="text-align: left;display: flex;margin-top: 10px;">
<div style="width: 230px;margin-left: 20px;display: flex;align-self: center;color: #75af49;">
<img src="../src/style/img/fault/success.png" style="width: 22px;height: 22px;">
<span style="margin: 0px 6px 0px 6px;width: 105px;font-size: 16px">正常</span>
<h style="font-size: 24px">{{dialTest && dialTest.normal ?dialTest.normal:0}}</h>
<h class="text-link" style="font-size: 24px">{{dialTest && dialTest.normal ?dialTest.normal:0}}</h>
</div>
|
<div style="width: 200px;margin-left: 20px;display: flex;align-self: center;color: #febb1a;">
<img src="../src/style/img/fault/error.png" style="width: 22px;height: 22px;">
<span style="margin: 0px 6px 0px 6px;width: 105px;font-size: 16px"> 异常</span>
<h style="font-size: 24px">{{dialTest && dialTest.abnormal ?dialTest.abnormal:0}}</h>
<h class="text-link" style="font-size: 24px">{{dialTest && dialTest.abnormal ?dialTest.abnormal:0}}</h>
</div>
</div>
</div>
... ... @@ -57,31 +57,30 @@
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 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[0].resClassName}}</div>
<div style="color: white;font-size: 25px;">{{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[0].use}}</span></div>
<div style="padding-top: 30px;font-size: 20px;">应用：<span>{{item.use}}</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;">
<span style="margin: 0px 6px;width: 95px">响应时间:</span>
<span>{{item.time}}</span>
<span class="text-link">{{item.time ? item.time : 0}}</span>
</div>
<div style="width: 200px;margin-left: 20px;display: flex;align-self: center;">
<span style="margin: 0px 6px 0px 6px;width: 95px">Fullgc:</span>
<span>{{item[0].count}}</span>
<span class="text-link">{{item.count ? item.count : 0}}</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;">
<span style="margin: 0px 6px;width: 95px">线程总数:</span>
<span>{{item.count}}</span>
<span class="text-link">{{item.count ? item.count : 0}}</span>
</div>
<div style="width: 200px;margin-left: 20px;display: flex;align-self: center;">
<span style="margin: 0px 6px 0px 6px;width: 95px">错误率:</span>
<span>{{item.error}}</span>
<span class="text-link">{{item.error ? item.count : 0}}</span>
</div>
</div>
</div>
</div>
</div>
... ...
... ... @@ -28,6 +28,9 @@ export default {
let faultDetailDialogTitle = Vue.ref('');
let faultDetailDetailInfo = Vue.ref({
faultNo: '',
resId: '',
kpiId: '',
flag: '',
items: [{
faultType: 'NETLINK',
faultTypeName: '网络链路',
... ...
... ... @@ -76,12 +76,14 @@ const alarmService = () => {
alarmFlg.value = flg;
}
let openAlarmDialog = (proxy, faultNo, targetType, resId, kpiId, flag) => {
let openAlarmDialog = (proxy, faultNo, targetType, resId, kpiId, flag, resClass) => {
showAlarmDialog(true);
// 获取告警列表
let params = {
// 基础更多查询需要传入对应的资源类型
resClass: resClass,
faultNo: faultNo,
targetType: targetType,
type: targetType,
resId: resId,
kpiId: kpiId,
flag: flag
... ... @@ -137,7 +139,7 @@ const alarmService = () => {
}
}];
proxy.$http.get(`/api-web/fault/result/findAlarmList`, params, function (res) {
proxy.$http.get(`/api-web/fault/result/alarmList`, params, function (res) {
if (res && res.success) {
if (res.data) {
alarmList.value.dataList = res.data;
... ...