monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 鲁尚清
Commit fe16b8238c5aa22fa206a3aef5dcedbe9bff4811 1 parent 855f658b

【1390】【 告警中心】活动告警/历史告警，增加搜索按钮，增加展开/收起 #4

Inline Side-by-side
Showing 6 changed files with 155 additions and 80 deletions
@@ -7847,16 +7847,19 @@ form[lay-filter="activewarning-form"] .layui-inline { @@ -7847,16 +7847,19 @@ form[lay-filter="activewarning-form"] .layui-inline {
7847 /*lsq 告警中心搜索条件栏样式 2022-06-21*/ 7847 /*lsq 告警中心搜索条件栏样式 2022-06-21*/
7848 margin-top:5px; 7848 margin-top:5px;
7849 } 7849 }
7850 -/*lsq 通知查询搜索条件栏样式 2022-06-21*/  
7851 -form[lay-filter="notice_search_form"] .layui-inline { 7850 +/*lsq 通知查询/通知压缩查询/历史告警搜索条件栏样式 2022-06-21*/
  7851 +form[lay-filter="notice_search_form"] .layui-inline,form[lay-filter="noticemerge-form"] .layui-inline ,form[lay-filter="historywarning-form"] .layui-inline {
7852 margin-top:5px; 7852 margin-top:5px;
7853 } 7853 }
7854 -  
7855 -/*lsq 通知压缩查询搜索条件栏样式 2022-06-21*/  
7856 -form[lay-filter="noticemerge-form"] .layui-inline {  
7857 - margin-top:5px; 7854 +form[lay-filter="activewarning-form"],form[lay-filter="historywarning-form"]{
  7855 + display: flex;
  7856 + justify-content: flex-start;
  7857 +}
  7858 +#openStow,#openStowHis{
  7859 + color:#1E9FFF;
  7860 + cursor: pointer;
  7861 + line-height: 50px;
7858 } 7862 }
7859 -  
7860 #noticeSearchQueryBtn,#seachNoticemerge{ 7863 #noticeSearchQueryBtn,#seachNoticemerge{
7861 margin-top:-3px; 7864 margin-top:-3px;
7862 } 7865 }
@@ -6,90 +6,100 @@ @@ -6,90 +6,100 @@
6 <div class="layui-card-header"> 6 <div class="layui-card-header">
7 <div class="layui-status"> 7 <div class="layui-status">
8 <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="activewarning-form"> 8 <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="activewarning-form">
9 - <div class="layui-form-item">  
10 - <div class="layui-inline">  
11 - <div class="layui-input-inline layui-input-inline--long">  
12 - <input type="text" id="activewarningkw" name="activewarningkw" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input" lay-tips="关键字检索包括:<br>资源名称<br>告警编号<br>IP<br>内容"> 9 + <div class="form-item-open-stow">
  10 + <div class="layui-form-item">
  11 + <div class="layui-inline">
  12 + <div class="layui-input-inline layui-input-inline--long">
  13 + <input type="text" id="activewarningkw" name="activewarningkw" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input" lay-tips="关键字检索包括:<br>资源名称<br>告警编号<br>IP<br>内容">
  14 + </div>
13 </div> 15 </div>
14 - </div>  
15 - <div class="layui-inline">  
16 - <div class="layui-input-inline">  
17 - <select name="alarmKpi" lay-filter="alarmKpiSearch" lay-verify="required" lay-search="" id="alarmKpiSearchBox">  
18 - </select> 16 + <div class="layui-inline">
  17 + <div class="layui-input-inline">
  18 + <select name="alarmKpi" lay-filter="alarmKpiSearch" lay-verify="required" lay-search="" id="alarmKpiSearchBox">
  19 + </select>
  20 + </div>
19 </div> 21 </div>
20 - </div>  
21 - <div class="layui-inline">  
22 - <div class="layui-input-inline layui-input-inline--long">  
23 -<!-- <select name="bisTypeSearchBox" lay-filter="bisTypeSearch" lay-verify="required" lay-search="" id="bisTypeSearchBox">-->  
24 -<!-- <option value="">选择/搜索业务</option>-->  
25 -<!-- </select>--> 22 + <div class="layui-inline">
26 <div class="layui-input-inline layui-input-inline--long"> 23 <div class="layui-input-inline layui-input-inline--long">
27 - <div id="bisTypeSearchBox" class="xm-select-demo"></div> 24 + <!-- <select name="bisTypeSearchBox" lay-filter="bisTypeSearch" lay-verify="required" lay-search="" id="bisTypeSearchBox">-->
  25 + <!-- <option value="">选择/搜索业务</option>-->
  26 + <!-- </select>-->
  27 + <div class="layui-input-inline layui-input-inline--long">
  28 + <div id="bisTypeSearchBox" class="xm-select-demo"></div>
  29 + </div>
