ichec-angular-core 0.3.6 → 0.3.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { BehaviorSubject, map, catchError, mergeMap, throwError, tap, of, debounceTime, distinctUntilChanged, merge, Subscription, finalize } from 'rxjs';
|
|
2
2
|
import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { InjectionToken, inject,
|
|
4
|
+
import { InjectionToken, inject, DOCUMENT, signal, Injectable, Component, computed, input, output, viewChild } from '@angular/core';
|
|
5
5
|
import { CookieService } from 'ngx-cookie-service';
|
|
6
6
|
import * as i1$2 from '@angular/forms';
|
|
7
7
|
import { FormControl, Validators, FormGroup, ReactiveFormsModule, FormBuilder } from '@angular/forms';
|
|
@@ -183,9 +183,11 @@ class FileRecord {
|
|
|
183
183
|
const REST_SERVICE_CONFIG = new InjectionToken("Config for the rest service");
|
|
184
184
|
class RestService {
|
|
185
185
|
manifest = new BehaviorSubject(null);
|
|
186
|
+
loggedInUser = new BehaviorSubject(null);
|
|
186
187
|
_url = "";
|
|
187
188
|
userQuery = "user";
|
|
188
189
|
config = inject(REST_SERVICE_CONFIG);
|
|
190
|
+
document = inject(DOCUMENT);
|
|
189
191
|
_http = inject(HttpClient);
|
|
190
192
|
cookieService = inject(CookieService);
|
|
191
193
|
deleteItem(id) {
|
|
@@ -223,16 +225,16 @@ class RestService {
|
|
|
223
225
|
if (query.filter) {
|
|
224
226
|
params.set('search', query.filter);
|
|
225
227
|
}
|
|
226
|
-
return this._http.get(this.baseUrl, this.getRequestBase("json", new HttpParams({ fromObject: Object.fromEntries(params) }))).pipe(catchError(this.handleError));
|
|
228
|
+
return this._http.get(this.baseUrl, this.getRequestBase("json", new HttpParams({ fromObject: Object.fromEntries(params) }), "", true)).pipe(catchError(this.handleError));
|
|
227
229
|
}
|
|
228
230
|
getItem(id) {
|
|
229
|
-
return this._http.get(this.baseUrl + id + "/", this.getRequestBase()).pipe(catchError(this.handleError));
|
|
231
|
+
return this._http.get(this.baseUrl + id + "/", this.getRequestBase("json", new HttpParams(), "", true)).pipe(catchError(this.handleError));
|
|
230
232
|
}
|
|
231
233
|
getUrl(url) {
|
|
232
|
-
return this._http.get(url, this.getRequestBase()).pipe(catchError(this.handleError));
|
|
234
|
+
return this._http.get(url, this.getRequestBase("json", new HttpParams(), "", true)).pipe(catchError(this.handleError));
|
|
233
235
|
}
|
|
234
236
|
getPaginatedUrl(url) {
|
|
235
|
-
return this._http.get(url, this.getRequestBase()).pipe(catchError(this.handleError));
|
|
237
|
+
return this._http.get(url, this.getRequestBase("json", new HttpParams(), "", true)).pipe(catchError(this.handleError));
|
|
236
238
|
}
|
|
237
239
|
getOptions() {
|
|
238
240
|
return this._http.options(this.baseUrl, this.getRequestBase()).pipe(catchError(this.handleError));
|
|
@@ -271,7 +273,7 @@ class RestService {
|
|
|
271
273
|
postItem(item) {
|
|
272
274
|
return this._http.post(this.baseUrl, item, this.getRequestBase()).pipe(catchError(this.handleError));
|
|
273
275
|
}
|
|
274
|
-
getHeaders(content_type = "json", file = "") {
|
|
276
|
+
getHeaders(content_type = "json", file = "", xhr = false) {
|
|
275
277
|
let headers = new HttpHeaders({ 'Accept': 'application/json' });
|
|
276
278
|
if (this.config.auth_type === "token") {
|
|
277
279
|
headers = headers.set('Authorization', "Token " + localStorage.getItem("api_token"));
|
|
@@ -288,6 +290,9 @@ class RestService {
|
|
|
288
290
|
else if (content_type) {
|
|
289
291
|
headers = headers.set('Content-Type', content_type);
|
|
290
292
|
}
|
|
293
|
+
if (xhr) {
|
|
294
|
+
headers = headers.set("x-requested-with", "XMLHttpRequest");
|
|
295
|
+
}
|
|
291
296
|
return headers;
|
|
292
297
|
}
|
|
293
298
|
get baseUrl() {
|
|
@@ -296,12 +301,12 @@ class RestService {
|
|
|
296
301
|
get mediaUrl() {
|
|
297
302
|
return this.config.endpoint_url + "/api/" + this._url.slice(0, -1) + "_media/";
|
|
298
303
|
}
|
|
299
|
-
getRequestBase(content_type = "json", params = new HttpParams(), file = "") {
|
|
304
|
+
getRequestBase(content_type = "json", params = new HttpParams(), file = "", xhr = false) {
|
|
300
305
|
let supports_cors = "same-origin";
|
|
301
306
|
if (this.manifest.value && this.manifest.value.supports_cors) {
|
|
302
307
|
supports_cors = 'include';
|
|
303
308
|
}
|
|
304
|
-
return { headers: this.getHeaders(content_type, file),
|
|
309
|
+
return { headers: this.getHeaders(content_type, file, xhr),
|
|
305
310
|
credentials: supports_cors ? 'include' : 'same-origin',
|
|
306
311
|
params: params };
|
|
307
312
|
}
|
|
@@ -310,6 +315,11 @@ class RestService {
|
|
|
310
315
|
// A client-side or network error occurred. Handle it accordingly.
|
|
311
316
|
console.error('Client side or network error:', error.error);
|
|
312
317
|
}
|
|
318
|
+
else if (error.status === 403 && "refresh_url" in error.error) {
|
|
319
|
+
// This is a special case in the backend - our session has timed out
|
|
320
|
+
// so we need to reload that page to reflect the user's current status
|
|
321
|
+
window.location.reload();
|
|
322
|
+
}
|
|
313
323
|
else {
|
|
314
324
|
console.error(`Backend returned code ${error.status}, body was: `, error.error);
|
|
315
325
|
}
|
|
@@ -348,9 +358,7 @@ class UserService extends ItemService {
|
|
|
348
358
|
/**
|
|
349
359
|
Service to handle IPortalMember via REST and also handle logins.
|
|
350
360
|
*/
|
|
351
|
-
loggedInUser = new BehaviorSubject(null);
|
|
352
361
|
canInvite = signal(false, ...(ngDevMode ? [{ debugName: "canInvite" }] : []));
|
|
353
|
-
document = inject(DOCUMENT);
|
|
354
362
|
_url = PortalMember.plural;
|
|
355
363
|
typename = PortalMember.typename;
|
|
356
364
|
permissions = new Map();
|
|
@@ -376,22 +384,25 @@ class UserService extends ItemService {
|
|
|
376
384
|
if (next) {
|
|
377
385
|
suffix = "?next=" + next;
|
|
378
386
|
}
|
|
379
|
-
|
|
380
|
-
|
|
387
|
+
else {
|
|
388
|
+
suffix = "?next=/home";
|
|
389
|
+
}
|
|
390
|
+
const logout_url = prefix + this.manifest.value.logout_url + "/" + suffix;
|
|
391
|
+
console.log("posting logout to: ", logout_url);
|
|
392
|
+
this._http.post(logout_url, "", {
|
|
381
393
|
headers: new HttpHeaders({
|
|
382
394
|
'X-CSRFToken': this.cookieService.get("csrftoken")
|
|
383
395
|
}),
|
|
384
396
|
responseType: 'text',
|
|
385
397
|
credentials: this.manifest.value.supports_cors ? 'include' : 'same-origin'
|
|
386
|
-
}).pipe(
|
|
387
|
-
// The backend can return an error as it tries to redirect to a non-existing url.
|
|
388
|
-
catchError(_ => this.document.location.href = prefix + "/" + suffix)).subscribe(_ => {
|
|
398
|
+
}).pipe(map(m => this._logout_redirect(JSON.parse(m)))).subscribe(_ => {
|
|
389
399
|
console.log("Logged Out");
|
|
390
|
-
// Force a page reload
|
|
391
|
-
this.document.location.href = prefix + "/" + suffix;
|
|
392
|
-
//this.login(next)
|
|
393
400
|
});
|
|
394
401
|
}
|
|
402
|
+
_logout_redirect(manifest) {
|
|
403
|
+
console.log("Redirecting logout to: ", manifest.url);
|
|
404
|
+
this.document.location.href = manifest.url;
|
|
405
|
+
}
|
|
395
406
|
canCreate() {
|
|
396
407
|
return this.canInvite();
|
|
397
408
|
}
|
|
@@ -424,7 +435,8 @@ class UserService extends ItemService {
|
|
|
424
435
|
if (this.config.endpoint_url) {
|
|
425
436
|
prefix = this.config.endpoint_url + "/";
|
|
426
437
|
}
|
|
427
|
-
|
|
438
|
+
const suffix = "/?next=" + next;
|
|
439
|
+
this.document.location.href = prefix + this.manifest.value.login_url + suffix;
|
|
428
440
|
}
|
|
429
441
|
hasAddPermission(feature) {
|
|
430
442
|
const perm = this.permissions.get(feature);
|
|
@@ -2049,7 +2061,7 @@ class ListTableViewComponent {
|
|
|
2049
2061
|
}));
|
|
2050
2062
|
}
|
|
2051
2063
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ListTableViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2052
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ListTableViewComponent, isStandalone: true, selector: "lib-list-table-view", inputs: { itemType: { classPropertyName: "itemType", publicName: "itemType", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, searchFilter: { classPropertyName: "searchFilter", publicName: "searchFilter", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "@if (dataSource(); as dataSource) {\n <table\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n matSortActive=\"name\"\n matSortDisableClear\n matSortDirection=\"desc\"\n class=\"mat-elevation-z8\"\n >\n @for (column of columns(); track column.name) {\n <ng-container matColumnDef=\"{{ column.name }}\">\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\n {{ column.title }}\n </th>\n <td mat-cell *matCellDef=\"let element\">\n\n @if(column.element_type === \"date\")\n {\n {{ element[column.name] | date}}\n }\n @else if(column.element_type === \"enum\")\n {\n {{ element[column.name] | titlecase}}\n }\n @else {\n {{ element[column.name] }}\n }\n </td>\n </ng-container>\n }\n\n <tr mat-header-row *matHeaderRowDef=\"columnNames()\"></tr>\n <tr\n mat-row\n *matRowDef=\"let row; columns: columnNames()\"\n [routerLink]=\"['/' + itemType() + '/detail/', row.id]\"\n [routerLinkActive]=\"['is-active']\"\n ></tr>\n </table>\n\n <mat-paginator\n [length]=\"dataSource.length()\"\n [pageSize]=\"20\"\n [pageSizeOptions]=\"pageSizeOptions\"\n aria-label=\"Select page\"\n >\n </mat-paginator>\n}\n", styles: [".mat-mdc-row .mat-mdc-cell{border-bottom:1px solid transparent;border-top:1px solid transparent;cursor:pointer}.mat-mdc-row:hover .mat-mdc-cell{border-color:currentColor}.is-active{font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i2$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }] });
|
|
2064
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ListTableViewComponent, isStandalone: true, selector: "lib-list-table-view", inputs: { itemType: { classPropertyName: "itemType", publicName: "itemType", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, searchFilter: { classPropertyName: "searchFilter", publicName: "searchFilter", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "@if (dataSource(); as dataSource) {\n <table\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n matSortActive=\"name\"\n matSortDisableClear\n matSortDirection=\"desc\"\n class=\"mat-elevation-z8\"\n style=\"width:100%; max-width: 800px;\"\n >\n @for (column of columns(); track column.name) {\n <ng-container matColumnDef=\"{{ column.name }}\">\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\n {{ column.title }}\n </th>\n <td mat-cell *matCellDef=\"let element\">\n\n @if(column.element_type === \"date\")\n {\n {{ element[column.name] | date}}\n }\n @else if(column.element_type === \"enum\")\n {\n {{ element[column.name] | titlecase}}\n }\n @else {\n {{ element[column.name] }}\n }\n </td>\n </ng-container>\n }\n\n <tr mat-header-row *matHeaderRowDef=\"columnNames()\"></tr>\n <tr\n mat-row\n *matRowDef=\"let row; columns: columnNames()\"\n [routerLink]=\"['/' + itemType() + '/detail/', row.id]\"\n [routerLinkActive]=\"['is-active']\"\n ></tr>\n </table>\n\n <mat-paginator\n [length]=\"dataSource.length()\"\n [pageSize]=\"20\"\n [pageSizeOptions]=\"pageSizeOptions\"\n aria-label=\"Select page\"\n >\n </mat-paginator>\n}\n", styles: [".mat-mdc-row .mat-mdc-cell{border-bottom:1px solid transparent;border-top:1px solid transparent;cursor:pointer}.mat-mdc-row:hover .mat-mdc-cell{border-color:currentColor}.is-active{font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i2$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }] });
|
|
2053
2065
|
}
|
|
2054
2066
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ListTableViewComponent, decorators: [{
|
|
2055
2067
|
type: Component,
|
|
@@ -2063,7 +2075,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
2063
2075
|
RouterModule,
|
|
2064
2076
|
DatePipe,
|
|
2065
2077
|
TitleCasePipe
|
|
2066
|
-
], template: "@if (dataSource(); as dataSource) {\n <table\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n matSortActive=\"name\"\n matSortDisableClear\n matSortDirection=\"desc\"\n class=\"mat-elevation-z8\"\n >\n @for (column of columns(); track column.name) {\n <ng-container matColumnDef=\"{{ column.name }}\">\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\n {{ column.title }}\n </th>\n <td mat-cell *matCellDef=\"let element\">\n\n @if(column.element_type === \"date\")\n {\n {{ element[column.name] | date}}\n }\n @else if(column.element_type === \"enum\")\n {\n {{ element[column.name] | titlecase}}\n }\n @else {\n {{ element[column.name] }}\n }\n </td>\n </ng-container>\n }\n\n <tr mat-header-row *matHeaderRowDef=\"columnNames()\"></tr>\n <tr\n mat-row\n *matRowDef=\"let row; columns: columnNames()\"\n [routerLink]=\"['/' + itemType() + '/detail/', row.id]\"\n [routerLinkActive]=\"['is-active']\"\n ></tr>\n </table>\n\n <mat-paginator\n [length]=\"dataSource.length()\"\n [pageSize]=\"20\"\n [pageSizeOptions]=\"pageSizeOptions\"\n aria-label=\"Select page\"\n >\n </mat-paginator>\n}\n", styles: [".mat-mdc-row .mat-mdc-cell{border-bottom:1px solid transparent;border-top:1px solid transparent;cursor:pointer}.mat-mdc-row:hover .mat-mdc-cell{border-color:currentColor}.is-active{font-weight:700}\n"] }]
|
|
2078
|
+
], template: "@if (dataSource(); as dataSource) {\n <table\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n matSortActive=\"name\"\n matSortDisableClear\n matSortDirection=\"desc\"\n class=\"mat-elevation-z8\"\n style=\"width:100%; max-width: 800px;\"\n >\n @for (column of columns(); track column.name) {\n <ng-container matColumnDef=\"{{ column.name }}\">\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\n {{ column.title }}\n </th>\n <td mat-cell *matCellDef=\"let element\">\n\n @if(column.element_type === \"date\")\n {\n {{ element[column.name] | date}}\n }\n @else if(column.element_type === \"enum\")\n {\n {{ element[column.name] | titlecase}}\n }\n @else {\n {{ element[column.name] }}\n }\n </td>\n </ng-container>\n }\n\n <tr mat-header-row *matHeaderRowDef=\"columnNames()\"></tr>\n <tr\n mat-row\n *matRowDef=\"let row; columns: columnNames()\"\n [routerLink]=\"['/' + itemType() + '/detail/', row.id]\"\n [routerLinkActive]=\"['is-active']\"\n ></tr>\n </table>\n\n <mat-paginator\n [length]=\"dataSource.length()\"\n [pageSize]=\"20\"\n [pageSizeOptions]=\"pageSizeOptions\"\n aria-label=\"Select page\"\n >\n </mat-paginator>\n}\n", styles: [".mat-mdc-row .mat-mdc-cell{border-bottom:1px solid transparent;border-top:1px solid transparent;cursor:pointer}.mat-mdc-row:hover .mat-mdc-cell{border-color:currentColor}.is-active{font-weight:700}\n"] }]
|
|
2067
2079
|
}], propDecorators: { itemType: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemType", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], searchFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFilter", required: false }] }], sort: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatSort), { isSignal: true }] }], paginator: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatPaginator), { isSignal: true }] }] } });
|
|
2068
2080
|
|
|
2069
2081
|
// Datasource needs any
|
|
@@ -2301,7 +2313,7 @@ class ListViewComponent {
|
|
|
2301
2313
|
return (url_segments.length == 2) && (url_segments[1].path == "self");
|
|
2302
2314
|
}
|
|
2303
2315
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2304
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ListViewComponent, isStandalone: true, selector: "lib-list-view", inputs: { viewType: { classPropertyName: "viewType", publicName: "viewType", isSignal: true, isRequired: false, transformFunction: null }, itemService: { classPropertyName: "itemService", publicName: "itemService", isSignal: true, isRequired: false, transformFunction: null }, listItemTemplate: { classPropertyName: "listItemTemplate", publicName: "listItemTemplate", isSignal: true, isRequired: false, transformFunction: null }, itemDetailTemplate: { classPropertyName: "itemDetailTemplate", publicName: "itemDetailTemplate", isSignal: true, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: true, isRequired: false, transformFunction: null }, itemWidth: { classPropertyName: "itemWidth", publicName: "itemWidth", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, sortFields: { classPropertyName: "sortFields", publicName: "sortFields", isSignal: true, isRequired: false, transformFunction: null }, noSelfItemsMessage: { classPropertyName: "noSelfItemsMessage", publicName: "noSelfItemsMessage", isSignal: true, isRequired: false, transformFunction: null }, noItemsCanCreateMessage: { classPropertyName: "noItemsCanCreateMessage", publicName: "noItemsCanCreateMessage", isSignal: true, isRequired: false, transformFunction: null }, noItemsMessage: { classPropertyName: "noItemsMessage", publicName: "noItemsMessage", isSignal: true, isRequired: false, transformFunction: null }, defaultQueries: { classPropertyName: "defaultQueries", publicName: "defaultQueries", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, embeddedMode: { classPropertyName: "embeddedMode", publicName: "embeddedMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }], ngImport: i0, template: "@if(!embeddedMode()){\n<lib-back-button></lib-back-button>\n}\n\n<div class=\"container\">\n <lib-list-header style=\"width:100%\" [itemType]=\"itemType()\" [canCreate]=\"canCreate()\" [showControls]=\"showControls()\" [filters]=\"filters()\"\n [sortFields]=\"sortFields()\" (searchChanged)=\"onSearchChange($event)\"></lib-list-header>\n\n <div class=\"content-container\" style=\"padding: 0px\">\n @if(dataSource)\n {\n <div class=\"result-container\" [style.width]=\"resolvedItemWidth\">\n\n @if (dataSource.loading()) {\n <div class=\"spinner-container\">\n <mat-spinner></mat-spinner>\n </div>\n }\n\n @if(!embeddedMode()){\n <div [hidden]=\"!dataSource.sourceIsEmpty()\">\n @if(isSelfList())\n {\n @if(noSelfItemsMessage())\n {\n <p>{{noSelfItemsMessage()}}</p>\n }\n @else {\n <p>You do not have any {{itemType()}}.</p>\n }\n }\n @else{\n @if(canCreate()){\n @if(noItemsCanCreateMessage())\n {\n <p>{{noItemsCanCreateMessage()}}</p>\n }\n @else{\n <p>There are currently no {{itemType()}}, click above to add one.</p>\n }\n }\n @else{\n @if(noItemsMessage())\n {\n <p>{{noItemsMessage()}}</p>\n }\n @else\n {\n <p>There are currently no {{itemType()}}.</p>\n }\n }\n }\n </div>\n }\n\n <div style=\"width: 100%\" [hidden]=\"dataSource.sourceIsEmpty()\">\n @if(isTableView()) {\n <lib-list-table-view style=\"max-width:800px
|
|
2316
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ListViewComponent, isStandalone: true, selector: "lib-list-view", inputs: { viewType: { classPropertyName: "viewType", publicName: "viewType", isSignal: true, isRequired: false, transformFunction: null }, itemService: { classPropertyName: "itemService", publicName: "itemService", isSignal: true, isRequired: false, transformFunction: null }, listItemTemplate: { classPropertyName: "listItemTemplate", publicName: "listItemTemplate", isSignal: true, isRequired: false, transformFunction: null }, itemDetailTemplate: { classPropertyName: "itemDetailTemplate", publicName: "itemDetailTemplate", isSignal: true, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: true, isRequired: false, transformFunction: null }, itemWidth: { classPropertyName: "itemWidth", publicName: "itemWidth", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, sortFields: { classPropertyName: "sortFields", publicName: "sortFields", isSignal: true, isRequired: false, transformFunction: null }, noSelfItemsMessage: { classPropertyName: "noSelfItemsMessage", publicName: "noSelfItemsMessage", isSignal: true, isRequired: false, transformFunction: null }, noItemsCanCreateMessage: { classPropertyName: "noItemsCanCreateMessage", publicName: "noItemsCanCreateMessage", isSignal: true, isRequired: false, transformFunction: null }, noItemsMessage: { classPropertyName: "noItemsMessage", publicName: "noItemsMessage", isSignal: true, isRequired: false, transformFunction: null }, defaultQueries: { classPropertyName: "defaultQueries", publicName: "defaultQueries", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, embeddedMode: { classPropertyName: "embeddedMode", publicName: "embeddedMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }], ngImport: i0, template: "@if(!embeddedMode()){\n<lib-back-button></lib-back-button>\n}\n\n<div class=\"container\">\n <lib-list-header style=\"width:100%\" [itemType]=\"itemType()\" [canCreate]=\"canCreate()\" [showControls]=\"showControls()\" [filters]=\"filters()\"\n [sortFields]=\"sortFields()\" (searchChanged)=\"onSearchChange($event)\"></lib-list-header>\n\n <div class=\"content-container\" style=\"padding: 0px\">\n @if(dataSource)\n {\n <div class=\"result-container\" [style.width]=\"resolvedItemWidth\">\n\n @if (dataSource.loading()) {\n <div class=\"spinner-container\">\n <mat-spinner></mat-spinner>\n </div>\n }\n\n @if(!embeddedMode()){\n <div [hidden]=\"!dataSource.sourceIsEmpty()\">\n @if(isSelfList())\n {\n @if(noSelfItemsMessage())\n {\n <p>{{noSelfItemsMessage()}}</p>\n }\n @else {\n <p>You do not have any {{itemType()}}.</p>\n }\n }\n @else{\n @if(canCreate()){\n @if(noItemsCanCreateMessage())\n {\n <p>{{noItemsCanCreateMessage()}}</p>\n }\n @else{\n <p>There are currently no {{itemType()}}, click above to add one.</p>\n }\n }\n @else{\n @if(noItemsMessage())\n {\n <p>{{noItemsMessage()}}</p>\n }\n @else\n {\n <p>There are currently no {{itemType()}}.</p>\n }\n }\n }\n </div>\n }\n\n <div style=\"width: 100%\" [hidden]=\"dataSource.sourceIsEmpty()\">\n @if(isTableView()) {\n <div style=\"width: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center;\">\n <lib-list-table-view style=\"width:100%; max-width:800px; display: block;\" [itemType]=\"itemType()\" [columns]=\"columns()\" [dataSource]=\"dataSource\">\n </lib-list-table-view>\n </div>\n }\n @else {\n <div class=\"scroll-container\">\n <h3>Results: {{dataSource.length()}}</h3>\n <lib-list-scroll-view [listItemTemplate]=\"listItemTemplate()\" [itemHeight]=\"itemHeight()\"\n [itemWidth]=\"itemWidth().toString()\" [dataSource]=\"dataSource\"\n (selected)=\"onSelection($event)\"></lib-list-scroll-view>\n </div>\n }\n </div>\n </div>\n @if(itemDetailTemplate()){\n <div class=\"detail-container\">\n <ng-container *ngTemplateOutlet=\"itemDetailTemplate()\">\n </ng-container>\n </div>\n }\n }\n </div>\n</div>", styles: [":host{flex-grow:1}.container{display:flex;padding-left:5px;padding-right:5px;flex-direction:column;justify-content:center;text-align:left;align-items:center}.content-container{display:flex;flex-direction:row;justify-content:left;align-items:start;width:100%}.hide-element{display:none}h3{margin-bottom:5px;margin-top:0;padding:0;text-align:center}.scroll-container{display:flex;flex-direction:column;width:100%}.detail-container{width:100%;display:flex;flex-grow:1;height:100%;min-width:400px}\n"], dependencies: [{ kind: "component", type: ListTableViewComponent, selector: "lib-list-table-view", inputs: ["itemType", "columns", "dataSource", "searchFilter"] }, { kind: "component", type: ListScrollViewComponent, selector: "lib-list-scroll-view", inputs: ["searchTerm", "pageSize", "itemHeight", "itemWidth", "dataSource", "listItemTemplate", "routerMode"], outputs: ["selected"] }, { kind: "component", type: BackButtonComponent, selector: "lib-back-button" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: ListHeaderComponent, selector: "lib-list-header", inputs: ["itemType", "canCreate", "showControls", "sortFields", "filters"], outputs: ["searchChanged"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
2305
2317
|
}
|
|
2306
2318
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ListViewComponent, decorators: [{
|
|
2307
2319
|
type: Component,
|
|
@@ -2318,7 +2330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
2318
2330
|
MatTooltipModule,
|
|
2319
2331
|
MatButtonModule,
|
|
2320
2332
|
ListHeaderComponent,
|
|
2321
|
-
NgTemplateOutlet], template: "@if(!embeddedMode()){\n<lib-back-button></lib-back-button>\n}\n\n<div class=\"container\">\n <lib-list-header style=\"width:100%\" [itemType]=\"itemType()\" [canCreate]=\"canCreate()\" [showControls]=\"showControls()\" [filters]=\"filters()\"\n [sortFields]=\"sortFields()\" (searchChanged)=\"onSearchChange($event)\"></lib-list-header>\n\n <div class=\"content-container\" style=\"padding: 0px\">\n @if(dataSource)\n {\n <div class=\"result-container\" [style.width]=\"resolvedItemWidth\">\n\n @if (dataSource.loading()) {\n <div class=\"spinner-container\">\n <mat-spinner></mat-spinner>\n </div>\n }\n\n @if(!embeddedMode()){\n <div [hidden]=\"!dataSource.sourceIsEmpty()\">\n @if(isSelfList())\n {\n @if(noSelfItemsMessage())\n {\n <p>{{noSelfItemsMessage()}}</p>\n }\n @else {\n <p>You do not have any {{itemType()}}.</p>\n }\n }\n @else{\n @if(canCreate()){\n @if(noItemsCanCreateMessage())\n {\n <p>{{noItemsCanCreateMessage()}}</p>\n }\n @else{\n <p>There are currently no {{itemType()}}, click above to add one.</p>\n }\n }\n @else{\n @if(noItemsMessage())\n {\n <p>{{noItemsMessage()}}</p>\n }\n @else\n {\n <p>There are currently no {{itemType()}}.</p>\n }\n }\n }\n </div>\n }\n\n <div style=\"width: 100%\" [hidden]=\"dataSource.sourceIsEmpty()\">\n @if(isTableView()) {\n <lib-list-table-view style=\"max-width:800px
|
|
2333
|
+
NgTemplateOutlet], template: "@if(!embeddedMode()){\n<lib-back-button></lib-back-button>\n}\n\n<div class=\"container\">\n <lib-list-header style=\"width:100%\" [itemType]=\"itemType()\" [canCreate]=\"canCreate()\" [showControls]=\"showControls()\" [filters]=\"filters()\"\n [sortFields]=\"sortFields()\" (searchChanged)=\"onSearchChange($event)\"></lib-list-header>\n\n <div class=\"content-container\" style=\"padding: 0px\">\n @if(dataSource)\n {\n <div class=\"result-container\" [style.width]=\"resolvedItemWidth\">\n\n @if (dataSource.loading()) {\n <div class=\"spinner-container\">\n <mat-spinner></mat-spinner>\n </div>\n }\n\n @if(!embeddedMode()){\n <div [hidden]=\"!dataSource.sourceIsEmpty()\">\n @if(isSelfList())\n {\n @if(noSelfItemsMessage())\n {\n <p>{{noSelfItemsMessage()}}</p>\n }\n @else {\n <p>You do not have any {{itemType()}}.</p>\n }\n }\n @else{\n @if(canCreate()){\n @if(noItemsCanCreateMessage())\n {\n <p>{{noItemsCanCreateMessage()}}</p>\n }\n @else{\n <p>There are currently no {{itemType()}}, click above to add one.</p>\n }\n }\n @else{\n @if(noItemsMessage())\n {\n <p>{{noItemsMessage()}}</p>\n }\n @else\n {\n <p>There are currently no {{itemType()}}.</p>\n }\n }\n }\n </div>\n }\n\n <div style=\"width: 100%\" [hidden]=\"dataSource.sourceIsEmpty()\">\n @if(isTableView()) {\n <div style=\"width: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center;\">\n <lib-list-table-view style=\"width:100%; max-width:800px; display: block;\" [itemType]=\"itemType()\" [columns]=\"columns()\" [dataSource]=\"dataSource\">\n </lib-list-table-view>\n </div>\n }\n @else {\n <div class=\"scroll-container\">\n <h3>Results: {{dataSource.length()}}</h3>\n <lib-list-scroll-view [listItemTemplate]=\"listItemTemplate()\" [itemHeight]=\"itemHeight()\"\n [itemWidth]=\"itemWidth().toString()\" [dataSource]=\"dataSource\"\n (selected)=\"onSelection($event)\"></lib-list-scroll-view>\n </div>\n }\n </div>\n </div>\n @if(itemDetailTemplate()){\n <div class=\"detail-container\">\n <ng-container *ngTemplateOutlet=\"itemDetailTemplate()\">\n </ng-container>\n </div>\n }\n }\n </div>\n</div>", styles: [":host{flex-grow:1}.container{display:flex;padding-left:5px;padding-right:5px;flex-direction:column;justify-content:center;text-align:left;align-items:center}.content-container{display:flex;flex-direction:row;justify-content:left;align-items:start;width:100%}.hide-element{display:none}h3{margin-bottom:5px;margin-top:0;padding:0;text-align:center}.scroll-container{display:flex;flex-direction:column;width:100%}.detail-container{width:100%;display:flex;flex-grow:1;height:100%;min-width:400px}\n"] }]
|
|
2322
2334
|
}], propDecorators: { viewType: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewType", required: false }] }], itemService: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemService", required: false }] }], listItemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "listItemTemplate", required: false }] }], itemDetailTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemDetailTemplate", required: false }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], itemWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemWidth", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], sortFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortFields", required: false }] }], noSelfItemsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noSelfItemsMessage", required: false }] }], noItemsCanCreateMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noItemsCanCreateMessage", required: false }] }], noItemsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noItemsMessage", required: false }] }], defaultQueries: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultQueries", required: false }] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }], embeddedMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "embeddedMode", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], sort: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatSort), { isSignal: true }] }] } });
|
|
2323
2335
|
|
|
2324
2336
|
class TopBarComponent {
|
|
@@ -2358,7 +2370,7 @@ class TopBarComponent {
|
|
|
2358
2370
|
}
|
|
2359
2371
|
}
|
|
2360
2372
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TopBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2361
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: TopBarComponent, isStandalone: true, selector: "lib-top-bar", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, loginRoute: { classPropertyName: "loginRoute", publicName: "loginRoute", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-toolbar class=\"toolbar\" [style.background-image]=\"backgroundStyle\">\n\n @if(logo())\n {\n <a aria-label=\"Home\" [routerLink]=\"['home']\">\n <img src=\"{{logo()}}\" class=\"logo\" alt=\"Website logo\"/>\n </a>\n }\n @else {\n <a mat-icon-button aria-label=\"Home\" [routerLink]=\"['home']\">\n <mat-icon class=\"icon\">home</mat-icon>\n </a>\n <span>{{title()}}</span>\n }\n @if(user()){\n <button mat-icon-button style=\"margin: 5px\" aria-label=\"Toggle Nav Bar\">\n <mat-icon class=\"icon\" (click)=\"leftNavService.toggle()\">\n @if(leftNavService.wide()){\n
|
|
2373
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: TopBarComponent, isStandalone: true, selector: "lib-top-bar", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, loginRoute: { classPropertyName: "loginRoute", publicName: "loginRoute", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-toolbar class=\"toolbar\" [style.background-image]=\"backgroundStyle\">\n\n @if(logo())\n {\n <a aria-label=\"Home\" [routerLink]=\"['home']\">\n <img src=\"{{logo()}}\" class=\"logo\" alt=\"Website logo\"/>\n </a>\n }\n @else {\n <a mat-icon-button aria-label=\"Home\" [routerLink]=\"['home']\">\n <mat-icon class=\"icon\">home</mat-icon>\n </a>\n <span>{{title()}}</span>\n }\n @if(user()){\n <button mat-icon-button style=\"margin: 5px\" aria-label=\"Toggle Nav Bar\">\n <mat-icon class=\"icon\" (click)=\"leftNavService.toggle()\">\n @if(leftNavService.wide()){\n menu_open\n }\n @else {\n menu\n }\n </mat-icon>\n </button>\n }\n\n <span class=\"topbar-spacer\"></span>\n @if(user(); as user)\n {\n <span>{{user.username}}</span>\n \n <button mat-icon-button style=\"margin: 5px\" aria-label=\"User Profile\" [matMenuTriggerFor]=\"profile_menu\">\n <mat-icon class=\"icon\">person</mat-icon>\n </button>\n\n <mat-menu #profile_menu=\"matMenu\">\n <a mat-menu-item aria-label=\"My Profile\" [routerLink]=\"['/members/detail', user.id]\">\n <mat-icon>manage_accounts</mat-icon>\n <span>My Profile</span>\n </a> \n <a mat-menu-item aria-label=\"Get Support\" [routerLink]=\"['/feedback']\">\n <mat-icon>contact_support</mat-icon>\n <span>Get Support</span>\n </a> \n <button mat-menu-item (click)=\"onLogout()\">\n <mat-icon>logout</mat-icon>\n <span>Log Out</span>\n </button>\n\n </mat-menu>\n }\n @else {\n <span>Log In</span>\n <button matIconButton (click)=\"onLogin()\">\n <mat-icon class=\"icon\">login</mat-icon>\n </button>\n }\n</mat-toolbar>\n", styles: [".topbar-spacer{flex:1 1 auto}.toolbar{height:60px;background-size:cover;--mat-toolbar-container-background-color: var(--mat-sys-primary);--mat-toolbar-container-text-color: var(--mat-sys-on-primary)}.logo{height:50px;margin-top:5px}.icon{color:var(--mat-sys-on-primary)}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
2362
2374
|
}
|
|
2363
2375
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TopBarComponent, decorators: [{
|
|
2364
2376
|
type: Component,
|
|
@@ -2366,7 +2378,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
2366
2378
|
MatToolbarModule,
|
|
2367
2379
|
MatIconModule,
|
|
2368
2380
|
MatButtonModule,
|
|
2369
|
-
MatMenuModule], template: "<mat-toolbar class=\"toolbar\" [style.background-image]=\"backgroundStyle\">\n\n @if(logo())\n {\n <a aria-label=\"Home\" [routerLink]=\"['home']\">\n <img src=\"{{logo()}}\" class=\"logo\" alt=\"Website logo\"/>\n </a>\n }\n @else {\n <a mat-icon-button aria-label=\"Home\" [routerLink]=\"['home']\">\n <mat-icon class=\"icon\">home</mat-icon>\n </a>\n <span>{{title()}}</span>\n }\n @if(user()){\n <button mat-icon-button style=\"margin: 5px\" aria-label=\"Toggle Nav Bar\">\n <mat-icon class=\"icon\" (click)=\"leftNavService.toggle()\">\n @if(leftNavService.wide()){\n
|
|
2381
|
+
MatMenuModule], template: "<mat-toolbar class=\"toolbar\" [style.background-image]=\"backgroundStyle\">\n\n @if(logo())\n {\n <a aria-label=\"Home\" [routerLink]=\"['home']\">\n <img src=\"{{logo()}}\" class=\"logo\" alt=\"Website logo\"/>\n </a>\n }\n @else {\n <a mat-icon-button aria-label=\"Home\" [routerLink]=\"['home']\">\n <mat-icon class=\"icon\">home</mat-icon>\n </a>\n <span>{{title()}}</span>\n }\n @if(user()){\n <button mat-icon-button style=\"margin: 5px\" aria-label=\"Toggle Nav Bar\">\n <mat-icon class=\"icon\" (click)=\"leftNavService.toggle()\">\n @if(leftNavService.wide()){\n menu_open\n }\n @else {\n menu\n }\n </mat-icon>\n </button>\n }\n\n <span class=\"topbar-spacer\"></span>\n @if(user(); as user)\n {\n <span>{{user.username}}</span>\n \n <button mat-icon-button style=\"margin: 5px\" aria-label=\"User Profile\" [matMenuTriggerFor]=\"profile_menu\">\n <mat-icon class=\"icon\">person</mat-icon>\n </button>\n\n <mat-menu #profile_menu=\"matMenu\">\n <a mat-menu-item aria-label=\"My Profile\" [routerLink]=\"['/members/detail', user.id]\">\n <mat-icon>manage_accounts</mat-icon>\n <span>My Profile</span>\n </a> \n <a mat-menu-item aria-label=\"Get Support\" [routerLink]=\"['/feedback']\">\n <mat-icon>contact_support</mat-icon>\n <span>Get Support</span>\n </a> \n <button mat-menu-item (click)=\"onLogout()\">\n <mat-icon>logout</mat-icon>\n <span>Log Out</span>\n </button>\n\n </mat-menu>\n }\n @else {\n <span>Log In</span>\n <button matIconButton (click)=\"onLogin()\">\n <mat-icon class=\"icon\">login</mat-icon>\n </button>\n }\n</mat-toolbar>\n", styles: [".topbar-spacer{flex:1 1 auto}.toolbar{height:60px;background-size:cover;--mat-toolbar-container-background-color: var(--mat-sys-primary);--mat-toolbar-container-text-color: var(--mat-sys-on-primary)}.logo{height:50px;margin-top:5px}.icon{color:var(--mat-sys-on-primary)}\n"] }]
|
|
2370
2382
|
}], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], logo: [{ type: i0.Input, args: [{ isSignal: true, alias: "logo", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], loginRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "loginRoute", required: false }] }] } });
|
|
2371
2383
|
|
|
2372
2384
|
class LeftNavComponent {
|
|
@@ -2391,11 +2403,18 @@ class LeftNavComponent {
|
|
|
2391
2403
|
}
|
|
2392
2404
|
}
|
|
2393
2405
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LeftNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2394
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: LeftNavComponent, isStandalone: true, selector: "lib-left-nav", inputs: { background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "sideNavContent", first: true, predicate: MatSidenavContent, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-sidenav-container class=\"leftnav-container\">\n @if(leftNavService.wide()){\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width:200px; padding-top:0px\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon style=\"margin-right: 5px;\">{{option.icon}}</mat-icon><span>{{ option.name }}</span>\n </div>\n </a>\n </li>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n @else{\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width: 70px;\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; flex-direction: row; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\" matTooltip=\"{{option.name}}\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon>{{option.icon}}</mat-icon>\n </div>\n </a>\n </li>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n\n <mat-sidenav-content class=\"leftnav-content\" [style.background-image]=\"backgroundStyle\"> \n <router-outlet />\n </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}.leftnav-container{flex-grow:1;display:flex}.leftnav-content{display:flex;flex-grow:1;height:90vh;background-blend-mode:lighten;background-color:#ffffffa6;background-size:cover}.leftnav-side{padding:5px}ul,li{margin:0;padding:0;list-style-type:none;padding-inline-start:0;list-style:none}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1$5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i1$5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i1$5.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i2$1.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
2406
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: LeftNavComponent, isStandalone: true, selector: "lib-left-nav", inputs: { background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "sideNavContent", first: true, predicate: MatSidenavContent, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-sidenav-container class=\"leftnav-container\">\n @if(leftNavService.wide()){\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width:200px; padding-top:0px\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping; let idx=$index; let count=$count) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon style=\"margin-right: 5px;\">{{option.icon}}</mat-icon><span>{{ option.name }}</span>\n </div>\n </a>\n </li>\n }\n @if(idx < count-1)\n {\n <mat-divider></mat-divider>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n @else{\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width: 70px;\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping; let idx=$index; let count=$count) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; flex-direction: row; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\" matTooltip=\"{{option.name}}\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon>{{option.icon}}</mat-icon>\n </div>\n </a>\n </li>\n }\n @if(idx < count-1)\n {\n <mat-divider></mat-divider>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n\n <mat-sidenav-content class=\"leftnav-content\" [style.background-image]=\"backgroundStyle\"> \n <router-outlet />\n </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}.leftnav-container{flex-grow:1;display:flex}.leftnav-content{display:flex;flex-grow:1;height:90vh;background-blend-mode:lighten;background-color:#ffffffa6;background-size:cover}.leftnav-side{padding:5px}ul,li{margin:0;padding:0;list-style-type:none;padding-inline-start:0;list-style:none}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1$5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i1$5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i1$5.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i2$1.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDividerModule }] });
|
|
2395
2407
|
}
|
|
2396
2408
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LeftNavComponent, decorators: [{
|
|
2397
2409
|
type: Component,
|
|
2398
|
-
args: [{ selector: 'lib-left-nav', imports: [MatSidenavModule,
|
|
2410
|
+
args: [{ selector: 'lib-left-nav', imports: [MatSidenavModule,
|
|
2411
|
+
MatListModule,
|
|
2412
|
+
RouterOutlet,
|
|
2413
|
+
RouterModule,
|
|
2414
|
+
MatIconModule,
|
|
2415
|
+
MatTooltipModule,
|
|
2416
|
+
NgStyle,
|
|
2417
|
+
MatDividerModule], template: "<mat-sidenav-container class=\"leftnav-container\">\n @if(leftNavService.wide()){\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width:200px; padding-top:0px\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping; let idx=$index; let count=$count) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon style=\"margin-right: 5px;\">{{option.icon}}</mat-icon><span>{{ option.name }}</span>\n </div>\n </a>\n </li>\n }\n @if(idx < count-1)\n {\n <mat-divider></mat-divider>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n @else{\n <mat-sidenav mode=\"side\" class=\"leftnav-side\" [opened]=\"user()!== null\" style=\"width: 70px;\">\n <mat-nav-list>\n @for (grouping of leftNavService.activeGroupings(); track grouping; let idx=$index; let count=$count) { \n <ul>\n @if(grouping.name)\n {\n <div style=\"display:flex; width: 100%; flex-direction: row; align-items: center; text-align: center;margin-top: 5px; margin-bottom: 5px;\">\n <span style=\"width:100%\">{{grouping.name}}</span>\n </div>\n }\n @for (option of grouping.options; track option) {\n <li>\n <a mat-list-item \n [routerLink]=\"option.route\" \n routerLinkActive #rla=\"routerLinkActive\" \n [activated]=\"rla.isActive\" matTooltip=\"{{option.name}}\">\n <div style=\"display:flex; vertical-align:middle;\">\n <mat-icon>{{option.icon}}</mat-icon>\n </div>\n </a>\n </li>\n }\n @if(idx < count-1)\n {\n <mat-divider></mat-divider>\n }\n </ul>\n }\n </mat-nav-list>\n </mat-sidenav>\n }\n\n <mat-sidenav-content class=\"leftnav-content\" [style.background-image]=\"backgroundStyle\"> \n <router-outlet />\n </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}.leftnav-container{flex-grow:1;display:flex}.leftnav-content{display:flex;flex-grow:1;height:90vh;background-blend-mode:lighten;background-color:#ffffffa6;background-size:cover}.leftnav-side{padding:5px}ul,li{margin:0;padding:0;list-style-type:none;padding-inline-start:0;list-style:none}\n"] }]
|
|
2399
2418
|
}], ctorParameters: () => [], propDecorators: { background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], sideNavContent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatSidenavContent), { isSignal: true }] }] } });
|
|
2400
2419
|
|
|
2401
2420
|
class FeedbackComponent {
|