monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by wangtao
Commit b02b7f0456108f59c7e1ab8f319b3028a2e112ca 1 parent f96fe19b

故障诊断调整

Inline Side-by-side
Showing 10 changed files with 94 additions and 24 deletions
@@ -55,6 +55,18 @@ @@ -55,6 +55,18 @@
55 <ul class="icon_lists dib-box"> 55 <ul class="icon_lists dib-box">
56 56
57 <li class="dib"> 57 <li class="dib">
  58 + <span class="icon iconfont">&#xec1e;</span>
  59 + <div class="name">点</div>
  60 + <div class="code-name">&amp;#xec1e;</div>
  61 + </li>
  62 +
  63 + <li class="dib">
  64 + <span class="icon iconfont">&#xe8c4;</span>
  65 + <div class="name">216更多-竖向</div>
  66 + <div class="code-name">&amp;#xe8c4;</div>
  67 + </li>
  68 +
  69 + <li class="dib">
58 <span class="icon iconfont">&#xe67b;</span> 70 <span class="icon iconfont">&#xe67b;</span>
59 <div class="name">微信</div> 71 <div class="name">微信</div>
60 <div class="code-name">&amp;#xe67b;</div> 72 <div class="code-name">&amp;#xe67b;</div>
@@ -1434,9 +1446,9 @@ @@ -1434,9 +1446,9 @@
1434 <pre><code class="language-css" 1446 <pre><code class="language-css"
1435 >@font-face { 1447 >@font-face {
1436 font-family: 'iconfont'; 1448 font-family: 'iconfont';
1437 - src: url('iconfont.woff2?t=1654501118919') format('woff2'),  
1438 - url('iconfont.woff?t=1654501118919') format('woff'),  
1439 - url('iconfont.ttf?t=1654501118919') format('truetype'); 1449 + src: url('iconfont.woff2?t=1658918655869') format('woff2'),
  1450 + url('iconfont.woff?t=1658918655869') format('woff'),
  1451 + url('iconfont.ttf?t=1658918655869') format('truetype');
1440 } 1452 }
1441 </code></pre> 1453 </code></pre>
1442 <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> 1454 <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -1463,6 +1475,24 @@ @@ -1463,6 +1475,24 @@
1463 <ul class="icon_lists dib-box"> 1475 <ul class="icon_lists dib-box">
1464 1476
1465 <li class="dib"> 1477 <li class="dib">
  1478 + <span class="icon iconfont icon-dian"></span>
  1479 + <div class="name">
  1480 + 点
  1481 + </div>
  1482 + <div class="code-name">.icon-dian
  1483 + </div>
  1484 + </li>
  1485 +
  1486 + <li class="dib">
  1487 + <span class="icon iconfont icon-gengduo-shuxiang"></span>
  1488 + <div class="name">
  1489 + 216更多-竖向
  1490 + </div>
  1491 + <div class="code-name">.icon-gengduo-shuxiang
  1492 + </div>
  1493 + </li>
  1494 +
  1495 + <li class="dib">
1466 <span class="icon iconfont icon-weixin"></span> 1496 <span class="icon iconfont icon-weixin"></span>
1467 <div class="name"> 1497 <div class="name">
1468 微信 1498 微信
@@ -3534,6 +3564,22 @@ @@ -3534,6 +3564,22 @@
3534 3564
3535 <li class="dib"> 3565 <li class="dib">
3536 <svg class="icon svg-icon" aria-hidden="true"> 3566 <svg class="icon svg-icon" aria-hidden="true">
  3567 + <use xlink:href="#icon-dian"></use>
  3568 + </svg>
  3569 + <div class="name">点</div>
  3570 + <div class="code-name">#icon-dian</div>
  3571 + </li>
  3572 +
  3573 + <li class="dib">
  3574 + <svg class="icon svg-icon" aria-hidden="true">
  3575 + <use xlink:href="#icon-gengduo-shuxiang"></use>
  3576 + </svg>
  3577 + <div class="name">216更多-竖向</div>
  3578 + <div class="code-name">#icon-gengduo-shuxiang</div>
  3579 + </li>
  3580 +
  3581 + <li class="dib">
  3582 + <svg class="icon svg-icon" aria-hidden="true">
