Project

General

Profile

1
<div id="manage-subscribers" class=" uk-card uk-card-default uk-padding">
2
  <div class="uk-text-large uk-text-center uk-width-5-6@l uk-width">Manage subscribers</div>
3
    <form class="uk-text-center uk-animation uk-card uk-card-default uk-padding">
4
      <div>
5
        <input type="text" class="uk-input  uk-width-1-2" placeholder="Search subscribers..." aria-describedby="sizing-addon2"  [(ngModel)]="subscribersSearchUtils.keyword" name="keyword" >
6
        <button (click)="goTo(1)"  type="submit" class=" uk-button">
7
           <span class="uk-icon">
8
           <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>
9
           </span>Search
10
        </button>
11
      </div>
12
    </form>
13

    
14
    <div *ngIf="subscribersSearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
15
      <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
16
        <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
17
          {{subscribersSearchUtils.totalResults | number}} subscribers, page {{subscribersSearchUtils.page | number}} of {{(totalPages()) | number}}
18
        </span>
19
        <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
20
          <paging-no-load [currentPage]="subscribersSearchUtils.page" [totalResults]="subscribersSearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>
21
        </span>
22
      </div>
23
    </div>
24

    
25
    <div class="custom-dataTable-content">
26
        <div class="uk-overflow-container">
27
            <table datatable class="uk-table uk-table-striped divider-table" id="dpTable" [dtOptions]="dtOptions" [dtTrigger]="dtTrigger" dtInstance="dtInstanceCallback">
28
              <thead>
29
                <tr>
30
                  <th class="uk-text-center">Email</th>
31
                  <th class="uk-text-center">Action</th>
32
                </tr>
33
              </thead>
34
              <tbody *ngIf="communitySubscribers">
35
                <tr class="uk-table-middle" *ngFor="let item of communitySubscribers.subscribers;">
36
                  <td class="uk-text-center uk-width-1-2">
37
                    {{item.email}}
38
                  </td>
39
                  <td class="uk-text-center uk-width-1-2">
40
<!--                    red_background_color red_color-->
41
                      <a (click)="removeSubscriber(item.email)" class="uk-icon-button remove uk-button-danger" uk-icon="icon: close; ratio: 1" title="Remove"></a>
42
                  </td>
43
                </tr>
44
              </tbody>
45
            </table>
46
        </div>
47
    </div>
48

    
49
    <div *ngIf="subscribersSearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
50
      <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
51
        <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
52
          {{subscribersSearchUtils.totalResults | number}} subscribers, page {{subscribersSearchUtils.page | number}} of {{(totalPages()) | number}}
53
        </span>
54
        <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
55
          <paging-no-load [currentPage]="subscribersSearchUtils.page" [totalResults]="subscribersSearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>
56
        </span>
57
      </div>
58
    </div>
59

    
60
</div>
61

    
62
<modal-alert #AlertModalDeleteSubscriber (alertOutput)="confirmedDeleteSubscriber()"></modal-alert>
(2-2/4)