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">Enrich Your Content - Browse Subscriptions</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-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>
23
            <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{errorMessage}}</div>
24
            <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{successMessage}}</div>
25
            <div *ngIf="loadingMessage" class="loading-big">
26
              <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">{{ loadingMessage }}</div>
27
              <div class="whiteFilm"></div>
28
            </div>
29
            <div *ngIf="noSubscriptions" class="uk-alert">{{noSubscriptions}}</div>
30
          </div>
31
          <div *ngIf="subscrOfUser">
32
            <div *ngFor="let key of subKeys">
33
              <h4 class="uk-h4 uk-text-primary uk-scrollspy-inview uk-animation-slide-top-medium uk-scrollspy-class=">
34
                <span>{{ key }}</span>
35
              </h4>
36
              <table class="uk-table uk-table-striped uk-table-middle">
37
                <thead>
38
                <tr>
39
                  <th>Topic</th>
40
                  <th>Creation Date</th>
41
                  <th>Last Notification Date</th>
42
                  <th class="uk-text-nowrap"># of notifications</th>
43
                  <th class="uk-text-nowrap">Actions</th>
44
                </tr>
45
                </thead>
46
                <tbody>
47
                <tr *ngFor="let sub of subscrOfUser[key]" class="el-item">
48
                  <td class="uk-table-shrink">
49
                    <a [routerLink]="sub.id">
50
                      <div class="el-title">{{ sub.topic }}</div>
51
                    </a>
52
                  </td>
53
                  <td class="uk-table-shrink">
54
                    <div class="el-title">{{ sub.creationDate | date:'yyyy-MM-dd HH:mm:ss' }}</div>
55
                  </td>
56
                  <td class="uk-table-shrink">
57
                    <div class="el-title">{{ sub.lastNotificationDate }}</div>
58
                  </td>
59
                  <td class="uk-text-nowrap uk-table-shrink">
60
                    <div class="el-title">{{ sub.count }}</div>
61
                  </td>
62
                  <td class="uk-text-nowrap uk-table-shrink">
63
                    <a class="el-link" (click)="deleteSubscription(sub.id)">
64
                      <i class="fa fa-remove" aria-hidden="true"></i>
65
                    </a>
66
                  </td>
67
                </tr>
68
                </tbody>
69
              </table>
70
            </div>
71
          </div>
72

    
73
        </div>
74

    
75
        <!-- RIGHT HELP CONTENT -->
76
        <aside-help-content #rightHelperContent [position]="'right'"
77
                            [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
78
        </aside-help-content>
79

    
80
      </div>
81
    </div>
82

    
83

    
84
    <!-- BOTTOM HELP CONTENT -->
85
    <help-content #bottomHelperContent [position]="'bottom'"
86
                  [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
87
    </help-content>
88

    
89

    
90
  </div>
91
</div>
92

    
(9-9/13)