sdnc-a1-controller/oam/SdncReports/SdncReportsApi/src/main/resources/static/form-viewReport.html

   1 <!-- /*
   2    * ============LICENSE_START=======================================================
   3    * ONAP : SDNC-FEATURES
   4    * ================================================================================
   5    * Copyright 2018 TechMahindra
   6    *=================================================================================
   7    * Licensed under the Apache License, Version 2.0 (the "License");
   8    * you may not use this file except in compliance with the License.
   9    * You may obtain a copy of the License at
  10    *
  11    *     http://www.apache.org/licenses/LICENSE-2.0
  12    *
  13    * Unless required by applicable law or agreed to in writing, software
  14    * distributed under the License is distributed on an "AS IS" BASIS,
  15    * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16    * See the License for the specific language governing permissions and
  17    * limitations under the License.
  18    * ============LICENSE_END=========================================================
  19    */
  20     -->
  21 <div class="ReportMain" style="height:auto ;">
  22    <div class="heading"><img src="images/search.png" width=30 height="30" style="margin-left:5px;">&nbsp;&nbsp;Search For Historical Test Reports</div>
  23    <form name="myForm">
  24       <div class="row">
  25          <div role="alert" style="margin-left:20px;margin-bottom:5px;">
  26             <button class="btn btn-danger ReportNotification" ng-show="showError"><img src="images/error.png" width=25 height="25" class="ReportImgIcon">{{errorMessage}}</button>
  27             <button class="btn btn-success ReportNotification" ng-show="showSuccess"><img src="images/success.png" width=30 height="30" class="ReportImgIcon">{{successMessage}}</button>
  28             <button class="btn btn-warning ReportNotification" ng-show="showWarning"><img src="images/waning.png" width=35 height="25" class="ReportImgIcon">{{warningMessage}}</button>
  29          </div>
  30          <div class="column" style="background-color:#f2f2f2;width:40%;">
  31             <label for="exampleInput" class="labeltext">Start Date</label>
  32             <input type="date" id="exampleInput" name="input" ng-model="startdate.value"
  33                placeholder="yyyy-MM-dd" style="margin-left:75px;width:170px;" required/>
  34             <div role="alert">
  35                <span class="error" ng-show="myForm.input.$error.required">
  36                Required!</span>
  37                <span class="error" ng-show="myForm.input.$error.date">
  38                Not a valid date!</span>
  39             </div>
  40          </div>
  41          <div class="column" style="background-color:#f2f2f2;margin-left:0px;width:50%;">
  42             <label for="exampleEndInput" class="labeltext">End Date</label>
  43             <input type="date" id="exampleEndInput" name="enddate" ng-model="enddate.value"
  44                placeholder="yyyy-MM-dd" style="width:170px;" required/>
  45             <div role="alert">
  46                <span class="error" ng-show="myForm.input.$error.required">
  47                Required!</span>
  48                <span class="error" ng-show="myForm.input.$error.date">
  49                Not a valid date!</span>
  50             </div>
  51          </div>
  52       </div>
  53       <div class="row">
  54          <div class="column" style="background-color:#f2f2f2;width:90%;">
  55             <label class="labeltext">Specify Device IP</label>
  56             <input type="text" ng-model="deviceIP" name="text" style="margin-left:25px;width:170px;" required></input>
  57             <div role="alert">
  58                <span class="error" ng-show="myForm.text.$error.required">
  59                Required!</span>
  60                <span class="error" ng-show="myForm.text.$error.date">
  61                Not a valid date!</span>
  62             </div>
  63          </div>
  64       </div>
  65       <div class="row">
  66          <input type="submit" id="btnSubmit" ng-click="getReports(deviceIP,startdate.value,enddate.value)" style="width:120px;"></input>
  67       </div>
  68        <table class="tableDisplay" ng-show="ShowResult" id="tableToExport">
  69       <tr class="first_row">
  70          <th>SNo.
  71          </th>
  72          <th colspan="2" style="text-align:center;">TestName
  73          </th>
  74          <th>DeviceIP
  75          </th>
  76          <th>Timestamp
  77          </th>
  78          <th>Status
  79          </th>
  80          <th style="width:20%;">Statistics (%Loss)</th>
  81          <th style="width:20%;">Average Time (ms)</th>
  82          <th colspan="2" style="text-align:center;">Result
  83          </th>
  84       </tr>
  85       <tr dir-paginate="test in objTestModel | itemsPerPage: 4">
  86          <td>{{$index+1}}
  87          </td>
  88          <td><img src="{{(test.testname=='Network Layer') ? 'images/images.png': 'images/protocol.png'}}" width=40 height=30 ></img></td>
  89          <td>{{test.testname}}
  90          </td>
  91          <td>{{test.deviceIP}}
  92          </td>
  93          <td>{{test.timeStamp}}
  94          </td>
  95          <td>{{test.executionDetails.status | uppercase}}
  96          </td>
  97           <td>{{test.executionDetails.statistics}}
  98          </td>
  99          </td>
 100           <td>{{test.executionDetails.avgTime}}
 101          </td>
 102          <td>{{test.result}}</td>
 103          <td><img src="{{(test.result=='pass'||'reachable') ? 'images/success.png': 'images/FailImage.png'}}" width=30 height=25></img>
 104       </tr>
 105    </table>
 106    </form>
 107
 108    <div class="row">
 109       <div class="column">
 110          <dir-pagination-controls ng-show="pagination"
 111             max-size="5"
 112             direction-links="true"
 113             boundary-links="true" >
 114          </dir-pagination-controls>
 115       </div>
 116       <div class="column" style="margin-top:10px;" ng-show="ShowResult">
 117          <span class='arrowRed'>&#8594;</span>
 118          <label class="labeltext">UnReachable</label>&nbsp;&nbsp;
 119          <span class='arrowGreen'>&#8594;</span>
 120          <label class="labeltext">Reachable</label>
 121       </div>
 122    </div>
 123    <div class="row">
 124       <button type="button" ng-csv="objTestModel" class="btndownload" ng-show="ShowResult" filename="fileName.csv" csv-column-order="csvOrder" csv-header="['TestName','DeviceIP','TimeStamp','Status','Statistics','AvgTime','Result']">Download</button>
 125       <img src="images/downloadImage.png" width=30 height="30" ng-show="ShowResult" style="margin-left:5px;">
 126    </div>
 127 </div>
 128 </body>
 129 </html>