3537 <use xlink:href="#icon-weixin"></use> 3583 <use xlink:href="#icon-weixin"></use>
3538 </svg> 3584 </svg>
3539 <div class="name">微信</div> 3585 <div class="name">微信</div>
1 @font-face { 1 @font-face {
2 font-family: "iconfont"; /* Project id 2843738 */ 2 font-family: "iconfont"; /* Project id 2843738 */
3 - src: url('iconfont.woff2?t=1654501118919') format('woff2'),  
4 - url('iconfont.woff?t=1654501118919') format('woff'),  
5 - url('iconfont.ttf?t=1654501118919') format('truetype'); 3 + src: url('iconfont.woff2?t=1658918655869') format('woff2'),
  4 + url('iconfont.woff?t=1658918655869') format('woff'),
  5 + url('iconfont.ttf?t=1658918655869') format('truetype');
6 } 6 }
7 7
8 .iconfont { 8 .iconfont {
@@ -13,6 +13,14 @@ @@ -13,6 +13,14 @@
13 -moz-osx-font-smoothing: grayscale; 13 -moz-osx-font-smoothing: grayscale;
14 } 14 }
15 15
  16 +.icon-dian:before {
  17 + content: "\ec1e";
  18 +}
  19 +
  20 +.icon-gengduo-shuxiang:before {
  21 + content: "\e8c4";
  22 +}
  23 +