28 </div> 30 </div>
29 </div> 31 </div>
30 - </div>  
31 - <div class="layui-inline">  
32 - <div class="layui-input-inline">  
33 - <div id="resTypeSearchBox"></div> 32 + <div class="layui-inline">
  33 + <div class="layui-input-inline">
  34 + <div id="resTypeSearchBox"></div>
  35 + </div>
34 </div> 36 </div>
35 - </div>  
36 - <div class="layui-inline">  
37 - <div class="layui-input-inline layui-input-inline--long">  
38 - <input type="text" class="layui-input" id="activewarningStartdate" placeholder="开始时间"> 37 + <div class="layui-inline">
  38 + <div class="layui-input-inline layui-input-inline--long">
  39 + <input type="text" class="layui-input" id="activewarningStartdate" placeholder="开始时间">
  40 + </div>
39 </div> 41 </div>
40 - </div>  
41 - <div class="layui-inline layui-inline--sm">-</div>  
42 - <div class="layui-inline">  
43 - <div class="layui-input-inline layui-input-inline--long">  
44 - <input type="text" class="layui-input" id="activewarningEnddate" placeholder="结束时间"> 42 + <div class="layui-inline layui-inline--sm">-</div>
  43 + <div class="layui-inline">
  44 + <div class="layui-input-inline layui-input-inline--long">
  45 + <input type="text" class="layui-input" id="activewarningEnddate" placeholder="结束时间">
  46 + </div>
45 </div> 47 </div>
46 - </div>  
47 - <div class="layui-inline">  
48 - <div class="layui-input-inline layui-input-inline-sm">  
49 - <select name="alarmStatusSearchBox" lay-filter="alarmStatusSearch" lay-verify="required" lay-search="" id="alarmStatusSearchBox">  
50 - <option value="">=告警状态=</option>  
51 - <option value="1">已关闭</option>  
52 - <option value="0">未关闭</option>  
53 - </select> 48 + <div class="layui-inline">
  49 + <div class="layui-input-inline layui-input-inline-sm">
  50 + <select name="alarmStatusSearchBox" lay-filter="alarmStatusSearch" lay-verify="required" lay-search="" id="alarmStatusSearchBox">
  51 + <option value="">=告警状态=</option>
  52 + <option value="1">已关闭</option>
  53 + <option value="0">未关闭</option>
  54 + </select>
  55 + </div>
54 </div> 56 </div>
55 - </div>  
56 - <div class="layui-inline">  
57 - <div class="layui-input-inline layui-input-inline-sm">  
58 - <select name="alarmLevelSearchBox" lay-filter="alarmLevelSearch" lay-verify="required" lay-search="" id="alarmLevelSearchBox">  
59 - <option value="">=告警级别=</option>  
60 - <option value="3">严重告警</option>  
61 - <option value="2">重要告警</option>  
62 - <option value="1">一般告警</option>  
63 - </select> 57 + <div class="layui-inline">
  58 + <div class="layui-input-inline layui-input-inline-sm">
  59 + <select name="alarmLevelSearchBox" lay-filter="alarmLevelSearch" lay-verify="required" lay-search="" id="alarmLevelSearchBox">
  60 + <option value="">=告警级别=</option>
  61 + <option value="3">严重告警</option>
  62 + <option value="2">重要告警</option>
  63 + <option value="1">一般告警</option>
  64 + </select>
  65 + </div>
64 </div> 66 </div>
65 - </div>  
66 - <div class="layui-inline">  
67 - <div class="layui-input-inline layui-input-inline-sm">  
68 - <select name="alarmConfirmSearchBox" lay-filter="alarmConfirmSearch" lay-verify="required" lay-search="" id="alarmConfirmSearchBox">  
69 - <option value="">=告警确认=</option>  
70 - <option value="1">已确认</option>  
71 - <option value="0">未确认</option>  
72 - </select> 67 + <div class="layui-inline">
  68 + <div class="layui-input-inline layui-input-inline-sm">
  69 + <select name="alarmConfirmSearchBox" lay-filter="alarmConfirmSearch" lay-verify="required" lay-search="" id="alarmConfirmSearchBox">
  70 + <option value="">=告警确认=</option>
  71 + <option value="1">已确认</option>
  72 + <option value="0">未确认</option>
  73 + </select>
  74 + </div>
