context-dashboard/dashboard-detail.component.ts
OnInit
OnChanges
OnDestroy
| selector | c8y-dashboard-detail |
| templateUrl | ./dashboard-detail.component.html |
Properties |
Methods |
|
Inputs |
Outputs |
constructor(contextDashboardService: ContextDashboardService, translateService: TranslateService, contextRoute: ContextRouteService, activatedRoute: ActivatedRoute, tabsService: TabsService, router: Router, inventory: InventoryService, route: ActivatedRoute, dashboardDetailService: DashboardDetailService, appState: AppStateService, groupService: GroupService, modal: ModalService, gainsightService: GainsightService)
|
||||||||||||||||||||||||||||||||||||||||||
|
Parameters :
|
| context |
Type : any
|
| dashboard |
Type : ContextDashboard
|
| deviceType |
Type : string
|
| hideAvailability |
Type : boolean
|
Default value : false
|
| isNamedDashboard |
Type : boolean
|
| isReport |
Type : boolean
|
| mo |
Type : ContextDashboardManagedObject
|
| dashboardSaved |
Type : EventEmitter
|
| previewChanged |
Type : EventEmitter
|
| Async cancel |
cancel()
|
|
Returns :
any
|
| Async canDeactivate | ||||||
canDeactivate(omitConfirm)
|
||||||
|
Parameters :
Returns :
Promise<boolean>
|
| Async duplicateWithoutType |
duplicateWithoutType()
|
|
Returns :
Promise<void>
|
| ngAfterContentInit |
ngAfterContentInit()
|
|
Returns :
void
|
| ngOnChanges |
ngOnChanges()
|
|
Returns :
void
|
| ngOnDestroy |
ngOnDestroy()
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| Async revertDashboard | ||||||
revertDashboard(dashboard: ContextDashboard)
|
||||||
|
Parameters :
Returns :
any
|
| Async save |
save()
|
|
Returns :
any
|
| selectTab | ||||||
selectTab(selectedTab: DashboardDetailsTabId)
|
||||||
|
Parameters :
Returns :
void
|
| show | ||||||
show(isEdit: boolean)
|
||||||
|
Parameters :
Returns :
void
|
| updateDashboardHistoryDescription | ||||||
updateDashboardHistoryDescription(dashboardChanges: string[])
|
||||||
|
Parameters :
Returns :
DashboardHistoryDescription
|
| allowTypeDashboard |
Type : AllowTypeDashboard
|
| appearanceSettingsForm |
Type : ReturnType<>
|
| currentContext |
Type : ContextData
|
| currentDashboard |
Type : ContextDashboard
|
| dashboardDetailsForm |
Type : ReturnType<>
|
| deviceTypeValue |
Type : string
|
| displayDeviceTypeValue |
Type : string
|
| generalSettingsForm |
Type : ReturnType<>
|
| icons |
Type : string[]
|
| isCollapsed |
Default value : true
|
| isEdit |
Type : boolean
|
| namePlaceholder |
Type : string
|
| selectedTab |
Type : DashboardDetailsTabId
|
Default value : DashboardDetailsTabId.GENERAL
|
| Readonly TABS |
Type : DashboardDetailsTabs
|
Default value : {
general: {
featureId: DashboardDetailsTabId.GENERAL,
priority: 30,
label: gettext('General')
},
appearance: {
featureId: DashboardDetailsTabId.APPEARANCE,
priority: 20,
label: gettext('Appearance')
},
versionHistory: {
featureId: DashboardDetailsTabId.VERSIONHISTORY,
priority: 10,
label: gettext('Version history')
}
}
|
| Readonly TABS_OUTLET_NAME |
Type : string
|
Default value : 'dashboardTabs'
|
| tabs$ |
Type : Observable<Tab[]>
|
<div
class="collapse c8y-top-drawer"
[collapse]="isCollapsed"
[isAnimated]="true"
>
<div class="p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom">
<span class="h4">{{ 'Dashboard settings' | translate }}</span>
</div>
<div
class="d-flex"
[formGroup]="dashboardDetailsForm"
*ngIf="!isCollapsed"
>
<c8y-tabs-outlet
[tabs]="tabs$ | async"
[outletName]="TABS_OUTLET_NAME"
[orientation]="'vertical'"
class="c8y-top-drawer--tabs"
></c8y-tabs-outlet>
<div class="inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24">
<c8y-tab
*ngIf="(!isNamedDashboard && !hideAvailability) || isReport"
[label]="TABS.general.label"
[icon]="'imac-settings'"
[priority]="100"
[tabsOutlet]="TABS_OUTLET_NAME"
(onSelect)="selectTab(TABS.general.featureId)"
[isActive]="selectedTab === TABS.general.featureId"
></c8y-tab>
<c8y-tab
[label]="TABS.appearance.label"
[priority]="50"
[icon]="'web-design'"
[tabsOutlet]="TABS_OUTLET_NAME"
(onSelect)="selectTab(TABS.appearance.featureId)"
[isActive]="selectedTab === TABS.appearance.featureId"
></c8y-tab>
<c8y-tab
*ngIf="mo?.c8y_DashboardHistory"
[label]="TABS.versionHistory.label"
[icon]="'versions'"
[priority]="10"
[tabsOutlet]="TABS_OUTLET_NAME"
(onSelect)="selectTab(TABS.versionHistory.featureId)"
[isActive]="selectedTab === TABS.versionHistory.featureId"
></c8y-tab>
<ng-container [ngSwitch]="selectedTab">
<c8y-dashboard-general-settings
*ngSwitchCase="TABS.general.featureId"
[isReport]="isReport"
[isNamedDashboard]="isNamedDashboard"
[hideAvailability]="hideAvailability"
[dashboard]="dashboard"
[generalSettingsForm]="generalSettingsForm"
[deviceTypeValue]="deviceTypeValue"
[displayDeviceTypeValue]="displayDeviceTypeValue"
[mo]="mo"
[allowTypeDashboard]="allowTypeDashboard"
[isDevice]="!!context?.c8y_IsDevice"
class="animated fadeIn"
(onDuplicateWithoutType)="duplicateWithoutType()"
></c8y-dashboard-general-settings>
<c8y-dashboard-appearance-settings
*ngSwitchCase="TABS.appearance.featureId"
[dashboard]="dashboard"
[appearanceSettingsForm]="appearanceSettingsForm"
(previewChanged)="previewChanged.emit($event)"
class="animated fadeIn"
></c8y-dashboard-appearance-settings>
<c8y-dashboard-version-history
*ngSwitchCase="TABS.versionHistory.featureId"
[dashboardHistory]="mo.c8y_DashboardHistory"
[isReport]="isReport"
(onRevert)="revertDashboard($event)"
class="animated fadeIn"
></c8y-dashboard-version-history>
</ng-container>
</div>
</div>
<div class="c8y-top-drawer--footer">
<button
class="btn btn-default"
title="{{ 'Cancel' | translate }}"
type="button"
data-cy="dashboard-detail--cancel-dashboard"
(click)="cancel()"
>
{{ 'Cancel' | translate }}
</button>
<button
class="btn btn-primary"
title="{{ 'Save' | translate }}"
type="button"
data-cy="dashboard-detail--save-dashboard"
(click)="save()"
[disabled]="
(dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit
"
>
{{ 'Save' | translate }}
</button>
</div>
</div>