16 .icon-weixin:before { 24 .icon-weixin:before {
17 content: "\e67b"; 25 content: "\e67b";
18 } 26 }
@@ -6,6 +6,20 @@ @@ -6,6 +6,20 @@
6 "description": "", 6 "description": "",
7 "glyphs": [ 7 "glyphs": [
8 { 8 {
  9 + "icon_id": "4933869",
  10 + "name": "点",
  11 + "font_class": "dian",
  12 + "unicode": "ec1e",
  13 + "unicode_decimal": 60446
  14 + },
  15 + {
  16 + "icon_id": "1727447",
  17 + "name": "216更多-竖向",
  18 + "font_class": "gengduo-shuxiang",
  19 + "unicode": "e8c4",
  20 + "unicode_decimal": 59588
  21 + },
  22 + {
9 "icon_id": "1206404", 23 "icon_id": "1206404",
10 "name": "微信", 24 "name": "微信",
11 "font_class": "weixin", 25 "font_class": "weixin",
@@ -2,10 +2,10 @@ @@ -2,10 +2,10 @@
2 <div class="d-flex"> 2 <div class="d-flex">
3 <img src="../src/style/img/fault/base.gif"> 3 <img src="../src/style/img/fault/base.gif">
4 <h3 style="margin-left: 10px">基础资源</h3> 4 <h3 style="margin-left: 10px">基础资源</h3>
5 - <div style="width: calc(100% - 200px);line-height: 54px" class="align-right"> 5 + <!--<div style="width: calc(100% - 200px);line-height: 54px" class="align-right">
6 <a class="m-r-20" @click="allCard()">更多</a> 6 <a class="m-r-20" @click="allCard()">更多</a>
7 <a @click="closeCard()">收起</a> 7 <a @click="closeCard()">收起</a>
8 - </div> 8 + </div>-->
9 </div> 9 </div>
10 <el-divider/> 10 <el-divider/>
11 <div class="d-flex" v-model="dialTest"> 11 <div class="d-flex" v-model="dialTest">
1 <el-divider/> 1 <el-divider/>
2 <div class="d-flex" v-model="dialTest"> 2 <div class="d-flex" v-model="dialTest">
3 <div class="d-flex align-center" style="width: 300px;justify-content: center;"> 3 <div class="d-flex align-center" style="width: 300px;justify-content: center;">
4 - <span style="width: 10px;height: 10px;background-color: red;border-radius: 50%">&nbsp;</span> 4 + <!--<span style="width: 10px;height: 10px;background-color: red;border-radius: 50%">&nbsp;</span>-->
  5 + <i class="iconfont icon-dian" style="font-size: 32px;color: red;"/>
5 <img class="m-l-6" src="../src/style/img/fault/base/resType/数据库.png"> 6 <img class="m-l-6" src="../src/style/img/fault/base/resType/数据库.png">
6 <a class="m-l-6">数据库</a> 7 <a class="m-l-6">数据库</a>
7 </div> 8 </div>
@@ -59,43 +60,43 @@ @@ -59,43 +60,43 @@
59 <img src="../src/style/img/fault/base/基础-数据库-黄.png"> 60 <img src="../src/style/img/fault/base/基础-数据库-黄.png">
60 </el-col> 61 </el-col>
61 <el-col :span="16"> 62 <el-col :span="16">
62 - 资源名称xxxxxx<br>  
63 - 127.0.0.0.111111 63 + 这是资源名称啊啊啊啊啊啊啊<br>
  64 + IP地址：127.0.0.0.111111
64 </el-col> 65 </el-col>
65 - <el-col :span="4">  
66 - <i class="iconfont">more</i> 66 + <el-col :span="4" class="align-right">
  67 + <i class="iconfont icon-gengduo-shuxiang" style="font-size: 30px;"></i>
67 </el-col> 68 </el-col>
68 </el-row> 69 </el-row>
69 70
70 <el-row style="height: 70px;padding: 10px 30px;"> 71 <el-row style="height: 70px;padding: 10px 30px;">
71 - <el-col :span="4"> 72 + <el-col :span="4" class="align-center">
72 <img src="../src/style/img/fault/base/连接失败.png"> 73 <img src="../src/style/img/fault/base/连接失败.png">
73 </el-col> 74 </el-col>
74 - <el-col :span="1" style="line-height: 36px"> 75 + <el-col :span="1" style="line-height: 36px;color: gainsboro;">
75 | 76 |
76 </el-col> 77 </el-col>
77 - <el-col :span="4"> 78 + <el-col :span="4" class="align-center">
78 <img src="../src/style/img/fault/base/CPU-绿.png"><br/> 79 <img src="../src/style/img/fault/base/CPU-绿.png"><br/>
79 21% 80 21%
80 </el-col> 81 </el-col>
81 - <el-col :span="1" style="line-height: 36px"> 82 + <el-col :span="1" style="line-height: 36px;color: gainsboro;">
82 | 83 |
83 </el-col> 84 </el-col>
84 - <el-col :span="4"> 85 + <el-col :span="4" class="align-center">
85 <img src="../src/style/img/fault/base/内存.png"><br/> 86 <img src="../src/style/img/fault/base/内存.png"><br/>
86 21% 87 21%
87 </el-col> 88 </el-col>
88 - <el-col :span="1" style="line-height: 36px"> 89 + <el-col :span="1" style="line-height: 36px;color: gainsboro;">
89 | 90 |
90 </el-col> 91 </el-col>
91 - <el-col :span="4"> 92 + <el-col :span="4" class="align-center">
92 <img src="../src/style/img/fault/base/alarm.png"><br/> 93 <img src="../src/style/img/fault/base/alarm.png"><br/>
93 21% 94 21%
94 </el-col> 95 </el-col>
95 - <el-col :span="1" style="line-height: 36px"> 96 + <el-col :span="1" style="line-height: 36px;color: gainsboro;">
96 | 97 |
97 </el-col> 98 </el-col>
98 - <el-col :span="4"> 99 + <el-col :span="4" class="align-center">
99 <img src="../src/style/img/fault/base/时间-绿.png"><br/> 100 <img src="../src/style/img/fault/base/时间-绿.png"><br/>
100 30分钟 101 30分钟
101 </el-col> 102 </el-col>
1 <div style="text-align: left;overflow-y: auto;max-height: 100%;"> 1 <div style="text-align: left;overflow-y: auto;max-height: 100%;">
2 - <div class="d-flex p-6">  
3 - <div style="width: calc(100% - 50px)">{{faultDetailDialogTitle}}</div> 2 + <div class="d-flex p-6" style="position: fixed;z-index: 1000;width: 100%;background: aliceblue;">
  3 + <div style="width: calc(100% - 80px)">{{faultDetailDialogTitle}}</div>
4 <el-button type="text" size="small" 4 <el-button type="text" size="small"
5 @click.prevent="$global.openReport('GZZDS',{faultNumber:faultDetailDetailInfo.faultNo},'60%','80%')"> 5 @click.prevent="$global.openReport('GZZDS',{faultNumber:faultDetailDetailInfo.faultNo},'60%','80%')">
6 <i class="iconfont iconfont-small icon-icon-rizhi"/> 报表 6 <i class="iconfont iconfont-small icon-icon-rizhi"/> 报表
7 </el-button> 7 </el-button>
8 </div> 8 </div>
  9 + <div style="height: 44px"></div>
9 <el-timeline> 10 <el-timeline>
10 11
11 <el-timeline-item v-for="item in faultDetailDetailInfo.items" center :timestamp="item.faultTypeName" 12 <el-timeline-item v-for="item in faultDetailDetailInfo.items" center :timestamp="item.faultTypeName"