Project

General

Profile

1
<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
2
  <div class="uk-width-1-1@m uk-first-column">
3

    
4
    <h1 class="uk-h2">Run compatibility test</h1>
5

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

    
11
    <div class="uk-container uk-margin-medium-top uk-margin-medium-bottom">
12
      <div class="uk-grid">
13

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

    
19
        <!-- MIDDLE -->
20
        <div class=" uk-width-expand@m">
21

    
22
          <div class="wizard">
23
            <div class="wizardBreadcrumbs">
24
              <div class="steps clearfix">
25
                <div class="step active">
26
                  <div>
27
                    Select datasource
28
                    <span></span>
29
                  </div>
30
                </div>
31
                <div class="step {{step2}}">
32
                  <div>
33
                    Select guidlines
34
                    <span></span>
35
                  </div>
36
                </div>
37
                <div class="step {{step3}}">
38
                  <div>
39
                    Select parameters
40
                    <span></span>
41
                  </div>
42
                </div>
43
                <div class="step {{step4}}">
44
                  <div>
45
                    Finish
46
                    <span></span>
47
                  </div>
48
                </div>
49
              </div>
50
            </div>
51
            <div class="content">
52
              <div>
53
                <div class="animated fadeInRight stepContent">
54
                  <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>
55
                  <div *ngIf="loadingMessage" class="loading-big">
56
                    <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
57
                      {{ loadingMessage }}
58
                    </div>
59
                    <div class="whiteFilm"></div>
60
                  </div>
61
                  <div *ngIf="showDatasource">
62
                    <compatibility-validate-step1 #step1ChooseBaseUrl
63
                                                  [baseUrlList]="baseUrlList"
64
                                                  (emitObject)="getChosenUrl($event)"></compatibility-validate-step1>
65
                  </div>
66
                  <div *ngIf="showGuidelines">
67
                    <compatibility-validate-step2 #step2ChooseGuidelines
68
                                                  [ruleSets]="ruleSets"
69
                                                  (emitObject)="getChosenRules($event)">
70
                    </compatibility-validate-step2>
71
                  </div>
72
                  <div *ngIf="showParameters">
73
                    <compatibility-validate-step3 #step3ChooseParameters
74
                                                  [valSets]="valSets"
75
                                                  (emitObject)="getChosenParameters($event)">
76
                    </compatibility-validate-step3>
77
                  </div>
78
                  <div *ngIf="showCrisEntities">
79
                    <compatibility-validate-step3-cris #step3ChooseCrisEntities
80
                                                       (emitObject)="getChosenCrisEntities($event)">
81
                    </compatibility-validate-step3-cris>
82
                  </div>
83
                  <div *ngIf="showFinish">
84
                    <div>
85
                      <div class="success">
86
                        <i class="fa fa-check-circle" style=""></i>
87
                        <h3>Validation has begun</h3>
88
                      </div>
89
                      <div class="uk-alert uk-alert-primary marginTop20 textAlignCenter">
90
                        You will be notified by email with the results of the compatibility test.
91
                      </div>
92
                    </div>
93
                  </div>
94
                </div>
95
              </div>
96
            </div>
97
            <div class="wizardActions">
98
              <button *ngIf="!showDatasource && !showFinish" class="uk-button uk-button-grey-light" type="button" (click)="moveBackAStep()">
99
                <i class="fa fa-angle-double-left"></i>
100
                Back
101
              </button>
102
              <button *ngIf="!showFinish" class="uk-button uk-button-grey-light" type="button" (click)="moveAStep()">
103
                <span *ngIf="!showParameters">Next</span>
104
                <span *ngIf="showParameters" class="uk-link">Finish</span>
105
                <i class="fa fa-angle-double-right"></i>
106
              </button>
107
            </div>
108
          </div>
109

    
110
        </div>
111

    
112
        <!-- RIGHT HELP CONTENT -->
113
        <aside-help-content #rightHelperContent [position]="'right'"
114
                            [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
115
        </aside-help-content>
116

    
117
      </div>
118
    </div>
119

    
120

    
121
    <!-- BOTTOM HELP CONTENT -->
122
    <help-content #bottomHelperContent [position]="'bottom'"
123
                  [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
124
    </help-content>
125

    
126

    
127
  </div>
128
</div>
(5-5/15)