repository/select-modal/repository-select-modal.component.ts
RepositorySelectModalComponent displays repository entries options and allows to select them.
```
* import { take } from 'rxjs/operators';
* import { RepositorySelectModalComponent, ModalSelectionMode, RepositoryType } from '@c8y/ngx-components/repository';
*
* const initialState = {
* repositoryType: RepositoryType.FIRMWARE,
* title: gettext('Install firmware'),
* subTitle: gettext('Available firmwares matching the device type'),
* icon: 'c8y-firmware',
* mode: ModalSelectionMode.SINGLE,
* labels: { ok: gettext('Install') },
* disableSelected: false
* };
*
* const modal = this.bsModal.show(RepositorySelectModalComponent, {
* ignoreBackdropClick: true,
* initialState
* });
*
* modal.content.load.next();
* modal.content.resultEmitter.pipe(take(1)).subscribe((firmware) => {
* ...
* })
* ```| selector | c8y-repository-select-modal |
| templateUrl | ./repository-select-modal.component.html |
Properties |
Methods |
constructor(repositoryService: RepositoryService, translateService: TranslateService)
|
|||||||||
|
Parameters :
|
| Async aggregate | ||||||
aggregate(mos: IManagedObject[])
|
||||||
|
Parameters :
Returns :
Promise<ISelectModalObject[]>
|
| getAndAssignRepositoryBinaries | ||||||
getAndAssignRepositoryBinaries(mos: IManagedObject[])
|
||||||
|
Parameters :
Returns :
{}
|
| getSelectModalObject | |||||||||
getSelectModalObject(repositoryEntry: RepositoryCategory, options: ISelectModalOption[])
|
|||||||||
|
Parameters :
Returns :
ISelectModalObject
|
| getSelectModalOptions | |||||||||||||||
getSelectModalOptions(versions: RepositoryBinary[], selectedItems: SelectedRepositoryBinary[], repositoryEntry: RepositoryCategory, repositoryType: RepositoryType)
|
|||||||||||||||
|
Parameters :
Returns :
ISelectModalOption[]
|
| isBinaryRepositorySelected | |||||||||||||||
isBinaryRepositorySelected(selectedItems: SelectedRepositoryBinary[], repositoryEntry: RepositoryCategory, repositoryBinary: RepositoryBinary, repositoryType: RepositoryType)
|
|||||||||||||||
|
Parameters :
Returns :
boolean
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| result | ||||||
result(selectedItems: SelectedRepositoryBinary[])
|
||||||
|
Parameters :
Returns :
void
|
| search | ||||||
search(searchTerm: string)
|
||||||
|
Parameters :
Returns :
void
|
| areMoreEntries |
areMoreEntries:
|
Type : boolean
|
Default value : false
|
|
Optional Allows to show a warning that the search criteria should be narrowed down. By default, this warning is hidden. |
| badgeTemplates |
badgeTemplates:
|
Type : object
|
Default value : { '=1': gettext('{{count}} version'), other: gettext('{{count}} versions') }
|
|
Optional Allows to use custom badges templates. |
| deviceTypeQuery |
deviceTypeQuery:
|
Type : any
|
Default value : {}
|
|
Optional Allows to provide device type query to restrict search criteria. Only takes effect when repositoryEntriesWithVersions$ is not provided, otherwise modal's caller have to provide already filtered data in the repositoryEntriesWithVersions$. |
| disableSelected |
disableSelected:
|
Type : boolean
|
Default value : true
|
|
Allows to block selection of the other versions from the same repository entry. |
| icon |
icon:
|
Type : string
|
|
Optional Allows to use custom icon in the modal header. |
| labels |
labels:
|
Type : ModalLabels
|
Default value : { ok: gettext('Save') }
|
|
Optional Allows to provide custom labels for the buttons responsible for confirm/dismiss modal actions. |
| load |
load:
|
Type : Subject<void>
|
Default value : new Subject()
|
|
Loads the content of the modal. Must be invoked by the modal's caller. |
| modalEntries |
modalEntries:
|
Type : Observable<ISelectModalObject[]>
|
Default value : this.load.pipe(
switchMap(() => this.repositoryEntriesWithVersions$),
mergeMap(mos => this.aggregate(mos)),
tap(items => {
this.areMoreEntries = items.length >= this.PAGE_SIZE ? true : false;
})
)
|
| mode |
mode:
|
Type : ModalSelectionMode
|
Default value : ModalSelectionMode.SINGLE
|
|
Optional Allows to change selection mode. Supported options:
|
| repositoryEntriesWithVersions$ |
repositoryEntriesWithVersions$:
|
Type : Observable<IManagedObject[]>
|
Default value : undefined
|
|
Optional Allows to provide custom data. |
| repositoryType |
repositoryType:
|
Type : RepositoryType.FIRMWARE | RepositoryType.SOFTWARE
|
|
Repository entry type. |
| resultEmitter |
resultEmitter:
|
Type : EventEmitter<SelectedRepositoryBinary[]>
|
Default value : new EventEmitter<
SelectedRepositoryBinary[]
>()
|
|
Emits the list of selected options. |
| searchQuery |
searchQuery:
|
Type : any
|
Default value : {}
|
|
Optional Allows to provide query to restrict search criteria. Only takes effect when repositoryEntriesWithVersions$ is not provided, otherwise modal's caller have to provide already filtered data in the repositoryEntriesWithVersions$. |
| selected |
selected:
|
Type : SelectedRepositoryBinary[]
|
|
Optional Allows to pass the array of items. Each item from this array will be marked as selected in the modal. |
| showFilter |
showFilter:
|
Type : boolean
|
Default value : true
|
|
Optional Allows to hide the filter input field. By default, the filter input field is displayed. |
| subTitle |
subTitle:
|
Type : string
|
|
Optional Allows to provide custom modal subtitle. |
| title |
title:
|
Type : string
|
Default value : gettext('Select repository entry')
|
|
Optional Allows to provide custom modal title. |
<c8y-select-modal
[icon]="icon"
[title]="title"
[subTitle]="subTitle"
[items]="modalEntries | async"
[mode]="mode"
[disableSelected]="disableSelected"
[labels]="labels"
[showFilter]="showFilter"
[areMoreEntries]="areMoreEntries"
(search)="search($event)"
(result)="result($event)"
>
</c8y-select-modal>