Project

General

Profile

1
<div id="pages">
2
        <div class="menubar ">
3

    
4
            <div class="page-title uk-text-large  ">Pages</div>
5
            <div *ngIf="updateErrorMessage" class="uk-alert-danger" uk-alert>
6
              <a class="uk-alert-close" uk-close></a>
7
              {{updateErrorMessage}}
8
            </div>
9
            <div *ngIf="!errorMessage && !showLoading" class="page-controls">
10
                <div class="  filters ">
11
                    <div class="show-options uk-float-right">
12
                      <button class="uk-button" type="button">Bulk Actions</button>
13
                      <div uk-dropdown="mode: click">
14
                          <ul class="uk-nav uk-nav-dropdown"
15
                              [attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : 'cls: uk-invisible'"
16
                              title="Select at least one page">
17
                            <li><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''" (click)="togglePages(true, getSelectedPages())"><i></i> Activate </a></li>
18
                            <li><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''" (click)="togglePages(false, getSelectedPages())"><i></i> Deactivate </a></li>
19
                            <li  *ngIf="isPortalAdministrator"><a (click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
20
                          </ul>
21
                      </div>
22
                    </div>
23
                </div>
24
            </div>
25
            <a  *ngIf="isPortalAdministrator" (click)="showModal()" class="uk-button uk-button-primary uk-float-right"><i></i> New Page </a>
26
            <form target="BSFormPanel_Admin_1" class="search">
27
                <input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Page name..." type="text" class="uk-input uk-width-medium"/>
28
                <button class="uk-button" type="submit">Search</button>
29
            </form>
30
        </div>
31

    
32
        <div class="content-wrapper" id="contentWrapper">
33
            <div>
34
                <div class="contentPanel uk-margin-top">
35

    
36

    
37
                    <div class="uk-alert uk-alert-primary uk-margin-top-large">
38
                      <div>
39
                        <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>
40
                        Disable a page to hide it from community dashboard portal. </div>
41
                        <div class="uk-text-small">If the page is disabled, a message "Can't find that page" will appear in case the url of that page is loaded. If the disabled page belongs to the menu, the link will be removed from menu, too.  </div>
42

    
43
                    </div>
44
                    <div *ngIf="errorMessage" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
45
                    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
46
                    <div *ngIf="!errorMessage && !showLoading">
47
                        <div class="gwt-HTML">
48
                            <div class="users-list"> <!--"row" class removed"-->
49
                                <div class="col-md-12">
50

    
51
                                  <!-- <div class="filters marginBottom20">
52
                                      <div class="links form-group form-inline">
53
                                          <span>Filter by community:</span>
54
                                          <select class="uk-select uk-width-medium" (change)="filterByCommunity($event)">
55
                                              <option *ngFor="let community of communities" value="{{community.pid}}">{{community.name}}</option>
56
                                          </select>
57
                                      </div>
58
                                  </div> -->
59
                                  <table class="uk-table uk-table-striped">
60
                                    <thead>
61
                                        <tr>
62
                                            <th><input id="allPageCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)"></th>
63
                                            <th>Name</th>
64
                                            <th>State</th>
65
                                            <th *ngIf="!pagesType">Type</th>
66
                                            <th>Related Entities</th>
67
                                            <th>Route</th>
68
                                            <th  *ngIf="isPortalAdministrator" >Actions</th>
69
                                            <th>Page help texts</th>
70
                                            <th *ngIf="pageWithDivIds && pageWithDivIds.length > 0">Class help texts</th>
71
                                        </tr>
72
                                    </thead>
73
                                    <tbody >
74
                                        <tr *ngFor="let check of checkboxes; let i=index">
75
                                            <td><input id="{{check.page._id}}" class="checkBox" type="checkbox"
76
                                                                                name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
77
                                            </td>
78
                                            <td>
79
                                                <div class="name" href="#">{{check.page.name}}</div>
80
                                            </td>
81
                                            <td>
82
                                              <div *ngIf="check.page.isEnabled" class="activated" >
83
                                                  <input (click)="togglePages(false,[check.page._id])" class="deactivate" src="assets/imgs/check-icon.png" title="Disable" width="20" type="image" height="20">
84
                                              </div>
85
                                              <div *ngIf="!check.page.isEnabled" class="deactivated" >
86
                                                  <input (click)="togglePages(true,[check.page._id])" class="deactivate" src="assets/imgs/x-icon.png" title="Enable" width="20" type="image" height="20">
87
                                              </div>
88
                                            </td>
89
                                            <td *ngIf="!pagesType">
90
                                                <div class="type" href="#">{{check.page.type}}</div>
91
                                            </td>
92
                                            <td>
93
                                                <div class="entities" href="#">
94
                                                  <span *ngFor="let entity of check.page.entities let i=index">{{entity.name}}<span *ngIf="i<(check.page.entities.length-1)">, </span></span>
95
                                                </div>
96
                                            </td>
97
                                            <td>
98
                                                <div class="route" href="#">{{check.page.route}}</div>
99
                                            </td>
100

    
101
                                            <td  *ngIf="isPortalAdministrator" >
102
                                                <div class="actions" href="#">
103
                                                    <input title="Edit" src="assets/imgs/icn_edit.png" class="edit" type="image" (click)="editPage(i)">
104
                                                    <input title="Delete" src="assets/imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeletePage(check.page._id)">
105
                                                </div>
106
                                            </td>
107
                                            <td>
108
                                              <a class="helpContents" [queryParams]="{communityId: selectedCommunityPid, pageId: check.page._id}" routerLink="/pageContents">add page contents</a>
109
                                            </td>
110
                                            <td *ngIf="pageWithDivIds && pageWithDivIds.length > 0" class="uk-text-center">
111
                                              <a *ngIf="pageWithDivIds.includes(check.page._id)" class="classHelpContents" [queryParams]="{communityId: selectedCommunityPid, pageId: check.page._id}" routerLink="/classContents">add class contents</a>
112
                                              <span *ngIf="!pageWithDivIds.includes(check.page._id)">-</span>
113
                                            </td>
114
                                        </tr>
115
                                    </tbody>
116
                                </table>
117

    
118
                                    <div *ngIf="checkboxes.length==0" class="col-md-12">
119
                                        <div class="uk-alert-warning" uk-alert>No pages found</div>
120
                                    </div>
121
                                </div>
122
                            </div>
123
                        </div>
124
                    </div>
125
                </div>
126
            </div>
127
        </div>
128
</div>
129
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Page'" [formGroup]="formGroup" [type]="'page'"
130
            [isModalShown]="isModalShown" (emmitObject)="pageSavedSuccessfully($event)" (emmitError)="handleUpdateError($event)">
131
    <page-form [group]="formGroup"></page-form>
132
</modal-form>
133

    
134
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Page'" [formGroup]="formGroup" [type]="'page'"
135
            [isModalShown]="isModalShown" (emmitObject)="pageUpdatedSuccessfully($event)" (emmitError)="handleUpdateError($event)">
136
    <page-form [group]="formGroup"></page-form>
137
</modal-form>
138

    
139
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeletePages($event)">
140
    Are you sure you want to delete the selected page(s)?
141
</delete-confirmation-dialog>
(3-3/4)