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

100 lines
2.5 KiB
JavaScript
Raw Normal View History

2018-11-12 10:31:58 +00:00
import ngModule from '../../module';
import Component from '../../lib/component';
import './style.scss';
2019-10-02 07:54:52 +00:00
import './childs';
import './content';
2018-11-12 10:31:58 +00:00
/**
2019-04-29 09:49:43 +00:00
* Treeview
2018-11-12 10:31:58 +00:00
*
* @property {String} position The relative position to the parent
*/
export default class Treeview extends Component {
2019-10-01 13:09:55 +00:00
constructor($element, $scope, $transclude) {
2018-11-12 10:31:58 +00:00
super($element, $scope);
2019-04-29 09:49:43 +00:00
this.$scope = $scope;
2019-10-01 13:09:55 +00:00
this.$transclude = $transclude;
2019-10-02 07:54:52 +00:00
this.items = [];
2018-11-12 10:31:58 +00:00
}
2019-01-21 10:45:53 +00:00
$onInit() {
this.refresh();
2018-11-12 10:31:58 +00:00
}
2019-01-21 10:45:53 +00:00
refresh() {
this.model.refresh().then(() => {
2019-10-02 07:54:52 +00:00
this.items = this.model.data;
2019-01-21 10:45:53 +00:00
});
}
2019-03-12 14:04:09 +00:00
/**
* Emits selection event
* @param {Object} item - Selected item
* @param {Boolean} value - Changed value
*/
2019-02-18 07:37:26 +00:00
onSelection(item, value) {
this.emit('selection', {item, value});
2019-01-21 10:45:53 +00:00
}
2019-03-12 14:04:09 +00:00
onCreate(parent) {
this.emit('create', {parent});
}
2019-01-21 10:45:53 +00:00
onToggle(item) {
2019-02-18 07:37:26 +00:00
if (item.active)
2019-01-21 10:45:53 +00:00
item.childs = undefined;
else {
this.model.applyFilter({}, {parentFk: item.id}).then(() => {
2019-02-18 07:37:26 +00:00
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;
});
}
2019-02-18 12:23:24 +00:00
item.childs = newData.sort((a, b) => {
2019-03-12 14:04:09 +00:00
if (b.selected !== a.selected) {
if (a.selected == null)
2019-02-20 11:31:08 +00:00
return 1;
2019-03-12 14:04:09 +00:00
if (b.selected == null)
2019-02-20 11:31:08 +00:00
return -1;
2019-03-12 14:04:09 +00:00
return b.selected - a.selected;
2019-02-20 11:31:08 +00:00
}
return a.name.localeCompare(b.name);
2019-02-18 12:23:24 +00:00
});
2019-01-21 10:45:53 +00:00
});
}
2019-02-18 07:37:26 +00:00
item.active = !item.active;
2018-11-12 10:31:58 +00:00
}
onDrop(item, dragged, dropped) {
this.emit('drop', {item, dragged, dropped});
}
2018-11-12 10:31:58 +00:00
}
2019-10-01 13:09:55 +00:00
Treeview.$inject = ['$element', '$scope', '$transclude'];
2018-11-12 10:31:58 +00:00
ngModule.component('vnTreeview', {
template: require('./index.html'),
controller: Treeview,
bindings: {
2019-03-12 14:04:09 +00:00
model: '<',
icons: '<?',
disabled: '<?',
selectable: '<?',
editable: '<?',
2019-04-29 09:49:43 +00:00
draggable: '<?',
droppable: '<?',
2019-03-12 14:04:09 +00:00
aclRole: '@?'
2019-10-01 13:09:55 +00:00
},
2019-10-02 07:54:52 +00:00
transclude: true
2018-11-12 10:31:58 +00:00
});