File
Implements
Methods
addBaseVersion
|
addBaseVersion()
|
|
Async
deleteBaseVersion
|
deleteBaseVersion(baseVersion: IManagedObject)
|
Parameters :
Name |
Type |
Optional |
baseVersion |
IManagedObject
|
No
|
|
getBinaryName$
|
getBinaryName$(binaryUrl)
|
Decorators :
@memoize()
|
Parameters :
Name |
Optional |
binaryUrl |
No
|
|
ngOnDestroy
|
ngOnDestroy()
|
|
onSelectSoftwareType
|
onSelectSoftwareType(software)
|
Parameters :
Name |
Optional |
software |
No
|
|
baseVersions$
|
Type : Observable<IResultList<IManagedObject>>
|
Default value : merge(
this.software$.pipe(distinctUntilKeyChanged('id')),
this.baseVersionsUpdated$,
this.reload$
).pipe(
switchMap(() => this.software$),
switchMap(software => this.repositoryService.listBaseVersions(software)),
shareReplay(1)
)
|
baseVersionsUpdated$
|
Type : Subject<void>
|
Default value : new Subject()
|
destroy$
|
Type : Subject<boolean>
|
Default value : new Subject<boolean>()
|
isLegacy$
|
Type : Observable<boolean>
|
Default value : this.software$.pipe(
map(software => this.repositoryService.isLegacyEntry(software)),
shareReplay(1)
)
|
isSoftwareTypeChanged
|
Default value : false
|
reload$
|
Type : Subject<void>
|
Default value : new Subject()
|
reloading$
|
Type : BehaviorSubject<boolean>
|
Default value : new BehaviorSubject(false)
|
software$
|
Type : Observable<IManagedObject>
|
Default value : merge(
this.activatedRoute.params.pipe(
map(params => params.id),
switchMap(id => from(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 => from(this.inventoryService.detail(id).then(result => result.data))),
tap(() => this.reloading$.next(false))
),
this.softwareUpdated$
).pipe(shareReplay(1))
|
softwareTypeObject
|
Type : IManagedObject
|
softwareUpdated$
|
Type : Subject<IManagedObject>
|
Default value : new Subject()
|
updateSoftware$
|
Type : Subject<Partial<IManagedObject>>
|
Default value : new Subject()
|
<c8y-title>
{{ (software$ | async)?.name }}
</c8y-title>
<c8y-breadcrumb>
<c8y-breadcrumb-item
label="{{ 'Management' | translate }}"
icon="c8y-management"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
path="#/software"
label="{{ 'Software repository' | translate }}"
icon="c8y-tools"
></c8y-breadcrumb-item>
<c8y-breadcrumb-item
label="{{ (software$ | async)?.name }}"
icon="c8y-tools"
></c8y-breadcrumb-item>
</c8y-breadcrumb>
<c8y-action-bar-item [placement]="'right'">
<button
class="btn btn-link"
type="button"
title="{{ 'Add software' | translate }}"
(click)="addBaseVersion()"
*ngIf="!(isLegacy$ | async)"
>
<i c8yIcon="plus-circle"></i>
{{ 'Add software' | 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 overflow-visible">
<div class="content-flex-70">
<div class="text-center">
<i class="c8y-icon-duocolor icon-48 c8y-icon c8y-icon-tools"></i>
<p>
<small class="label label-info">Software</small>
</p>
</div>
<div class="flex-grow col-10">
<div class="row">
<div class="col-sm-6">
<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]="(software$ | async)?.name"
#nameModel="ngModel"
placeholder="{{ 'e.g. My software' | translate }}"
[ngStyle]="{ 'width.ch': (software$ | async)?.name?.length + 2 || 31 }"
required
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
(click)="updateSoftware$.next({ name: nameInput.value }); nameModel.reset()"
[disabled]="nameInput.value.length === 0"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
<div class="col-sm-6">
<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]="(software$ | async)?.description"
#descriptionModel="ngModel"
placeholder="{{ 'e.g. Cloud connectivity software' | translate }}"
[ngStyle]="{ 'width.ch': (software$ | async)?.description?.length + 2 || 31 }"
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
(click)="
updateSoftware$.next({ description: descriptionInput.value });
descriptionModel.reset()
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<c8y-form-group>
<label class="control-label">
{{ 'Device type' | translate }}
<button
class="btn-help"
type="button"
[attr.aria-label]="'Help' | translate"
popover="{{
'If the filter is set, the software will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'
| translate
}}"
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]="(software$ | async)?.c8y_Filter?.type"
#deviceTypeModel="ngModel"
placeholder="{{ 'e.g.' | translate }} c8y_Linux"
[ngStyle]="{ 'width.ch': (software$ | async)?.type?.length + 2 || 31 }"
/>
<span></span>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
(click)="
updateSoftware$.next({ c8y_Filter: { type: deviceTypeInput.value } });
deviceTypeModel.reset()
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
<div class="col-sm-6">
<c8y-form-group>
<label class="control-label">
{{ 'Software type' | translate }}
</label>
<div class="input-group input-group-editable">
<c8y-software-type
[softwareTypeMO]="softwareTypeObject"
[style]="{ 'width.ch': softwareTypeObject?.softwareType?.length + 2 || 31 }"
(onSelectSoftware)="onSelectSoftwareType($event)"
></c8y-software-type>
<div class="input-group-btn">
<button
class="btn btn-primary"
type="button"
title="{{ 'Save' | translate }}"
[ngClass]="isSoftwareTypeChanged ? '' : 'hidden'"
[disabled]="softwareTypeObject?.softwareType === ''"
(click)="
updateSoftware$.next({ softwareType: softwareTypeObject.softwareType });
softwareType.resetInput();
isSoftwareTypeChanged = false
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</c8y-form-group>
</div>
</div>
</div>
</div>
</div>
<div class="inner-scroll">
<div class="card-header separator-top-bottom sticky-top bg-component">
<div
class="card-title"
translate
>
Versions
</div>
</div>
<div class="card-block p-t-0 p-b-24">
<c8y-ui-empty-state
*ngIf="(baseVersions$ | async)?.data.length === 0"
[icon]="'c8y-tools'"
[title]="'No versions to display.' | translate"
[subtitle]="'Add a new version by clicking below.' | translate"
>
<p>
<button
class="btn btn-primary"
type="button"
title="{{ 'Add software' | translate }}"
(click)="addBaseVersion()"
>
{{ 'Add software' | translate }}
</button>
</p>
</c8y-ui-empty-state>
<c8y-list-group *ngIf="(baseVersions$ | async)?.data.length > 0">
<c8y-li
*c8yFor="let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'"
>
<c8y-li-icon>
<i c8yIcon="c8y-tools"></i>
</c8y-li-icon>
<c8y-li-body class="content-flex-50">
<div class="col-4">
<p
class="text-truncate-wrap"
title="{{ baseVersion.c8y_Software.version }}"
>
{{ baseVersion.c8y_Software.version }}
</p>
</div>
<div class="col-5">
<p class="text-truncate-wrap">
<span
class="text-label-small m-r-8"
translate
>
File
</span>
<span title=" {{ getBinaryName$(baseVersion.c8y_Software.url) | async }}">
<c8y-file-download
url="{{ baseVersion.c8y_Software.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>
<div
class="fit-h-20"
*ngIf="!(isLegacy$ | async)"
>
<button
class="btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8"
type="button"
title="{{ 'Delete' | translate }}"
(click)="deleteBaseVersion(baseVersion)"
>
<i c8yIcon="delete"></i>
{{ 'Delete' | translate }}
</button>
</div>
</div>
<div
*ngIf="!(isLegacy$ | async)"
class="m-l-auto fit-h-20 hidden-xs"
>
<button
class="btn btn-dot text-danger showOnHover"
type="button"
data-cy="software-details-component--Delete-button"
[attr.aria-label]="'Delete' | translate"
tooltip="{{ 'Delete' | translate }}"
[delay]="500"
(click)="deleteBaseVersion(baseVersion)"
>
<i c8yIcon="delete"></i>
</button>
</div>
</c8y-li-body>
</c8y-li>
</c8y-list-group>
</div>
</div>
</div>
</div>
</div>