Browse Source

Merge pull request #9649 from ArtemDzhereleiko/AD/imp/links-for-autocomplete

Improve added links to entities from setting of entities
pull/9782/head
Igor Kulikov 3 years ago
committed by GitHub
parent
commit
8af394e80b
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 5
      ui-ngx/src/app/modules/home/components/profile/asset-profile-autocomplete.component.html
  2. 18
      ui-ngx/src/app/modules/home/components/profile/asset-profile-autocomplete.component.ts
  3. 5
      ui-ngx/src/app/modules/home/components/profile/device-profile-autocomplete.component.html
  4. 18
      ui-ngx/src/app/modules/home/components/profile/device-profile-autocomplete.component.ts
  5. 6
      ui-ngx/src/app/modules/home/components/rule-chain/rule-chain-autocomplete.component.html
  6. 8
      ui-ngx/src/app/modules/home/components/rule-chain/rule-chain-autocomplete.component.ts
  7. 6
      ui-ngx/src/app/shared/components/dashboard-autocomplete.component.html
  8. 24
      ui-ngx/src/app/shared/components/dashboard-autocomplete.component.ts
  9. 6
      ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.html
  10. 5
      ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.ts
  11. 5
      ui-ngx/src/app/shared/components/ota-package/ota-package-autocomplete.component.html
  12. 24
      ui-ngx/src/app/shared/components/ota-package/ota-package-autocomplete.component.ts

5
ui-ngx/src/app/modules/home/components/profile/asset-profile-autocomplete.component.html

@ -25,8 +25,9 @@
(keydown)="assetProfileEnter($event)"
(keypress)="assetProfileEnter($event)"
[matAutocomplete]="assetProfileAutocomplete"
[fxShow]="!showDetailsPageLink || !disabled || !selectAssetProfileFormGroup.get('assetProfile').value">
<a *ngIf="showDetailsPageLink && selectAssetProfileFormGroup.get('assetProfile').value && disabled" aria-label="Open asset profile" [routerLink]=assetProfileURL>
[fxShow]="!showDetailsPageLink || !useAssetProfileLink || !disabled || !selectAssetProfileFormGroup.get('assetProfile').value">
<a *ngIf="showDetailsPageLink && useAssetProfileLink && selectAssetProfileFormGroup.get('assetProfile').value && disabled"
aria-label="Open asset profile" [routerLink]=assetProfileURL>
{{ displayAssetProfileFn(selectAssetProfileFormGroup.get('assetProfile').value) }}
</a>
<button *ngIf="selectAssetProfileFormGroup.get('assetProfile').value && !disabled"

18
ui-ngx/src/app/modules/home/components/profile/asset-profile-autocomplete.component.ts

