File
Implements
Methods
|
addBaseVersion
|
addBaseVersion()
|
|
|
|
addPatchVersion
|
addPatchVersion()
|
|
|
|
Async
deleteBaseVersion
|
deleteBaseVersion(baseVersion: IManagedObject)
|
Parameters :
| Name |
Type |
Optional |
| baseVersion |
IManagedObject
|
No
|
|
|
Async
deletePatchVersion
|
deletePatchVersion(patchVersion: IManagedObject)
|
Parameters :
| Name |
Type |
Optional |
| patchVersion |
IManagedObject
|
No
|
|
|
getBinaryName$
|
getBinaryName$(binaryUrl)
|
Decorators :
@memoize()
|
Parameters :
| Name |
Optional |
| binaryUrl |
No
|
|
|
getPatchVersions$
|
getPatchVersions$(baseVersion)
|
Decorators :
@memoize(undefined)
|
Parameters :
| Name |
Optional |
| baseVersion |
No
|
|
|
getPatchVersionsCount$
|
getPatchVersionsCount$(baseVersion: FirmwareBinary)
|
Decorators :
@memoize(undefined)
|
|
|
|
ngOnDestroy
|
ngOnDestroy()
|
|
|
|
baseVersions$
|
Type : Observable<IResultList<IManagedObject>>
|
Default value : merge(
this.firmware$.pipe(distinctUntilKeyChanged('id')),
this.baseVersionsUpdated$,
this.patchVersionsUpdated$,
this.reload$
).pipe(
switchMap(() => this.firmware$),
switchMap(firmware => this.repositoryService.listBaseVersions(firmware)),
shareReplay(1)
)
|
|
baseVersionsUpdated$
|
Type : Subject<void>
|
Default value : new Subject()
|
|
canAddPatchVersions$
|
Type : Observable<boolean>
|
Default value : combineLatest(
this.isLegacy$,
this.baseVersions$.pipe(map(({ data }) => data.length > 0))
).pipe(map(([isLegacy, hasBaseVersions]) => !isLegacy && hasBaseVersions))
|
|
destroy$
|
Type : Subject<boolean>
|
Default value : new Subject<boolean>()
|
|
expanded
|
Type : literal type
|
Default value : {}
|
|
firmware
|
Type : IManagedObject
|
|
firmware$
|
Type : Observable<IManagedObject>
|
Default value : merge(
this.activatedRoute.params.pipe(
map(params => params.id),
switchMap(id => defer(() => this.inventoryService.detail(id).then(result => result.data)))
),
this.reload$.pipe(
tap(() => this.reloading$.next(true)),
switchMap(() => this.activatedRoute.params),
map(params => params.id),
switchMap(id => defer(() => this.inventoryService.detail(id).then(result => result.data))),
tap(() => this.reloading$.next(false))
),
this.firmwareUpdated$
).pipe(shareReplay(1))
|
|
firmwareUpdated$
|
Type : Subject<IManagedObject>
|
Default value : new Subject()
|
|
isLegacy$
|
Type : Observable<boolean>
|
Default value : this.firmware$.pipe(
map(firmware => this.repositoryService.isLegacyEntry(firmware)),
shareReplay(1)
)
|
|
patchVersionsUpdated$
|
Type : Subject<void>
|
Default value : new Subject()
|
|
reload$
|
Type : Subject<void>
|
Default value : new Subject()
|
|
reloading$
|
Type : BehaviorSubject<boolean>
|
Default value : new BehaviorSubject(false)
|
|
updateFirmware$
|
Type : Subject<Partial<IManagedObject>>
|
Default value : new Subject()
|
<c8y-title>
{{ (firmware$ | async)?.name }}
</c8y-title>
<c8y-breadcrumb>
<c8y-breadcrumb-item
label="{{ 'Management' | translate }}"
icon="c8y-management"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
path="#/firmware"
label="{{ 'Firmware repository' | translate }}"
icon="c8y-firmware"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
label="{{ (firmware$ | async)?.name }}"
icon="c8y-firmware"
></c8y-breadcrumb-item>
</c8y-breadcrumb>
<c8y-action-bar-item [placement]="'right'">
<button
*ngIf="!(isLegacy$ | async)"
class="btn btn-link"
type="button"
title="{{ 'Add firmware' | translate }}"
data-cy="firmware-details--add-firmware-btn"
(click)="addBaseVersion()"
>
<i c8yIcon="plus-circle"></i>
{{ 'Add firmware' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'right'">
<button
*ngIf="canAddPatchVersions$ | async"
class="btn btn-link"
type="button"
title="{{ 'Add firmware patch' | translate }}"
data-cy="firmware-details--add-firmware-patch-btn"
(click)="addPatchVersion()"
>
<i c8yIcon="plus-circle"></i>
{{ 'Add firmware patch' | translate }}
</button>
</c8y-action-bar-item>
<c8y-action-bar-item [placement]="'right'">
<button
class="btn btn-link"
type="button"
title="{{ 'Reload' | translate }}"
(click)="reload$.next()"
>
<i c8yIcon="refresh" [ngClass]="{ 'icon-spin': reloading$ | async }"></i>
{{ 'Reload' | translate }}
</button>
</c8y-action-bar-item>
<div class="row">
<div class="col-lg-12 col-lg-max">
<div class="card card--fullpage">
<div class="card-block bg-level-1 flex-no-shrink p-t-24 p-b-24">
<div class="content-flex-70">
<div class="text-center">
<i class="c8y-icon-duocolor icon-48 c8y-icon c8y-icon-firmware"></i>
<p>
<small class="label label-info">Firmware</small>
</p>
</div>
<div class="flex-grow col-10">
<div class="row">
<div class="col-md-4">
<c8y-form-group>
<label class="control-label">
{{ 'Name' | translate }}
</label>
<div class="input-group input-group-editable">
<input
#nameInput
type="text"
class="form-control"
[ngModel]="(firmware$ | async)?.name"
#nameModel="ngModel"
placeholder="{{ 'e.g. My firmware' | translate }}"
data-cy="firmware-details--name-input"
[ngStyle]="{ 'width.ch': (firmware$ | async)?.name?.length + 2 || 36 }"
required
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
data-cy="firmware-details--name-save-btn"
(click)="updateFirmware$.next({ name: nameInput.value }); nameModel.reset()"
[disabled]="nameInput.value.length == 0"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
<div class="col-md-4">
<c8y-form-group>
<label class="control-label">
{{ 'Description' | translate }}
</label>
<div class="input-group input-group-editable">
<input
#descriptionInput
type="text"
class="form-control"
[ngModel]="(firmware$ | async)?.description"
#descriptionModel="ngModel"
placeholder="{{ 'e.g. Firmware for hardware revision B' | translate }}"
data-cy="firmware-details--description-input"
[ngStyle]="{ 'width.ch': (firmware$ | async)?.description?.length || 36 }"
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
data-cy="firmware-details--description-save-btn"
(click)="
updateFirmware$.next({ description: descriptionInput.value });
descriptionModel.reset()
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
<div class="col-md-4">
<c8y-form-group>
<label class="control-label">
{{ 'Device type filter' | translate }}
<button
class="btn-help"
type="button"
[attr.aria-label]="'Help' | translate"
popover="{{
'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'
| translate
}}"
placement="right"
triggers="focus"
container="body"
>
<i c8yIcon="question-circle-o"></i>
</button>
</label>
<div class="input-group input-group-editable">
<input
#deviceTypeInput
type="text"
class="form-control"
[ngModel]="(firmware$ | async)?.c8y_Filter?.type"
#deviceTypeModel="ngModel"
placeholder="{{ 'e.g.' | translate }} c8y_Linux"
data-cy="firmware-details--device-type-filter-input"
[ngStyle]="{ 'width.ch': (firmware$ | async)?.type?.length || 36 }"
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
data-cy="firmware-details--device-type-filter-save-btn"
(click)="
updateFirmware$.next({ c8y_Filter: { type: deviceTypeInput.value } });
deviceTypeModel.reset()
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
</div>
</div>
</div>
</div>
<div class="inner-scroll">
<div class="card-header separator-top-bottom bg-component sticky-top">
<div class="card-title" translate>Versions and patches</div>
</div>
<div class="card-block p-t-0 p-b-24">
<div *ngIf="(baseVersions$ | async)?.data.length === 0">
<c8y-ui-empty-state
[icon]="'c8y-firmware'"
[title]="'No versions to display.' | translate"
[subtitle]="'Add a new version by clicking below.' | translate"
[horizontal]="true"
>
<button
class="btn btn-sm btn-default m-t-8"
type="button"
title="{{ 'Add firmware' | translate }}"
(click)="addBaseVersion()"
>
<i c8yIcon="plus-circle"></i>
{{ 'Add firmware' | translate }}
</button>
</c8y-ui-empty-state>
</div>
<c8y-list-group *ngIf="(baseVersions$ | async)?.data.length > 0">
<c8y-li
*c8yFor="let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'"
[emptyActions]="!(getPatchVersions$(baseVersion) | async)?.data.length"
[collapsed]="!expanded[baseVersion.id]"
(collapsedChange)="expanded[baseVersion.id] = !$event"
>
<c8y-li-icon>
<i c8yIcon="c8y-firmware"></i>
</c8y-li-icon>
<c8y-li-body class="content-flex-50">
<div class="col-4">
<p class="text-truncate" title="{{ baseVersion.c8y_Firmware.version }}">
{{ baseVersion.c8y_Firmware.version }}
</p>
</div>
<div class="col-5">
<p class="text-truncate">
<span class="text-label-small m-r-8" translate>File</span>
<span title="{{ getBinaryName$(baseVersion.c8y_Firmware.url) | async }}">
<c8y-file-download
url="{{ baseVersion.c8y_Firmware.url }}"
></c8y-file-download>
</span>
</p>
</div>
<div class="col-2 d-flex a-i-start">
<span *ngIf="isLegacy$ | async" class="label label-warning m-l-auto-sm">
{{ 'Legacy' | translate }}
</span>
<span *ngIf="!(isLegacy$ | async)">
<span *ngIf="(getPatchVersionsCount$(baseVersion) | async) === null">
<span class="label label-info">
<i c8yIcon="circle-o-notch" class="icon-spin"></i>
</span>
</span>
<span *ngIf="(getPatchVersionsCount$(baseVersion) | async) !== null">
<span [ngPlural]="getPatchVersionsCount$(baseVersion) | async">
<ng-template ngPluralCase="=0">
<span class="label label-default m-l-auto-sm">
<span translate>No patches</span>
</span>
</ng-template>
<ng-template ngPluralCase="=1">
<span class="label label-info">
<span translate>1 patch</span>
</span>
</ng-template>
<ng-template ngPluralCase="other">
<span class="label label-info">
<span
ngNonBindable
translate
[translateParams]="{
count: getPatchVersionsCount$(baseVersion) | async
}"
>
{{ count }} patches
</span>
</span>
</ng-template>
</span>
</span>
</span>
</div>
<div class="fit-h-20 visible-xs" *ngIf="!(isLegacy$ | async)">
<button
class="btn btn-default btn-sm m-t-8"
type="button"
title="{{ 'Delete' | translate }}"
(click)="deleteBaseVersion(baseVersion)"
>
<i c8yIcon="delete"></i>
{{ 'Delete' | translate }}
</button>
</div>
<div *ngIf="!(isLegacy$ | async)" class="m-l-auto fit-h-20 p-r-8 hidden-xs">
<button
class="btn btn-dot btn-dot--danger showOnHover"
type="button"
[attr.aria-label]="'Delete' | translate"
data-cy="firmware-details--delete-base-version"
tooltip="{{ 'Delete' | translate }}"
[delay]="500"
(click)="deleteBaseVersion(baseVersion)"
>
<i c8yIcon="delete"></i>
</button>
</div>
</c8y-li-body>
<c8y-li-collapse *ngIf="(getPatchVersions$(baseVersion) | async)?.data.length">
<c8y-list-group class="separator-top">
<c8y-li
*c8yFor="
let patchVersion of getPatchVersions$(baseVersion) | async;
let i = index;
loadMore: 'auto'
"
>
<c8y-li-icon>
<i c8yIcon="c8y-firmware"></i>
</c8y-li-icon>
<c8y-li-body class="content-flex-50">
<div class="col-4">
{{ patchVersion.c8y_Firmware.version }}
</div>
<div class="col-5">
<div class="text-truncate">
<span class="text-label-small m-r-8" translate>File</span>
<c8y-file-download
url="{{ patchVersion.c8y_Firmware.url }}"
></c8y-file-download>
</div>
</div>
<div class="visible-xs m-t-8">
<button
class="btn btn-danger btn-xs"
type="button"
title="{{ 'Delete' | translate }}"
data-cy="firmware-details--delete-patch-version"
(click)="deletePatchVersion(patchVersion)"
>
<i c8yIcon="delete"></i>
{{ 'Delete' | translate }}
</button>
</div>
<div class="m-l-auto p-r-8 hidden-xs fit-h-20">
<button
class="btn btn-dot text-danger showOnHover"
type="button"
[attr.aria-label]="'Delete' | translate"
tooltip="{{ 'Delete' | translate }}"
placement="right"
[delay]="500"
(click)="deletePatchVersion(patchVersion)"
>
<i c8yIcon="delete" data-cy="firmware-details--Remove-icon"></i>
</button>
</div>
</c8y-li-body>
</c8y-li>
</c8y-list-group>
</c8y-li-collapse>
</c8y-li>
</c8y-list-group>
</div>
</div>
</div>
</div>
</div>