UI: Add entities hierarchy widget settings form
This commit is contained in:
Igor Kulikov
parent
b4b4015061
commit
63da3e048f
File diff suppressed because one or more lines are too long
@ -0,0 +1,74 @@
|
||||
<!--
|
||||
|
||||
Copyright © 2016-2022 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.
|
||||
|
||||
-->
|
||||
<section class="tb-widget-settings" [formGroup]="entitiesHierarchyWidgetSettingsForm" fxLayout="column">
|
||||
<fieldset class="fields-group">
|
||||
<legend class="group-title" translate>widgets.entities-hierarchy.hierarchy-data-settings</legend>
|
||||
<tb-js-func formControlName="nodeRelationQueryFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.relations-query-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_relation_query_fn">
|
||||
</tb-js-func>
|
||||
<tb-js-func formControlName="nodeHasChildrenFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.has-children-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_has_children_fn">
|
||||
</tb-js-func>
|
||||
</fieldset>
|
||||
<fieldset class="fields-group">
|
||||
<legend class="group-title" translate>widgets.entities-hierarchy.node-state-settings</legend>
|
||||
<tb-js-func formControlName="nodeOpenedFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.node-opened-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_opened_fn">
|
||||
</tb-js-func>
|
||||
<tb-js-func formControlName="nodeDisabledFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.node-disabled-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_disabled_fn">
|
||||
</tb-js-func>
|
||||
</fieldset>
|
||||
<fieldset class="fields-group">
|
||||
<legend class="group-title" translate>widgets.entities-hierarchy.display-settings</legend>
|
||||
<tb-js-func formControlName="nodeIconFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.node-icon-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_icon_fn">
|
||||
</tb-js-func>
|
||||
<tb-js-func formControlName="nodeTextFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.node-text-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/node_text_fn">
|
||||
</tb-js-func>
|
||||
</fieldset>
|
||||
<fieldset class="fields-group">
|
||||
<legend class="group-title" translate>widgets.entities-hierarchy.sort-settings</legend>
|
||||
<tb-js-func formControlName="nodesSortFunction"
|
||||
[globalVariables]="functionScopeVariables"
|
||||
[functionArgs]="['nodeCtx1', 'nodeCtx2']"
|
||||
functionTitle="{{ 'widgets.entities-hierarchy.nodes-sort-function' | translate }}"
|
||||
helpId="widget/lib/entities_hierarchy/nodes_sort_fn">
|
||||
</tb-js-func>
|
||||
</fieldset>
|
||||
</section>
|
||||
|
||||
@ -0,0 +1,64 @@
|
||||
///
|
||||
/// Copyright © 2016-2022 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 { WidgetSettings, WidgetSettingsComponent } from '@shared/models/widget.models';
|
||||
import { FormBuilder, FormGroup } from '@angular/forms';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { AppState } from '@core/core.state';
|
||||
|
||||
@Component({
|
||||
selector: 'tb-entities-hierarchy-widget-settings',
|
||||
templateUrl: './entities-hierarchy-widget-settings.component.html',
|
||||
styleUrls: ['./widget-settings.scss']
|
||||
})
|
||||
export class EntitiesHierarchyWidgetSettingsComponent extends WidgetSettingsComponent {
|
||||
|
||||
entitiesHierarchyWidgetSettingsForm: FormGroup;
|
||||
|
||||
constructor(protected store: Store<AppState>,
|
||||
private fb: FormBuilder) {
|
||||
super(store);
|
||||
}
|
||||
|
||||
protected settingsForm(): FormGroup {
|
||||
return this.entitiesHierarchyWidgetSettingsForm;
|
||||
}
|
||||
|
||||
protected defaultSettings(): WidgetSettings {
|
||||
return {
|
||||
nodeRelationQueryFunction: '',
|
||||
nodeHasChildrenFunction: '',
|
||||
nodeOpenedFunction: '',
|
||||
nodeDisabledFunction: '',
|
||||
nodeIconFunction: '',
|
||||
nodeTextFunction: '',
|
||||
nodesSortFunction: '',
|
||||
};
|
||||
}
|
||||
|
||||
protected onSettingsSet(settings: WidgetSettings) {
|
||||
this.entitiesHierarchyWidgetSettingsForm = this.fb.group({
|
||||
nodeRelationQueryFunction: [settings.nodeRelationQueryFunction, []],
|
||||
nodeHasChildrenFunction: [settings.nodeHasChildrenFunction, []],
|
||||
nodeOpenedFunction: [settings.nodeOpenedFunction, []],
|
||||
nodeDisabledFunction: [settings.nodeDisabledFunction, []],
|
||||
nodeIconFunction: [settings.nodeIconFunction, []],
|
||||
nodeTextFunction: [settings.nodeTextFunction, []],
|
||||
nodesSortFunction: [settings.nodesSortFunction, []]
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -41,6 +41,9 @@ import {
|
||||
import {
|
||||
DashboardStateWidgetSettingsComponent
|
||||
} from '@home/components/widget/lib/settings/dashboard-state-widget-settings.component';
|
||||
import {
|
||||
EntitiesHierarchyWidgetSettingsComponent
|
||||
} from '@home/components/widget/lib/settings/entities-hierarchy-widget-settings.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
@ -53,7 +56,8 @@ import {
|
||||
LabelWidgetLabelComponent,
|
||||
LabelWidgetSettingsComponent,
|
||||
SimpleCardWidgetSettingsComponent,
|
||||
DashboardStateWidgetSettingsComponent
|
||||
DashboardStateWidgetSettingsComponent,
|
||||
EntitiesHierarchyWidgetSettingsComponent
|
||||
],
|
||||
imports: [
|
||||
CommonModule,
|
||||
@ -70,7 +74,8 @@ import {
|
||||
LabelWidgetLabelComponent,
|
||||
LabelWidgetSettingsComponent,
|
||||
SimpleCardWidgetSettingsComponent,
|
||||
DashboardStateWidgetSettingsComponent
|
||||
DashboardStateWidgetSettingsComponent,
|
||||
EntitiesHierarchyWidgetSettingsComponent
|
||||
]
|
||||
})
|
||||
export class WidgetSettingsModule {
|
||||
@ -84,5 +89,6 @@ export const widgetSettingsComponentsMap: {[key: string]: Type<IWidgetSettingsCo
|
||||
'tb-markdown-widget-settings': MarkdownWidgetSettingsComponent,
|
||||
'tb-label-widget-settings': LabelWidgetSettingsComponent,
|
||||
'tb-simple-card-widget-settings': SimpleCardWidgetSettingsComponent,
|
||||
'tb-dashboard-state-widget-settings': DashboardStateWidgetSettingsComponent
|
||||
'tb-dashboard-state-widget-settings': DashboardStateWidgetSettingsComponent,
|
||||
'tb-entities-hierarchy-widget-settings': EntitiesHierarchyWidgetSettingsComponent
|
||||
};
|
||||
|
||||
@ -3247,6 +3247,19 @@
|
||||
"Ok": "Ok"
|
||||
}
|
||||
},
|
||||
"entities-hierarchy": {
|
||||
"hierarchy-data-settings": "Hierarchy data settings",
|
||||
"relations-query-function": "Node relations query function",
|
||||
"has-children-function": "Node has children function",
|
||||
"node-state-settings": "Node state settings",
|
||||
"node-opened-function": "Default node opened function",
|
||||
"node-disabled-function": "Node disabled function",
|
||||
"display-settings": "Display settings",
|
||||
"node-icon-function": "Node icon function",
|
||||
"node-text-function": "Node text function",
|
||||
"sort-settings": "Sort settings",
|
||||
"nodes-sort-function": "Nodes sort function"
|
||||
},
|
||||
"input-widgets": {
|
||||
"attribute-not-allowed": "Attribute parameter cannot be used in this widget",
|
||||
"blocked-location": "Geolocation is blocked in your browser",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user