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

UI: Fixed unclear cached result in dashboard autocomplete when changing user

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2025-02-05 11:56:51 +02:00
parent c76cd05b12
commit 783579a093
2 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui-ngx/src/app/shared/components/dashboard-autocomplete.component.html
View File

@ -31,7 +31,9 @@
[required]="required" [required]="required"
[matAutocomplete]="dashboardAutocomplete" [matAutocomplete]="dashboardAutocomplete"
[class.!hidden]="useDashboardLink && disabled && selectDashboardFormGroup.get('dashboard').value"> [class.!hidden]="useDashboardLink && disabled && selectDashboardFormGroup.get('dashboard').value">
<a *ngIf="useDashboardLink && selectDashboardFormGroup.get('dashboard').value && disabled" aria-label="Open device profile" [routerLink]=dashboardURL> <a *ngIf="useDashboardLink && selectDashboardFormGroup.get('dashboard').value && disabled"
[attr.aria-label]="'dashboard.open-dashboard' | translate"
[routerLink]=dashboardURL>
{{ displayDashboardFn(selectDashboardFormGroup.get('dashboard').value) | customTranslate }} {{ displayDashboardFn(selectDashboardFormGroup.get('dashboard').value) | customTranslate }}
</a> </a>
<button *ngIf="selectDashboardFormGroup.get('dashboard').value && !disabled" <button *ngIf="selectDashboardFormGroup.get('dashboard').value && !disabled"

14
ui-ngx/src/app/shared/components/dashboard-autocomplete.component.ts
View File

@ -14,7 +14,7 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { AfterViewInit, Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core'; import { Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
import { import {
ControlValueAccessor, ControlValueAccessor,
NG_VALUE_ACCESSOR, NG_VALUE_ACCESSOR,
@ -25,7 +25,7 @@ import {
import { Observable, of } from 'rxjs'; import { Observable, of } from 'rxjs';
import { PageLink } from '@shared/models/page/page-link'; import { PageLink } from '@shared/models/page/page-link';
import { Direction } from '@shared/models/page/sort-order'; import { Direction } from '@shared/models/page/sort-order';
import { catchError, debounceTime, distinctUntilChanged, map, share, switchMap, tap } from 'rxjs/operators'; import { catchError, debounceTime, map, share, switchMap, tap } from 'rxjs/operators';
import { emptyPageData, PageData } from '@shared/models/page/page-data'; import { emptyPageData, PageData } from '@shared/models/page/page-data';
import { DashboardInfo } from '@app/shared/models/dashboard.models'; import { DashboardInfo } from '@app/shared/models/dashboard.models';
import { DashboardService } from '@core/http/dashboard.service'; import { DashboardService } from '@core/http/dashboard.service';
@ -39,6 +39,7 @@ import { getEntityDetailsPageURL } from '@core/utils';
import { EntityType } from '@shared/models/entity-type.models'; import { EntityType } from '@shared/models/entity-type.models';
import { AuthUser } from '@shared/models/user.model'; import { AuthUser } from '@shared/models/user.model';
import { coerceBoolean } from '@shared/decorators/coercion'; import { coerceBoolean } from '@shared/decorators/coercion';
import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
@Component({ @Component({
selector: 'tb-dashboard-autocomplete', selector: 'tb-dashboard-autocomplete',
@ -50,7 +51,7 @@ import { coerceBoolean } from '@shared/decorators/coercion';
multi: true multi: true
}] }]
}) })
export class DashboardAutocompleteComponent implements ControlValueAccessor, OnInit, AfterViewInit { export class DashboardAutocompleteComponent implements ControlValueAccessor, OnInit {
private dirty = false; private dirty = false;
@ -103,6 +104,7 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
disabled: boolean; disabled: boolean;
@ViewChild('dashboardInput', {static: true}) dashboardInput: ElementRef; @ViewChild('dashboardInput', {static: true}) dashboardInput: ElementRef;
@ViewChild('dashboardInput', {read: MatAutocompleteTrigger, static: true}) dashboardAutocomplete: MatAutocompleteTrigger;
filteredDashboards: Observable<Array<DashboardInfo>>; filteredDashboards: Observable<Array<DashboardInfo>>;
@ -151,16 +153,11 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
this.updateView(modelValue); this.updateView(modelValue);
}), }),
map(value => value ? (typeof value === 'string' ? value : value.name) : ''), map(value => value ? (typeof value === 'string' ? value : value.name) : ''),
distinctUntilChanged(),
switchMap(name => this.fetchDashboards(name) ), switchMap(name => this.fetchDashboards(name) ),
share() share()
); );
} }
ngAfterViewInit(): void {
// this.selectFirstDashboardIfNeeded();
}
selectFirstDashboardIfNeeded(): void { selectFirstDashboardIfNeeded(): void {
if (this.selectFirstDashboard && !this.modelValue) { if (this.selectFirstDashboard && !this.modelValue) {
this.getDashboards(new PageLink(1, 0, null, { this.getDashboards(new PageLink(1, 0, null, {
@ -183,6 +180,7 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
this.disabled = isDisabled; this.disabled = isDisabled;
if (this.disabled) { if (this.disabled) {
this.selectDashboardFormGroup.disable({emitEvent: false}); this.selectDashboardFormGroup.disable({emitEvent: false});
this.dashboardAutocomplete.closePanel();
} else { } else {
this.selectDashboardFormGroup.enable({emitEvent: false}); this.selectDashboardFormGroup.enable({emitEvent: false});
} }