File
Methods
|
loadPackages
|
loadPackages()
|
|
|
|
packages$
|
Type : Observable<IApplication>
|
Default value : this.reload$.pipe(
tap(() => (this.reloading = true)),
switchMap(() => this.ecosystemService.getPackageApplications()),
tap(() => (this.reloading = false)),
shareReplay()
)
|
|
reload$
|
Type : BehaviorSubject<void>
|
Default value : new BehaviorSubject(null)
|
|
reloading
|
Type : boolean
|
Default value : false
|
<c8y-title>{{ 'Packages' | translate }}</c8y-title>
<c8y-breadcrumb>
<c8y-breadcrumb-item [icon]="'c8y-atom'" [label]="'Ecosystem' | translate"></c8y-breadcrumb-item>
<c8y-breadcrumb-item
[icon]="'c8y-modules'"
[label]="'Applications' | translate"
[path]="'ecosystem/applications'"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item [icon]="'big-parcel'" [label]="'Packages' | translate"></c8y-breadcrumb-item>
</c8y-breadcrumb>
<c8y-action-bar-item [placement]="'right'">
<button (click)="addPackage()" class="btn btn-link" title="{{ 'Add package' | translate }}">
<i c8yIcon="plus-circle"></i>
{{ 'Add package' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'right'">
<button (click)="loadPackages()" class="btn btn-link" title="{{ 'Reload' | translate }}">
<i [ngClass]="{ 'icon-spin': reloading }" c8yIcon="refresh"></i>
{{ 'Reload' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'left'" itemClass="navbar-form hidden-xs">
<c8y-list-display-switch
(onListClassChange)="listClass = $event"
[listLength]="(packages$ | async)?.length"
></c8y-list-display-switch>
</c8y-action-bar-item>
<div [ngClass]="listClass" class="card-group">
<div class="page-sticky-header hidden-xs flex-row" *ngIf="(packages$ | async)?.length > 0">
<div class="card-block card-column-40">
<div class="card-appicon p-l-32 p-r-16 m-r-0 m-l-4"></div>
{{ 'Package' | translate }}
</div>
<div class="card-block p-0 card-column-80">
<div class="card-block card-column-80">{{ 'Description' | translate }}</div>
<div class="card-block card-column-20">{{ 'Type' | translate }}</div>
<div class="card-block card-column-20"></div>
</div>
</div>
<div *ngFor="let app of packages$ | async" class="col-xs-12 col-sm-4 col-md-3">
<c8y-application-card
(onAppDeleted)="loadPackages()"
[app]="app"
class="d-contents"
></c8y-application-card>
</div>
<div *ngIf="(packages$ | async)?.length === 0" class="c8y-empty-state text-center">
<h1 c8yIcon="big-parcel" class="c8y-icon-duocolor"></h1>
<h3 translate>No packages to display.</h3>
<p translate>Add your first package by clicking below.</p>
<p>
<button
(click)="addPackage()"
class="btn btn-primary"
title="{{ 'Add package' | translate }}"
>
{{ 'Add package' | translate }}
</button>
</p>
</div>
</div>