File
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Outputs
|
|
|
|
containerClass
|
Type : string
|
CSS class for the container element.
Defaults to 'd-flex p-t-4 p-b-4' if not provided.
|
|
displayMode
|
Type : "default" | "icon-only"
|
Default value : 'default'
|
|
exportConfig
|
Type : ExportConfig
|
Configuration for the export selector modal.
|
Methods
|
Async
openExportModal
|
openExportModal()
|
|
Returns : Promise<void>
|
|
Readonly
DEFAULT_CSS_STYLE
|
Type : string
|
Default value : 'd-flex'
|
|
isExportDisabled
|
Type : unknown
|
Default value : computed(() => {
const config = this.exportConfig();
return !config?.datapointDetails || config.datapointDetails.length === 0;
})
|
Check if export button should be disabled
Disabled when: no config provided or no datapoints configured
|
@switch (displayMode()) {
@case ('default') {
@if (containerClass() !== 'd-contents') {
<div [class]="containerClass() || DEFAULT_CSS_STYLE">
<button
class="btn btn-default btn-sm"
[attr.aria-label]="'Generate export' | translate"
tooltip="{{ 'Generate export' | translate }}"
container="body"
type="button"
data-cy="datapoints-export-selector--open-export-button"
(click)="openExportModal()"
[adaptivePosition]="false"
[disabled]="isExportDisabled()"
[delay]="500"
>
<i
class="icon-14"
c8yIcon="data-export"
></i>
</button>
</div>
} @else {
<button
class="btn btn-link"
type="button"
(click)="openExportModal()"
[disabled]="isExportDisabled()"
>
<i c8yIcon="data-export"></i>
{{ 'Generate export' | translate }}
</button>
}
}
@case ('icon-only') {
<button
class="btn btn-icon"
[attr.aria-label]="'Generate export' | translate"
tooltip="{{ 'Generate export' | translate }}"
container="body"
type="button"
data-cy="datapoints-export-selector--open-export-button"
(click)="openExportModal()"
[adaptivePosition]="false"
[disabled]="!exportConfig()"
[delay]="500"
>
<i
class="icon-14"
c8yIcon="data-export"
></i>
</button>
}
}