@lowcodeunit/applications-flow-common 1.33.179-lets-get-social-ish → 1.33.180-lets-get-social-ish
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.
- package/esm2020/lib/elements/breadcrumb/breadcrumb.component.mjs +6 -3
- package/esm2020/lib/elements/main-feed-card/main-feed-card.component.mjs +8 -3
- package/esm2020/lib/services/project.service.mjs +7 -8
- package/esm2020/lib/state/applications-flow.state.mjs +1 -1
- package/fesm2015/lowcodeunit-applications-flow-common.mjs +19 -11
- package/fesm2015/lowcodeunit-applications-flow-common.mjs.map +1 -1
- package/fesm2020/lowcodeunit-applications-flow-common.mjs +18 -11
- package/fesm2020/lowcodeunit-applications-flow-common.mjs.map +1 -1
- package/lib/elements/breadcrumb/breadcrumb.component.d.ts +1 -0
- package/lib/elements/main-feed-card/main-feed-card.component.d.ts +1 -0
- package/lib/state/applications-flow.state.d.ts +2 -0
- package/package.json +1 -1
|
@@ -39,6 +39,7 @@ import * as i6$1 from '@angular/material/checkbox';
|
|
|
39
39
|
import * as i1$3 from '@angular/cdk/layout';
|
|
40
40
|
import * as i3 from 'skeleton-elements/angular';
|
|
41
41
|
import { SkeletonElementsModule } from 'skeleton-elements/angular';
|
|
42
|
+
import moment from 'moment';
|
|
42
43
|
import { EaCApplicationAsCode } from '@semanticjs/common';
|
|
43
44
|
import * as i1$4 from '@angular/material/dialog';
|
|
44
45
|
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
@@ -442,20 +443,19 @@ class ProjectService {
|
|
|
442
443
|
}
|
|
443
444
|
async GetActiveEnterprise(state) {
|
|
444
445
|
return new Promise((resolve, reject) => {
|
|
445
|
-
state.
|
|
446
|
+
state.LoadingActiveEnterprise = true;
|
|
446
447
|
this.appsFlowSvc.GetActiveEnterprise().subscribe(async (response) => {
|
|
448
|
+
state.LoadingActiveEnterprise = false;
|
|
447
449
|
if (response.Status.Code === 0) {
|
|
448
450
|
state.ActiveEnterpriseLookup = response.Model?.Lookup;
|
|
449
|
-
state.Loading = false;
|
|
450
451
|
resolve();
|
|
451
452
|
}
|
|
452
453
|
else {
|
|
453
|
-
state.Loading = false;
|
|
454
454
|
reject(response.Status);
|
|
455
455
|
console.log(response);
|
|
456
456
|
}
|
|
457
457
|
}, (err) => {
|
|
458
|
-
state.
|
|
458
|
+
state.LoadingActiveEnterprise = false;
|
|
459
459
|
reject(err);
|
|
460
460
|
console.log(err);
|
|
461
461
|
});
|
|
@@ -480,9 +480,9 @@ class ProjectService {
|
|
|
480
480
|
}
|
|
481
481
|
async ListEnterprises(state) {
|
|
482
482
|
return new Promise((resolve, reject) => {
|
|
483
|
-
state.
|
|
483
|
+
state.LoadingEnterprises = true;
|
|
484
484
|
this.appsFlowSvc.ListEnterprises().subscribe(async (response) => {
|
|
485
|
-
state.
|
|
485
|
+
state.LoadingEnterprises = false;
|
|
486
486
|
if (response.Status.Code === 0) {
|
|
487
487
|
state.Enterprises = response.Model;
|
|
488
488
|
resolve(response.Model);
|
|
@@ -492,7 +492,7 @@ class ProjectService {
|
|
|
492
492
|
console.log(response);
|
|
493
493
|
}
|
|
494
494
|
}, (err) => {
|
|
495
|
-
state.
|
|
495
|
+
state.LoadingEnterprises = false;
|
|
496
496
|
reject(err);
|
|
497
497
|
console.log(err);
|
|
498
498
|
});
|
|
@@ -3765,15 +3765,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
|
|
|
3765
3765
|
class MainFeedCardComponent {
|
|
3766
3766
|
constructor() { }
|
|
3767
3767
|
ngOnInit() { }
|
|
3768
|
+
// API Methods
|
|
3769
|
+
CalculateTimelapse(timestamp) {
|
|
3770
|
+
return moment(timestamp).fromNow();
|
|
3771
|
+
}
|
|
3768
3772
|
HandleAction(action) {
|
|
3769
3773
|
console.log('Action clicked');
|
|
3770
3774
|
}
|
|
3771
3775
|
}
|
|
3772
3776
|
MainFeedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: MainFeedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3773
|
-
MainFeedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: MainFeedCardComponent, selector: "lcu-main-feed-card", inputs: { FeedItem: ["feed-item", "FeedItem"] }, ngImport: i0, template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ FeedItem.Timestamp }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }] });
|
|
3777
|
+
MainFeedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: MainFeedCardComponent, selector: "lcu-main-feed-card", inputs: { FeedItem: ["feed-item", "FeedItem"] }, ngImport: i0, template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ CalculateTimelapse(FeedItem.Timestamp) }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }] });
|
|
3774
3778
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: MainFeedCardComponent, decorators: [{
|
|
3775
3779
|
type: Component,
|
|
3776
|
-
args: [{ selector: 'lcu-main-feed-card', template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ FeedItem.Timestamp }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"] }]
|
|
3780
|
+
args: [{ selector: 'lcu-main-feed-card', template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ CalculateTimelapse(FeedItem.Timestamp) }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"] }]
|
|
3777
3781
|
}], ctorParameters: function () { return []; }, propDecorators: { FeedItem: [{
|
|
3778
3782
|
type: Input,
|
|
3779
3783
|
args: ['feed-item']
|
|
@@ -5034,6 +5038,9 @@ class BreadcrumbComponent {
|
|
|
5034
5038
|
get CurrentRouteApplicationLookups() {
|
|
5035
5039
|
return Object.keys(this.RoutedApplications[this.SelectedRoute] || {});
|
|
5036
5040
|
}
|
|
5041
|
+
get Loading() {
|
|
5042
|
+
return this.State?.LoadingActiveEnterprise || this.State?.LoadingEnterprises;
|
|
5043
|
+
}
|
|
5037
5044
|
get Projects() {
|
|
5038
5045
|
return this.State?.EaC?.Projects || {};
|
|
5039
5046
|
}
|
|
@@ -5106,10 +5113,10 @@ class BreadcrumbComponent {
|
|
|
5106
5113
|
async handleStateChange() { }
|
|
5107
5114
|
}
|
|
5108
5115
|
BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: EaCService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5109
|
-
BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: BreadcrumbComponent, selector: "lcu-breadcrumb", inputs: { ApplicationLookup: ["application-lookup", "ApplicationLookup"], ProjectLookup: ["project-lookup", "ProjectLookup"], SelectedRoute: ["selected-route", "SelectedRoute"] }, ngImport: i0, template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"
|
|
5116
|
+
BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: BreadcrumbComponent, selector: "lcu-breadcrumb", inputs: { ApplicationLookup: ["application-lookup", "ApplicationLookup"], ProjectLookup: ["project-lookup", "ProjectLookup"], SelectedRoute: ["selected-route", "SelectedRoute"] }, ngImport: i0, template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">{{Enterprise?.Name}}</div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"ProjectLookup && SelectedProject\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/projects', ProjectLookup]\"\n >\n {{SelectedProject?.Project?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n \n \n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button \n mat-menu-item \n *ngFor=\"let projectLookup of ProjectLookups\" \n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro;\">{{pro.Project?.Name}}</span>\n </button>\n </mat-menu>\n\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{SelectedRoute}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appRoute of Routes\" [routerLink]=\"['/routes', appRoute, ProjectLookup]\">\n <span *ngIf=\"appRoute\">{{appRoute}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedApplication && ApplicationLookup\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"crumb-name\" \n [routerLink]=\"['/applications', ApplicationLookup, SelectedRoute, ProjectLookup]\"\n >\n {{SelectedApplication?.Application?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"['/applications', appLookup, SelectedRoute, ProjectLookup]\">\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup];\n let app\">{{app.Application?.Name}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n\n</div>", styles: [".breadcrumb-container{background-color:#ebecf0;margin:10px 30px}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"], components: [{ type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i5$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }, { type: i8$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i4$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5110
5117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: BreadcrumbComponent, decorators: [{
|
|
5111
5118
|
type: Component,
|
|
5112
|
-
args: [{ selector: 'lcu-breadcrumb', template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"
|
|
5119
|
+
args: [{ selector: 'lcu-breadcrumb', template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">{{Enterprise?.Name}}</div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"ProjectLookup && SelectedProject\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/projects', ProjectLookup]\"\n >\n {{SelectedProject?.Project?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n \n \n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button \n mat-menu-item \n *ngFor=\"let projectLookup of ProjectLookups\" \n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro;\">{{pro.Project?.Name}}</span>\n </button>\n </mat-menu>\n\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{SelectedRoute}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appRoute of Routes\" [routerLink]=\"['/routes', appRoute, ProjectLookup]\">\n <span *ngIf=\"appRoute\">{{appRoute}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedApplication && ApplicationLookup\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"crumb-name\" \n [routerLink]=\"['/applications', ApplicationLookup, SelectedRoute, ProjectLookup]\"\n >\n {{SelectedApplication?.Application?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"['/applications', appLookup, SelectedRoute, ProjectLookup]\">\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup];\n let app\">{{app.Application?.Name}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n\n</div>", styles: [".breadcrumb-container{background-color:#ebecf0;margin:10px 30px}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"] }]
|
|
5113
5120
|
}], ctorParameters: function () { return [{ type: EaCService }]; }, propDecorators: { ApplicationLookup: [{
|
|
5114
5121
|
type: Input,
|
|
5115
5122
|
args: ['application-lookup']
|