checkbox.component.ts 2.2 KB
Newer Older
François Agneray's avatar
François Agneray committed
1
2
3
import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
import { FormControl, FormArray } from '@angular/forms';

Tifenn Guillas's avatar
Tifenn Guillas committed
4
5
import { Criterion, SelectMultipleCriterion } from '../../../store/model';
import { Option } from '../../../../metamodel/model';
François Agneray's avatar
François Agneray committed
6
7
8
9
10
11
12
13

@Component({
    selector: 'app-checkbox',
    templateUrl: 'checkbox.component.html',
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class CheckboxComponent {
    @Input() id: number;
François Agneray's avatar
François Agneray committed
14
    @Input() operator: string;
François Agneray's avatar
François Agneray committed
15
16
17
18
19
20
21
22
23
24
    @Input() label: string;
    @Input()
    set options(options: Option[]) {
        this._options = options;
        this.setCheckboxes(options);
    }
    @Input()
    set criterion(criterion: Criterion) {
        this.getDefault(criterion);
    }
François Agneray's avatar
François Agneray committed
25
    @Output() add: EventEmitter<SelectMultipleCriterion> = new EventEmitter();
François Agneray's avatar
François Agneray committed
26
27

    checkboxes: FormArray;
François Agneray's avatar
François Agneray committed
28
    checkboxesFormControls: {value: string, control: FormControl}[];
François Agneray's avatar
François Agneray committed
29
30
31
32
33
34
35
36
37
    _options: Option[];

    addCriterion() {
        const values: Option[] = [];
        this.checkboxes.controls.forEach((formControl, i) => {
            if (formControl.value) {
                values.push(this._options[i]);
            }
        });
François Agneray's avatar
François Agneray committed
38
        const cb = new SelectMultipleCriterion(this.id, this.operator, values);
François Agneray's avatar
François Agneray committed
39
40
41
42
        this.add.emit(cb);
    }

    setCheckboxes(options: Option[]) {
François Agneray's avatar
François Agneray committed
43
44
45
46
47
        this.checkboxesFormControls = [];
        this.checkboxes = new FormArray(options.map((option: Option) => {
            const control = new FormControl(false);
            this.checkboxesFormControls.push({value: option.value, control});
            return control;
François Agneray's avatar
François Agneray committed
48
49
50
51
52
53
54
55
        }));
    }

    getDefault(criterion: Criterion): void {
        if (!criterion) {
            this.checkboxes.reset();
            this.checkboxes.enable();
        } else {
François Agneray's avatar
François Agneray committed
56
57
58
59
            const checkboxCriterion = criterion as SelectMultipleCriterion;
            checkboxCriterion.options.map(option => {
                this.checkboxesFormControls.find(formControl => formControl.value === option.value).control.setValue(true);
            })
François Agneray's avatar
François Agneray committed
60
61
62
63
64
65
66
67
            this.checkboxes.disable();
        }
    }

    isChecked() {
        return this.checkboxes.controls.filter(formControl => formControl.value).length > 0;
    }
}