73 </div> 75 </div>
74 - </div>  
75 - <div class="layui-inline" id="inline-condition-duration">  
76 - <sapn class="duration-desc">持续时间 大于</sapn>  
77 - <div class="layui-input-inline">  
78 - <input type="number" name="durationVal" class="layui-input">  
79 - <select name="durationUnit">  
80 - <option value="s">秒</option>  
81 - <option value="min">分钟</option>  
82 - <option value="hour">小时</option>  
83 - <option value="day">天</option>  
84 - </select> 76 + <div class="layui-inline" id="inline-condition-duration">
  77 + <sapn class="duration-desc">持续时间 大于</sapn>
  78 + <div class="layui-input-inline">
  79 + <input type="number" name="durationVal" class="layui-input">
  80 + <select name="durationUnit">
  81 + <option value="s">秒</option>
  82 + <option value="min">分钟</option>
  83 + <option value="hour">小时</option>
  84 + <option value="day">天</option>
  85 + </select>
  86 + </div>
85 </div> 87 </div>
86 - </div>  
87 - <!--<div class="layui-inline">  
88 - <div class="layui-input-inline">  
89 - <button class="layui-btn layui-btn-sm layui-btn-normal" type="button" id="todayOrAllBtn" >今日告警</button> 88 + <!--<div class="layui-inline">
  89 + <div class="layui-input-inline">
  90 + <button class="layui-btn layui-btn-sm layui-btn-normal" type="button" id="todayOrAllBtn" >今日告警</button>
  91 + </div>
  92 + </div>-->
  93 + <!--lsq 活动告警增加搜索按钮 2022-06-21-->
  94 + <div class="layui-inline">
  95 + <div class="layui-input-inline layui-input-inline-sm">
  96 + <button type="button" id="seachActiveWarning" class="layui-btn layui-btn-normal layui-btn-normal" >
  97 + 搜索</button>
  98 + </div>
90 </div> 99 </div>
91 - </div>--> 100 + </div>
92 </div> 101 </div>
  102 + <span id="openStow">展开</span>
93 </form> 103 </form>
94 </div> 104 </div>
95 </div> 105 </div>
@@ -6,7 +6,8 @@ @@ -6,7 +6,8 @@
6 <div class="layui-card-header"> 6 <div class="layui-card-header">
7 <div class="layui-status"> 7 <div class="layui-status">
8 <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="historywarning-form"> 8 <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="historywarning-form">
9 - <div class="layui-form-item"> 9 + <div class="form-item-open-stow">
  10 + <div class="layui-form-item">
10 <div class="layui-inline"> 11 <div class="layui-inline">
11 <div class="layui-input-inline layui-input-inline--long"> 12 <div class="layui-input-inline layui-input-inline--long">
12 <input type="text" id="historywarningkw" name="historywarningkw" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input" lay-tips="关键字检索包括:<br>资源名称<br>告警编号<br>IP<br>内容"> 13 <input type="text" id="historywarningkw" name="historywarningkw" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input" lay-tips="关键字检索包括:<br>资源名称<br>告警编号<br>IP<br>内容">
@@ -79,7 +80,16 @@ @@ -79,7 +80,16 @@
79 </select> 80 </select>
80 </div> 81 </div>
81 </div> 82 </div>
  83 + <!--lsq 历史告警增加搜索按钮 2022-06-21-->
  84 + <div class="layui-inline">
  85 + <div class="layui-input-inline layui-input-inline-sm">
  86 + <button type="button" id="seachHistoryWarning" class="layui-btn layui-btn-normal layui-btn-normal" >
  87 + 搜索</button>
  88 + </div>
  89 + </div>
  90 + </div>
82 </div> 91 </div>
  92 + <span id="openStowHis">展开</span>
