From 02c01341f4dae30ec6b81fcb644952393d73c4a8 Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Wed, 5 Aug 2020 00:50:07 +0200 Subject: add ng-select for templatable select options - create select-tags component to replace ngx-chips - create select-options to factorize option selection in forms - create select-channel to simplify channel selection - refactor tags validation --- .../shared-forms/select-channel.component.ts | 51 ++++++++++++++++++++++ 1 file changed, 51 insertions(+) create mode 100644 client/src/app/shared/shared-forms/select-channel.component.ts (limited to 'client/src/app/shared/shared-forms/select-channel.component.ts') diff --git a/client/src/app/shared/shared-forms/select-channel.component.ts b/client/src/app/shared/shared-forms/select-channel.component.ts new file mode 100644 index 000000000..de98c8c0a --- /dev/null +++ b/client/src/app/shared/shared-forms/select-channel.component.ts @@ -0,0 +1,51 @@ +import { Component, Input, forwardRef, ViewChild } from '@angular/core' +import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms' +import { Actor } from '../shared-main' + +@Component({ + selector: 'my-select-channel', + styleUrls: [ './select-shared.component.scss' ], + templateUrl: './select-channel.component.html', + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => SelectChannelComponent), + multi: true + } + ] +}) +export class SelectChannelComponent implements ControlValueAccessor { + @Input() items: { id: number, label: string, support: string, avatarPath?: string }[] = [] + + selectedId: number + + // ng-select options + bindLabel = 'label' + bindValue = 'id' + clearable = false + searchable = false + + get channels () { + return this.items.map(c => Object.assign(c, { + avatarPath: c.avatarPath ? c.avatarPath : Actor.GET_DEFAULT_AVATAR_URL() + })) + } + + propagateChange = (_: any) => { /* empty */ } + + writeValue (id: number) { + this.selectedId = id + } + + registerOnChange (fn: (_: any) => void) { + this.propagateChange = fn + } + + registerOnTouched () { + // Unused + } + + onModelChange () { + this.propagateChange(this.selectedId) + } +} -- cgit v1.2.3