dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #9869 from Dmitriymush/bug-fix/action-navigate-to-dashboard

Browse Source 
Fixed stateId autocomplete and added improvements for widget action dialog
This commit is contained in:
Igor Kulikov 2024-01-24 17:14:57 +02:00 committed by GitHub
commit a8bf7ad1b3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 50 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui-ngx/src/app/modules/home/components/widget/action/widget-action-dialog.component.html
View File

@ -97,6 +97,7 @@
#dashboardStateInput
formControlName="targetDashboardStateId"
[required]="widgetActionFormGroup.get('type').value === widgetActionType.openDashboardState"
(focusin)="onFocus()"
[matAutocomplete]="targetDashboardStateAutocomplete">
<button *ngIf="actionTypeFormGroup.get('targetDashboardStateId').value"
type="button"

65
ui-ngx/src/app/modules/home/components/widget/action/widget-action-dialog.component.ts
View File

@ -28,7 +28,7 @@ import {
ValidatorFn,
Validators
} from '@angular/forms';
import { Observable, of, Subscription } from 'rxjs';
import { Observable, of, Subject, Subscription } from 'rxjs';
import { Router } from '@angular/router';
import { DialogComponent } from '@app/shared/components/dialog.component';
import {
@ -43,7 +43,7 @@ import {
WidgetActionType,
widgetActionTypeTranslationMap
} from '@shared/models/widget.models';
import { map, mergeMap, startWith, tap } from 'rxjs/operators';
import { map, mergeMap, startWith, takeUntil, tap } from 'rxjs/operators';
import { DashboardService } from '@core/http/dashboard.service';
import { Dashboard } from '@shared/models/dashboard.models';
import { DashboardUtilsService } from '@core/services/dashboard-utils.service';
@ -88,6 +88,10 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
@ViewChild('mobileActionEditor', {static: false}) mobileActionEditor: MobileActionEditorComponent;
private destroy$ = new Subject<void>();
private dashboard: Dashboard;
widgetActionFormGroup: UntypedFormGroup;
actionTypeFormGroup: UntypedFormGroup;
actionTypeFormGroupSubscriptions: Subscription[] = [];
@ -156,18 +160,30 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
this.fb.control(this.action.type, [Validators.required]));
this.updateShowWidgetActionForm();
this.updateActionTypeFormGroup(this.action.type, this.action);
this.widgetActionFormGroup.get('type').valueChanges.subscribe((type: WidgetActionType) => {
this.widgetActionFormGroup.get('type').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe((type: WidgetActionType) => {
this.updateActionTypeFormGroup(type);
});
this.widgetActionFormGroup.get('actionSourceId').valueChanges.subscribe(() => {
this.widgetActionFormGroup.get('actionSourceId').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe(() => {
this.widgetActionFormGroup.get('name').updateValueAndValidity();
this.updateShowWidgetActionForm();
});
this.widgetActionFormGroup.get('useShowWidgetActionFunction').valueChanges.subscribe(() => {
this.widgetActionFormGroup.get('useShowWidgetActionFunction').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe(() => {
this.updateShowWidgetActionForm();
});
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
super.ngOnDestroy();
}
displayShowWidgetActionForm(): boolean {
return !!this.data.actionsData.actionSources[this.widgetActionFormGroup.get('actionSourceId').value]?.hasShowCondition;
}
@ -225,7 +241,7 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
this.fb.control(action ? action.targetDashboardId : null,
[Validators.required])
);
this.setupSelectedDashboardStateIds(action ? action.targetDashboardId : null);
this.setupSelectedDashboardStateIds();
} else {
if (type === WidgetActionType.openDashboardState) {
const displayType = this.getStateDisplayType(action);
@ -235,8 +251,10 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
);
this.updateStateDisplayTypeFormGroup(displayType, action);
this.actionTypeFormGroupSubscriptions.push(
this.actionTypeFormGroup.get('stateDisplayType').valueChanges.subscribe((displayTypeValue: stateDisplayType) => {
this.updateStateDisplayTypeFormGroup(displayTypeValue);
this.actionTypeFormGroup.get('stateDisplayType').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe((displayTypeValue: stateDisplayType) => {
this.updateStateDisplayTypeFormGroup(displayTypeValue);
})
);
}
@ -339,25 +357,35 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
return res;
}
private setupSelectedDashboardStateIds(targetDashboardId?: string) {
private setupSelectedDashboardStateIds() {
this.selectedDashboardStateIds =
this.actionTypeFormGroup.get('targetDashboardId').valueChanges.pipe(
// startWith<string>(targetDashboardId),
tap(() => {
tap((dashboardId) => {
if (!dashboardId) {
this.actionTypeFormGroup.get('targetDashboardStateId')
.patchValue('', {emitEvent: true});
}
this.targetDashboardStateSearchText = '';
}),
mergeMap((dashboardId) => {
if (dashboardId) {
return this.dashboardService.getDashboard(dashboardId);
if (this.dashboard?.id.id === dashboardId) {
return of(this.dashboard);
} else {
return this.dashboardService.getDashboard(dashboardId);
}
} else {
return of(null);
}
}),
map((dashboard: Dashboard) => {
if (dashboard) {
dashboard = this.dashboardUtils.validateAndUpdateDashboard(dashboard);
const states = dashboard.configuration.states;
return Object.keys(states);
if (this.dashboard?.id.id !== dashboard.id.id) {
this.dashboard = this.dashboardUtils.validateAndUpdateDashboard(dashboard);
}
return Object.keys(this.dashboard.configuration.states);
} else {
return [];
}
@ -371,7 +399,8 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
.pipe(
startWith(''),
map(value => value ? value : ''),
mergeMap(name => this.fetchDashboardStates(name) )
mergeMap(name => this.fetchDashboardStates(name)),
takeUntil(this.destroy$)
);
}
@ -461,6 +490,10 @@ export class WidgetActionDialogComponent extends DialogComponent<WidgetActionDia
}
}
onFocus(): void {
this.actionTypeFormGroup.get('targetDashboardId').updateValueAndValidity({onlySelf: true, emitEvent: true});
}
cancel(): void {
this.dialogRef.close(null);
}