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

UI: Refactoring string items list

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2025-04-02 13:58:49 +03:00
parent 44f1e139bd
commit 555de9bb6f
1 changed files with 13 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
ui-ngx/src/app/shared/components/string-items-list.component.ts
View File

@ -14,16 +14,7 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { import { Component, ElementRef, forwardRef, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
Component,
DestroyRef,
ElementRef,
forwardRef,
Input,
OnInit,
ViewChild,
ViewEncapsulation
} from '@angular/core';
import { import {
AbstractControl, AbstractControl,
ControlValueAccessor, ControlValueAccessor,
@ -39,8 +30,7 @@ import { coerceArray, coerceBoolean } from '@shared/decorators/coercion';
import { Observable, of } from 'rxjs'; import { Observable, of } from 'rxjs';
import { filter, mergeMap, share, tap } from 'rxjs/operators'; import { filter, mergeMap, share, tap } from 'rxjs/operators';
import { MatAutocompleteTrigger } from '@angular/material/autocomplete'; import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
import { isDefined } from '@core/utils'; import { isDefined, isUndefined } from '@core/utils';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
export interface StringItemsOption { export interface StringItemsOption {
name: string; name: string;
@ -146,8 +136,7 @@ export class StringItemsListComponent implements ControlValueAccessor, OnInit {
private propagateChange: (value: any) => void = () => {}; private propagateChange: (value: any) => void = () => {};
private dirty = false; private dirty = false;
constructor(private fb: FormBuilder, constructor(private fb: FormBuilder) {
private destroyRef: DestroyRef) {
this.stringItemsForm = this.fb.group({ this.stringItemsForm = this.fb.group({
item: [null], item: [null],
items: [null] items: [null]
@ -200,7 +189,7 @@ export class StringItemsListComponent implements ControlValueAccessor, OnInit {
if (value != null && value.length > 0) { if (value != null && value.length > 0) {
this.modelValue = [...value]; this.modelValue = [...value];
this.itemList = []; this.itemList = [];
if (this.predefinedValues) { if (this.predefinedValues && !this.allowUserValue) {
value.forEach(item => { value.forEach(item => {
const findItem = this.predefinedValues.find(option => option.value === item); const findItem = this.predefinedValues.find(option => option.value === item);
if (findItem) { if (findItem) {
@ -256,25 +245,23 @@ export class StringItemsListComponent implements ControlValueAccessor, OnInit {
return values ? values.name : undefined; return values ? values.name : undefined;
} }
private addItem(value: string) { private addItem(searchText: string) {
const item = value.trim(); searchText = searchText.trim();
if (item) { if (searchText) {
if (this.predefinedValues && !this.allowUserValue) { if (this.allowUserValue || !this.predefinedValues && isUndefined(this.fetchOptionsFn)) {
this.add({value: searchText, name: searchText});
} else if (this.predefinedValues) {
const findItems = this.predefinedValues const findItems = this.predefinedValues
.filter(value => value.name.toLowerCase().includes(item.toLowerCase())); .filter(value => value.name.toLowerCase().includes(searchText.toLowerCase()));
if (findItems.length === 1) { if (findItems.length === 1) {
this.add(findItems[0]); this.add(findItems[0]);
} }
} else if (isDefined(this.fetchOptionsFn) && !this.allowUserValue) { } else if (isDefined(this.fetchOptionsFn)) {
this.fetchOptionsFn(item).pipe( this.fetchOptionsFn(searchText).subscribe((findItems) => {
takeUntilDestroyed(this.destroyRef)
).subscribe((findItems) => {
if (findItems.length === 1) { if (findItems.length === 1) {
this.add(findItems[0]); this.add(findItems[0]);
} }
}) })
} else {
this.add({value: item, name: item});
} }
} }
} }