16 changed files with 161 additions and 99 deletions
@ -0,0 +1,51 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2024 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. |
|||
|
|||
--> |
|||
<ng-container [formGroup]="actionButtonWidgetSettingsForm"> |
|||
<div class="tb-form-panel"> |
|||
<div class="tb-form-panel-title" translate>widgets.action-button.behavior</div> |
|||
<div class="tb-form-row"> |
|||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.activated-state-hint' | translate}}" translate>widgets.button-state.activated-state</div> |
|||
<tb-get-value-action-settings fxFlex |
|||
panelTitle="widgets.button-state.activated-state" |
|||
[valueType]="valueType.BOOLEAN" |
|||
stateLabel="widgets.button-state.activated" |
|||
[aliasController]="aliasController" |
|||
[targetDevice]="targetDevice" |
|||
[widgetType]="widgetType" |
|||
formControlName="activatedState"></tb-get-value-action-settings> |
|||
</div> |
|||
<div class="tb-form-row"> |
|||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}" translate>widgets.button-state.disabled-state</div> |
|||
<tb-get-value-action-settings fxFlex |
|||
panelTitle="widgets.button-state.disabled-state" |
|||
[valueType]="valueType.BOOLEAN" |
|||
stateLabel="widgets.button-state.disabled" |
|||
[aliasController]="aliasController" |
|||
[targetDevice]="targetDevice" |
|||
[widgetType]="widgetType" |
|||
formControlName="disabledState"></tb-get-value-action-settings> |
|||
</div> |
|||
</div> |
|||
<div class="tb-form-panel"> |
|||
<div class="tb-form-panel-title" translate>widget-config.appearance</div> |
|||
<tb-widget-button-appearance |
|||
[borderRadius]="borderRadius" |
|||
formControlName="appearance"> |
|||
</tb-widget-button-appearance> |
|||
</div> |
|||
</ng-container> |
|||
@ -0,0 +1,70 @@ |
|||
///
|
|||
/// Copyright © 2016-2024 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.
|
|||
///
|
|||
|
|||
import { Component } from '@angular/core'; |
|||
import { TargetDevice, WidgetSettings, WidgetSettingsComponent, widgetType } from '@shared/models/widget.models'; |
|||
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; |
|||
import { Store } from '@ngrx/store'; |
|||
import { AppState } from '@core/core.state'; |
|||
import { ValueType } from '@shared/models/constants'; |
|||
import { getTargetDeviceFromDatasources } from '@shared/models/widget-settings.models'; |
|||
import { actionButtonDefaultSettings } from '@home/components/widget/lib/button/action-button-widget.models'; |
|||
|
|||
@Component({ |
|||
selector: 'tb-action-button-widget-settings', |
|||
templateUrl: './action-button-widget-settings.component.html', |
|||
styleUrls: ['./../widget-settings.scss'] |
|||
}) |
|||
export class ActionButtonWidgetSettingsComponent extends WidgetSettingsComponent { |
|||
|
|||
get targetDevice(): TargetDevice { |
|||
const datasources = this.widgetConfig?.config?.datasources; |
|||
return getTargetDeviceFromDatasources(datasources); |
|||
} |
|||
|
|||
get widgetType(): widgetType { |
|||
return this.widgetConfig?.widgetType; |
|||
} |
|||
get borderRadius(): string { |
|||
return this.widgetConfig?.config?.borderRadius; |
|||
} |
|||
|
|||
valueType = ValueType; |
|||
|
|||
actionButtonWidgetSettingsForm: UntypedFormGroup; |
|||
|
|||
constructor(protected store: Store<AppState>, |
|||
private fb: UntypedFormBuilder) { |
|||
super(store); |
|||
} |
|||
|
|||
protected settingsForm(): UntypedFormGroup { |
|||
return this.actionButtonWidgetSettingsForm; |
|||
} |
|||
|
|||
protected defaultSettings(): WidgetSettings { |
|||
return {...actionButtonDefaultSettings}; |
|||
} |
|||
|
|||
protected onSettingsSet(settings: WidgetSettings) { |
|||
this.actionButtonWidgetSettingsForm = this.fb.group({ |
|||
activatedState: [settings.activatedState, []], |
|||
disabledState: [settings.disabledState, []], |
|||
|
|||
appearance: [settings.appearance, []] |
|||
}); |
|||
} |
|||
} |
|||
Loading…
Reference in new issue