Web SDK documentation
  1. Components
  2. SupportOutletComponent

File

core/docs/support-outlet/support-outlet.component.ts

Implements

OnInit

Metadata

selector c8y-support-outlet
templateUrl ./support-outlet.component.html

Index

Properties
Methods

Constructor

constructor(ui: AppStateService, optionsService: OptionsService, modalService: ModalService, translateService: TranslateService, tenantService: TenantService, alertService: AlertService, userService: UserService, headerService: HeaderService)
Parameters :
Name Type Optional
ui AppStateService No
optionsService OptionsService No
modalService ModalService No
translateService TranslateService No
tenantService TenantService No
alertService AlertService No
userService UserService No
headerService HeaderService No

Methods

Async activateSupportAccess
activateSupportAccess()
Returns : any
Async deactivateSupportAccess
deactivateSupportAccess()
Returns : any
ngOnInit
ngOnInit()
Returns : void

Properties

drawerOpen$
Type : Observable<boolean>
isCollapsed
Type : boolean
isCollapsible
Type : boolean
PRODUCT_EXPERIENCE
Default value : PRODUCT_EXPERIENCE_CORE_SHARED
supportUrl
Type : string | boolean
supportUserEnabled$
Type : Observable<boolean>
tabIndex$
Type : Observable<"0" | "-1">
textClass
Type : string
Public ui
Type : AppStateService
userSupportAvailable
Type : boolean 
<button
  class="c8y-right-drawer__link sticky-top"
  [tabindex]="tabIndex$ | async"
  type="button"
  (click)="isCollapsed = !isCollapsed"
  *ngIf="isCollapsible"
>
  <i c8yIcon="c8y-c8y-support"></i>
  <span class="text-bold">{{ 'Support' | translate }}</span>
  <i
    class="m-l-auto"
    c8yIcon="angle-up"
    [ngClass]="{ 'icon-rotate-180': isCollapsed }"
  ></i>
</button>
<div
  class="collapse"
  id="collapseSupport"
  [collapse]="isCollapsed"
  [isAnimated]="true"
>
  <button
    class="c8y-right-drawer__link"
    title="{{ 'Activate support access' | translate }}"
    [tabindex]="tabIndex$ | async"
    *ngIf="!(supportUserEnabled$ | async) && userSupportAvailable"
    (click)="activateSupportAccess()"
    c8yProductExperience
    [actionName]="PRODUCT_EXPERIENCE.QUICK_LINKS.EVENTS.QUICK_LINK_RIGHT_DRAWER"
  >
    <i
      c8yIcon="c8y-c8y-support"
      *ngIf="!isCollapsible"
    ></i>
    <span
      [class]="textClass"
      title="{{ 'Activate support access' | translate }}"
    >
      {{ 'Activate support access' | translate }}
    </span>
  </button>
  <button
    class="c8y-right-drawer__link"
    title="{{ 'Deactivate support access' | translate }}"
    [tabindex]="tabIndex$ | async"
    *ngIf="(supportUserEnabled$ | async) && userSupportAvailable"
    (click)="deactivateSupportAccess()"
    c8yProductExperience
    [actionName]="PRODUCT_EXPERIENCE.QUICK_LINKS.EVENTS.QUICK_LINK_RIGHT_DRAWER"
  >
    <i
      c8yIcon="c8y-c8y-support"
      *ngIf="!isCollapsible"
    ></i>
    <span
      [class]="textClass"
      title="{{ 'Deactivate support access' | translate }}"
    >
      {{ 'Deactivate support access' | translate }}
    </span>
  </button>
  <a
    class="c8y-right-drawer__link"
    [ngClass]="{'separator-top': !isCollapsible}"
    title="{{ 'Request support' | translate }}"
    [tabindex]="tabIndex$ | async"
    role="button"
    target="_blank"
    *ngIf="supportUrl"
    rel="noopener noreferrer"
    [href]="supportUrl"
    c8yProductExperience
    [actionName]="PRODUCT_EXPERIENCE.QUICK_LINKS.EVENTS.QUICK_LINK_RIGHT_DRAWER"
  >
    <i
      c8yIcon="c8y-c8y-support"
      *ngIf="!isCollapsible"
    ></i>
    <span
      [class]="textClass"
      title="{{ 'Request support' | translate }}"
    >
      {{ 'Request support' | translate }}
    </span>
  </a>
</div>

results matching ""

    No results matching ""