Project

General

Profile

1 61381 k.triantaf
<div page-content class="admin-pages">
2
  <div header>
3
    <admin-tabs tab="class" header></admin-tabs>
4
    <div *ngIf="!showLoading" class="uk-grid" uk-grid>
5
      <div class="uk-width-1-1">
6
        <ul class="uk-subnav uk-subnav-pill">
7
          <li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a
8
              (click)="filterForm.get('type').setValue('all')"><span
9
              class="title">All portals</span></a></li>
10
          <li *ngFor="let type of  portalUtils.portalTypes; let i=index"
11
              [class.uk-active]="filterForm.get('type').value === type.value" class="uk-margin-small-bottom"><a
12
              (click)="filterForm.get('type').setValue(type.value)"><span
13
              class="title">{{type.label}}</span></a></li>
14
        </ul>
15
      </div>
16
      <div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
17
        <div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
18
             placeholder="Search class"
19
             [selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
20
             [bordered]="true" colorClass="uk-text-secondary"
21
             class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
22
        <div class="show-options">
23
          <button class="uk-button uk-button-secondary">Bulk Actions</button>
24
          <div uk-dropdown="mode: click">
25
            <ul class="uk-nav uk-dropdown-nav"
26
                [attr.uk-tooltip]="getSelectedDivIds().length == 0 ? 'pos:left; cls: uk-active' : 'cls: uk-invisible'"
27
                title="Select at least one class">
28
              <li><a [class]="getSelectedDivIds().length == 0 ? 'uk-disabled' : ''"
29
                     (click)="confirmDeleteSelectedDivIds()"><i></i> Delete </a></li>
30
            </ul>
31
          </div>
32
        </div>
33
        <div>
34
          <a (click)="newDivId()"
35
             class="uk-flex uk-flex-middle uk-text-uppercase">
36
            <button class="large uk-icon-button uk-button-secondary">
37
              <icon name="add"></icon>
38
            </button>
39
            <button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add class</button>
40
          </a>
41
        </div>
42
      </div>
43
    </div>
44
  </div>
45
  <div inner>
46
    <div *ngIf="showLoading" class="uk-position-center">
47
      <loading></loading>
48
    </div>
49
    <div *ngIf="!showLoading">
50
      <table *ngIf="checkboxes.length > 0"class="uk-table uk-table-striped uk-table-large">
51
        <thead class="uk-card-header">
52
        <tr>
53
          <th
54
              class="uk-width-small"><input id="allDivIdCheckbox" type="checkbox"
55
                                            (change)="toggleCheckBoxes($event)"></th>
56
          <th>Name</th>
57
          <th *ngIf="!selectedCommunityPid">Portal Type</th>
58
          <th>Page</th>
59
          <th>Actions</th>
60
        </tr>
61
        </thead>
62
        <tbody>
63
        <tr *ngFor="let check of checkboxes; let i=index">
64
          <td><input id="{{check.divId._id}}" class="checkBox" type="checkbox"
65
                     name="divIdscb[]" value="{{check.divId._id}}" [(ngModel)]="check.checked">
66
          </td>
67
          <td>
68
            <div class="name" href="#">{{check.divId.name}}</div>
69
          </td>
70
          <td *ngIf="!selectedCommunityPid">
71
            <div class="portalType" href="#">{{check.divId.portalType}}</div>
72
          </td>
73
          <td>
74
            <div class="pages" href="#">
75
                  <span *ngFor="let page of check.divId.pages let i=index">{{page.name}}<span
76
                      *ngIf="i<(check.divId.pages.length-1)">, </span></span>
77
            </div>
78
          </td>
79
          <td>
80
81
            <div class="actions" href="#">
82
              <i class="clickable" uk-icon="pencil" (click)="editDivId(i)"></i>
83
              <i class="clickable uk-text-danger" uk-icon="trash"
84
                 (click)="confirmDeleteDivId(check.divId._id)"></i>
85
            </div>
86
          </td>
87
        </tr>
88
        </tbody>
89
      </table>
90
      <div *ngIf="checkboxes.length == 0"
91
           class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
92
        <div>No classes found</div>
93
      </div>
94
    </div>
95
  </div>
96
</div>
97
<modal-alert #editModal (alertOutput)="divIdSaveConfirmed($event)"
98
             [okDisabled]="classForm && (classForm.invalid || !classForm.dirty)">
99
  <form *ngIf="classForm" [formGroup]="classForm" class="uk-grid uk-child-width-1-1" uk-grid>
100
    <div dashboard-input [formInput]="classForm.get('name')"
101
         type="text" label="Class Name" placeholder="Write a name">
102
    </div>
103
    <div dashboard-input [formInput]="classForm.get('pages')" placeholder="Add a page"
104
         type="chips" [options]="allPages" label="Pages">
105
    </div>
106
    <div dashboard-input type="select" label="Portal Type" placeholder="Choose a type"
107
         [formInput]="classForm.get('portalType')" [options]="portalUtils.portalTypes"></div>
108
  </form>
109
</modal-alert>
110
<modal-alert #deleteModal (alertOutput)="confirmedDeleteDivIds($event)"></modal-alert>