451 lines
24 KiB
HTML
451 lines
24 KiB
HTML
<!--
|
|
|
|
Copyright © 2016-2021 The Thingsboard Authors
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
|
|
-->
|
|
<mat-tab-group [ngClass]="{'tb-headless': (widgetType === widgetTypes.static && !displayAdvanced())}"
|
|
class="tb-widget-config tb-absolute-fill" [(selectedIndex)]="selectedTab">
|
|
<mat-tab label="{{ 'widget-config.data' | translate }}" [fxShow]="widgetType !== widgetTypes.static">
|
|
<div [formGroup]="dataSettings" class="mat-content mat-padding" fxLayout="column" fxLayoutGap="8px">
|
|
<div *ngIf="widgetType === widgetTypes.timeseries || widgetType === widgetTypes.alarm" fxFlex="100"
|
|
fxLayout.xs="column" fxLayoutGap="8px" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center">
|
|
<div fxLayout="column" fxLayoutGap="8px" fxFlex.gt-xs>
|
|
<mat-checkbox formControlName="useDashboardTimewindow">
|
|
{{ 'widget-config.use-dashboard-timewindow' | translate }}
|
|
</mat-checkbox>
|
|
<mat-checkbox formControlName="displayTimewindow">
|
|
{{ 'widget-config.display-timewindow' | translate }}
|
|
</mat-checkbox>
|
|
</div>
|
|
<section fxLayout="row" fxLayoutAlign="start center" fxLayout.lt-lg="column" fxLayoutAlign.lt-lg="center start"
|
|
fxFlex.gt-xs style="margin-bottom: 16px;">
|
|
<span [ngClass]="{'tb-disabled-label': dataSettings.get('useDashboardTimewindow').value}" translate
|
|
style="padding-right: 8px;">widget-config.timewindow</span>
|
|
<tb-timewindow asButton="true"
|
|
isEdit="true"
|
|
aggregation="{{ widgetType === widgetTypes.timeseries }}"
|
|
fxFlex formControlName="timewindow"></tb-timewindow>
|
|
</section>
|
|
</div>
|
|
<div *ngIf="widgetType === widgetTypes.alarm" fxLayout="column" fxLayoutAlign="center">
|
|
<div fxLayout="column" fxLayoutAlign="center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="start center"
|
|
fxLayoutGap="8px">
|
|
<mat-form-field fxFlex class="mat-block" floatLabel="always">
|
|
<mat-label translate>alarm.alarm-status-list</mat-label>
|
|
<mat-select formControlName="alarmStatusList" multiple
|
|
placeholder="{{ !dataSettings.get('alarmStatusList').value?.length ? ('alarm.any-status' | translate) : '' }}">
|
|
<mat-option *ngFor="let searchStatus of alarmSearchStatuses" [value]="searchStatus">
|
|
{{ alarmSearchStatusTranslationMap.get(searchStatus) | translate }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex class="mat-block" floatLabel="always">
|
|
<mat-label translate>alarm.alarm-severity-list</mat-label>
|
|
<mat-select formControlName="alarmSeverityList" multiple
|
|
placeholder="{{ !dataSettings.get('alarmSeverityList').value?.length ? ('alarm.any-severity' | translate) : '' }}">
|
|
<mat-option *ngFor="let alarmSeverity of alarmSeverities" [value]="alarmSeverity">
|
|
{{ alarmSeverityTranslationMap.get(alarmSeverityEnum[alarmSeverity]) | translate }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
<div fxLayout="column" fxLayoutAlign="center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="start center"
|
|
fxLayoutGap="8px">
|
|
<mat-form-field fxFlex class="mat-block" floatLabel="always">
|
|
<mat-label translate>alarm.alarm-type-list</mat-label>
|
|
<mat-chip-list #alarmTypeChipList formControlName="alarmTypeList">
|
|
<mat-chip *ngFor="let type of alarmTypeList()" [selectable]="true"
|
|
[removable]="true" (removed)="removeAlarmType(type)">
|
|
{{type}}
|
|
<mat-icon matChipRemove>cancel</mat-icon>
|
|
</mat-chip>
|
|
<input placeholder="{{ !dataSettings.get('alarmTypeList').value?.length ? ('alarm.any-type' | translate) : '' }}"
|
|
[matChipInputFor]="alarmTypeChipList"
|
|
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
|
[matChipInputAddOnBlur]="true"
|
|
(matChipInputTokenEnd)="addAlarmType($event)">
|
|
</mat-chip-list>
|
|
</mat-form-field>
|
|
<mat-checkbox fxFlex formControlName="searchPropagatedAlarms">
|
|
{{ 'alarm.search-propagated-alarms' | translate }}
|
|
</mat-checkbox>
|
|
</div>
|
|
</div>
|
|
<mat-expansion-panel class="tb-datasources" *ngIf="widgetType !== widgetTypes.rpc &&
|
|
widgetType !== widgetTypes.alarm &&
|
|
widgetType !== widgetTypes.static &&
|
|
modelValue?.isDataEnabled" [expanded]="true">
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title fxLayout="column">
|
|
<div class="tb-panel-title" translate>widget-config.datasources</div>
|
|
<div *ngIf="modelValue?.typeParameters && modelValue?.typeParameters.maxDatasources > -1"
|
|
class="tb-panel-hint">{{ 'widget-config.maximum-datasources' | translate:{count: modelValue?.typeParameters.maxDatasources} }}</div>
|
|
</mat-panel-title>
|
|
</mat-expansion-panel-header>
|
|
<div *ngIf="datasourcesFormArray().length === 0; else datasourcesTemplate">
|
|
<span translate fxLayoutAlign="center center"
|
|
class="tb-prompt">datasource.add-datasource-prompt</span>
|
|
</div>
|
|
<ng-template #datasourcesTemplate>
|
|
<div fxFlex fxLayout="row" fxLayoutAlign="start center">
|
|
<span style="width: 60px;"></span>
|
|
<div fxFlex fxLayout="row" fxLayoutAlign="start center"
|
|
style="padding: 0 0 0 10px; margin: 5px;">
|
|
<span translate style="min-width: 120px;">widget-config.datasource-type</span>
|
|
<span fxHide fxShow.gt-sm translate fxFlex
|
|
style="padding-left: 10px;">widget-config.datasource-parameters</span>
|
|
<span style="min-width: 40px;"></span>
|
|
</div>
|
|
</div>
|
|
<div style="overflow: auto; padding-bottom: 15px;">
|
|
<mat-list dndDropzone dndEffectAllowed="move"
|
|
(dndDrop)="onDatasourceDrop($event)"
|
|
[dndDisableIf]="disabled" formArrayName="datasources">
|
|
<mat-list-item dndPlaceholderRef
|
|
class="dndPlaceholder">
|
|
</mat-list-item>
|
|
<mat-list-item *ngFor="let datasourceControl of datasourcesFormArray().controls; let $index = index;"
|
|
[dndDraggable]="datasourceControl.value"
|
|
(dndMoved)="dndDatasourceMoved($index)"
|
|
[dndDisableIf]="disabled"
|
|
dndEffectAllowed="move">
|
|
<div fxFlex fxLayout="row" fxLayoutAlign="start center">
|
|
<div style="width: 60px;">
|
|
<button *ngIf="!disabled" mat-icon-button color="primary"
|
|
class="handle"
|
|
style="min-width: 40px; margin: 0"
|
|
dndHandle
|
|
matTooltip="{{ 'action.drag' | translate }}"
|
|
matTooltipPosition="above">
|
|
<mat-icon>drag_handle</mat-icon>
|
|
</button>
|
|
<span>{{$index + 1}}.</span>
|
|
</div>
|
|
<div class="mat-elevation-z4" fxFlex
|
|
fxLayout="row"
|
|
fxLayoutAlign="start center"
|
|
style="padding: 0 0 0 10px; margin: 5px;">
|
|
<section fxFlex
|
|
fxLayout="column"
|
|
fxLayoutAlign="center"
|
|
fxLayout.gt-sm="row"
|
|
fxLayoutAlign.gt-sm="start center">
|
|
<mat-form-field class="tb-datasource-type">
|
|
<mat-select [formControl]="datasourceControl.get('type')">
|
|
<mat-option *ngFor="let datasourceType of datasourceTypes" [value]="datasourceType">
|
|
{{ datasourceTypesTranslations.get(datasourceType) | translate }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
<section fxLayout="column" class="tb-datasource" [ngSwitch]="datasourceControl.get('type').value">
|
|
<ng-template [ngSwitchCase]="datasourceType.function">
|
|
<mat-form-field floatLabel="always"
|
|
class="tb-datasource-name" style="min-width: 200px;">
|
|
<mat-label></mat-label>
|
|
<input matInput
|
|
placeholder="{{ 'datasource.label' | translate }}"
|
|
[formControl]="datasourceControl.get('name')">
|
|
</mat-form-field>
|
|
</ng-template>
|
|
<ng-template [ngSwitchCase]="datasourceControl.get('type').value === datasourceType.entity ||
|
|
datasourceControl.get('type').value === datasourceType.entityCount ? datasourceControl.get('type').value : ''">
|
|
<tb-entity-alias-select
|
|
[showLabel]="true"
|
|
[tbRequired]="true"
|
|
[aliasController]="aliasController"
|
|
[formControl]="datasourceControl.get('entityAliasId')"
|
|
[callbacks]="widgetConfigCallbacks">
|
|
</tb-entity-alias-select>
|
|
<tb-filter-select
|
|
[showLabel]="true"
|
|
[aliasController]="aliasController"
|
|
[formControl]="datasourceControl.get('filterId')"
|
|
[callbacks]="widgetConfigCallbacks">
|
|
</tb-filter-select>
|
|
<mat-form-field *ngIf="datasourceControl.get('type').value === datasourceType.entityCount"
|
|
floatLabel="always"
|
|
class="tb-datasource-name no-border-top" style="min-width: 200px;">
|
|
<mat-label></mat-label>
|
|
<input matInput
|
|
placeholder="{{ 'datasource.label' | translate }}"
|
|
[formControl]="datasourceControl.get('name')">
|
|
</mat-form-field>
|
|
</ng-template>
|
|
</section>
|
|
<tb-data-keys class="tb-data-keys" fxFlex
|
|
[widgetType]="widgetType"
|
|
[datasourceType]="datasourceControl.get('type').value"
|
|
[maxDataKeys]="modelValue?.typeParameters?.maxDataKeys"
|
|
[optDataKeys]="modelValue?.typeParameters?.dataKeysOptional"
|
|
[aliasController]="aliasController"
|
|
[datakeySettingsSchema]="modelValue?.dataKeySettingsSchema"
|
|
[callbacks]="widgetConfigCallbacks"
|
|
[entityAliasId]="datasourceControl.get('entityAliasId').value"
|
|
[formControl]="datasourceControl.get('dataKeys')">
|
|
</tb-data-keys>
|
|
</section>
|
|
<button [disabled]="isLoading$ | async"
|
|
type="button"
|
|
mat-icon-button color="primary"
|
|
style="min-width: 40px;"
|
|
(click)="removeDatasource($index)"
|
|
matTooltip="{{ 'widget-config.remove-datasource' | translate }}"
|
|
matTooltipPosition="above">
|
|
<mat-icon>close</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</mat-list-item>
|
|
</mat-list>
|
|
</div>
|
|
</ng-template>
|
|
<div fxFlex fxLayout="row" fxLayoutAlign="start center">
|
|
<button [disabled]="isLoading$ | async"
|
|
type="button"
|
|
mat-raised-button color="primary"
|
|
[fxShow]="modelValue?.typeParameters &&
|
|
(modelValue?.typeParameters.maxDatasources == -1 || datasourcesFormArray().controls.length < modelValue?.typeParameters.maxDatasources)"
|
|
(click)="addDatasource()"
|
|
matTooltip="{{ 'widget-config.add-datasource' | translate }}"
|
|
matTooltipPosition="above">
|
|
<mat-icon>add</mat-icon>
|
|
<span translate>action.add</span>
|
|
</button>
|
|
</div>
|
|
</mat-expansion-panel>
|
|
<mat-expansion-panel class="tb-datasources" *ngIf="widgetType === widgetTypes.rpc &&
|
|
modelValue?.isDataEnabled" [expanded]="true">
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title>
|
|
{{ 'widget-config.target-device' | translate }}
|
|
</mat-panel-title>
|
|
</mat-expansion-panel-header>
|
|
<div [formGroup]="targetDeviceSettings" style="padding: 0 5px;">
|
|
<tb-entity-alias-select fxFlex
|
|
[tbRequired]="!widgetEditMode"
|
|
[aliasController]="aliasController"
|
|
[allowedEntityTypes]="[entityTypes.DEVICE]"
|
|
[callbacks]="widgetConfigCallbacks"
|
|
formControlName="targetDeviceAliasId">
|
|
</tb-entity-alias-select>
|
|
</div>
|
|
</mat-expansion-panel>
|
|
<mat-expansion-panel class="tb-datasources" *ngIf="widgetType === widgetTypes.alarm &&
|
|
modelValue?.isDataEnabled" [expanded]="true">
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title>
|
|
{{ 'widget-config.alarm-source' | translate }}
|
|
</mat-panel-title>
|
|
</mat-expansion-panel-header>
|
|
<div [formGroup]="alarmSourceSettings" style="padding: 0 5px;">
|
|
<section fxFlex
|
|
fxLayout="column"
|
|
fxLayoutAlign="center"
|
|
fxLayout.gt-sm="row"
|
|
fxLayoutAlign.gt-sm="start center">
|
|
<mat-form-field class="tb-datasource-type">
|
|
<mat-select formControlName="type">
|
|
<mat-option *ngFor="let datasourceType of datasourceTypes" [value]="datasourceType">
|
|
{{ datasourceTypesTranslations.get(datasourceType) | translate }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
<section class="tb-datasource" [ngSwitch]="alarmSourceSettings.get('type').value">
|
|
<ng-template [ngSwitchCase]="datasourceType.entity">
|
|
<tb-entity-alias-select
|
|
[showLabel]="true"
|
|
[tbRequired]="alarmSourceSettings.get('type').value === datasourceType.entity"
|
|
[aliasController]="aliasController"
|
|
formControlName="entityAliasId"
|
|
[callbacks]="widgetConfigCallbacks">
|
|
</tb-entity-alias-select>
|
|
<tb-filter-select
|
|
[showLabel]="true"
|
|
[aliasController]="aliasController"
|
|
formControlName="filterId"
|
|
[callbacks]="widgetConfigCallbacks">
|
|
</tb-filter-select>
|
|
</ng-template>
|
|
</section>
|
|
<tb-data-keys class="tb-data-keys" fxFlex
|
|
[widgetType]="widgetType"
|
|
[datasourceType]="alarmSourceSettings.get('type').value"
|
|
[aliasController]="aliasController"
|
|
[datakeySettingsSchema]="modelValue?.dataKeySettingsSchema"
|
|
[callbacks]="widgetConfigCallbacks"
|
|
[entityAliasId]="alarmSourceSettings.get('entityAliasId').value"
|
|
formControlName="dataKeys">
|
|
</tb-data-keys>
|
|
</section>
|
|
</div>
|
|
</mat-expansion-panel>
|
|
</div>
|
|
</mat-tab>
|
|
<mat-tab label="{{ 'widget-config.settings' | translate }}">
|
|
<div class="mat-content mat-padding" fxLayout="column" fxLayoutGap="8px">
|
|
<div [formGroup]="widgetSettings" fxLayout="column" fxLayoutGap="8px">
|
|
<span translate>widget-config.general-settings</span>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center">
|
|
<div fxLayout="column" fxLayoutAlign="center" fxFlex.sm="40%" fxFlex.gt-sm="30%">
|
|
<mat-form-field fxFlex class="mat-block">
|
|
<mat-label translate>widget-config.title</mat-label>
|
|
<input matInput formControlName="title">
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.title-tooltip</mat-label>
|
|
<input matInput formControlName="titleTooltip">
|
|
</mat-form-field>
|
|
</div>
|
|
<div fxFlex [fxShow]="widgetSettings.get('showTitle').value">
|
|
<tb-json-object-edit
|
|
[editorStyle]="{minHeight: '100px'}"
|
|
required
|
|
label="{{ 'widget-config.title-style' | translate }}"
|
|
formControlName="titleStyle"
|
|
></tb-json-object-edit>
|
|
</div>
|
|
</div>
|
|
<div fxLayout="column" fxLayoutAlign="center" fxLayout.gt-md="row" fxLayoutAlign.gt-md="start center" fxFlex="100%"
|
|
fxLayoutGap="8px">
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px" fxFlex.gt-md>
|
|
<mat-checkbox fxFlex formControlName="showTitleIcon">
|
|
{{ 'widget-config.display-icon' | translate }}
|
|
</mat-checkbox>
|
|
<tb-material-icon-select fxFlex
|
|
formControlName="titleIcon">
|
|
</tb-material-icon-select>
|
|
</div>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px" fxFlex.gt-md>
|
|
<tb-color-input fxFlex
|
|
label="{{'widget-config.icon-color' | translate}}"
|
|
icon="format_color_fill"
|
|
openOnInput
|
|
formControlName="iconColor">
|
|
</tb-color-input>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.icon-size</mat-label>
|
|
<input matInput formControlName="iconSize">
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px">
|
|
<div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="8px" fxFlex.sm="40%" fxFlex.gt-sm="30%">
|
|
<mat-checkbox formControlName="showTitle">
|
|
{{ 'widget-config.display-title' | translate }}
|
|
</mat-checkbox>
|
|
<mat-checkbox formControlName="dropShadow">
|
|
{{ 'widget-config.drop-shadow' | translate }}
|
|
</mat-checkbox>
|
|
<mat-checkbox formControlName="enableFullscreen">
|
|
{{ 'widget-config.enable-fullscreen' | translate }}
|
|
</mat-checkbox>
|
|
</div>
|
|
<div fxFlex>
|
|
<tb-json-object-edit
|
|
[editorStyle]="{minHeight: '100px'}"
|
|
required
|
|
label="{{ 'widget-config.widget-style' | translate }}"
|
|
formControlName="widgetStyle"
|
|
></tb-json-object-edit>
|
|
</div>
|
|
</div>
|
|
<div fxLayout="column" fxLayoutAlign="center" fxLayout.gt-md="row" fxLayoutAlign.gt-md="start center"
|
|
fxFlex="100%" fxLayoutGap="8px">
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px" fxFlex.gt-md>
|
|
<tb-color-input fxFlex
|
|
label="{{'widget-config.background-color' | translate}}"
|
|
icon="format_color_fill"
|
|
openOnInput
|
|
formControlName="backgroundColor">
|
|
</tb-color-input>
|
|
<tb-color-input fxFlex
|
|
label="{{'widget-config.text-color' | translate}}"
|
|
icon="format_color_fill"
|
|
openOnInput
|
|
formControlName="color">
|
|
</tb-color-input>
|
|
</div>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px" fxFlex.gt-md>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.padding</mat-label>
|
|
<input matInput formControlName="padding">
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.margin</mat-label>
|
|
<input matInput formControlName="margin">
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px">
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.units</mat-label>
|
|
<input matInput formControlName="units">
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.decimals</mat-label>
|
|
<input matInput formControlName="decimals" type="number" min="0" max="15" step="1">
|
|
</mat-form-field>
|
|
</div>
|
|
<div [fxShow]="widgetType === widgetTypes.timeseries || widgetType === widgetTypes.latest"
|
|
fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px" fxFlex="100%">
|
|
<mat-checkbox fxFlex.gt-xs formControlName="showLegend">
|
|
{{ 'widget-config.display-legend' | translate }}
|
|
</mat-checkbox>
|
|
<section fxFlex.gt-xs fxLayout="row" fxLayoutAlign="start center" style="margin-bottom: 16px;">
|
|
<tb-legend-config formControlName="legendConfig">
|
|
</tb-legend-config>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<div [formGroup]="layoutSettings" fxLayout="column" fxLayoutGap="8px">
|
|
<span translate>widget-config.mobile-mode-settings</span>
|
|
<div fxLayout.xs="column" fxLayoutAlign.xs="center" fxLayout="row" fxLayoutAlign="start center"
|
|
fxLayoutGap="8px">
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.order</mat-label>
|
|
<input matInput formControlName="mobileOrder" type="number" step="1">
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex>
|
|
<mat-label translate>widget-config.height</mat-label>
|
|
<input matInput formControlName="mobileHeight" type="number" min="1" max="10" step="1">
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mat-tab>
|
|
<mat-tab *ngIf="displayAdvanced()" label="{{ 'widget-config.advanced' | translate }}">
|
|
<div [formGroup]="advancedSettings" class="mat-content mat-padding tb-advanced-widget-config"
|
|
fxLayout="column">
|
|
<tb-json-form
|
|
formControlName="settings">
|
|
</tb-json-form>
|
|
</div>
|
|
</mat-tab>
|
|
<mat-tab label="{{ 'widget-config.actions' | translate }}" [formGroup]="actionsSettings">
|
|
<tb-manage-widget-actions
|
|
[callbacks]="widgetConfigCallbacks"
|
|
[modelValue] = "modelValue"
|
|
formControlName="actionsData">
|
|
</tb-manage-widget-actions>
|
|
</mat-tab>
|
|
</mat-tab-group>
|