Toggle navigation
Toggle navigation
This project
Loading...
Sign in
monitor_v3
/
hg-monitor-web
·
Commits
Go to a project
GitLab
Go to group
Project
Activity
Files
Commits
Pipelines
0
Builds
0
Graphs
Milestones
Issues
0
Merge Requests
0
Members
Labels
Wiki
Forks
Network
Create a new issue
Download as
Email Patches
Plain Diff
Browse Files
Authored by
xwx
3 years ago
Commit
5cfced1749054d11b02c98ca3946824e7af1f92d
1 parent
584eb8e7
故障诊断基础资源汇总信息弹框
Show whitespace changes
Inline
Side-by-side
Showing
10 changed files
with
82 additions
and
29 deletions
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/apm/index.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/dialtest/index.html
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/dialtest/index.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/index.html
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/index.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/resItem/index.html
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/resItem/index.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/npm/index.html
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/npm/index.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/views/faultDiagnosis/result/service.js
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/apm/index.js
View file @
5cfced1
...
...
@@ -96,11 +96,9 @@ export default {
const
openBusScenarios
=
()
=>
{
let
param
=
[{
prop
:
'taskName'
,
width
:
150
,
label
:
'名称'
,
},{
prop
:
'taskType'
,
width
:
120
,
label
:
'类型'
,
}]
service
.
sendEventDiagnoseBusinessScenarios
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
(),
param
);
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/dialtest/index.html
View file @
5cfced1
...
...
@@ -2,7 +2,18 @@
<div
class=
"d-flex"
>
<img
src=
"../src/style/img/fault/dialtest.gif"
>
<h3
style=
"margin-left: 10px;color: #666666;font-size: 18px"
>
业务拨测
</h3>
<div
style=
"width: calc(100% - 200px);line-height: 54px"
class=
"align-right"
>
<div
style=
"line-height: 60px;"
class=
"m-l-6"
>
<el-tooltip
effect=
"light"
placement=
"top-start"
>
<template
#
content
>
以图标方式展示每个场景的拨测结果,颜色代表拨测结果
<br/>
红色:拨测结果
< 70
%;
橙色:
70
%
<=
拨测结果
<
90
%
;
蓝色:
90
%
<=
拨测结果
<
100
%
;
绿色:拨测结果
=
100
%
</
template
>
<i
class=
"iconfont icon-tishi"
/>
</el-tooltip>
</div>
<div
style=
"width: calc(100% - 250px);line-height: 54px"
class=
"align-right"
>
<a
class=
"m-r-20"
v-if=
"card && card.length > 0"
@
click=
"openMoreDialog"
>
更多
</a>
<a
v-model=
"cardName"
v-if=
"card && card.length > 0"
@
click=
"openOrCloseDialtest()"
>
{{cardName}}
</a>
</div>
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/dialtest/index.js
View file @
5cfced1
...
...
@@ -86,12 +86,17 @@ export default {
const
openBusScenarios
=
()
=>
{
let
param
=
[{
prop
:
'taskName'
,
width
:
150
,
label
:
'名称'
,
},{
prop
:
'taskType'
,
width
:
120
,
label
:
'类型'
,
render
:
function
(
row
)
{
if
(
row
.
taskType
==
1
)
{
return
'页面拨测'
;
}
else
if
(
row
.
taskType
==
2
)
{
return
'事务拨测'
;
}
}
}]
service
.
sendEventDiagnoseBusinessScenarios
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
(),
param
);
}
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/index.html
View file @
5cfced1
...
...
@@ -2,7 +2,7 @@
<div
class=
"d-flex"
>
<img
src=
"../src/style/img/fault/base.gif"
>
<h3
style=
"margin-left: 10px;color: #666666;font-size: 18px"
>
基础资源
</h3>
<div
style=
"width: calc(100% - 2
00
px);line-height: 54px;"
class=
"align-right"
>
<div
style=
"width: calc(100% - 2
25
px);line-height: 54px;"
class=
"align-right"
>
<a
class=
"m-r-20"
v-if=
"card && card.length > 0"
@
click=
"openMoreDialog"
>
更多
</a>
<a
v-model=
"cardName"
v-if=
"card && card.length > 0"
@
click=
"openOrCloseBase()"
>
{{cardName}}
</a>
</div>
...
...
@@ -55,6 +55,6 @@
</div>
<res-item
v-for=
"item in card"
v-if=
"cardOpen"
:cardList=
"item"
/>
<res-item
v-for=
"item in card"
v-if=
"cardOpen"
:cardList=
"item"
:faultNo=
"faultNo"
:targetType=
"targetType"
/>
</div>
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/index.js
View file @
5cfced1
...
...
@@ -38,6 +38,8 @@ export default {
cardName
.
value
=
'展开'
;
}
}
let
faultNo
=
props
.
faultNo
;
let
targetType
=
props
.
targetType
.
toLocaleLowerCase
();
let
getDialtestList
=
()
=>
{
let
params
=
{
faultNo
:
props
.
faultNo
,
...
...
@@ -60,7 +62,7 @@ export default {
const
openAlarm
=
()
=>
{
service
.
sendEventAlarmDialog
(
emit
,
{
faultNo
:
props
.
faultNo
,
targetType
:
props
.
targetType
targetType
:
props
.
targetType
.
toLocaleLowerCase
()
});
}
const
openMoreDialog
=
()
=>
{
...
...
@@ -69,13 +71,11 @@ export default {
//诊断资源
const
openBusScenarios
=
()
=>
{
let
param
=
[{
prop
:
'taskName'
,
width
:
150
,
label
:
'名称'
,
prop
:
'resName'
,
label
:
'资源名称'
,
},{
prop
:
'taskType'
,
width
:
120
,
label
:
'类型'
,
prop
:
'ip'
,
label
:
'IP地址'
,
}]
service
.
sendEventDiagnoseBusinessScenarios
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
(),
param
);
}
...
...
@@ -98,7 +98,9 @@ export default {
openAlarm
,
getFaultItemValue
:
service
.
getFaultItemValue
,
openBusScenarios
,
openKpiList
openKpiList
,
faultNo
,
targetType
}
}
}
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/resItem/index.html
View file @
5cfced1
...
...
@@ -7,16 +7,16 @@
</div>
<div>
<div
class=
"d-flex align-left"
>
<div
style=
"width: 2
0
0px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px"
>
<div
style=
"width: 2
3
0px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px"
>
<img
src=
"../src/style/img/fault/disRes.png"
>
<span
style=
"margin: 0px 6px 0px 6px;width: 105px"
>
诊断资源
</span>
<h
class=
"text-link"
>
{{getFaultItemValue(cardList,'diagnosticResources')}}
</h>
<h
class=
"text-link"
@
click=
"openBusScenarios()"
>
{{getFaultItemValue(cardList,'diagnosticResources')}}
</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
class=
"text-link"
>
{{getFaultItemValue(cardList,'diagnosticIndicators')}}
</h>
<h
class=
"text-link"
@
click=
"openKpiList()"
>
{{getFaultItemValue(cardList,'diagnosticIndicators')}}
</h>
</div>
|
<div
style=
"width: 200px;margin-left: 20px;display: flex;align-self: center;color: #666666;font-size: 16px"
>
...
...
@@ -26,7 +26,7 @@
</div>
</div>
<div
style=
"text-align: left;display: flex;margin-top: 10px;"
>
<div
style=
"width: 2
0
0px;margin-left: 20px;display: flex;align-self: center;color: #75af49;"
>
<div
style=
"width: 2
3
0px;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: 20px"
class=
"text-link"
>
{{getFaultItemValue(cardList,'normal')}}
</h>
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/item/resItem/index.js
View file @
5cfced1
...
...
@@ -5,7 +5,7 @@ export default {
name
:
'faultDialTest'
,
template
:
''
,
components
:
{},
props
:
[
'cardList'
],
props
:
[
'cardList'
,
'faultNo'
,
'targetType'
],
data
()
{
return
{}
},
...
...
@@ -29,6 +29,8 @@ export default {
dialTest
=
Vue
.
ref
([]);
}
}
let
faultNo
=
props
.
faultNo
;
let
targetType
=
props
.
targetType
;
let
getDialtestList
=
(
data
)
=>
{
for
(
let
i
=
0
;
i
<
data
.
length
;
i
++
)
{
let
resItem
=
{
...
...
@@ -82,6 +84,21 @@ export default {
const
openMoreDialog
=
()
=>
{
service
.
sendEventMoreDialog
(
emit
,
proxy
.
$global
,
cardList
.
faultFixInfoList
);
}
//诊断资源
const
openBusScenarios
=
()
=>
{
let
param
=
[{
prop
:
'resName'
,
label
:
'资源名称'
,
},{
prop
:
'ip'
,
label
:
'IP地址'
,
}]
service
.
sendEventDiagnoseBusinessScenarios
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
(),
param
,
props
.
cardList
.
resClass
);
}
//诊断指标
const
openKpiList
=
()
=>
{
service
.
sendEventDiagnoseKpiList
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
());
}
// 挂载完
Vue
.
onMounted
(()
=>
{
...
...
@@ -98,7 +115,11 @@ export default {
alarmColor
,
openMoreDialog
,
openAlarm
,
getFaultItemValue
:
service
.
getFaultItemValue
getFaultItemValue
:
service
.
getFaultItemValue
,
faultNo
,
targetType
,
openBusScenarios
,
openKpiList
}
}
}
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/npm/index.html
View file @
5cfced1
...
...
@@ -2,7 +2,18 @@
<div
class=
"d-flex"
>
<img
src=
"../src/style/img/fault/npm.gif"
>
<h3
style=
"margin-left: 10px;color: #666666;font-size: 18px"
>
NPM
</h3>
<div
style=
"width: calc(100% - 170px);line-height: 54px"
class=
"align-right"
>
<div
style=
"line-height: 60px;"
class=
"m-l-6"
>
<el-tooltip
effect=
"light"
placement=
"top-start"
>
<template
#
content
>
以图标方式展示每个链路节点数的监控结果,指标值颜色代表结果
<br/>
红色:监控结果
< 70
%;
橙色:
70
%
<=
监控结果
<
90
%
;
蓝色:
90
%
<=
监控结果
<
100
%
;
绿色:监控结果:=
100
%
</
template
>
<i
class=
"iconfont icon-tishi"
/>
</el-tooltip>
</div>
<div
style=
"width: calc(100% - 220px);line-height: 54px"
class=
"align-right"
>
<a
class=
"m-r-20"
v-if=
"card && card.length > 0"
@
click=
"openMoreDialog"
>
更多
</a>
<a
v-model=
"cardName"
v-if=
"card && card.length > 0"
@
click=
"openOrCloseNpm()"
>
{{cardName}}
</a>
</div>
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/components/page/faultDiagnosis/result/npm/index.js
View file @
5cfced1
...
...
@@ -92,13 +92,11 @@ export default {
//诊断链路场景
const
openBusScenarios
=
()
=>
{
let
param
=
[{
prop
:
'taskName'
,
width
:
150
,
prop
:
'streamName'
,
label
:
'名称'
,
},{
prop
:
'taskType'
,
width
:
120
,
label
:
'类型'
,
prop
:
'createBy'
,
label
:
'创建用户'
,
}]
service
.
sendEventDiagnoseBusinessScenarios
(
emit
,
props
.
faultNo
,
props
.
targetType
.
toLocaleLowerCase
(),
param
);
}
...
...
hg-monitor-web-zj/src/main/resources/static/vue3/src/views/faultDiagnosis/result/service.js
View file @
5cfced1
...
...
@@ -334,14 +334,21 @@ const faultEvent = () => {
* @param targetType 诊断类型
* @param columns 数组,表格列对象
*/
const
sendEventDiagnoseBusinessScenarios
=
(
emit
,
faultNo
,
targetType
,
columns
)
=>
{
const
sendEventDiagnoseBusinessScenarios
=
(
emit
,
faultNo
,
targetType
,
columns
,
resClass
)
=>
{
var
obj
=
{
columns
:
columns
,
data
:
[]
}
var
param
=
{
faultNo
:
faultNo
,
targetType
:
targetType
}
if
(
resClass
&&
resClass
!=
''
){
param
.
resClass
=
resClass
;
}
store
.
dispatch
(
'getFaultBusinessList'
,
{
faultNo
:
faultNo
,
targetType
:
targetType
}
).
then
((
res
)
=>
{
store
.
dispatch
(
'getFaultBusinessList'
,
param
).
then
((
res
)
=>
{
if
(
res
&&
res
.
success
)
{
obj
.
data
=
res
.
data
;
emit
(
'openDialog'
,
'more'
,
{},
obj
);
...
...
Please
register
or
login
to post a comment