Project

General

Profile

1
<div id="page_content">
2
  <div id="page_content_inner">
3
    <h2 class="heading_b uk-margin-bottom">Previous validations</h2>
4

    
5
    <!-- TOP HELP CONTENT -->
6
    <help-content #topHelperContent [position]="'top'"
7
                  [ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
8
    </help-content>
9

    
10
    <div class="uk-grid">
11

    
12
      <!-- LEFT HELP CONTENT -->
13
      <aside-help-content #leftHelperContent [position]="'left'"
14
                          [ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
15
      </aside-help-content>
16

    
17
      <!-- MIDDLE -->
18
      <div class=" uk-width-expand@m">
19

    
20
        <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{ successMessage }}</div>
21
        <div *ngIf="failureMessage" class="uk-alert uk-alert-danger">{{ failureMessage }}</div>
22
        <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>
23
        <div *ngIf="loadingMessage" class="loading-big">
24
          <div class="loader-big"
25
               style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
26
            {{ loadingMessage }}
27
          </div>
28
          <div class="transparentFilm"></div>
29
        </div>
30
        <div *ngIf="jobsOfUser">
31

    
32

    
33
          <div class="page-controls">
34

    
35
            <div class="md-card uk-margin-medium-bottom">
36
              <div class="md-card-content">
37
                <div class="uk-grid" data-uk-grid-margin="">
38

    
39
                  <div class="uk-width-1-5 uk-row-first">
40
                    <div class="uk-margin-small-top">
41
                      <div class="md-input-wrapper md-input-filled">
42
                        <label class="">Filter by job type</label>
43
                        <select class="md-input" #selectType (change)="getJobType(selectType.value)">
44
                          <option value="">--none selected--</option>
45
                          <option *ngFor="let type of jobTypes" value="{{type}}">{{type}}</option>
46
                        </select>
47
                        <span class="md-input-bar"></span>
48
                      </div>
49

    
50
                      <!--<select id="product_search_status1" data-md-selectize="" multiple="multiple" data-md-selectize-bottom="" tabindex="-1" style="display: none;" class="selectized"></select>-->
51
                      <!--<div class="selectize-control multi plugin-tooltip">-->
52
                        <!--<div class="selectize-input items not-full has-options">-->
53
                          <!--<input type="select-multiple" autocomplete="off" tabindex="" id="product_search_status-selectized1" placeholder="Status" style="width: 47px;">-->
54
                        <!--</div>-->
55
                      <!--</div>-->
56
                      <!--<div class="selectize_fix"></div>-->
57
                    </div>
58
                  </div>
59

    
60
                  <div class="uk-width-3-5">
61
                  </div>
62

    
63
                  <div class="uk-width-1-5">
64
                    <div class="uk-margin-small-top">
65

    
66
                      <div class="md-input-wrapper md-input-filled">
67
                        <label class="">Jobs per page</label>
68
                        <select #itemsPerPage class="md-input" (change)="getItemsPerPage(+itemsPerPage.value)">
69
                          <option value="10" selected>10</option>
70
                          <option value="25">25</option>
71
                          <option value="50">50</option>
72
                          <option value="100">100</option>
73
                        </select>
74
                        <span class="md-input-bar"></span>
75
                      </div>
76

    
77
                    </div>
78
                  </div>
79

    
80
                </div>
81
              </div>
82
            </div>
83

    
84
            <div class="uk-margin-bottom uk-width-1-1 filters">
85

    
86
              <!--<h3 class="heading_a uk-margin-bottom">Filter validation jobs:</h3>-->
87
              <ul id="filter" class="uk-subnav uk-subnav-pill">
88
                <li class="uk-active" [class.uk-active]="currentFilter==='all'" data-uk-filter="">
89
                  <a (click)="filterJobs('all')">All jobs ({{this.jobsOfUser.totalJobs}})</a>
90
                </li>
91
                <li class="" [class.uk-active]="currentFilter==='successful'" data-uk-filter="filter-a">
92
                  <a (click)="filterJobs('successful')">successful ({{this.jobsOfUser.totalJobsSuccessful}})</a>
93
                </li>
94
                <li class="" [class.uk-active]="currentFilter==='failed'" data-uk-filter="filter-b">
95
                  <a (click)="filterJobs('failed')">failed ({{this.jobsOfUser.totalJobsFailed}})</a>
96
                </li>
97
                <li class="" [class.uk-active]="currentFilter==='ongoing'" data-uk-filter="filter-c">
98
                  <a (click)="filterJobs('ongoing')">ongoing ({{this.jobsOfUser.totalJobsOngoing}})</a>
99
                </li>
100
              </ul>
101

    
102
            </div>
103
          </div>
104

    
105

    
106
          <div class="md-card uk-margin-medium-bottom">
107
            <div class="md-card-content">
108
              <div class="uk-overflow-container">
109
                <table class="uk-table uk-table-nowrap table_check">
110
                  <thead>
111
                    <tr>
112
                      <th class="uk-width-2-10">Repository</th>
113
                      <th class="uk-width-1-10">Validation Type</th>
114
                      <th class="uk-width-1-10">Status</th>
115
                      <th class="uk-width-1-10">Score</th>
116
                      <th class="uk-width-1-10">Started</th>
117
                      <th class="uk-width-2-10">Guidelines</th>
118
                      <th class="uk-width-1-10">Actions</th>
119
                      <th class="uk-width-1-10"></th>
120
                    </tr>
121
                  </thead>
122
                  <tbody>
123
                    <tr *ngIf="infoMessage">
124
                      <td colspan="7">{{ infoMessage }}</td>
125
                    </tr>
126
                    <ng-container *ngIf="jobsOfUser && jobsOfUser.jobs">
127
                      <tr *ngFor="let job of jobsOfUser.jobs">
128
                        <td style="vertical-align: top !important;">
129
                          <div class="">{{ job.baseUrl }}</div>
130
                        </td>
131
                        <td style="vertical-align: top !important;">
132
                          <div *ngIf="job.validationType.includes('C')" class="">OAI Content</div>
133
                          <div *ngIf="job.validationType.includes('U')" class="">OAI Usage</div>
134
                        </td>
135
                        <td style="vertical-align: top !important;">
136
                          <div *ngIf="job.validationType.includes('C')" class="">{{ job.contentJobStatus }}</div>
137
                          <div *ngIf="job.validationType.includes('U')" class="">{{ job.usageJobStatus }}</div>
138
                        </td>
139
                        <td style="vertical-align: top !important;">
140
                          <div *ngIf="job.validationType.includes('C')" class="">{{ job.contentJobScore }}</div>
141
                          <div *ngIf="job.validationType.includes('U')" class="">{{ job.usageJobScore }}</div>
142
                        </td>
143
                        <td style="vertical-align: top !important;">
144
                          <div class="">{{ job.started }}</div>
145
                        </td>
146
                        <td style="vertical-align: top !important;">
147
                          <div class="">{{ job.guidelinesShortName }}</div>
148
                        </td>
149
                        <td style="vertical-align: top !important;">
150
                          <div>
151
                            <a [routerLink]="[job.id]">
152
                              View Results<i class="fa fa-angle-right uk-margin-small-left"></i>
153
                            </a>
154
                          </div>
155
                          <div>
156
                            <a (click)="resubmitJob(job.id.toString(), job.userEmail)">Resubmit Job<i class="fa fa-repeat uk-margin-small-left"></i></a>
157
                          </div>
158
                        </td>
159
                        <td class="uk-text-center">
160
                          <i *ngIf="job.validationStatus === 'ongoing'" title="{{job.validationStatus}}" class="material-icons" style="color: yellow; font-size: 25px;">help</i>
161
                          <i *ngIf="job.validationStatus === 'successful'" title="{{job.validationStatus}}" class="material-icons" style="color: green; font-size: 25px;">check_circle</i>
162
                          <i *ngIf="job.validationStatus === 'failed'" title="{{job.validationStatus}}" class="material-icons" style="color: red; font-size: 25px;">cancel</i>
163
                          <!--<img type="image" [src]="getResultImage(job.validationStatus)" title="{{job.validationStatus}}">-->
164
                        </td>
165
                      </tr>
166
                    </ng-container>
167
                  </tbody>
168
                </table>
169
              </div>
170

    
171
              <ul class="uk-pagination uk-margin-top uk-flex-right" uk-margin>
172
                <li><a (click)="goToPreviousPage()" class="pagination_arrow"><span uk-pagination-previous></span></a></li>
173
                <li class="uk-active"><span>{{ (totalPages > 0) ? currentPage+1 : 0 }}</span></li>
174
                <li><a (click)="goToNextPage()" class="pagination_arrow"><span uk-pagination-next></span></a></li>
175
              </ul>
176
              <!--<ul class="uk-pagination uk-margin-medium-top">-->
177
                <!--<li class="uk-pagination-previous"><a (click)="goToPreviousPage()"><i class="uk-icon-angle-left"></i><span class="uk-margin-left">Previous</span></a></li>-->
178
                <!--<li class=""><span>page {{ (totalPages > 0) ? currentPage+1 : 0 }} of {{ totalPages }}</span></li>-->
179
                <!--<li class="uk-pagination-next"><a (click)="goToNextPage()"><span class="uk-margin-right">Next</span><i class="uk-icon-angle-right"></i></a></li>-->
180
              <!--</ul>-->
181
            </div>
182
          </div>
183

    
184
          <!--<div class="contentAndPagerPanel">-->
185
            <!--<div>-->
186
              <!--<ul class="uk-pagination">-->
187
                <!--<li>-->
188
                  <!--<a class="uk-link uk-link-muted" (click)="goToPreviousPage()">-->
189
                      <!--<span class="uk-margin-small-right uk-pagination-previous uk-icon" uk-pagination-previous="">-->
190
                        <!--<svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg"-->
191
                             <!--icon="pagination-previous" ratio="1"></svg>-->
192
                      <!--</span>-->
193
                    <!--Previous-->
194
                  <!--</a>-->
195
                <!--</li>-->
196
                <!--<li class="uk-margin-auto-left">-->
197
                  <!--<a class="uk-link uk-link-muted" (click)="goToNextPage()">-->
198
                    <!--Next-->
199
                    <!--<span class="uk-margin-small-left uk-pagination-next uk-icon" uk-pagination-next="">-->
200
                        <!--<svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg"-->
201
                             <!--icon="pagination-next" ratio="1"></svg>-->
202
                      <!--</span>-->
203
                  <!--</a>-->
204
                <!--</li>-->
205
              <!--</ul>-->
206
              <!--<div class="resultsPageLabel">page {{ (totalPages > 0) ? currentPage+1 : 0 }} of {{ totalPages }}</div>-->
207
            <!--</div>-->
208
            <!--<div>-->
209
              <!--<div>-->
210
                <!--<div class="uk-overflow-auto uk-scrollspy-inview uk-animation-slide-top-medium uk-margin-top uk-margin-bottom">-->
211
                  <!--<table class="uk-table uk-table-middle uk-table-striped" style="vertical-align: top !important;">-->
212
                    <!--<thead>-->
213
                    <!--<tr>-->
214
                      <!--<th>Repository</th>-->
215
                      <!--<th>Validation Type</th>-->
216
                      <!--<th>Status</th>-->
217
                      <!--<th>Score</th>-->
218
                      <!--<th>Started</th>-->
219
                      <!--<th>Guidelines</th>-->
220
                      <!--<th>Actions</th>-->
221
                      <!--<th></th>-->
222
                    <!--</tr>-->
223
                    <!--</thead>-->
224
                    <!--<tr *ngIf="infoMessage">-->
225
                      <!--<td colspan="7">{{ infoMessage }}</td>-->
226
                    <!--</tr>-->
227
                    <!--<tbody *ngIf="jobsOfUser && jobsOfUser.jobs">-->
228
                    <!--<tr class="el-item" *ngFor="let job of jobsOfUser.jobs">-->
229
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
230
                        <!--<div class="el-title">{{ job.baseUrl }}</div>-->
231
                      <!--</td>-->
232
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
233
                        <!--<div *ngIf="job.validationType.includes('C')" class="el-title">OAI Content</div>-->
234
                        <!--<div *ngIf="job.validationType.includes('U')" class="el-title">OAI Usage</div>-->
235
                      <!--</td>-->
236
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
237
                        <!--<div *ngIf="job.validationType.includes('C')" class="el-title">{{ job.contentJobStatus }}</div>-->
238
                        <!--<div *ngIf="job.validationType.includes('U')" class="el-title">{{ job.usageJobStatus }}</div>-->
239
                      <!--</td>-->
240
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
241
                        <!--<div *ngIf="job.validationType.includes('C')" class="el-title">{{ job.contentJobScore }}</div>-->
242
                        <!--<div *ngIf="job.validationType.includes('U')" class="el-title">{{ job.usageJobScore }}</div>-->
243
                      <!--</td>-->
244
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
245
                        <!--<div class="el-title">{{ job.started }}</div>-->
246
                      <!--</td>-->
247
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
248
                        <!--<div class="el-title">{{ job.guidelinesShortName }}</div>-->
249
                      <!--</td>-->
250
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
251
                        <!--<div class="el-link">-->
252
                          <!--<div class="viewDetailsLinkWrapper">-->
253
                            <!--<a class="viewDetails" [routerLink]="[job.id]">-->
254
                              <!--View Results<i class="fa fa-angle-right"></i>-->
255
                            <!--</a>-->
256
                          <!--</div>-->
257
                          <!--<div>-->
258
                            <!--<a class="resubmitJob" (click)="resubmitJob(job.id.toString(), job.userEmail)">Resubmit Job<i class="fa fa-repeat"></i></a>-->
259
                          <!--</div>-->
260
                        <!--</div>-->
261
                      <!--</td>-->
262
                      <!--<td class="uk-table-shrink" style="vertical-align: top !important;">-->
263
                        <!--<img type="image" [src]="getResultImage(job.validationStatus)" title="{{job.validationStatus}}">-->
264
                      <!--</td>-->
265
                    <!--</tr>-->
266
                    <!--</tbody>-->
267
                  <!--</table>-->
268
                <!--</div>-->
269
              <!--</div>-->
270
            <!--</div>-->
271
            <!--<div>-->
272
              <!--<ul class="uk-pagination">-->
273
                <!--<li>-->
274
                  <!--<a class="uk-link uk-link-muted" (click)="goToPreviousPage()">-->
275
                    <!--<span class="uk-margin-small-right uk-pagination-previous uk-icon" uk-pagination-previous="">-->
276
                      <!--<svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg"-->
277
                           <!--icon="pagination-previous" ratio="1"></svg>-->
278
                    <!--</span>-->
279
                    <!--Previous-->
280
                  <!--</a>-->
281
                <!--</li>-->
282
                <!--<li class="uk-margin-auto-left">-->
283
                  <!--<a class="uk-link uk-link-muted" (click)="goToNextPage()">-->
284
                    <!--Next-->
285
                    <!--<span class="uk-margin-small-left uk-pagination-next uk-icon" uk-pagination-next="">-->
286
                        <!--<svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg"-->
287
                             <!--icon="pagination-next" ratio="1"></svg>-->
288
                      <!--</span>-->
289
                  <!--</a>-->
290
                <!--</li>-->
291
              <!--</ul>-->
292
              <!--<div class="resultsPageLabel">page {{ (totalPages > 0) ? currentPage+1 : 0 }} of {{ totalPages }}</div>-->
293
            <!--</div>-->
294
          <!--</div>-->
295
          <!--<div class="row"></div>-->
296
        </div>
297

    
298
      </div>
299

    
300
      <!-- RIGHT HELP CONTENT -->
301
      <aside-help-content #rightHelperContent [position]="'right'"
302
                          [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
303
      </aside-help-content>
304

    
305
    </div>
306

    
307
    <!-- BOTTOM HELP CONTENT -->
308
    <help-content #bottomHelperContent [position]="'bottom'"
309
                  [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
310
    </help-content>
311

    
312
  </div>
313
</div>
314

    
(5-5/11)