@ -25,7 +25,7 @@ import {
Output,
ViewChild
} from '@angular/core';
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { PageLink } from '@shared/models/page/page-link';
import { Direction } from '@shared/models/page/sort-order';
@ -33,7 +33,6 @@ import { catchError, debounceTime, distinctUntilChanged, map, share, switchMap,
import { Store } from '@ngrx/store';
import { AppState } from '@app/core/core.state';
import { TranslateService } from '@ngx-translate/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { entityIdEquals } from '@shared/models/id/entity-id';
import { TruncatePipe } from '@shared//pipe/truncate.pipe';
import { ENTER } from '@angular/cdk/keycodes';
@ -47,6 +46,9 @@ import { AssetProfileService } from '@core/http/asset-profile.service';
import { AssetProfileDialogComponent, AssetProfileDialogData } from './asset-profile-dialog.component';
import { SubscriptSizing } from '@angular/material/form-field';
import { coerceBoolean } from '@shared/decorators/coercion';
import { AuthUser } from '@shared/models/user.model';
import { getCurrentAuthUser } from '@core/auth/auth.selectors';
import { Authority } from '@shared/models/authority.enum';
@Component({
selector: 'tb-asset-profile-autocomplete',
@ -110,6 +112,10 @@ export class AssetProfileAutocompleteComponent implements ControlValueAccessor,
searchText = '';
assetProfileURL: string;
useAssetProfileLink = true;
private authUser: AuthUser;
private dirty = false;
private ignoreClosedPanel = false;
@ -128,6 +134,10 @@ export class AssetProfileAutocompleteComponent implements ControlValueAccessor,
private fb: UntypedFormBuilder,
private zone: NgZone,
private dialog: MatDialog) {
this.authUser = getCurrentAuthUser(this.store);
if (this.authUser.authority === Authority.CUSTOMER_USER) {
this.useAssetProfileLink = false;
}
this.selectAssetProfileFormGroup = this.fb.group({
assetProfile: [null]
});
@ -226,7 +236,9 @@ export class AssetProfileAutocompleteComponent implements ControlValueAccessor,
this.assetProfileService.getAssetProfileInfo(value.id).subscribe(
(profile) => {
this.modelValue = new AssetProfileId(profile.id.id);
this.assetProfileURL = getEntityDetailsPageURL(this.modelValue.id, this.modelValue.entityType);
if (this.useAssetProfileLink) {
this.assetProfileURL = getEntityDetailsPageURL(this.modelValue.id, this.modelValue.entityType);
}
this.selectAssetProfileFormGroup.get('assetProfile').patchValue(profile, {emitEvent: false});
this.assetProfileChanged.emit(profile);
}

5
ui-ngx/src/app/modules/home/components/profile/device-profile-autocomplete.component.html

@ -25,8 +25,9 @@
(keydown)="deviceProfileEnter($event)"
(keypress)="deviceProfileEnter($event)"
[matAutocomplete]="deviceProfileAutocomplete"
[fxShow]="!showDetailsPageLink || !disabled || !selectDeviceProfileFormGroup.get('deviceProfile').value">
<a *ngIf="showDetailsPageLink && selectDeviceProfileFormGroup.get('deviceProfile').value && disabled" aria-label="Open device profile" [routerLink]=deviceProfileURL>
[fxShow]="!showDetailsPageLink || !useDeviceProfileLink || !disabled || !selectDeviceProfileFormGroup.get('deviceProfile').value">
<a *ngIf="showDetailsPageLink && useDeviceProfileLink && selectDeviceProfileFormGroup.get('deviceProfile').value && disabled"
aria-label="Open device profile" [routerLink]=deviceProfileURL>
{{ displayDeviceProfileFn(selectDeviceProfileFormGroup.get('deviceProfile').value) }}
</a>
<button *ngIf="selectDeviceProfileFormGroup.get('deviceProfile').value && !disabled"

18
ui-ngx/src/app/modules/home/components/profile/device-profile-autocomplete.component.ts

@ -27,7 +27,7 @@ import {
SimpleChanges,
ViewChild
} from '@angular/core';
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { PageLink } from '@shared/models/page/page-link';
import { Direction } from '@shared/models/page/sort-order';
@ -35,7 +35,6 @@ import { catchError, debounceTime, distinctUntilChanged, map, share, switchMap,
import { Store } from '@ngrx/store';
import { AppState } from '@app/core/core.state';
import { TranslateService } from '@ngx-translate/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { entityIdEquals } from '@shared/models/id/entity-id';
import { TruncatePipe } from '@shared//pipe/truncate.pipe';
import { ENTER } from '@angular/cdk/keycodes';
@ -50,6 +49,9 @@ import { emptyPageData } from '@shared/models/page/page-data';
import { getEntityDetailsPageURL } from '@core/utils';
import { SubscriptSizing } from '@angular/material/form-field';
import { coerceBoolean } from '@shared/decorators/coercion';
import { AuthUser } from '@shared/models/user.model';
import { getCurrentAuthUser } from '@core/auth/auth.selectors';
import { Authority } from '@shared/models/authority.enum';
@Component({
selector: 'tb-device-profile-autocomplete',
@ -119,6 +121,10 @@ export class DeviceProfileAutocompleteComponent implements ControlValueAccessor,
searchText = '';
deviceProfileURL: string;
useDeviceProfileLink = true;
private authUser: AuthUser;
private dirty = false;
private ignoreClosedPanel = false;
@ -139,6 +145,10 @@ export class DeviceProfileAutocompleteComponent implements ControlValueAccessor,
private fb: UntypedFormBuilder,
private zone: NgZone,
private dialog: MatDialog) {
this.authUser = getCurrentAuthUser(this.store);
if (this.authUser.authority === Authority.CUSTOMER_USER) {
this.useDeviceProfileLink = false;
}
this.selectDeviceProfileFormGroup = this.fb.group({
deviceProfile: [null]
});
@ -248,7 +258,9 @@ export class DeviceProfileAutocompleteComponent implements ControlValueAccessor,
this.deviceProfileService.getDeviceProfileInfo(value.id).subscribe(
(profile) => {
this.modelValue = new DeviceProfileId(profile.id.id);
this.deviceProfileURL = getEntityDetailsPageURL(this.modelValue.id, this.modelValue.entityType);
if (this.useDeviceProfileLink) {
this.deviceProfileURL = getEntityDetailsPageURL(this.modelValue.id, this.modelValue.entityType);
}
this.selectDeviceProfileFormGroup.get('deviceProfile').patchValue(profile, {emitEvent: false});
this.deviceProfileChanged.emit(profile);
}

6
ui-ngx/src/app/modules/home/components/rule-chain/rule-chain-autocomplete.component.html

@ -22,7 +22,11 @@
formControlName="ruleChainId"
(focusin)="onFocus()"
[required]="required"
[matAutocomplete]="ruleChainAutocomplete">
[matAutocomplete]="ruleChainAutocomplete"
[fxShow]="!disabled || !selectRuleChainFormGroup.get('ruleChainId').value">
<a *ngIf="selectRuleChainFormGroup.get('ruleChainId').value && disabled" aria-label="Open device profile" [routerLink]=ruleChainURL>
{{ displayRuleChainFn(selectRuleChainFormGroup.get('ruleChainId').value) }}
</a>
<button *ngIf="selectRuleChainFormGroup.get('ruleChainId').value && !disabled"
type="button"
matSuffix mat-icon-button aria-label="Clear"

8
ui-ngx/src/app/modules/home/components/rule-chain/rule-chain-autocomplete.component.ts

@ -15,7 +15,7 @@
///
import { Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { catchError, debounceTime, distinctUntilChanged, map, share, switchMap, tap } from 'rxjs/operators';
import { Store } from '@ngrx/store';
@ -30,6 +30,7 @@ import { TruncatePipe } from '@shared/pipe/truncate.pipe';
import { RuleChainService } from '@core/http/rule-chain.service';
import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
import { RuleChainType } from '@app/shared/models/rule-chain.models';
import { getEntityDetailsPageURL } from '@core/utils';
@Component({
selector: 'tb-rule-chain-autocomplete',
@ -74,6 +75,7 @@ export class RuleChainAutocompleteComponent implements ControlValueAccessor, OnI
filteredRuleChains: Observable<Array<BaseData<EntityId>>>;
searchText = '';
ruleChainURL: string;
private dirty = false;
@ -151,6 +153,10 @@ export class RuleChainAutocompleteComponent implements ControlValueAccessor, OnI
this.entityService.getEntity(targetEntityType, value, {ignoreLoading: true, ignoreErrors: true}).subscribe(
(entity) => {
this.modelValue = entity.id.id;
this.ruleChainURL = getEntityDetailsPageURL(this.modelValue,EntityType.RULE_CHAIN);
if (this.ruleChainType === RuleChainType.EDGE) {
this.ruleChainURL = '/edgeManagement' + this.ruleChainURL;
}
this.selectRuleChainFormGroup.get('ruleChainId').patchValue(entity, {emitEvent: false});
},
() => {

6
ui-ngx/src/app/shared/components/dashboard-autocomplete.component.html

@ -24,7 +24,11 @@
formControlName="dashboard"
(focusin)="onFocus()"
[required]="required"
[matAutocomplete]="dashboardAutocomplete">
[matAutocomplete]="dashboardAutocomplete"
[fxShow]="!useDashboardLink || !disabled || !selectDashboardFormGroup.get('dashboard').value">
<a *ngIf="useDashboardLink && selectDashboardFormGroup.get('dashboard').value && disabled" aria-label="Open device profile" [routerLink]=dashboardURL>
{{ displayDashboardFn(selectDashboardFormGroup.get('dashboard').value) }}
</a>
<button *ngIf="selectDashboardFormGroup.get('dashboard').value && !disabled"
type="button"
matSuffix mat-icon-button aria-label="Clear"

24
ui-ngx/src/app/shared/components/dashboard-autocomplete.component.ts

@ -15,7 +15,7 @@
///
import { AfterViewInit, Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { PageLink } from '@shared/models/page/page-link';
import { Direction } from '@shared/models/page/sort-order';
@ -30,6 +30,9 @@ import { Authority } from '@shared/models/authority.enum';
import { TranslateService } from '@ngx-translate/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { FloatLabelType, MatFormFieldAppearance, SubscriptSizing } from '@angular/material/form-field';
import { getEntityDetailsPageURL } from '@core/utils';
import { EntityType } from '@shared/models/entity-type.models';
import { AuthUser } from '@shared/models/user.model';
@Component({
selector: 'tb-dashboard-autocomplete',
@ -97,12 +100,23 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
searchText = '';
dashboardURL: string;
useDashboardLink = true;
private authUser: AuthUser;
private propagateChange = (v: any) => { };
constructor(private store: Store<AppState>,
public translate: TranslateService,
private dashboardService: DashboardService,
private fb: UntypedFormBuilder) {
this.authUser = getCurrentAuthUser(this.store);
if (this.authUser.authority === Authority.SYS_ADMIN) {
this.useDashboardLink = false;
}
this.selectDashboardFormGroup = this.fb.group({
dashboard: [null]
});
@ -173,6 +187,9 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
this.dashboardService.getDashboardInfo(value).subscribe(
(dashboard) => {
this.modelValue = this.useIdValue ? dashboard.id.id : dashboard;
if (this.useDashboardLink) {
this.dashboardURL = getEntityDetailsPageURL(this.modelValue as string, EntityType.DASHBOARD);
}
this.selectDashboardFormGroup.get('dashboard').patchValue(dashboard, {emitEvent: false});
}
);
@ -215,8 +232,7 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
getDashboards(pageLink: PageLink): Observable<PageData<DashboardInfo>> {
let dashboardsObservable: Observable<PageData<DashboardInfo>>;
const authUser = getCurrentAuthUser(this.store);
if (this.dashboardsScope === 'customer' || authUser.authority === Authority.CUSTOMER_USER) {
if (this.dashboardsScope === 'customer' || this.authUser.authority === Authority.CUSTOMER_USER) {
if (this.customerId) {
dashboardsObservable = this.dashboardService.getCustomerDashboards(this.customerId, pageLink,
{ignoreLoading: true});
@ -224,7 +240,7 @@ export class DashboardAutocompleteComponent implements ControlValueAccessor, OnI
dashboardsObservable = of(emptyPageData());
}
} else {
if (authUser.authority === Authority.SYS_ADMIN) {
if (this.authUser.authority === Authority.SYS_ADMIN) {
if (this.tenantId) {
dashboardsObservable = this.dashboardService.getTenantDashboardsByTenantId(this.tenantId, pageLink,
{ignoreLoading: true});

6
ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.html

@ -22,7 +22,11 @@
formControlName="entity"
(focusin)="onFocus()"
[required]="required"
[matAutocomplete]="entityAutocomplete">
[matAutocomplete]="entityAutocomplete"
[fxShow]="!disabled || !selectEntityFormGroup.get('entity').value">
<a *ngIf="selectEntityFormGroup.get('entity').value && disabled" aria-label="Open device profile" [routerLink]=entityURL>
{{ displayEntityFn(selectEntityFormGroup.get('entity').value) }}
</a>
<button *ngIf="selectEntityFormGroup.get('entity').value && !disabled"
type="button"
matSuffix mat-icon-button aria-label="Clear"

5
ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.ts

@ -38,7 +38,7 @@ import { EntityId } from '@shared/models/id/entity-id';
import { EntityService } from '@core/http/entity.service';
import { getCurrentAuthUser } from '@core/auth/auth.selectors';
import { Authority } from '@shared/models/authority.enum';
import { isDefinedAndNotNull, isEqual } from '@core/utils';
import { getEntityDetailsPageURL, isDefinedAndNotNull, isEqual } from '@core/utils';
import { coerceBoolean } from '@shared/decorators/coercion';
@Component({
@ -71,6 +71,8 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
searchText = '';
entityURL: string;
private dirty = false;
private refresh$ = new Subject<Array<BaseData<EntityId>>>();
@ -312,6 +314,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
this.propagateChange(null);
}
this.modelValue = entity !== null ? (this.useFullEntityId ? entity.id : entity.id.id) : null;
this.entityURL = getEntityDetailsPageURL(this.modelValue as string, targetEntityType);
this.selectEntityFormGroup.get('entity').patchValue(entity !== null ? entity : '', {emitEvent: false});
this.entityChanged.emit(entity);
} else {

5
ui-ngx/src/app/shared/components/ota-package/ota-package-autocomplete.component.html

@ -24,8 +24,9 @@
[required]="required"
[matAutocomplete]="packageAutocomplete"
[matAutocompleteDisabled]="disabled"
[fxShow]="!showDetailsPageLink || !disabled || !otaPackageFormGroup.get('packageId').value">
<a *ngIf="showDetailsPageLink && otaPackageFormGroup.get('packageId').value && disabled" aria-label="Open ota package" [routerLink]=packageURL>
[fxShow]="!showDetailsPageLink || !usePackageLink || !disabled || !otaPackageFormGroup.get('packageId').value">
<a *ngIf="showDetailsPageLink && usePackageLink && otaPackageFormGroup.get('packageId').value && disabled"
aria-label="Open ota package" [routerLink]=packageURL>
{{ displayPackageFn(otaPackageFormGroup.get('packageId').value) }}
</a>
<button *ngIf="otaPackageFormGroup.get('packageId').value && !disabled"

24
ui-ngx/src/app/shared/components/ota-package/ota-package-autocomplete.component.ts

@ -14,8 +14,8 @@
/// limitations under the License.
///
import { Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
import { Component, ElementRef, forwardRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { merge, Observable, of, Subject } from 'rxjs';
import { catchError, debounceTime, map, share, switchMap, tap } from 'rxjs/operators';
import { Store } from '@ngrx/store';
@ -32,6 +32,9 @@ import { PageLink } from '@shared/models/page/page-link';
import { Direction } from '@shared/models/page/sort-order';
import { emptyPageData } from '@shared/models/page/page-data';
import { getEntityDetailsPageURL } from '@core/utils';
import { AuthUser } from '@shared/models/user.model';
import { getCurrentAuthUser } from '@core/auth/auth.selectors';
import { Authority } from '@shared/models/authority.enum';
@Component({
selector: 'tb-ota-package-autocomplete',
@ -43,7 +46,7 @@ import { getEntityDetailsPageURL } from '@core/utils';
multi: true
}]
})
export class OtaPackageAutocompleteComponent implements ControlValueAccessor, OnInit {
export class OtaPackageAutocompleteComponent implements ControlValueAccessor, OnInit, OnDestroy {
otaPackageFormGroup: UntypedFormGroup;
@ -106,6 +109,10 @@ export class OtaPackageAutocompleteComponent implements ControlValueAccessor, On
searchText = '';
packageURL: string;
usePackageLink = true;
private authUser: AuthUser;
private dirty = false;
private cleanFilteredPackages: Subject<Array<OtaPackageInfo>> = new Subject();
@ -117,6 +124,10 @@ export class OtaPackageAutocompleteComponent implements ControlValueAccessor, On
private entityService: EntityService,
private otaPackageService: OtaPackageService,
private fb: UntypedFormBuilder) {
this.authUser = getCurrentAuthUser(this.store);
if (this.authUser.authority === Authority.CUSTOMER_USER) {
this.usePackageLink = false;
}
this.otaPackageFormGroup = this.fb.group({
packageId: [null]
});
@ -153,9 +164,6 @@ export class OtaPackageAutocompleteComponent implements ControlValueAccessor, On
this.filteredPackages = merge(this.cleanFilteredPackages, getPackages);
}
ngAfterViewInit(): void {
}
ngOnDestroy() {
this.cleanFilteredPackages.complete();
this.cleanFilteredPackages = null;
@ -195,7 +203,9 @@ export class OtaPackageAutocompleteComponent implements ControlValueAccessor, On
if (packageId !== '') {
this.entityService.getEntity(EntityType.OTA_PACKAGE, packageId, {ignoreLoading: true, ignoreErrors: true}).subscribe(
(entity) => {
this.packageURL = getEntityDetailsPageURL(entity.id.id, EntityType.OTA_PACKAGE);
if (this.usePackageLink) {
this.packageURL = getEntityDetailsPageURL(entity.id.id, EntityType.OTA_PACKAGE);
}
this.modelValue = this.useFullEntityId ? entity.id : entity.id.id;
this.otaPackageFormGroup.get('packageId').patchValue(entity, {emitEvent: false});
},

Loading…
Cancel
Save