Commit 84f2bdd2dedfde61b9360bc28456aa91ac773008
1 parent
c6a50433
Delete Legend config panel component
Showing
4 changed files
with
0 additions
and
199 deletions
@@ -49,7 +49,6 @@ import { EntityAliasSelectComponent } from '@home/components/alias/entity-alias- | @@ -49,7 +49,6 @@ import { EntityAliasSelectComponent } from '@home/components/alias/entity-alias- | ||
49 | import { DataKeysComponent } from '@home/components/widget/data-keys.component'; | 49 | import { DataKeysComponent } from '@home/components/widget/data-keys.component'; |
50 | import { DataKeyConfigDialogComponent } from '@home/components/widget/data-key-config-dialog.component'; | 50 | import { DataKeyConfigDialogComponent } from '@home/components/widget/data-key-config-dialog.component'; |
51 | import { DataKeyConfigComponent } from '@home/components/widget/data-key-config.component'; | 51 | import { DataKeyConfigComponent } from '@home/components/widget/data-key-config.component'; |
52 | -import { LegendConfigPanelComponent } from '@home/components/widget/legend-config-panel.component'; | ||
53 | import { LegendConfigComponent } from '@home/components/widget/legend-config.component'; | 52 | import { LegendConfigComponent } from '@home/components/widget/legend-config.component'; |
54 | import { ManageWidgetActionsComponent } from '@home/components/widget/action/manage-widget-actions.component'; | 53 | import { ManageWidgetActionsComponent } from '@home/components/widget/action/manage-widget-actions.component'; |
55 | import { WidgetActionDialogComponent } from '@home/components/widget/action/widget-action-dialog.component'; | 54 | import { WidgetActionDialogComponent } from '@home/components/widget/action/widget-action-dialog.component'; |
@@ -182,7 +181,6 @@ import { DeviceProfileCommonModule } from '@home/components/profile/device/commo | @@ -182,7 +181,6 @@ import { DeviceProfileCommonModule } from '@home/components/profile/device/commo | ||
182 | DataKeysComponent, | 181 | DataKeysComponent, |
183 | DataKeyConfigComponent, | 182 | DataKeyConfigComponent, |
184 | DataKeyConfigDialogComponent, | 183 | DataKeyConfigDialogComponent, |
185 | - LegendConfigPanelComponent, | ||
186 | LegendConfigComponent, | 184 | LegendConfigComponent, |
187 | ManageWidgetActionsComponent, | 185 | ManageWidgetActionsComponent, |
188 | WidgetActionDialogComponent, | 186 | WidgetActionDialogComponent, |
1 | -<!-- | ||
2 | - | ||
3 | - Copyright © 2016-2021 The Thingsboard Authors | ||
4 | - | ||
5 | - Licensed under the Apache License, Version 2.0 (the "License"); | ||
6 | - you may not use this file except in compliance with the License. | ||
7 | - You may obtain a copy of the License at | ||
8 | - | ||
9 | - http://www.apache.org/licenses/LICENSE-2.0 | ||
10 | - | ||
11 | - Unless required by applicable law or agreed to in writing, software | ||
12 | - distributed under the License is distributed on an "AS IS" BASIS, | ||
13 | - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
14 | - See the License for the specific language governing permissions and | ||
15 | - limitations under the License. | ||
16 | - | ||
17 | ---> | ||
18 | -<form [formGroup]="legendConfigForm"> | ||
19 | - <fieldset [disabled]="(isLoading$ | async)"> | ||
20 | - <div class="mat-content" style="height: 100%;"> | ||
21 | - <div class="mat-padding"> | ||
22 | - <section fxLayout="column"> | ||
23 | - <mat-form-field> | ||
24 | - <mat-label translate>legend.direction</mat-label> | ||
25 | - <mat-select matInput formControlName="direction" style="min-width: 150px;"> | ||
26 | - <mat-option *ngFor="let direction of legendDirections" [value]="direction"> | ||
27 | - {{ legendDirectionTranslations.get(legendDirection[direction]) | translate }} | ||
28 | - </mat-option> | ||
29 | - </mat-select> | ||
30 | - </mat-form-field> | ||
31 | - <mat-form-field> | ||
32 | - <mat-label translate>legend.position</mat-label> | ||
33 | - <mat-select matInput formControlName="position" style="min-width: 150px;"> | ||
34 | - <mat-option *ngFor="let pos of legendPositions" [value]="pos" | ||
35 | - [disabled]="legendConfigForm.get('direction').value === legendDirection.row && | ||
36 | - (pos === legendPosition.left || pos === legendPosition.right)"> | ||
37 | - {{ legendPositionTranslations.get(legendPosition[pos]) | translate }} | ||
38 | - </mat-option> | ||
39 | - </mat-select> | ||
40 | - </mat-form-field> | ||
41 | - <mat-checkbox formControlName="sortDataKeys"> | ||
42 | - {{ 'legend.sort-legend' | translate }} | ||
43 | - </mat-checkbox> | ||
44 | - <mat-checkbox formControlName="showMin"> | ||
45 | - {{ 'legend.show-min' | translate }} | ||
46 | - </mat-checkbox> | ||
47 | - <mat-checkbox formControlName="showMax"> | ||
48 | - {{ 'legend.show-max' | translate }} | ||
49 | - </mat-checkbox> | ||
50 | - <mat-checkbox formControlName="showAvg"> | ||
51 | - {{ 'legend.show-avg' | translate }} | ||
52 | - </mat-checkbox> | ||
53 | - <mat-checkbox formControlName="showTotal"> | ||
54 | - {{ 'legend.show-total' | translate }} | ||
55 | - </mat-checkbox> | ||
56 | - </section> | ||
57 | - </div> | ||
58 | - </div> | ||
59 | - </fieldset> | ||
60 | -</form> |
1 | -/** | ||
2 | - * Copyright © 2016-2021 The Thingsboard Authors | ||
3 | - * | ||
4 | - * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | - * you may not use this file except in compliance with the License. | ||
6 | - * You may obtain a copy of the License at | ||
7 | - * | ||
8 | - * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | - * | ||
10 | - * Unless required by applicable law or agreed to in writing, software | ||
11 | - * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | - * See the License for the specific language governing permissions and | ||
14 | - * limitations under the License. | ||
15 | - */ | ||
16 | -:host { | ||
17 | - width: 100%; | ||
18 | - height: 100%; | ||
19 | - form, | ||
20 | - fieldset { | ||
21 | - height: 100%; | ||
22 | - } | ||
23 | - | ||
24 | - .mat-content { | ||
25 | - overflow: hidden; | ||
26 | - background-color: #fff; | ||
27 | - } | ||
28 | - | ||
29 | - .mat-padding { | ||
30 | - padding: 16px; | ||
31 | - } | ||
32 | -} |
1 | -/// | ||
2 | -/// Copyright © 2016-2021 The Thingsboard Authors | ||
3 | -/// | ||
4 | -/// Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | -/// you may not use this file except in compliance with the License. | ||
6 | -/// You may obtain a copy of the License at | ||
7 | -/// | ||
8 | -/// http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | -/// | ||
10 | -/// Unless required by applicable law or agreed to in writing, software | ||
11 | -/// distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | -/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | -/// See the License for the specific language governing permissions and | ||
14 | -/// limitations under the License. | ||
15 | -/// | ||
16 | - | ||
17 | -import { Component, Inject, InjectionToken, OnInit, ViewContainerRef } from '@angular/core'; | ||
18 | -import { OverlayRef } from '@angular/cdk/overlay'; | ||
19 | -import { PageComponent } from '@shared/components/page.component'; | ||
20 | -import { Store } from '@ngrx/store'; | ||
21 | -import { AppState } from '@core/core.state'; | ||
22 | -import { FormBuilder, FormGroup } from '@angular/forms'; | ||
23 | -import { | ||
24 | - LegendConfig, | ||
25 | - LegendDirection, | ||
26 | - legendDirectionTranslationMap, | ||
27 | - LegendPosition, | ||
28 | - legendPositionTranslationMap | ||
29 | -} from '@shared/models/widget.models'; | ||
30 | - | ||
31 | -export const LEGEND_CONFIG_PANEL_DATA = new InjectionToken<any>('LegendConfigPanelData'); | ||
32 | - | ||
33 | -export interface LegendConfigPanelData { | ||
34 | - legendConfig: LegendConfig; | ||
35 | - legendConfigUpdated: (legendConfig: LegendConfig) => void; | ||
36 | -} | ||
37 | - | ||
38 | -@Component({ | ||
39 | - selector: 'tb-legend-config-panel', | ||
40 | - templateUrl: './legend-config-panel.component.html', | ||
41 | - styleUrls: ['./legend-config-panel.component.scss'] | ||
42 | -}) | ||
43 | -export class LegendConfigPanelComponent extends PageComponent implements OnInit { | ||
44 | - | ||
45 | - legendConfigForm: FormGroup; | ||
46 | - | ||
47 | - legendDirection = LegendDirection; | ||
48 | - | ||
49 | - legendDirections = Object.keys(LegendDirection); | ||
50 | - | ||
51 | - legendDirectionTranslations = legendDirectionTranslationMap; | ||
52 | - | ||
53 | - legendPosition = LegendPosition; | ||
54 | - | ||
55 | - legendPositions = Object.keys(LegendPosition); | ||
56 | - | ||
57 | - legendPositionTranslations = legendPositionTranslationMap; | ||
58 | - | ||
59 | - constructor(@Inject(LEGEND_CONFIG_PANEL_DATA) public data: LegendConfigPanelData, | ||
60 | - public overlayRef: OverlayRef, | ||
61 | - protected store: Store<AppState>, | ||
62 | - public fb: FormBuilder, | ||
63 | - public viewContainerRef: ViewContainerRef) { | ||
64 | - super(store); | ||
65 | - } | ||
66 | - | ||
67 | - ngOnInit(): void { | ||
68 | - this.legendConfigForm = this.fb.group({ | ||
69 | - direction: [this.data.legendConfig.direction, []], | ||
70 | - position: [this.data.legendConfig.position, []], | ||
71 | - sortDataKeys: [this.data.legendConfig.sortDataKeys, []], | ||
72 | - showMin: [this.data.legendConfig.showMin, []], | ||
73 | - showMax: [this.data.legendConfig.showMax, []], | ||
74 | - showAvg: [this.data.legendConfig.showAvg, []], | ||
75 | - showTotal: [this.data.legendConfig.showTotal, []] | ||
76 | - }); | ||
77 | - this.legendConfigForm.get('direction').valueChanges.subscribe((direction: LegendDirection) => { | ||
78 | - this.onDirectionChanged(direction); | ||
79 | - }); | ||
80 | - this.onDirectionChanged(this.data.legendConfig.direction); | ||
81 | - this.legendConfigForm.valueChanges.subscribe(() => { | ||
82 | - this.update(); | ||
83 | - }); | ||
84 | - } | ||
85 | - | ||
86 | - private onDirectionChanged(direction: LegendDirection) { | ||
87 | - if (direction === LegendDirection.row) { | ||
88 | - let position: LegendPosition = this.legendConfigForm.get('position').value; | ||
89 | - if (position !== LegendPosition.bottom && position !== LegendPosition.top) { | ||
90 | - position = LegendPosition.bottom; | ||
91 | - } | ||
92 | - this.legendConfigForm.patchValue( | ||
93 | - { | ||
94 | - position | ||
95 | - }, {emitEvent: false} | ||
96 | - ); | ||
97 | - } | ||
98 | - } | ||
99 | - | ||
100 | - update() { | ||
101 | - const newLegendConfig: LegendConfig = this.legendConfigForm.value; | ||
102 | - this.data.legendConfigUpdated(newLegendConfig); | ||
103 | - } | ||
104 | - | ||
105 | -} |