salix/client/core/src/multi-check/multi-check.js

import {module} from '../module';
import './multi-check.scss';
/**
 * Draw checkbox with a drop-down and multi options
 * @param {Array} options List of options shown in drop-down
 * @param {Array} models Elements to check / unCheck
 * @param {String} className Optional css class name
 */
export default class MultiCheck {
    constructor() {
        this._checkAll = 0;
        this._models = [];
        this.type = {};
        this.showDropDown = false;
    }

    get models() {
        return this._models;
    }

    set models(value) {
        this._models = value;
    }

    get checkAll() {
        return this._checkAll;
    }

    set checkAll(value) {
        this._checkAll = value;
        this.switchChecks();
    }

    switchChecks() {
        if (this.models)
            this.models.forEach(
                el => {
                    let checked;
                    if (this.type.id && this.type.id !== 'all' && this.type.id !== 'any') {
                        if (this.type.id.length > 3 && this.type.id.substr(0, 3) === 'no-') {
                            checked = el[this.type.id.replace('no-', '')] == null;
                        } else if (this.type.id.length > 6 && this.type.id.substr(0, 6) === 'equal-') {
                            let label = this.type.id.replace('equal-', '');
                            checked = (el[label] && el[label] === this.type.name);
                        } else {
                            checked = el[this.type.id] != null;
                        }
                    } else {
                        checked = this.checkAll === 1;
                    }
                    el.checked = checked;
                }
            );
    }

    $onChanges() {
        this.type = {};
        this.checkAll = 0;
    }

    $doCheck() {
        if (this.type && this.type.id) {
            switch (this.type.id) {
            case 'all':
                this.checkAll = 1;
                break;
            case 'any':
                this.checkAll = 0;
                break;
            default:
                this.checkAll = 2;
                break;
            }
            this.type = {};
        }
    }
}

MultiCheck.$inject = [];

module.component('vnMultiCheck', {
    template: require('./multi-check.html'),
    controller: MultiCheck,
    bindings: {
        checkAll: '=',
        options: '<',
        models: '=',
        className: '@?'
    }
});