Commit 476035e993c7e96a228f6897caefef83316f8bc4
1 parent
a3bd6efa
UI: Add entity autocomplete output EntityChange
Showing
1 changed file
with
24 additions
and
5 deletions
... | ... | @@ -14,7 +14,17 @@ |
14 | 14 | /// limitations under the License. |
15 | 15 | /// |
16 | 16 | |
17 | -import { AfterViewInit, Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core'; | |
17 | +import { | |
18 | + AfterViewInit, | |
19 | + Component, | |
20 | + ElementRef, | |
21 | + EventEmitter, | |
22 | + forwardRef, | |
23 | + Input, | |
24 | + OnInit, | |
25 | + Output, | |
26 | + ViewChild | |
27 | +} from '@angular/core'; | |
18 | 28 | import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR } from '@angular/forms'; |
19 | 29 | import { Observable } from 'rxjs'; |
20 | 30 | import { map, mergeMap, share, tap } from 'rxjs/operators'; |
... | ... | @@ -28,6 +38,7 @@ import { EntityService } from '@core/http/entity.service'; |
28 | 38 | import { coerceBooleanProperty } from '@angular/cdk/coercion'; |
29 | 39 | import { getCurrentAuthUser } from '@core/auth/auth.selectors'; |
30 | 40 | import { Authority } from '@shared/models/authority.enum'; |
41 | +import { isEqual } from '@core/utils'; | |
31 | 42 | |
32 | 43 | @Component({ |
33 | 44 | selector: 'tb-entity-autocomplete', |
... | ... | @@ -43,7 +54,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
43 | 54 | |
44 | 55 | selectEntityFormGroup: FormGroup; |
45 | 56 | |
46 | - modelValue: string | null; | |
57 | + modelValue: string | EntityId | null; | |
47 | 58 | |
48 | 59 | entityTypeValue: EntityType | AliasEntityType; |
49 | 60 | |
... | ... | @@ -95,6 +106,9 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
95 | 106 | @Input() |
96 | 107 | disabled: boolean; |
97 | 108 | |
109 | + @Output() | |
110 | + entityChanged = new EventEmitter<BaseData<EntityId>>(); | |
111 | + | |
98 | 112 | @ViewChild('entityInput', {static: true}) entityInput: ElementRef; |
99 | 113 | |
100 | 114 | entityText: string; |
... | ... | @@ -135,7 +149,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
135 | 149 | } else { |
136 | 150 | modelValue = value.id.id; |
137 | 151 | } |
138 | - this.updateView(modelValue); | |
152 | + this.updateView(modelValue, value); | |
139 | 153 | if (value === null) { |
140 | 154 | this.clear(); |
141 | 155 | } |
... | ... | @@ -265,10 +279,12 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
265 | 279 | (entity) => { |
266 | 280 | this.modelValue = entity.id.id; |
267 | 281 | this.selectEntityFormGroup.get('entity').patchValue(entity, {emitEvent: false}); |
282 | + this.entityChanged.emit(entity); | |
268 | 283 | }, |
269 | 284 | () => { |
270 | 285 | this.modelValue = null; |
271 | 286 | this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false}); |
287 | + this.entityChanged.emit(null); | |
272 | 288 | if (value !== null) { |
273 | 289 | this.propagateChange(this.modelValue); |
274 | 290 | } |
... | ... | @@ -280,10 +296,12 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
280 | 296 | (entity) => { |
281 | 297 | this.modelValue = entity.id.id; |
282 | 298 | this.selectEntityFormGroup.get('entity').patchValue(entity, {emitEvent: false}); |
299 | + this.entityChanged.emit(entity); | |
283 | 300 | }, |
284 | 301 | () => { |
285 | 302 | this.modelValue = null; |
286 | 303 | this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false}); |
304 | + this.entityChanged.emit(null); | |
287 | 305 | if (value !== null) { |
288 | 306 | this.propagateChange(this.modelValue); |
289 | 307 | } |
... | ... | @@ -311,10 +329,11 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit |
311 | 329 | this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false}); |
312 | 330 | } |
313 | 331 | |
314 | - updateView(value: string | null) { | |
315 | - if (this.modelValue !== value) { | |
332 | + updateView(value: string | EntityId | null, entity: BaseData<EntityId> | null) { | |
333 | + if (!isEqual(this.modelValue, value)) { | |
316 | 334 | this.modelValue = value; |
317 | 335 | this.propagateChange(this.modelValue); |
336 | + this.entityChanged.emit(entity); | |
318 | 337 | } |
319 | 338 | } |
320 | 339 | ... | ... |