salix/front/core/components/treeview/index.js

import ngModule from '../../module';
import Component from '../../lib/component';
import './style.scss';

import './childs';
import './content';

/**
 * Treeview
 *
 * @property {String} position The relative position to the parent
 */
export default class Treeview extends Component {
    constructor($element, $scope, $transclude) {
        super($element, $scope);
        this.$transclude = $transclude;
        this.items = [];
    }

    $onInit() {
        this.refresh();
    }

    refresh() {
        this.model.refresh().then(() => {
            this.items = this.model.data;
        });
    }

    onToggle(item) {
        if (item.active)
            this.fold(item);
        else
            this.unfold(item);
    }

    fold(item) {
        item.childs = undefined;
        item.active = false;
    }

    unfold(item) {
        return this.model.applyFilter({}, {parentFk: item.id}).then(() => {
            const newData = this.model.data;

            if (item.childs) {
                let childs = item.childs;
                childs.forEach(child => {
                    let index = newData.findIndex(newChild => {
                        return newChild.id == child.id;
                    });
                    newData[index] = child;
                });
            }

            item.childs = newData.sort((a, b) => {
                if (b.selected !== a.selected) {
                    if (a.selected == null)
                        return 1;
                    if (b.selected == null)
                        return -1;
                    return b.selected - a.selected;
                }

                return a.name.localeCompare(b.name);
            });
        }).then(() => item.active = true);
    }

    onDrop(item, dragged, dropped) {
        this.emit('drop', {item, dragged, dropped});
    }

    onRemove(item, items, parent) {
        if (!this.removeFunc) return;
        let res = this.removeFunc({$item: item, $parent: parent});

        function remove() {
            let index = items.indexOf(item);
            items.splice(index, 1);
            if (parent) parent.sons--;
        }

        if (res instanceof Object && res.then)
            res.then(remove);
        else if (res)
            remove();
    }

    onCreate(parent, childs) {
        if (!this.createFunc) return;
        let res = this.createFunc({$parent: parent, $childs: childs});

        function create() {
            if (!childs) childs = [];
            childs.push(res);
            if (parent) parent.sons++;
        }

        if (res instanceof Object && res.then) {
            if (parent && !parent.active)
                this.unfold(parent).then(() => res.then(create));
            else res.then(create);
        } else if (res) {
            if (parent && !parent.active)
                this.unfold(parent).then(() => create());
            else create();
        } else if (parent && !parent.active)
            this.unfold(parent);
    }

    /* onCreate(parent, childs) {
        if (!this.createFunc) return;
        let res = this.createFunc({$parent: parent});

        function create() {
            if (!childs) childs = [];

            childs.push(res);

            if (parent) parent.sons++;
        }

        if (res instanceof Object && res.then) {
            if (!parent.active)
                this.unfold(parent).then(() => res.then(create));
            else res.then(create);
        } else if (res) {
            if (!parent.active)
                this.unfold(parent).then(() => create());
            else create();
        }
    } */
}

Treeview.$inject = ['$element', '$scope', '$transclude'];

ngModule.component('vnTreeview', {
    template: require('./index.html'),
    controller: Treeview,
    bindings: {
        model: '<',
        icons: '<?',
        disabled: '<?',
        selectable: '<?',
        editable: '<?',
        draggable: '<?',
        droppable: '<?',
        aclRole: '@?',
        removeFunc: '&?',
        createFunc: '&?'
    },
    transclude: true
});