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">Registrations Admin</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-container-expand 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 *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>
23
          <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{ successMessage }}</div>
24

    
25

    
26
          <div class="uk-grid">
27
            <div class="uk-width-1-1@m uk-padding" style="background-color: #fff; text-align: center">
28
              <form [formGroup]="dataForm" class="uk-search uk-search-default uk-width-1-1@m">
29
                <input class="uk-width-1-2 uk-search-input" type="search" formControlName="officialName" placeholder="Search (official name) ..." style="background-color: #fff">
30
                <button class="uk-button" (click)="handleChangeAndResetPage()">Search</button>
31
              </form>
32
            </div>
33
          </div>
34

    
35
          <div class="uk-grid">
36
            <div class="uk-width-1-4@m">
37
              <form [formGroup]="dataForm" class="uk-form-stacked">
38

    
39
                <div class="uk-form-label uk-text-large">Filtered By</div>
40

    
41
                <div class="uk-margin">
42
                  <div class="uk-form-label uk-text-large">Datasource Type</div>
43
                  <div class="uk-form-controls">
44
                    <label><input class="uk-radio" type="radio" value="" (change)="handleChangeAndResetPage()" formControlName="typology"> Any</label><br>
45
                    <label><input class="uk-radio" type="radio" value="Aggregator" (change)="handleChangeAndResetPage()" formControlName="typology"> Aggregator</label><br>
46
                    <label><input class="uk-radio" type="radio" value="Journal" (change)="handleChangeAndResetPage()" formControlName="typology"> Journal</label><br>
47
                    <label><input class="uk-radio" type="radio" value="datarepository" (change)="handleChangeAndResetPage()" formControlName="typology"> Data Repository</label><br>
48
                    <label><input class="uk-radio" type="radio" value="pubsrepository" (change)="handleChangeAndResetPage()" formControlName="typology"> Public Repository</label><br>
49
                    <label><input class="uk-radio" type="radio" value="entityregistry" (change)="handleChangeAndResetPage()" formControlName="typology"> Entity Registry</label><br>
50
                    <label><input class="uk-radio" type="radio" value="Institutional" (change)="handleChangeAndResetPage()" formControlName="typology"> Institutional</label><br>
51
                    <label><input class="uk-radio" type="radio" value="Thematic" (change)="handleChangeAndResetPage()" formControlName="typology"> Thematic</label><br>
52
                    <label><input class="uk-radio" type="radio" value="Products" (change)="handleChangeAndResetPage()" formControlName="typology"> Products</label><br>
53
                    <label><input class="uk-radio" type="radio" value="Unknown" (change)="handleChangeAndResetPage()" formControlName="typology"> Unknown</label>
54
                  </div>
55
                </div>
56

    
57
                <div class="uk-margin">
58
                  <div class="uk-form-label uk-text-large">Countries</div>
59
                  <div class="uk-form-controls">
60
                    <ng-container *ngIf="countries && countries.length>0">
61
                      <read-more [maxHeight]="238">
62
                        <div><input class="uk-radio" type="radio" value="" (change)="handleChangeAndResetPage()" formControlName="country"> Any</div>
63
                        <ng-container *ngFor="let country of countries">
64
                          <div class="">
65
                            <input class="uk-radio" type="radio" value="{{country.code}}"
66
                                   (change)="handleChangeAndResetPage()" formControlName="country"> {{country.name}}
67
                          </div>
68
                        </ng-container>
69
                      </read-more>
70
                    </ng-container>
71
                  </div>
72
                </div>
73

    
74
              </form>
75
            </div>
76
            <div class="uk-width-expand@m">
77
              <div class="uk-grid">
78
                <div class="uk-width-1-1@m uk-margin-medium">
79
                  <form [formGroup]="dataForm" class="uk-form-horizontal uk-grid">
80

    
81
                    <div class="uk-width-2-5@m">
82
                      <div class="uk-margin">
83
                        <label class="uk-form-label uk-text-right" for="size">Items per page: </label>
84
                        <div class="uk-form-controls">
85
                          <select class="uk-select" id="size" (change)="handleChangeAndResetPage()" formControlName="size">
86
                            <option value="10">10</option>
87
                            <option value="25" selected>25</option>
88
                            <option value="50">50</option>
89
                            <option value="100">100</option>
90
                          </select>
91
                        </div>
92
                      </div>
93
                    </div>
94

    
95
                    <div class="uk-width-expand@m ">
96

    
97
                      <div class="uk-float-right">
98
                        <label class="uk-form-label uk-text-right" for="orderBy">Order by: </label>
99
                        <div class="uk-form-controls">
100
                          <select class="uk-select" id="orderBy" (change)="handleChangeAndResetPage()" formControlName="order">
101
                            <option value="DESCENDING" selected>Descending</option>
102
                            <option value="ASCENDING">Ascending</option>
103
                          </select>
104
                        </div>
105
                      </div>
106

    
107
                      <div class="uk-float-right">
108
                        <label class="uk-form-label uk-text-right" for="sortBy">Sort by: </label>
109
                        <div class="uk-form-controls">
110
                          <select class="uk-select" id="sortBy" (change)="handleChangeAndResetPage()" formControlName="requestSortBy">
111
                            <option value="registrationdate" selected>Date</option>
112
                            <option value="officialname">Name</option>
113
                          </select>
114
                        </div>
115
                      </div>
116

    
117
                    </div>
118

    
119

    
120
                  </form>
121
                </div>
122

    
123
                <div class="uk-width-1-1@m">
124

    
125
                  <div *ngIf="loadingMessage" class="loading-big">
126
                    <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
127
                      {{ loadingMessage }}
128

    
129
                    </div>
130
                    <div class="whiteFilm"></div>
131
                  </div>
132

    
133
                  <!-- TABLE -->
134
                  <table class="uk-table uk-table-striped">
135
                    <thead>
136
                    <tr>
137
                      <th>Repository</th>
138
                      <th>Date</th>
139
                      <th>Organization</th>
140
                      <th>Type</th>
141
                    </tr>
142
                    </thead>
143
                    <tbody>
144
                    <tr *ngFor="let res of repositorySnippet">
145
                      <td class="uk-width-1-6@m">{{res.officialname}} <br> ({{res.id}}) <br> {{res.registeredby}}</td>
146
                      <td >{{res.registrationdate}}</td>
147
                      <td> <div *ngFor="let organization of res.organizations">{{organization.legalname + ' (' + getCountryName(organization.country) + ')'}}<br></div></td>
148
                      <td>{{res.typology.split('::')[0]}}<br>{{res.typology.split('::')[1]}}<br>{{res.typology.split('::')[2]}}</td>
149
                    </tr>
150
                    </tbody>
151
                  </table>
152

    
153
                  <ul class="uk-pagination uk-flex-center" uk-margin>
154
                    <li><a (click)="previousPage()"><span uk-pagination-previous></span></a></li>
155
                    <li class="uk-active"><span>{{+dataForm.get('page').value + 1}}</span></li>
156
                    <li><a (click)="nextPage()"><span uk-pagination-next></span></a></li>
157
                  </ul>
158

    
159
                </div>
160

    
161
              </div>
162
            </div>
163
          </div>
164

    
165
        </div>
166
      </div>
167
    </div>
168
  </div>
169
</div>
(4-4/8)