Project

General

Profile

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

    
4
            <div class="page-title uk-text-large">{{capitalizeFirstLetter(pagesType)}} 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-navbar-dropdown-nav"
15
                              [attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : 'cls: uk-invisible'"
16
                              title="Select at least one page">
17
                            <li *ngIf="!isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''" (click)="togglePages(true, getSelectedPages())"><i></i> Activate </a></li>
18
                            <li *ngIf="!isPortalAdministrator"><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 [(ngModel)]="inputstring" (keyup.enter)="filterBySearch(inputstring)" placeholder="Page name..." type="text" name="searchForm" class="uk-input uk-width-medium"/>
28
                <button class="uk-button" type="submit">Search</button> -->
29
                <input type="text" class="uk-input uk-width-medium" placeholder="Page name, portal type..." aria-describedby="sizing-addon2"  [(ngModel)]="keyword"  name="keyword" >
30
                <button (click)="filterBySearch(keyword)"  type="submit" class=" uk-button">
31
                   <span class="uk-icon">
32
                   <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>
33
                   </span>Search
34
                 </button>
35
            </form>
36
        </div>
37

    
38
        <div class="content-wrapper" id="contentWrapper">
39
            <div>
40
                <div class="contentPanel uk-margin-top">
41

    
42

    
43
                    <div *ngIf="!isPortalAdministrator" class="uk-alert uk-alert-primary uk-margin-top-large">
44
                      <div>
45
                        <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>
46
                        Disable a page to hide it from community dashboard portal. </div>
47
                        <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>
48

    
49
                    </div>
50
                    <div *ngIf="errorMessage" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
51
                    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="uk-align-center loading-gif"></div>
52
                    <div *ngIf="!errorMessage && !showLoading">
53
                        <div class="gwt-HTML">
54
                            <div class="users-list"> <!--"row" class removed"-->
55
                                <div class="col-md-12">
56
                                  <table class="uk-table uk-table-striped">
57
                                    <thead>
58
                                        <tr>
59
                                            <th><input id="allPageCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)"></th>
60
                                            <th>Name</th>
61
                                            <th *ngIf="!isPortalAdministrator">Change status</th>
62
                                            <th *ngIf="!pagesType">Type</th>
63
                                            <th *ngIf="!isPortalAdministrator">Related Entities</th>
64
                                            <th>Route</th>
65
                                            <th *ngIf="!selectedCommunityPid">Portal Type</th>
66
                                            <th *ngIf="isPortalAdministrator" >Actions</th>
67
                                            <th *ngIf="!isPortalAdministrator" class="uk-text-center">Page help texts</th>
68
                                            <th *ngIf="!isPortalAdministrator && (pageWithDivIds && pageWithDivIds.length > 0)" class="uk-text-center">Class help texts</th>
69
                                        </tr>
70
                                    </thead>
71
                                    <tbody >
72
                                        <tr *ngFor="let check of checkboxes; let i=index">
73
                                            <td><input id="{{check.page._id}}" class="checkBox" type="checkbox"
74
                                                                                name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
75
                                            </td>
76
                                            <td>
77
                                                <div class="name" href="#">{{check.page.name}}</div>
78
                                            </td>
79
                                            <td *ngIf="!isPortalAdministrator">
80
                                              <mat-slide-toggle [checked]="check.page.isEnabled"
81
                                                                (change)="($event.source.checked = check.page.isEnabled);togglePages(!check.page.isEnabled,[check.page._id])"></mat-slide-toggle>
82
                                            </td>
83
                                            <td *ngIf="!pagesType">
84
                                                <div class="type" href="#">{{check.page.type}}</div>
85
                                            </td>
86
                                            <td *ngIf="!isPortalAdministrator">
87
                                                <div class="entities" href="#">
88
                                                  <span *ngFor="let entity of check.page.entities let i=index">{{entity.name}}<span *ngIf="i<(check.page.entities.length-1)">, </span></span>
89
                                                </div>
90
                                            </td>
91
                                            <td>
92
                                                <div class="route" href="#">{{check.page.route}}</div>
93
                                            </td>
94

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

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

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

    
142
<modal-alert #AlertModalSavePage (alertOutput)="pageSaveConfirmed($event)">
143
  <div *ngIf="modalErrorMessage" class="uk-alert-danger" uk-alert aria-hidden="true">{{ modalErrorMessage }}</div>
144
  <page-form [group]="formGroup"></page-form>
145
</modal-alert>
146

    
147
<modal-alert #AlertModalUpdatePage (alertOutput)="pageUpdateConfirmed($event)">
148
  <div *ngIf="modalErrorMessage" class="uk-alert-danger" uk-alert aria-hidden="true">{{ modalErrorMessage }}</div>
149
  <page-form [group]="formGroup"></page-form>
150
</modal-alert>
151

    
152
<!-- <delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeletePages($event)">
153
    Are you sure you want to delete the selected page(s)?
154
</delete-confirmation-dialog> -->
155
<modal-alert #AlertModalDeletePages (alertOutput)="confirmedDeletePages($event)"></modal-alert>
(4-4/6)