Project

General

Profile

« Previous | Next » 

Revision 58946

Created the indicator tables for the open science tab of the europe page

View differences:

countries-table.component.html
1
<table *ngIf="countries" class="uk-table uk-table-hover uk-table-divider uk-table-small">
2
  <thead>
1
<ng-container *ngIf="view==='overview'">
2
  <table *ngIf="countries" class="uk-table uk-table-hover uk-table-divider uk-table-small">
3
    <thead>
3 4
    <tr>
4 5
      <th width="12,5%" class="" (click)="sortBy('country')">
5 6
        <span *ngIf="!isSortedBy || isSortedBy!='country'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
......
20 21
        OA journals
21 22
      </th>
22 23
      <!--<th *ngIf="type=='overview'" class="uk-text-center" width="12,5%" (click)="sortBy('policies')">-->
23
        <!--<span *ngIf="!isSortedBy || isSortedBy!='policies'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>-->
24
        <!--<span *ngIf="isSortedBy && isSortedBy=='policies' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>-->
25
        <!--<span *ngIf="isSortedBy && isSortedBy=='policies' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>-->
26
        <!--OA policies-->
24
      <!--<span *ngIf="!isSortedBy || isSortedBy!='policies'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>-->
25
      <!--<span *ngIf="isSortedBy && isSortedBy=='policies' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>-->
26
      <!--<span *ngIf="isSortedBy && isSortedBy=='policies' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>-->
27
      <!--OA policies-->
27 28
      <!--</th>-->
28 29
      <th class="uk-text-center" width="12,5%" (click)="sortBy('publications')">
29 30
        <span *ngIf="!isSortedBy || isSortedBy!='publications'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
......
50 51
        OA other
51 52
      </th>
52 53
    </tr>
53
  </thead>
54
  <tbody>
54
    </thead>
55
    <tbody>
55 56
    <tr *ngFor="let countryOverview of countries">
56 57
      <td class=""><a [routerLink]="['/countryDashboard', countryOverview.code]">{{countryOverview.name}}</a></td>
57 58
      <td class="uk-text-center">
......
109 110
        </ng-container>
110 111
      </td>
111 112
    </tr>
112
  </tbody>
113
</table>
113
    </tbody>
114
  </table>
115
</ng-container>
116

  
117
<ng-container *ngIf="view==='openScience'">
118
  <table *ngIf="countries" class="uk-table uk-table-hover uk-table-divider uk-table-small">
119
    <thead>
120
    <tr>
121
      <th width="20%" class="" (click)="sortBy('country')">
122
        <span *ngIf="!isSortedBy || isSortedBy!='country'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
123
        <span *ngIf="isSortedBy && isSortedBy=='country' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>
124
        <span *ngIf="isSortedBy && isSortedBy=='country' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>
125
        Country
126
      </th>
127
      <th class="uk-text-center" width="20%" (click)="sortBy('pid')">
128
        <span *ngIf="!isSortedBy || isSortedBy!='pid'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
129
        <span *ngIf="isSortedBy && isSortedBy=='pid' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>
130
        <span *ngIf="isSortedBy && isSortedBy=='pid' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>
131
        PID
132
      </th>
133
      <th class="uk-text-center" width="20%" (click)="sortBy('licence')">
134
        <span *ngIf="!isSortedBy || isSortedBy!='licence'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
135
        <span *ngIf="isSortedBy && isSortedBy=='licence' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>
136
        <span *ngIf="isSortedBy && isSortedBy=='licence' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>
137
        Licence
138
      </th>
139
      <th class="uk-text-center" width="20%" (click)="sortBy('gold')">
140
        <span *ngIf="!isSortedBy || isSortedBy!='gold'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
141
        <span *ngIf="isSortedBy && isSortedBy=='gold' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>
142
        <span *ngIf="isSortedBy && isSortedBy=='gold' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>
143
        Gold
144
      </th>
145
      <th class="uk-text-center" width="20%" (click)="sortBy('green')">
146
        <span *ngIf="!isSortedBy || isSortedBy!='green'" class="uk-margin-small-right"><img src="../../../assets/img/icons/sort.svg"></span>
147
        <span *ngIf="isSortedBy && isSortedBy=='green' && isDescending"><img src="../../../assets/img/icons/sort-descending.svg"></span>
148
        <span *ngIf="isSortedBy && isSortedBy=='green' && !isDescending"><img src="../../../assets/img/icons/sort-ascending.svg"></span>
149
        Green
150
      </th>
151
    </tr>
152
    </thead>
153
    <tbody>
154
    <tr *ngFor="let countryOverview of countries">
155
      <td class=""><a [routerLink]="['/countryDashboard', countryOverview.code]">{{countryOverview.name}}</a></td>
156
      <td class="uk-text-center">
157
        <ng-container *ngIf="countryOverview.pid===null">--</ng-container>
158
        <ng-container *ngIf="countryOverview.pid!=null">
159
          <ng-container *ngIf="isPercentage">{{countryOverview.pid.percentage | number :'1.0-1'}}%</ng-container>
160
          <ng-container *ngIf="!isPercentage">{{countryOverview.pid.oa | number}}</ng-container>
161
        </ng-container>
162
      </td>
163
      <td class="uk-text-center">
164
        <ng-container *ngIf="countryOverview.licence===null">--</ng-container>
165
        <ng-container *ngIf="countryOverview.licence!=null">
166
          <ng-container *ngIf="isPercentage">{{countryOverview.licence.percentage | number :'1.0-1'}}%</ng-container>
167
          <ng-container *ngIf="!isPercentage">{{countryOverview.licence.oa | number}}</ng-container>
168
        </ng-container>
169
      </td>
170
      <td class="uk-text-center">
171
        <ng-container *ngIf="countryOverview.gold===null">--</ng-container>
172
        <ng-container *ngIf="countryOverview.gold!=null">
173
          <ng-container *ngIf="isPercentage">{{countryOverview.gold.percentage | number :'1.0-1'}}%</ng-container>
174
          <ng-container *ngIf="!isPercentage">{{countryOverview.gold.oa | number}}</ng-container>
175
        </ng-container>
176
      </td>
177
      <td class="uk-text-center">
178
        <ng-container *ngIf="countryOverview.green===null">--</ng-container>
179
        <ng-container *ngIf="countryOverview.green!=null">
180
          <ng-container *ngIf="isPercentage">{{countryOverview.green.percentage | number :'1.0-1'}}%</ng-container>
181
          <ng-container *ngIf="!isPercentage">{{countryOverview.green.oa | number}}</ng-container>
182
        </ng-container>
183
      </td>
184
    </tr>
185
    </tbody>
186
  </table>
187
</ng-container>
188

  

Also available in: Unified diff