ui/src/main/webapp/app/AECBlueprintValidationUI/GetBySubmissionId/GetBySubmissionIdTemplate.html

   1 <!--
   2 Copyright (c) 2019 AT&T Intellectual Property. All rights reserved.
   3
   4 Licensed under the Apache License, Version 2.0 (the "License");
   5 you may not use this file except in compliance with the License.
   6 You may obtain a copy of the License at
   7
   8        http://www.apache.org/licenses/LICENSE-2.0
   9
  10 Unless required by applicable law or agreed to in writing, software
  11 distributed under the License is distributed on an "AS IS" BASIS,
  12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 See the License for the specific language governing permissions and
  14 limitations under the License.
  15 -->
  16
  17 <div id="page-content" class="content" style="padding: 25px;">
  18  <style>
  19 .graph, .empty-graph {
  20     border: 1px solid #ccc;
  21     width: auto;
  22     height: 7px;
  23     padding: 0;
  24     background: #f33;
  25 }
  26
  27 .pass-bar {
  28     background: #1d4;
  29 }
  30
  31 .pass-bar, .fail-bar {
  32     float: left;
  33     height: 100%;
  34 }
  35
  36 div.box {
  37     border: 1px solid black;
  38 }
  39 </style>
  40
  41  <h1 class="heading-page">Get results by submission</h1>
  42
  43  <h2 class="heading-small">General matching string:</h2>
  44  <div>
  45   <input ng-model="filterGeneralMatch" type="text" placeholder="?"
  46    style="margin-top: 5px; width: 260px;">
  47  </div>
  48
  49  <h2 class="heading-small">Select Submission:</h2>
  50
  51  <div>
  52   <select ng-model="selectedSubmission"
  53    ng-init="selectedSubmission=submissionsForDisplay[0]"
  54    ng-change="selectedSubmissionChange(selectedSubmission)"
  55    ng-options="n for n in submissionsForDisplay | filter:filterGeneralMatch">
  56   </select>
  57  </div>
  58
  59  <div ng-show="loading">
  60   <img src=" static/fusion/images/giphy.gif" />
  61  </div>
  62
  63  <h2 class="heading-small"></h2>
  64  <div ng-show="showResults">
  65   <h2 class="heading-small">Select a blueprint layer of the
  66    selected submission:</h2>
  67   <div>
  68    <select ng-model="selectedLayer" ng-init="resultsLayers[0]"
  69     ng-change="selectedResultsLayerChange(selectedLayer)"
  70     ng-options="n for n in resultsLayers">
  71    </select>
  72   </div>
  73
  74   <h2 class="heading-small">Select a test suite of the selected
  75    (submission, layer) pair in order to be displayed:</h2>
  76   <div>
  77    <select ng-model="selectedTestSuiteName"
  78     ng-init="resultsLayerTestSuitesNames[0]"
  79     ng-change="selectedTestSuitesNameChange(selectedTestSuiteName)"
  80     ng-options="n for n in resultsLayerTestSuitesNames">
  81    </select>
  82   </div>
  83  </div>
  84
  85  <br> <br> <br>
  86
  87  <div
  88   ng-hide="selectedSubmission == null || selectedLayer == null || selectedTestSuiteName == null">
  89   <div>
  90    <h2 class="heading-small"></h2>
  91    <div class="box">
  92     <h3 class="heading-small">
  93      <u>General Info</u>
  94     </h3>
  95     <p></p>
  96
  97     <p></p>
  98     <p>Name: {{selectedRobotTestResult.name}}</p>
  99     <p>Generated: {{selectedRobotTestResult.robot.generated}}</p>
 100     <p>Generator: {{selectedRobotTestResult.robot.generator}}</p>
 101     <p>Errors: {{selectedRobotTestResult.robot.errors}}</p>
 102
 103     <h2 class="heading-small"></h2>
 104     <h3 class="heading-small">
 105      <u>Test Statistics</u>
 106     </h3>
 107     <p></p>
 108     <table class="striped" cellspacing="0" cellpadding="10">
 109      <caption>
 110       <h3></h3>
 111      </caption>
 112      <thead>
 113       <th><p>&nbsp;Total statistics&nbsp;</p></th>
 114       <th><p>Total&nbsp;</p></th>
 115       <th><p>Pass&nbsp;</p></th>
 116       <th><p>Fail&nbsp;</p></th>
 117       <th><p>Pass / Fail&nbsp;</p></th>
 118       </tr>
 119      </thead>
 120      <tbody>
 121       <tr
 122        ng-repeat="stat in selectedRobotTestResult.robot.statistics.total.stat">
 123        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 124         stat.content }}</td>
 125        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 126         (stat.fail * 1) + (stat.pass*1) }}</td>
 127        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 128         stat.pass }}</td>
 129        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 130         stat.fail}}</td>
 131        <td style="padding-left: 10px; font-size: 15px; width: 13%;">
 132         <div class="graph">
 133          <div class="pass-bar"
 134           ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 135           title="100%"></div>
 136          <div class="fail-bar"
 137           ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 138           title="0%"></div>
 139         </div>
 140        </td>
 141       </tr>
 142      </tbody>
 143     </table>
 144
 145     <br>
 146
 147     <h3 class="heading-small"></h3>
 148     <table class="striped" cellspacing="0" cellpadding="10">
 149      <caption>
 150       <h3></h3>
 151      </caption>
 152      <thead>
 153       <th><p>&nbsp;Statistics by Tag&nbsp;</p></th>
 154       <th><p>Total&nbsp;</p></th>
 155       <th><p>Pass&nbsp;</p></th>
 156       <th><p>Fail&nbsp;</p></th>
 157       <th><p>Pass / Fail&nbsp;</p></th>
 158       </tr>
 159      </thead>
 160      <tbody>
 161       <tr
 162        ng-repeat="stat in selectedRobotTestResult.robot.statistics.tag.stat">
 163        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 164         stat.content }}</td>
 165        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 166         (stat.fail * 1) + (stat.pass*1) }}</td>
 167        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 168         stat.pass }}</td>
 169        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 170         stat.fail}}</td>
 171        <td style="padding-left: 10px; font-size: 15px; width: 13%;">
 172         <div class="graph">
 173          <div class="pass-bar"
 174           ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 175           title="100%"></div>
 176          <div class="fail-bar"
 177           ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 178           title="0%"></div>
 179         </div>
 180        </td>
 181       </tr>
 182      </tbody>
 183     </table>
 184
 185     <br>
 186
 187     <h3 class="heading-small"></h3>
 188     <table class="striped" cellspacing="0" cellpadding="10">
 189      <caption>
 190       <h3></h3>
 191      </caption>
 192      <thead>
 193       <th><p>&nbsp;Statistics by Suite&nbsp;</p></th>
 194       <th><p>Total&nbsp;</p></th>
 195       <th><p>Pass&nbsp;</p></th>
 196       <th><p>Fail&nbsp;</p></th>
 197       <th><p>Pass / Fail&nbsp;</p></th>
 198       </tr>
 199      </thead>
 200      <tbody>
 201       <tr
 202        ng-repeat="stat in selectedRobotTestResult.robot.statistics.suite.stat">
 203        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 204         stat.content }}</td>
 205        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 206         (stat.fail * 1) + (stat.pass*1) }}</td>
 207        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 208         stat.pass }}</td>
 209        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 210         stat.fail}}</td>
 211        <td style="padding-left: 10px; font-size: 15px; width: 13%;">
 212         <div class="graph">
 213          <div class="pass-bar"
 214           ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 215           title="100%"></div>
 216          <div class="fail-bar"
 217           ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
 218           title="0%"></div>
 219         </div>
 220        </td>
 221       </tr>
 222      </tbody>
 223     </table>
 224    </div>
 225
 226    <h2 class="heading-small"></h2>
 227    <div class="box">
 228     <h3 class="heading-small">
 229      <a href="#" ng-click="showDetailsLog = ! showDetailsLog">Test
 230       Execution Log</a>
 231     </h3>
 232     <div ng-show="showDetailsLog">
 233      <p></p>
 234      <p>Root Suite Full Name:
 235       {{selectedRobotTestResult.robot.suite.name}}</p>
 236      <p>Source: {{selectedRobotTestResult.robot.suite.source}}</p>
 237      <p>Status:
 238       {{selectedRobotTestResult.robot.suite.status.status}}</p>
 239      <p>Start time:
 240       {{selectedRobotTestResult.robot.suite.status.starttime}}</p>
 241      <p>End time:
 242       {{selectedRobotTestResult.robot.suite.status.endtime}}</p>
 243
 244      <h2 class="heading-small"></h2>
 245      <p></p>
 246      <p>Sub-suite Full Name:
 247       {{selectedRobotTestResult.robot.suite.suite.name}}</p>
 248      <p>Documentation:
 249       {{selectedRobotTestResult.robot.suite.suite.doc}}</p>
 250      <p>Source: {{selectedRobotTestResult.robot.suite.suite.source}}</p>
 251      <p>Status:
 252       {{selectedRobotTestResult.robot.suite.suite.status.status}}</p>
 253      <p>Start time:
 254       {{selectedRobotTestResult.robot.suite.suite.status.starttime}}</p>
 255      <p>End time:
 256       {{selectedRobotTestResult.robot.suite.suite.status.endtime}}</p>
 257     </div>
 258    </div>
 259
 260    <h2 class="heading-small"></h2>
 261    <div class="box">
 262     <ul>
 263      <h4 class="heading-small">Sub-suite Robot keywords</h4>
 264      <li ng-repeat="kw in selectedRobotTestResult.robot.suite.suite.kw">
 265       <h2 class="heading-small"></h2>
 266       <h4>
 267        <a href="#" ng-click="showDetails = ! showDetails">
 268         {{kw.name}}</a>
 269       </h4>
 270       <div ng-show="showDetails">
 271        <p>&emsp;&emsp;&emsp;&emsp; Type: {{kw.type}}</p>
 272        <p>&emsp;&emsp;&emsp;&emsp; Library: {{kw.library}}</p>
 273        <p>&emsp;&emsp;&emsp;&emsp; Documentation: {{kw.doc}}</p>
 274        <p>&emsp;&emsp;&emsp;&emsp; Start time:
 275         {{kw.status.starttime}}</p>
 276        <p>&emsp;&emsp;&emsp;&emsp; End time: {{kw.status.endtime}}</p>
 277        <p>&emsp;&emsp;&emsp;&emsp; Status: {{kw.status.status}}</p>
 278        <p></p>
 279        <p>&emsp;&emsp;&emsp;&emsp; Used Robot keywords</p>
 280        <ul>
 281         <li ng-repeat="kw2 in kw.kw">
 282          <h4>
 283           <a href="#" ng-click="showDetails2 = ! showDetails2">&emsp;&emsp;&emsp;&emsp;
 284            {{kw2.name}}</a>
 285          </h4>
 286          <div ng-show="showDetails2">
 287           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; Type:
 288            {{kw2.type}}</p>
 289           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 290            Library: {{kw2.library}}</p>
 291           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 292            Documentation: {{kw2.doc}}</p>
 293           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; Start
 294            time: {{kw2.status.starttime}}</p>
 295           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; End
 296            time: {{kw2.status.endtime}}</p>
 297           <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 298            Status: {{kw2.status.status}}</p>
 299          </div>
 300         </li>
 301        </ul>
 302       </div>
 303      </li>
 304     </ul>
 305    </div>
 306
 307    <h2 class="heading-small"></h2>
 308    <div class="box">
 309     <h3 class="heading-small">Test Cases</h3>
 310     <table class="striped" cellspacing="0" cellpadding="10">
 311      <caption>
 312       <h3></h3>
 313      </caption>
 314      <thead>
 315       <th><p>&nbsp;Full Name&nbsp;</p></th>
 316       <th><p>Documentation&nbsp;</p></th>
 317       <th><p>Status&nbsp;</p></th>
 318       <th><p>Start Time&nbsp;</p></th>
 319       <th><p>End Time&nbsp;</p></th>
 320       <th><p>Critical&nbsp;</p></th>
 321       <th><p>Message&nbsp;</p></th>
 322       <th><p>Robot keywords&nbsp;</p></th>
 323       </tr>
 324      </thead>
 325      <tbody>
 326       <tr
 327        ng-repeat="test in selectedRobotTestResult.robot.suite.suite.test">
 328        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
 329         test.name }}</td>
 330        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.doc}}</td>
 331        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.status}}</td>
 332        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.starttime}}</td>
 333        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.endtime}}</td>
 334        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.critical}}</td>
 335        <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.content}}</td>
 336        <td style="padding-left: 10px; font-size: 15px; width: 13%;">
 337
 338         <ul>
 339          <li ng-repeat="testKw in test.kw">
 340           <h2 class="heading-small"></h2>
 341           <h4>
 342            <a href="#" ng-click="showDetails3 = ! showDetails3">
 343             {{testKw.name}}</a>
 344           </h4>
 345           <div ng-show="showDetails3">
 346            <p>&emsp;&emsp;&emsp;&emsp; Type: {{testKw.type}}</p>
 347            <p>&emsp;&emsp;&emsp;&emsp; Library: {{testKw.library}}</p>
 348            <p>&emsp;&emsp;&emsp;&emsp; Documentation: {{testKw.doc}}</p>
 349            <p>&emsp;&emsp;&emsp;&emsp; Start time:
 350             {{testKw.status.starttime}}</p>
 351            <p>&emsp;&emsp;&emsp;&emsp; End time:
 352             {{testKw.status.endtime}}</p>
 353            <p>&emsp;&emsp;&emsp;&emsp; Status:
 354             {{testKw.status.status}}</p>
 355            <p></p>
 356            <p>&emsp;&emsp;&emsp;&emsp; Used Robot keywords</p>
 357            <ul>
 358             <li ng-repeat="testKw2 in testKw.kw">
 359              <h4>
 360               <a href="#" ng-click="showDetails4 = ! showDetails4">&emsp;&emsp;&emsp;&emsp;
 361                {{testKw2.name}}</a>
 362              </h4>
 363              <div ng-show="showDetails4">
 364               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 365                Type: {{testKw2.type}}</p>
 366               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 367                Library: {{testKw2.library}}</p>
 368               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 369                Documentation: {{testKw2.doc}}</p>
 370               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 371                Start time: {{testKw2.status.starttime}}</p>
 372               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 373                End time: {{testKw2.status.endtime}}</p>
 374               <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
 375                Status: {{testKw2.status.status}}</p>
 376              </div>
 377             </li>
 378            </ul>
 379        </td>
 380
 381       </tr>
 382      </tbody>
 383     </table>
 384    </div>
 385
 386   </div>
 387  </div>
 388 </div>