Showing
7 changed files
with
41 additions
and
23 deletions
... | ... | @@ -124,6 +124,9 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC |
124 | 124 | hideToolbar: boolean; |
125 | 125 | |
126 | 126 | @Input() |
127 | + syncStateWithQueryParam = true; | |
128 | + | |
129 | + @Input() | |
127 | 130 | dashboard: Dashboard; |
128 | 131 | dashboardConfiguration: DashboardConfiguration; |
129 | 132 | ... | ... |
... | ... | @@ -88,6 +88,8 @@ export abstract class StateControllerComponent implements IStateControllerCompon |
88 | 88 | |
89 | 89 | currentState: string; |
90 | 90 | |
91 | + syncStateWithQueryParam: boolean; | |
92 | + | |
91 | 93 | private rxSubscriptions = new Array<Subscription>(); |
92 | 94 | |
93 | 95 | private inited = false; |
... | ... | @@ -99,18 +101,20 @@ export abstract class StateControllerComponent implements IStateControllerCompon |
99 | 101 | } |
100 | 102 | |
101 | 103 | ngOnInit(): void { |
102 | - this.rxSubscriptions.push(this.route.queryParamMap.subscribe((paramMap) => { | |
103 | - const dashboardId = this.route.snapshot.params.dashboardId || ''; | |
104 | - if (this.dashboardId === dashboardId) { | |
105 | - const newState = this.decodeStateParam(paramMap.get('state')); | |
106 | - if (this.currentState !== newState) { | |
107 | - this.currentState = newState; | |
108 | - if (this.inited) { | |
109 | - this.onStateChanged(); | |
104 | + if (this.syncStateWithQueryParam) { | |
105 | + this.rxSubscriptions.push(this.route.queryParamMap.subscribe((paramMap) => { | |
106 | + const dashboardId = this.route.snapshot.params.dashboardId || ''; | |
107 | + if (this.dashboardId === dashboardId) { | |
108 | + const newState = this.decodeStateParam(paramMap.get('state')); | |
109 | + if (this.currentState !== newState) { | |
110 | + this.currentState = newState; | |
111 | + if (this.inited) { | |
112 | + this.onStateChanged(); | |
113 | + } | |
110 | 114 | } |
111 | 115 | } |
112 | - } | |
113 | - })); | |
116 | + })); | |
117 | + } | |
114 | 118 | this.init(); |
115 | 119 | this.inited = true; |
116 | 120 | } |
... | ... | @@ -124,16 +128,18 @@ export abstract class StateControllerComponent implements IStateControllerCompon |
124 | 128 | |
125 | 129 | protected updateStateParam(newState: string) { |
126 | 130 | this.currentState = newState; |
127 | - const queryParams: Params = { state: this.currentState }; | |
128 | - this.ngZone.run(() => { | |
129 | - this.router.navigate( | |
130 | - [], | |
131 | - { | |
132 | - relativeTo: this.route, | |
133 | - queryParams, | |
134 | - queryParamsHandling: 'merge', | |
135 | - }); | |
136 | - }); | |
131 | + if (this.syncStateWithQueryParam) { | |
132 | + const queryParams: Params = {state: this.currentState}; | |
133 | + this.ngZone.run(() => { | |
134 | + this.router.navigate( | |
135 | + [], | |
136 | + { | |
137 | + relativeTo: this.route, | |
138 | + queryParams, | |
139 | + queryParamsHandling: 'merge', | |
140 | + }); | |
141 | + }); | |
142 | + } | |
137 | 143 | } |
138 | 144 | |
139 | 145 | public openRightLayout(): void { | ... | ... |
... | ... | @@ -24,6 +24,7 @@ export interface IStateControllerComponent extends IStateController { |
24 | 24 | stateControllerInstanceId: string; |
25 | 25 | state: string; |
26 | 26 | currentState: string; |
27 | + syncStateWithQueryParam: boolean; | |
27 | 28 | isMobile: boolean; |
28 | 29 | states: {[id: string]: DashboardState }; |
29 | 30 | dashboardId: string; | ... | ... |
... | ... | @@ -54,6 +54,9 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { |
54 | 54 | currentState: string; |
55 | 55 | |
56 | 56 | @Input() |
57 | + syncStateWithQueryParam: boolean; | |
58 | + | |
59 | + @Input() | |
57 | 60 | isMobile: boolean; |
58 | 61 | |
59 | 62 | stateControllerComponentRef: ComponentRef<IStateControllerComponent>; |
... | ... | @@ -89,6 +92,8 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { |
89 | 92 | this.stateControllerComponent.state = this.state; |
90 | 93 | } else if (propName === 'currentState') { |
91 | 94 | this.stateControllerComponent.currentState = this.currentState; |
95 | + } else if (propName === 'syncStateWithQueryParam') { | |
96 | + this.stateControllerComponent.syncStateWithQueryParam = this.syncStateWithQueryParam; | |
92 | 97 | } |
93 | 98 | } |
94 | 99 | } |
... | ... | @@ -119,6 +124,7 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { |
119 | 124 | this.stateControllerComponent.stateControllerInstanceId = stateControllerInstanceId; |
120 | 125 | this.stateControllerComponent.state = this.state; |
121 | 126 | this.stateControllerComponent.currentState = this.currentState; |
127 | + this.stateControllerComponent.syncStateWithQueryParam = this.syncStateWithQueryParam; | |
122 | 128 | this.stateControllerComponent.isMobile = this.isMobile; |
123 | 129 | this.stateControllerComponent.states = this.states; |
124 | 130 | this.stateControllerComponent.dashboardId = this.dashboardId; | ... | ... |
... | ... | @@ -44,7 +44,7 @@ import { EntityAction } from '@home/models/entity/entity-component.models'; |
44 | 44 | import { Subscription } from 'rxjs'; |
45 | 45 | import { MatTab, MatTabGroup } from '@angular/material/tabs'; |
46 | 46 | import { EntityTabsComponent } from '@home/components/entity/entity-tabs.component'; |
47 | -import { deepClone } from '@core/utils'; | |
47 | +import { deepClone, mergeDeep } from '@core/utils'; | |
48 | 48 | |
49 | 49 | @Component({ |
50 | 50 | selector: 'tb-entity-details-panel', |
... | ... | @@ -280,7 +280,7 @@ export class EntityDetailsPanelComponent extends PageComponent implements OnInit |
280 | 280 | |
281 | 281 | saveEntity() { |
282 | 282 | if (this.detailsForm.valid) { |
283 | - const editingEntity = {...this.editingEntity, ...this.entityComponent.entityFormValue()}; | |
283 | + const editingEntity = mergeDeep(this.editingEntity, this.entityComponent.entityFormValue()); | |
284 | 284 | this.entitiesTableConfig.saveEntity(editingEntity).subscribe( |
285 | 285 | (entity) => { |
286 | 286 | this.entity = entity; | ... | ... |
... | ... | @@ -27,7 +27,8 @@ |
27 | 27 | </mat-progress-bar> |
28 | 28 | <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div> |
29 | 29 | <div class="dashboard-state-dialog-content" mat-dialog-content fxFlex fxLayout="column" style="padding: 8px;"> |
30 | - <tb-dashboard-page [embedded]="true" [hideToolbar]="hideToolbar" [currentState]="state" [dashboard]="dashboard" style="width: 100%; height: 100%;"></tb-dashboard-page> | |
30 | + <tb-dashboard-page [embedded]="true" [syncStateWithQueryParam]="false" [hideToolbar]="hideToolbar" | |
31 | + [currentState]="state" [dashboard]="dashboard" style="width: 100%; height: 100%;"></tb-dashboard-page> | |
31 | 32 | </div> |
32 | 33 | <div mat-dialog-actions fxLayoutAlign="end center"> |
33 | 34 | <button mat-button color="primary" | ... | ... |