83 </form> 93 </form>
84 </div> 94 </div>
85 </div> 95 </div>
@@ -6,13 +6,20 @@ @@ -6,13 +6,20 @@
6 <div class="layui-card"> 6 <div class="layui-card">
7 <div class="layui-card-header"> 7 <div class="layui-card-header">
8 <div class="layui-status"> 8 <div class="layui-status">
9 - <form class="layui-form layui-card-header layuiadmin-card-header-auto"> 9 + <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="noticemerge-form">
10 <div class="layui-form-item"> 10 <div class="layui-form-item">
11 <div class="layui-inline"> 11 <div class="layui-inline">
12 <div class="layui-input-inline layui-input-inline--long"> 12 <div class="layui-input-inline layui-input-inline--long">
13 <input type="text" id="condition-noticemerge-name" lay-tips="关键字检索包含: </br>通知内容" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input"> 13 <input type="text" id="condition-noticemerge-name" lay-tips="关键字检索包含: </br>通知内容" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input">
14 </div> 14 </div>
15 </div> 15 </div>
  16 + <!--lsq 通知压缩查询增加搜索按钮 2022-06-21-->
  17 + <div class="layui-inline">
  18 + <div class="layui-input-inline layui-input-inline-sm">
  19 + <button type="button" id="seachNoticemerge" class="layui-btn layui-btn-normal layui-btn-normal" >
  20 + 搜索</button>
  21 + </div>
  22 + </div>
16 </div> 23 </div>
17 </form> 24 </form>
18 </div> 25 </div>
@@ -228,6 +228,10 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', @@ -228,6 +228,10 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
228 reloadTable(); 228 reloadTable();
229 } 229 }
230 }); 230 });
  231 + //lsq 活动告警页增加搜索按钮 2022-06-21
  232 + $('#seachActiveWarning').unbind('click').on('click',function (){
  233 + reloadTable();
  234 + })
231 //选择框搜索事件 235 //选择框搜索事件
232 bindSelectEvent(); 236 bindSelectEvent();
233 initDate(); 237 initDate();
@@ -1271,5 +1275,24 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', @@ -1271,5 +1275,24 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
1271 }); 1275 });
1272 1276
1273 } 1277 }
  1278 + //start lsq 活动告警搜索条件太多，增加展开/收起的功能 2022-06-21
  1279 + let formWidth=$('form[lay-filter="activewarning-form"] .layui-form-item').width();
  1280 + let winWidth=$(window).width();
  1281 + if(formWidth+300>winWidth){
  1282 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  1283 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('height','50px');
  1284 + }
  1285 + $("#openStow").unbind('click').on('click',function (){
  1286 + if($(this).text()=='展开'){
  1287 + $(this).text('收起')
  1288 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  1289 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('height','auto');
  1290 + }else{
  1291 + $(this).text('展开')
  1292 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  1293 + $('form[lay-filter="activewarning-form"] .form-item-open-stow').css('height','50px');
  1294 + }
  1295 + })
  1296 + //end lsq 2022-06-21
1274 }); 1297 });
1275 }); 1298 });
@@ -174,7 +174,10 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', @@ -174,7 +174,10 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
174 reloadTable(); 174 reloadTable();
175 } 175 }
176 }); 176 });
177 - 177 + //lsq 历史告警页增加搜索按钮 2022-06-21
  178 + $('#seachHistoryWarning').unbind('click').on('click',function (){
  179 + reloadTable();
  180 + })
178 //选择框搜索事件 181 //选择框搜索事件
179 bindSelectEvent(); 182 bindSelectEvent();
180 183
@@ -785,6 +788,25 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', @@ -785,6 +788,25 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common',
785 }); 788 });
786 })(); 789 })();
787 790
  791 + //start lsq 历史告警搜索条件太多，增加展开/收起的功能 2022-06-21
  792 + let formWidth=$('form[lay-filter="historywarning-form"] .layui-form-item').width();
  793 + let winWidth=$(window).width();
  794 + if(formWidth+250>winWidth){
  795 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  796 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('height','50px');
  797 + }
  798 + $("#openStowHis").unbind('click').on('click',function (){
  799 + if($(this).text()=='展开'){
  800 + $(this).text('收起')
  801 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  802 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('height','auto');
  803 + }else{
  804 + $(this).text('展开')
  805 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('width',(formWidth-50)+'px');
  806 + $('form[lay-filter="historywarning-form"] .form-item-open-stow').css('height','50px');
  807 + }
  808 + })
  809 + //end lsq 2022-06-21
788 }); 810 });
789 811
790 }); 812 });