UI initial implementation.
[validation.git] / ui / src / main / webapp / views / findBySubmissionId.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 <!DOCTYPE script PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
18 <html ng-app="BlueprintValidationUIManagement">
19 <head>
20 <style>
21 .graph, .empty-graph {
22         border: 1px solid #ccc;
23         width: auto;
24         height: 7px;
25         padding: 0;
26         background: #f33;
27 }
28
29 .pass-bar {
30         background: #1d4;
31 }
32
33 .pass-bar, .fail-bar {
34         float: left;
35         height: 100%;
36 }
37 </style>
38 </head>
39 <body ng-controller="AECFindBySubmissionIdController">
40  <div id="akrainofindbysubmissionidform"
41   style="padding-left: 20px; padding-right: 20px">
42   <div>
43    <h1>Find results by submission</h1>
44   </div>
45
46   <label>Select Submission: </label>
47   <div class="selectStyle">
48    <select class="exampleTable" ng-model="selectedSubmission"
49     ng-init="selectedSubmission=submissionsForDisplay[0]"
50     ng-change="selectedSubmissionChange(selectedSubmission)"
51     ng-options="n for n in submissionsForDisplay">
52    </select>
53   </div>
54
55   <div ng-repeat="result in results">
56
57    <h2>Test info</h2>
58    <p></p>
59    <p>Name: {{result.name}}</p>
60    <p>Generated: {{result.robot.generated}}</p>
61    <p>Generator: {{result.robot.generator}}</p>
62    <p>Errors: {{result.robot.errors}}</p>
63
64    <h2>Test Statistics</h2>
65    <p></p>
66    <table cellspacing="0" cellpadding="10" class="siteStatusTable">
67     <caption>
68      <h3></h3>
69     </caption>
70     <thead>
71      <th>&nbsp;Total statistics&nbsp;</th>
72      <th>Total&nbsp;</th>
73      <th>Pass&nbsp;</th>
74      <th>Fail&nbsp;</th>
75      <th>Pass / Fail&nbsp;</th>
76      </tr>
77     </thead>
78     <tbody>
79      <tr class="border_bottom"
80       ng-repeat="stat in result.robot.statistics.total.stat">
81       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
82        stat.content }}</td>
83       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
84        (stat.fail * 1) + (stat.pass*1) }}</td>
85       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
86        stat.pass }}</td>
87       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
88        stat.fail}}</td>
89       <td style="padding-left: 10px; font-size: 15px; width: 13%;">
90        <div class="graph">
91         <div class="pass-bar"
92          ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
93          title="100%"></div>
94         <div class="fail-bar"
95          ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
96          title="0%"></div>
97        </div>
98       </td>
99      </tr>
100     </tbody>
101    </table>
102
103    <table cellspacing="0" cellpadding="10" class="siteStatusTable">
104     <caption>
105      <h3></h3>
106     </caption>
107     <thead>
108      <th>&nbsp;Statistics by Tag&nbsp;</th>
109      <th>Total&nbsp;</th>
110      <th>Pass&nbsp;</th>
111      <th>Fail&nbsp;</th>
112      <th>Pass / Fail&nbsp;</th>
113      </tr>
114     </thead>
115     <tbody>
116      <tr class="border_bottom"
117       ng-repeat="stat in results.robot.statistics.tag.stat">
118       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
119        stat.content }}</td>
120       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
121        (stat.fail * 1) + (stat.pass*1) }}</td>
122       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
123        stat.pass }}</td>
124       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
125        stat.fail}}</td>
126       <td style="padding-left: 10px; font-size: 15px; width: 13%;">
127        <div class="graph">
128         <div class="pass-bar"
129          ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
130          title="100%"></div>
131         <div class="fail-bar"
132          ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
133          title="0%"></div>
134        </div>
135       </td>
136      </tr>
137     </tbody>
138    </table>
139
140    <table cellspacing="0" cellpadding="10" class="siteStatusTable">
141     <caption>
142      <h3></h3>
143     </caption>
144     <thead>
145      <th>&nbsp;Statistics by Suite&nbsp;</th>
146      <th>Total&nbsp;</th>
147      <th>Pass&nbsp;</th>
148      <th>Fail&nbsp;</th>
149      <th>Pass / Fail&nbsp;</th>
150      </tr>
151     </thead>
152     <tbody>
153      <tr class="border_bottom"
154       ng-repeat="stat in result.robot.statistics.suite.stat">
155       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
156        stat.content }}</td>
157       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
158        (stat.fail * 1) + (stat.pass*1) }}</td>
159       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
160        stat.pass }}</td>
161       <td style="padding-left: 10px; font-size: 15px; width: 13%;">{{
162        stat.fail}}</td>
163       <td style="padding-left: 10px; font-size: 15px; width: 13%;">
164        <div class="graph">
165         <div class="pass-bar"
166          ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
167          title="100%"></div>
168         <div class="fail-bar"
169          ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
170          title="0%"></div>
171        </div>
172       </td>
173      </tr>
174     </tbody>
175    </table>
176
177   </div>
178  </div>
179 </body>
180
181 </html>
182