File

context-dashboard/dashboard-detail.component.ts

Implements

OnInit OnChanges OnDestroy

Metadata

selector	`c8y-dashboard-detail`
templateUrl	`./dashboard-detail.component.html`

Index

Constructor

constructor(contextDashboardService: ContextDashboardService, translateService: TranslateService, contextRoute: ContextRouteService, activatedRoute: ActivatedRoute, tabsService: TabsService, router: Router, inventory: InventoryService, route: ActivatedRoute, dashboardDetailService: DashboardDetailService, appState: AppStateService, optionsService: OptionsService, groupService: GroupService, modal: ModalService, gainsightService: GainsightService)

Parameters :

Name	Type	Optional
contextDashboardService	`ContextDashboardService`	No
translateService	`TranslateService`	No
contextRoute	`ContextRouteService`	No
activatedRoute	`ActivatedRoute`	No
tabsService	`TabsService`	No
router	`Router`	No
inventory	`InventoryService`	No
route	`ActivatedRoute`	No
dashboardDetailService	`DashboardDetailService`	No
appState	`AppStateService`	No
optionsService	`OptionsService`	No
groupService	`GroupService`	No
modal	`ModalService`	No
gainsightService	`GainsightService`	No

Inputs

context

Type : any

dashboard

Type : ContextDashboard

deviceType

Type : string

hideAvailability

Type : boolean

Default value : false

isNamedDashboard

Type : boolean

isReport

Type : boolean

Type : ContextDashboardManagedObject

Outputs

dashboardSaved

Type : EventEmitter

previewChanged

Type : EventEmitter

Methods

Async cancel

cancel()

Returns : any

Async canDeactivate

canDeactivate(omitConfirm)

Parameters :

Name	Optional	Default value
omitConfirm	No	`false`

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 :

Name	Type	Optional
dashboard	`ContextDashboard`	No

Returns : any

Async save

save()

Returns : any

selectTab

selectTab(selectedTab: DashboardDetailsTabId)

Parameters :

Name	Type	Optional
selectedTab	`DashboardDetailsTabId`	No

Returns : void

show

show(isEdit: boolean)

Parameters :

Name	Type	Optional
isEdit	`boolean`	No

Returns : void

updateDashboardHistoryDescription

updateDashboardHistoryDescription(dashboardChanges: string[])

Parameters :

Name	Type	Optional
dashboardChanges	`string[]`	No

Returns : DashboardHistoryDescription

Properties

allowTypeDashboard

Type : boolean

appearanceSettingsForm

Type : ReturnType<>

currentContext

Type : ContextData

currentDashboard

Type : ContextDashboard

dashboardDetailsForm

Type : ReturnType<>

deviceTypeValue

Type : string

displayDeviceTypeValue

Type : string

generalSettingsForm

Type : ReturnType<>

Readonly HIDE_TYPE_DASHBOARD_FOR_ASSETS

Default value : 'hideTypeDashboardForAssets'

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>

File

Implements

Metadata

Index

Properties

Methods

Inputs

Outputs

Constructor

Inputs

Outputs

Methods

Properties

results matching ""

No results matching ""