2 * <eg-multi-select idlClass="acpl" linkedLibraryLabel="owning_lib">
5 import {Component, OnInit, Input, Output, ViewChild, EventEmitter, ElementRef} from '@angular/core';
6 import {map} from 'rxjs/operators';
7 import {Observable, of, Subject} from 'rxjs';
8 import {StoreService} from '@eg/core/store.service';
9 import {PcrudService} from '@eg/core/pcrud.service';
10 import {ComboboxComponent, ComboboxEntry} from '@eg/share/combobox/combobox.component';
13 selector: 'eg-multi-select',
14 templateUrl: './multi-select.component.html',
16 .icons {margin-left:-18px}
17 .material-icons {font-size: 16px;font-weight:bold}
20 export class MultiSelectComponent implements OnInit {
22 selected: ComboboxEntry;
23 entrylist: ComboboxEntry[];
25 @Input() idlClass: string;
26 @Input() linkedLibraryLabel: string;
27 @Input() startValue: string;
29 @Output() onChange: EventEmitter<string>;
32 private store: StoreService,
33 private pcrud: PcrudService,
36 this.onChange = new EventEmitter<string>();
39 valueSelected(entry: ComboboxEntry) {
41 this.selected = entry;
47 this.entrylist.push(this.selected);
48 this.onChange.emit(this.compileCurrentValue());
50 removeValue(entry: ComboboxEntry) {
51 this.entrylist = this.entrylist.filter(ent => ent.id !== entry.id);
52 this.onChange.emit(this.compileCurrentValue());
55 compileCurrentValue(): string {
56 const valstr = this.entrylist.map(entry => entry.id).join(',');
57 return '{' + valstr + '}';
61 if (this.startValue && this.startValue !== '{}') {
62 let valstr = this.startValue;
63 valstr = valstr.replace(/^{/, '');
64 valstr = valstr.replace(/}$/, '');
65 const ids = valstr.split(',');
66 const extra_args = {};
67 if (this.linkedLibraryLabel) {
68 const flesh_fields: Object = {};
69 flesh_fields[this.idlClass] = [ this.linkedLibraryLabel ];
70 extra_args['flesh'] = 1;
71 extra_args['flesh_fields'] = flesh_fields;
72 this.pcrud.search(this.idlClass, { 'id' : ids }, extra_args).pipe(map(data => {
75 'label' : data.name() + ' (' + data[this.linkedLibraryLabel]().shortname() + ')'
79 this.pcrud.search(this.idlClass, { 'id' : ids }, extra_args).pipe(map(data => {
80 this.entrylist.push({ 'id' : data.id(), 'label' : data.name() });