CLIENT GUI Framework
[vnfsdk/refrepo.git] / openo-portal / portal-performance / src / main / webapp / performance / alarm_view.html
1 <!--\r
2     Copyright 2016-2017, CMCC Technologies Co., Ltd.\r
3 \r
4     Licensed under the Apache License, Version 2.0 (the "License");\r
5     you may not use this file except in compliance with the License.\r
6     You may obtain a copy of the License at\r
7 \r
8             http://www.apache.org/licenses/LICENSE-2.0\r
9 \r
10     Unless required by applicable law or agreed to in writing, software\r
11     distributed under the License is distributed on an "AS IS" BASIS,\r
12     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
13     See the License for the specific language governing permissions and\r
14     limitations under the License.\r
15 -->\r
16 <!DOCTYPE html>\r
17 <html>\r
18         <head>\r
19                 <meta charset="UTF-8">\r
20                 <link href="../common/thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet" id="font_awesome"/>\r
21                 <link href="../common/thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet"/>\r
22                 <link href="../common/thirdparty/uniform/css/uniform.default.css" rel="stylesheet"/>\r
23                 <link href="../common/thirdparty/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css" rel="stylesheet">\r
24                 <link href="../common/thirdparty/icheck/skins/all.css" type="text/css" rel="stylesheet">\r
25                 <link href="../common/thirdparty/bootstrap-daterangepicker/daterangepicker-bs3.css" rel="stylesheet">\r
26                 <link href="../common/css/plugins.css" rel="stylesheet" type="text/css">\r
27                 <link href="../common/css/ZteIctIcons/style.css" rel="stylesheet" type="text/css"/>\r
28                 <link href="../common/css/ngict-component.css" rel="stylesheet" type="text/css">\r
29                 <link href="css/alarmsQuery.css" rel="stylesheet" type="text/css">\r
30         </head>\r
31         <body>\r
32                 <div id="alarmsDiv" class="container-fluid ms-controller" ms-controller="curAlarmsController">\r
33                         <div class="row" style=" margin-top: 15px;">\r
34                                 <div class="col-xs-6 col-md-6 col-sm-6 col-lg-6 titlefont searchTitle">\r
35                                         <span id="ngict_fm_iui_curalarm_currentAlarm" name_i18n="openo_alarm_i18n"></span>\r
36                                 </div>\r
37                         </div>\r
38                         <div class="separator-line"></div>\r
39                         <div class="row-fluid filtergroup">\r
40                                 <div>\r
41                                         <div class="btn-group">\r
42                                                 <button class="btn btnWhite circleBtn" ms-repeat-el="severityTypes" ms-class="<!--el.class-->:severityTypes[$index].value" ms-click="tabClicked(el ,this)"><!--el.name--></button>\r
43                                         </div>\r
44                                         <div class="btn-group btn-groupBlue">\r
45                                                 <button class="btn btnWhite circleBtn" ms-repeat-el="ackStateTypes" ms-class-blueActive="el.value" ms-click="tabClicked(el ,this)"><!--el.name--></button>\r
46                                         </div>\r
47                                         <div class="btn-group btn-groupBlue circleBtn">\r
48                                                 <button class="btn btnWhite circleBtn" ms-repeat-el="filterStateTypes" ms-class-blueActive="el.value" ms-click="tabClicked(el ,this)"><!--el.name--></button>\r
49                                         </div>\r
50                                         <div class="btn-group flRight">\r
51                                                 <span class=" adCondition">\r
52                                                         <button id="moreCondBtn" type="button" class="btn radius_l white" ms-click="moreCondClicked()" ms-class-blueActive="vm.moreCondBtn">\r
53                                                                 <span class="caret"></span><span id="ngict_fm_iui_curalarm_advance" name_i18n="openo_alarm_i18n"></span>\r
54                                                         </button>\r
55                                                 </span>\r
56                                         </div>\r
57                                 </div>\r
58                         </div>\r
59                         <div class="row" id="moreCond" style="display: none;">\r
60                                 <div class="row" style="margin-top: 20px;">\r
61                                         <span id="alLocation" class="cond_zone">\r
62                                                 <button class="condSelect btn white radius_l">\r
63                                                         <span id="ngict_fm_iui_curalarm_alarmPosition" name_i18n="openo_alarm_i18n"></span>\r
64                                                 </button>\r
65                                                 <span class="cond_selected">\r
66                                                         <span id="ngict_fm_iui_curalarm_locationSelected" name_i18n="openo_alarm_i18n"></span>\r
67                                                 </span>\r
68                                         </span>\r
69                                         <span id="alType" class="cond_zone">\r
70                                                 <button class="condSelect btn white radius_l">\r
71                                                         <span id="ngict_fm_iui_curalarm_alarmType" name_i18n="openo_alarm_i18n"></span>\r
72                                                 </button>\r
73                                                 <span class="cond_selected">\r
74                                                         <span id="ngict_fm_iui_curalarm_alarmTypeSelected" name_i18n="openo_alarm_i18n"></span>\r
75                                                 </span>\r
76                                         </span>\r
77                                         <span id="alCode" class="cond_zone">\r
78                                                 <button class="condSelect btn white radius_l">\r
79                                                         <span id="ngict_fm_iui_curalarm_probableCause" name_i18n="openo_alarm_i18n"></span>\r
80                                                 </button>\r
81                                                 <span class="cond_selected">\r
82                                                         <span id="ngict_fm_iui_curalarm_probableCauseSelected" name_i18n="openo_alarm_i18n"></span>\r
83                                                 </span>\r
84                                         </span>\r
85                                 </div>\r
86                                 <div class="row cond_zone_time">\r
87                                         <div class="col-xs-12 confirmTime">\r
88                                                 <label>\r
89                                                         <span id="ngict_fm_iui_curalarm_ackTimeTitle" name_i18n="openo_alarm_i18n"></span>&nbsp;&nbsp;\r
90                                                 </label>\r
91                                                 <input id="today_confirm" type="radio" name="timeConfirm" cond_value="1" cond_id="time" class="btn blue"></input>\r
92                                                 <label for="today_confirm" class="radioLabel">\r
93                                                         <span id="ngict_fm_iui_curalarm_recentOneDay" name_i18n="openo_alarm_i18n"></span>\r
94                                                 </label>\r
95                                                 <input id="one_week_confirm" type="radio" name="timeConfirm" cond_value="2" cond_id="time" class="btn blue"></input>\r
96                                                 <label for="one_week_confirm" class="radioLabel">\r
97                                                         <span id="ngict_fm_iui_curalarm_recenttwoDays" name_i18n="openo_alarm_i18n"></span>\r
98                                                 </label>\r
99                                                 <input id="one_month_confirm" type="radio" name="timeConfirm" cond_value="7" cond_id="time" class="btn blue"></input>\r
100                                                 <label for="one_month_confirm" class="radioLabel">\r
101                                                         <span id="ngict_fm_iui_curalarm_recentOneWeek" name_i18n="openo_alarm_i18n"></span>\r
102                                                 </label>\r
103                                                 <input id="customAckTime" type="radio" name="timeConfirm" class="btn blue"></input>\r
104                                                 <input dtitle="ackTime" id='daterangeConfirm' name="daterange" type='select' value="Custom" data-toggle="tooltip" data-placement="top" title ms-attr-disabled="<!--dataRangeLocationDisabled-->" class='btn btn-default dropdown-toggle' data-toggle='dropdown' />\r
105                                         </div>\r
106                                 </div>\r
107                                 <div class="row cond_zone_time">\r
108                                         <div class="col-xs-12 confirmTime">\r
109                                                 <label>\r
110                                                         <span id="ngict_fm_iui_curalarm_raisedTime" name_i18n="openo_alarm_i18n"></span>&nbsp;&nbsp;\r
111                                                 </label>\r
112                                                 <input id="today_occur" type="radio" name="timeOccur" cond_value="1" cond_id="time" class="btn blue"></input>\r
113                                                 <label for="today_occur" class="radioLabel">\r
114                                                         <span id="ngict_fm_iui_curalarm_recentOneDay" name_i18n="openo_alarm_i18n"></span>\r
115                                                 </label>\r
116                                                 <input id="one_week_occur" type="radio" name="timeOccur" cond_value="2" cond_id="time" class="btn blue"></input>\r
117                                                 <label for="one_week_occur" class="radioLabel">\r
118                                                         <span id="ngict_fm_iui_curalarm_recenttwoDays" name_i18n="openo_alarm_i18n"></span>\r
119                                                 </label>\r
120                                                 <input id="one_month_occur" type="radio" name="timeOccur" cond_value="7" cond_id="time" class="btn blue"></input>\r
121                                                 <label for="one_month_occur" class="radioLabel">\r
122                                                         <span id="ngict_fm_iui_curalarm_recentOneWeek" name_i18n="openo_alarm_i18n"></span>\r
123                                                 </label>\r
124                                                 <input id="customRaisedTime" type="radio" name="timeOccur" class="btn blue"></input>\r
125                                                 <input dtitle="raisedTime" id='daterangeOccur' name="daterange" type='select' value="Custom" data-toggle="tooltip" data-placement="top" title ms-attr-disabled="<!--dataRangeTypeDisabled-->" class='btn btn-default dropdown-toggle' data-toggle='dropdown' />\r
126                                         </div>\r
127                                 </div>\r
128                                 <div class="row margin-space flRight">\r
129                                         <button ms-click="searchModal()" class="btn white radius_l">\r
130                                                 <span class="ict-Magnifier alarmsSave"></span>\r
131                                                 <span id="ngict_fm_iui_curalarm_query" name_i18n="openo_alarm_i18n"></span>\r
132                                         </button>&nbsp;&nbsp;\r
133                                         <button ms-click="saveModal()" ms-visible="tempHide" class="btn white radius_l">\r
134                                                 <span class="ict-save alarmsSave"></span>\r
135                                                 <span id="ngict_fm_iui_curalarm_save" name_i18n="openo_alarm_i18n"></span>\r
136                                         </button>\r
137                                 </div>\r
138                         </div>\r
139                         <div class="fliterline"></div>\r
140                         <div class="row-fluid bodyTop">\r
141                                 <div class="col-xs-4 alarmbtn">\r
142                                         <div class="btn-group">\r
143                                                 <button id="affirm" onclick="alarmsUtil.loopAffirm(1);" class="btn white sideBtn" ms-class="btnRiusCircle:!showClear"><span class="ict-acknownledge"></span></button>\r
144                                                 <button id="unAffirm" class="btn white sideBtn" ms-visible="showClear" onclick="alarmsUtil.loopAffirm(2);"><span class="ict-unacknownledge"></span></button>\r
145                                         </div>\r
146                                         <button class="btn radius_l white" onclick="alarmsUtil.loopDelAralms();">\r
147                                                 <span class="ict-delete"></span>\r
148                                                 <span id="ngict_fm_iui_curalarm_clean" name_i18n="openo_alarm_i18n"></span>\r
149                                         </button>\r
150                                 </div>\r
151                                 <div class="tablebtn">\r
152                                         <button class="btn radius_l white" onclick="alarmsUtil.refresh();">\r
153                                                 <span class="ict-refresh"></span>\r
154                                                 <span id="ngict_fm_iui_curalarm_refreash" name_i18n="openo_alarm_i18n"></span>\r
155                                         </button>\r
156                                         <button class="btn radius_l white" ms-visible="tempHide">\r
157                                                 <span class="ict-export"></span>\r
158                                                 <span id="ngict_fm_iui_curalarm_exportAll" name_i18n="openo_alarm_i18n"></span>\r
159                                         </button>\r
160                                 </div>\r
161                         </div>\r
162                         <div class="row-fluid" data-name="table_zone">\r
163                                 <div class="col-xs-12" id='ict_alarms_table_div'></div>\r
164                         </div>\r
165                         <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">\r
166                                 <div class="modal-dialog">\r
167                                         <div class="modal-content">\r
168                                                 <div class="modal-header">\r
169                                                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>\r
170                                                         <h4 class="modal-title" id="myModalLabel"><span id="ngict_fm_iui_curalarm_save" name_i18n="openo_alarm_i18n"></span></h4>\r
171                                                 </div>\r
172                                                 <div class="modal-body">\r
173                                                         <span><span id="ngict_fm_iui_curalarm_name" name_i18n="openo_alarm_i18n"></span>&nbsp;&nbsp;</span>\r
174                                                         <input type="text" id="saveCondId"/>\r
175                                                         <div class="condSaveTip">\r
176                                                                 <span id="ngict_fm_iui_curalarm_condSaveTip" name_i18n="openo_alarm_i18n"></span>\r
177                                                         </div>\r
178                                                 </div>\r
179                                                 <div class="modal-footer">\r
180                                                         <button type="button" class="btn btn-default" id="saveModalCancle" data-dismiss="modal">\r
181                                                                 <span id="ngict_fm_iui_curalarm_cancel" name_i18n="openo_alarm_i18n"></span>\r
182                                                         </button>\r
183                                                         <button type="button" class="btn btn-primary" ms-click="alarmsCondSave()">\r
184                                                                 <span id="ngict_fm_iui_curalarm_ok" name_i18n="openo_alarm_i18n"></span>\r
185                                                         </button>\r
186                                                 </div>\r
187                                         </div>\r
188                                 </div>\r
189                         </div>\r
190                         <div hidefocus="true" class="modal fade group" id="alCodeTree" tabindex="-1" role="dialog" aria-labelledby="myModalLabelCode" aria-hidden="true">\r
191                                 <div class="modal-dialog">\r
192                                         <div class="modal-content">\r
193                                                 <div class="modal-header">\r
194                                                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>\r
195                                                         <h4 class="modal-title" id="myModalLabelCode"><span id="ngict_fm_iui_curalarm_probableCause" name_i18n="openo_alarm_i18n"></span></h4>\r
196                                                 </div>\r
197                                                 <div class="modal-body">\r
198                                                         <div class="row">\r
199                                                                 <div class="form-group col-xs-12 margin-top-space">\r
200                                                                         <div class="col-xs-6">\r
201                                                                                 <div class=" right_assign_box">\r
202                                                                                         <ul id="probableCausesTree" class="ztree"></ul>\r
203                                                                                 </div>\r
204                                                                         </div>\r
205                                                                         <div class="col-xs-1 iconPosition">\r
206                                                                                 <div ms-repeat-el="treeIcons">\r
207                                                                                         <i treeType="probableCausesTree" ms-class="<!--el-->" ms-click="moveTreeNode($(this))"></i>\r
208                                                                                 </div>\r
209                                                                         </div>\r
210                                                                         <div class="col-xs-5">\r
211                                                                                 <div tabindex="11" class="right-assign-checked-box tree-right-table">\r
212                                                                                         <table id="selectedProbableCausesTreeTable" class="table table-bordered"></table>\r
213                                                                                 </div>\r
214                                                                         </div>\r
215                                                                         <div class="col-xs-4 nodesDetail right">\r
216                                                                                 <button id="moreCondBtn" type="button" class="btn white blueactive right" ms-click="probableCausesTreeAffirm()">\r
217                                                                                         <span id="ngict_fm_iui_curalarm_ok" name_i18n="openo_alarm_i18n"></span>\r
218                                                                                 </button>\r
219                                                                         </div>\r
220                                                                 </div>\r
221                                                         </div>\r
222                                                 </div>\r
223                                         </div>\r
224                                 </div>\r
225                         </div>\r
226                         <div hidefocus="true" class="modal fade group" id="alTypeTree" tabindex="-1" role="dialog" aria-labelledby="myModalLabelType" aria-hidden="true">\r
227                                 <div class="modal-dialog">\r
228                                         <div class="modal-content">\r
229                                                 <div class="modal-header">\r
230                                                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>\r
231                                                         <h4 class="modal-title" id="myModalLabelType"><span id="ngict_fm_iui_curalarm_alarmType" name_i18n="openo_alarm_i18n"></span></h4>\r
232                                                 </div>\r
233                                                 <div class="modal-body">\r
234                                                         <div class="row">\r
235                                                                 <div class="form-group col-xs-12 margin-top-space">\r
236                                                                         <div class="col-xs-12">\r
237                                                                                 <div class=" right-assign-checked-box">\r
238                                                                                         <table id="selectedAlTypeTable" class="table table-bordered tree-left-table"></table>\r
239                                                                                 </div>\r
240                                                                         </div>\r
241                                                                         <div class="col-xs-4 nodesDetail right">\r
242                                                                                 <button id="moreCondBtn" type="button" class="btn white blueactive right" ms-click="alTypeTreeAffirm()">\r
243                                                                                         <span id="ngict_fm_iui_curalarm_ok" name_i18n="openo_alarm_i18n"></span>\r
244                                                                                 </button>\r
245                                                                         </div>\r
246                                                                 </div>\r
247                                                         </div>\r
248                                                 </div>\r
249                                         </div>\r
250                                 </div>\r
251                         </div>\r
252                         <div hidefocus="true" class="modal fade group" id="alLocationTree" tabindex="-1" role="dialog" aria-labelledby="myModalLabelLocation" aria-hidden="true">\r
253                                 <div class="modal-dialog">\r
254                                         <div class="modal-content">\r
255                                                 <div class="modal-header">\r
256                                                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>\r
257                                                         <h4 class="modal-title" id="myModalLabelLocation"><span id="ngict_fm_iui_curalarm_alarmPosition" name_i18n="openo_alarm_i18n"></span></h4>\r
258                                                 </div>\r
259                                                 <div class="modal-body">\r
260                                                         <div class="row">\r
261                                                                 <div class="form-group col-xs-12 margin-top-space">\r
262                                                                         <div class="col-xs-6">\r
263                                                                                 <div class="right_assign_box">\r
264                                                                                         <ul id="deptTree" class="ztree"></ul>\r
265                                                                                 </div>\r
266                                                                         </div>\r
267                                                                         <div class="col-xs-1 iconPosition">\r
268                                                                                 <div ms-repeat-el="treeIcons">\r
269                                                                                         <i treeType="deptTree" ms-class="<!--el-->" ms-click="moveTreeNode($(this))"></i>\r
270                                                                                 </div>\r
271                                                                         </div>\r
272                                                                         <div class="col-xs-5">\r
273                                                                                 <div id="selectedDeptTree" tabindex="11" class="right-assign-checked-box tree-right-table">\r
274                                                                                         <table id="selectedDeptTreeTable" class="table table-bordered"></table>\r
275                                                                                 </div>\r
276                                                                         </div>\r
277                                                                 </div>\r
278                                                         </div>\r
279                                                         <div class="row">\r
280                                                                 <div class="form-group col-xs-12">\r
281                                                                         <div class="col-xs-4 right">\r
282                                                                                 <button id="moreCondBtn" type="button" class="btn white blueactive right" ms-click="deptTreeAffirm()">\r
283                                                                                         <span id="ngict_fm_iui_curalarm_ok" name_i18n="openo_alarm_i18n"></span>\r
284                                                                                 </button>\r
285                                                                         </div>\r
286                                                                 </div>\r
287                                                         </div>\r
288                                                 </div>\r
289                                         </div>\r
290                                 </div>\r
291                         </div>\r
292                         <div id="affirmTrip" class="defaultHideTopLink">\r
293                                 <span id="ngict_fm_iui_curalarm_affirm" name_i18n="openo_alarm_i18n"></span>\r
294                         </div>\r
295                         <div id="unAffirmTrip" class="defaultHideTopLink">\r
296                                 <span id="ngict_fm_iui_curalarm_unaffirm" name_i18n="openo_alarm_i18n"></span>\r
297                         </div>\r
298                 </div>\r
299                 <script src="../common/thirdparty/jquery/jquery-1.10.2.min.js" type="text/javascript"></script>\r
300                 <script src="../common/thirdparty/jquery-cokie/jquery.cokie.min.js" type="text/javascript" ></script>\r
301                 <script src="../common/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js" type="text/javascript"></script>\r
302                 <script src="../common/thirdparty/bootbox/bootbox.min.js" type="text/javascript"></script>\r
303                 <script src="../common/thirdparty/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>\r
304                 <script src="../common/thirdparty/data-tables/jquery.dataTables-1.9.4.js"></script>\r
305                 <script src="../common/thirdparty/bootstrap-daterangepicker/moment.js" type="text/javascript"></script>\r
306                 <script src="../common/thirdparty/bootstrap-daterangepicker/daterangepicker.js" type="text/javascript"></script>\r
307                 <script src="../common/js/international/loadi18n.js" type="text/javascript"></script>\r
308                 <script src="../common/js/json2.js" type="text/javascript"></script>\r
309                 <script src="../common/js/tools.js" type="text/javascript"></script>\r
310                 <script src="../common/thirdparty/avalon/avalon.modern.js" type="text/javascript"></script>\r
311                 <script src="../common/thirdparty/icheck/icheck.min.js" type="text/javascript"></script>\r
312                 <script src="../common/thirdparty/zTree/js/jquery.ztree.all.js" type="text/javascript"></script>\r
313                 <script>\r
314                         loadi18n_WebFramework('web-alarm-i18n', 'i18n/', 'openo_alarm_i18n');\r
315                         var getUrlParam = function(name){\r
316                                 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");\r
317                                 var search = decodeURIComponent(location.search.substring(1));\r
318                                 var r = search.match(reg);\r
319                                 if (r != null) {\r
320                                         return unescape(r[2]);\r
321                                 }\r
322                                 return null;\r
323                         }\r
324                         $(function(){\r
325                                 var queryName = getUrlParam("queryId");\r
326                                 if (queryName) {\r
327                                         $(".searchTitle").text(queryName);\r
328                                         $("#saveCondId").val(queryName);\r
329                                 }\r
330                                 $('[data-toggle="tooltip"]').tooltip();\r
331                         });\r
332                 </script>\r
333                 <script src="js/alarmsServerPageTable.js" type="text/javascript"></script>\r
334                 <script src="js/alarmsUtil.js" type="text/javascript"></script>\r
335                 <script src="js/alarmConds.js" type="text/javascript"></script>\r
336                 <script src="js/commonUtil.js" type="text/javascript"></script>\r
337                 <script src="js/curAlarmsController.js" type="text/javascript"></script>\r
338         </body>\r
339 </html>\r