ecosystem/microservice-list.component.ts
| selector | c8y-microservice-list |
| templateUrl | ./microservice-list.component.html |
Properties |
Methods |
constructor(applicationService: ApplicationService, ecosystemService: EcosystemService, bsModalService: BsModalService)
|
||||||||||||
|
Parameters :
|
| Async addMicroservice |
addMicroservice()
|
|
Returns :
any
|
| loadMicroservices |
loadMicroservices()
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| listClass |
listClass:
|
Type : string
|
| microservices$ |
microservices$:
|
Type : Observable<IResultList<IApplication>>
|
Default value : this.reload$.pipe(
tap(() => (this.reloading = true)),
switchMap(() => this.ecosystemService.getApplications({ type: ApplicationType.MICROSERVICE })),
tap(() => (this.reloading = false))
)
|
| reload$ |
reload$:
|
Type : BehaviorSubject<void>
|
Default value : new BehaviorSubject(null)
|
| reloading |
reloading:
|
Type : boolean
|
Default value : false
|
<c8y-title>Microservices</c8y-title>
<c8y-action-bar-item [placement]="'right'">
<button class="btn btn-link" title="{{ 'Add microservice' | translate }}" (click)="addMicroservice()">
<i c8yIcon="plus"></i>
{{ 'Add microservice' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'right'">
<button class="btn btn-link" title="{{ 'Reload' | translate }}" (click)="reload$.next()">
<i c8yIcon="refresh" [ngClass]="{ 'icon-spin': reloading }"></i>
{{ 'Reload' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'left'" itemClass="navbar-form hidden-xs">
<c8y-list-display-switch
[listLength]="(microservices$ | async)?.length"
(onListClassChange)="listClass = $event"
></c8y-list-display-switch>
</c8y-action-bar-item>
<div class="c8y-empty-state text-center" *ngIf="(microservices$ | async)?.length === 0">
<h1 class="c8y-icon c8y-icon-modules c8y-icon-duocolor"></h1>
<h3 translate>No microservices to display.</h3>
<p translate>Add your first microservice by clicking below.</p>
<p>
<button
title="{{ 'Add microservice' | translate }}"
(click)="addMicroservice()"
class="btn btn-primary"
>
{{ 'Add microservice' | translate }}
</button>
</p>
</div>
<div class="card-group" [ngClass]="listClass">
<div class="page-sticky-header hidden-xs flex-row">
<div class="card-block card-column-30">
<div class="card-appicon p-l-32 p-r-16 m-r-0 m-l-4"></div>
Microservice
</div>
<div class="card-block card-column-90">
<div class="card-column-80">{{ 'Description' | translate }}</div>
<div class="card-column-20">{{ 'Type' | translate }}</div>
<div class="card-column-20"></div>
</div>
</div>
<div
*c8yFor="let microservice of microservices$; loadMore: 'hidden'"
class="col-xs-12 col-sm-4 col-md-3"
>
<c8y-application-list-card
[app]="microservice"
(onAppDeleted)="loadMicroservices()"
class="d-contents"
></c8y-application-list-card>
</div>
</div>