D-Net

<div id="manage-zenodo-communities" class="uk-padding uk-padding-remove-top">

  <div *ngIf="masterCommunity" class="uk-animation-fade  uk-alert uk-alert-primary uk-padding-small uk-margin-large-bottom">

    <div class="uk-text-large uk-margin-bottom"  >Master Zenodo community</div>

    <div class="uk-comment-header uk-grid-medium uk-flex-middle" uk-grid>

       <div class="uk-width-auto">

         <a target="_blank" [href]="masterCommunity.link">

           <img *ngIf="masterCommunity.logoUrl" class="uk-comment-avatar" src="{{masterCommunity.logoUrl}}" width="80" height="80" alt="">

         </a>

       </div>

       <div class="uk-width-expand">

           <h4 class="uk-comment-title uk-margin-remove">

             <a *ngIf="masterCommunity.link" class="custom-external" target="_blank" href="{{masterCommunity.link}}">

               <span *ngIf="masterCommunity.title">{{masterCommunity.title}}</span>

               <span *ngIf="!masterCommunity.title">[no name available]</span>

             </a>

             <div  *ngIf="!masterCommunity.link">

               <span *ngIf="masterCommunity.title">{{masterCommunity.title}}</span>

               <span *ngIf="!masterCommunity.title">[no name available]</span>

             </div>

         </h4>

           <div *ngIf="masterCommunity.date" class="uk-comment-meta " >

                last update: {{masterCommunity.date | date:'yyyy/MM/dd'}}

           </div>

       </div>

   </div>

   <div class="uk-comment-body uk-text-meta">

       <p *ngIf="masterCommunity.description">{{masterCommunity.description}}</p>

    </div>

  </div>

    <form class="uk-text-center uk-animation uk-card uk-card-default uk-padding">

      <div>

        <input type="text" class="uk-input  uk-width-1-2" placeholder="Search zenodo communities" aria-describedby="sizing-addon2"  [(ngModel)]="searchUtils.keyword" name="keyword" >

        <button (click)="goTo(1)"  type="submit" class=" uk-button">

           <span class="uk-icon">

           <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>

           </span>Search

        </button>

      </div>

    </form>

    <div *ngIf="searchUtils.status == errorCodes.DONE ||searchUtils.status == errorCodes.NONE " class="uk-alert uk-alert-primary">

      <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

    All the research results belonging to the Zenodo communities specified here will be automatically linked to your community dashboard.

    </div>

    <div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">

      <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">

        <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">

          {{searchUtils.totalResults | number}} zenodo communities, page {{searchUtils.page | number}} of {{(totalPages()) | number}}

        </span>

        <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">

          <paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>

        </span>

      </div>

    </div>

    <div class="custom-dataTable-content">

      <div class="uk-overflow-container">

        <table datatable class="uk-table uk-table-striped divider-table" [dtOptions]="dtOptions" id="dpTable"  [dtTrigger]="dtTrigger" dtInstance="dtInstanceCallback">

          <thead>

            <tr>

              <th class="uk-text-center">Name</th>

              <th class="uk-text-center">Last update on</th>

              <!-- <th class="uk-text-center">Funder</th> -->

              <th class="uk-text-center">Action</th>

            </tr>

          </thead>

          <tbody>

            <tr class="uk-table-middle" *ngFor="let item of selectedCommunities">

              <td class="uk-text-center uk-width-1-4">

                <a class="custom-external" target="_blank" href="{{item.link}}">

                  <span *ngIf="item.title">{{item.title}}</span>

                  <span *ngIf="!item.title">[no name available]</span>

                </a>

              </td>

              <td class="uk-text-center uk-width-1-4">

                <div class="  ">

                  {{item.date | date:'yyyy/MM/dd'}}

                </div>

              </td>

              <!-- <td class="uk-text-center uk-width-1-4">

                <span *ngIf="result.funder">{{result.funder}}</span>

                <span *ngIf="!result.funder">-</span>

              </td> -->

              <td class="uk-text-center uk-width-1-4">

<!--                red_background_color red_color-->

                <a    (click)="removeCommunity(item)" class="uk-icon-button remove uk-button-danger" uk-icon="close" title="Undo"></a>

              </td>

            </tr>

          </tbody>

        </table>

      </div>

    </div>

</div>

<modal-alert #AlertModalDeleteCommunity (alertOutput)="confirmedDeleteCommunity($event)"></modal-alert>