D-Net

<form class="uk-form">

  <fieldset data-uk-margin>

    <legend>Filter By:</legend>

    <input type="text" class="form-control" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="inputkeyword"  (keyup)="changekeyword()" name="claims-keyword" >

    <label> <input [(ngModel)]="projectCB" type="checkbox" (ngModelChange)="changeType()"  name="project"  /> Project </label>

    <label> <input [(ngModel)]="publicationCB" type="checkbox"  (ngModelChange)="changeType()" name="publication"  /> Publication </label>

    <label> <input [(ngModel)]="datasetCB" type="checkbox" (ngModelChange)="changeType()"  name="dataset"  /> Dataset </label>

    <label> <input [(ngModel)]="contextCB" type="checkbox" (ngModelChange)="changeType()"  name="context"  /> Context </label>

  </fieldset>

</form>

<h4 *ngIf="resultsNum>0" >Showing {{(size*page - size +1)}} to {{(size*page>resultsNum)?resultsNum:(size*page)}} of {{resultsNum}} claims</h4>

<div *ngIf="resultsNum>size*page " class="text-right">

  <span class="dropdown">

    Show <button class="uk-button dropdown-toggle" type="button" id="pagingDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">

     {{size}}

      </button>

     <ul class="dropdown-menu" aria-labelledby="pagingDropdown">

        <li *ngIf="resultsNum > 10" ><a  (click)="changeSize(10)  " >10 </a></li>

        <li *ngIf="resultsNum > 20" ><a  (click)="changeSize(20)" >20 </a></li>

        <li *ngIf="resultsNum > 30" ><a  (click)="changeSize(30)" >30 </a></li>

        <li *ngIf="resultsNum > 50" ><a  (click)="changeSize(40)" >50 </a></li>

     </ul>

   </span>

 </div>

 <div *ngIf="showErrorMessage " class = "alert alert-danger " >

     An Error occured.

 </div>

<div class="text-right" *ngIf="resultsNum">

  <!--<paging  [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="navigateTo" [size]="size" [params]="getParameters()" > </paging>-->

  <paging-no-load [currentPage]="page" [totalResults]="resultsNum" [navigateTo]="navigateTo"  [params]="getParameters()" [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>

</div>

<!--  Buttons for selecting and Delete Claims -->

<div *ngIf="enableDelete">

  <div *ngIf="selected.length>0 && resultsNum > 0 ">

    <div class = "alert alert-info " >

      You have selected {{selected.length}} claim(s)

    </div>

  </div>

  <div *ngIf="deleteMessage.length>0 " [innerHTML]="deleteMessage">

  </div>

  <button class="uk-button" (click)="selectAll()">Select All</button> <button class="uk-button" (click)="deselectAll()">Deselect All</button> <button class="uk-button" (click)="confirmOpen()">Delete</button>

</div>

<br>

<!--div class="input-group col-lg-6">

  <span class="input-group-addon" id="sizing-addon2">Filter</span>

  <input type="text" class="form-control" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="inputkeyword"  (keyup)="changekeyword()" >

</div-->

<div *ngIf=" claims && claims.length == 0" >

  <div class = "alert alert-info " >No entries found.</div>

</div>

<div class="">

<table *ngIf="claims && claims.length > 0" class="uk-table uk-table-striped">

  <thead>

     <tr>

        <th *ngIf="enableDelete"></th>

        <!--<th>Id</th>

        <!--  <th>Target Type</th> -->

          <th><a (click)="changeOrderby('target')" >Research Result</a> </th>

        <!--<th>Source type</th> -->

        <th><a (click)="changeOrderby('source')" >Link to</a> </th>

        <th><a (click)="changeOrderby('user')" >Claimed by</a> </th>

        <th><a (click)="changeOrderby('date')"> Claimed Date</a></th>

     </tr>

  </thead>

  <tbody>

      <tr *ngFor="let claim of claims " >

       <td *ngIf="enableDelete"><input [id]="claim.id" type="checkbox" (click)="select(claim,$event)"  [ngModel]="isSelected(claim.id)"/></td>

        <td><claim-entity [entity]="claim.target" [type]="claim.targetType" > </claim-entity></td>

         <td><claim-entity [entity]="claim.source" [type]="claim.sourceType" > </claim-entity></td>

        <td>{{claim.userMail}}</td>

        <td>{{claim.date}}</td>

     </tr>

  </tbody>

</table>

<modal-alert (alertOutput)="confirmClose($event)">

</modal-alert>

<modal-loading [message]= "'Please wait...'"></modal-loading>