forked from dk96/QuotationMaker
262 lines
6.9 KiB
JavaScript
262 lines
6.9 KiB
JavaScript
"use strict";
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
|
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
|
|
|
// Treeview Demo
|
|
// =============================================================
|
|
var TreeviewDemo = /*#__PURE__*/function () {
|
|
function TreeviewDemo() {
|
|
_classCallCheck(this, TreeviewDemo);
|
|
|
|
this.init();
|
|
}
|
|
|
|
_createClass(TreeviewDemo, [{
|
|
key: "init",
|
|
value: function init() {
|
|
// event handlers
|
|
this.handleTreeview();
|
|
}
|
|
}, {
|
|
key: "handleTreeview",
|
|
value: function handleTreeview() {
|
|
// jstree1
|
|
$('#jstree1').jstree({
|
|
plugins: ['types'],
|
|
types: Looper.jsTreeTypes()
|
|
}); // jstree2 - json data
|
|
|
|
$('#jstree2').jstree({
|
|
core: {
|
|
data: [{
|
|
text: 'Root',
|
|
icon: 'fa fa-hdd text-teal',
|
|
state: {
|
|
opened: true
|
|
},
|
|
children: [{
|
|
text: 'Directory',
|
|
icon: 'fa fa-folder text-teal'
|
|
}, {
|
|
text: 'File unread',
|
|
icon: 'far fa-file'
|
|
}, {
|
|
text: 'Another directory',
|
|
icon: 'fa fa-folder text-teal',
|
|
state: {
|
|
opened: true
|
|
},
|
|
children: [{
|
|
text: 'File text',
|
|
icon: 'far fa-file-alt'
|
|
}, {
|
|
text: 'File word',
|
|
icon: 'far fa-file-alt'
|
|
}, {
|
|
text: 'File excel',
|
|
icon: 'far fa-file-excel'
|
|
}, {
|
|
text: 'File powerpoint',
|
|
icon: 'far fa-file-powerpoint',
|
|
state: {
|
|
disabled: true
|
|
}
|
|
}, {
|
|
text: 'File pdf',
|
|
icon: 'far fa-file-pdf'
|
|
}, {
|
|
text: 'File archive',
|
|
icon: 'far fa-file-archive'
|
|
}, {
|
|
text: 'File image',
|
|
icon: 'far fa-file-image'
|
|
}, {
|
|
text: 'File audio',
|
|
icon: 'far fa-file-audio'
|
|
}, {
|
|
text: 'File video',
|
|
icon: 'far fa-file-video'
|
|
}]
|
|
}, {
|
|
text: 'Something else',
|
|
icon: 'fa fa-folder text-teal'
|
|
}, {
|
|
text: 'File unread',
|
|
icon: 'far fa-file'
|
|
}]
|
|
}]
|
|
}
|
|
}); // jstree3 - ajax data
|
|
|
|
$('#jstree3').jstree({
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree1.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
}); // jstree4 - event
|
|
|
|
$('#jstree4').on('changed.jstree', function (e, data) {
|
|
toastr.options = {
|
|
'positionClass': 'toast-bottom-right'
|
|
};
|
|
toastr.info('The selected id is: ' + data.selected);
|
|
}).jstree({
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree1.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
}); // jstree5 - checkbox
|
|
|
|
$('#jstree5').jstree({
|
|
plugins: ['checkbox'],
|
|
checkbox: {
|
|
'keep_selected_style': false
|
|
},
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
}); // jstree6 - contextmenu
|
|
|
|
$('#jstree6').jstree({
|
|
plugins: ['types', 'contextmenu'],
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree3.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
},
|
|
check_callback: true
|
|
},
|
|
types: Looper.jsTreeTypes()
|
|
}); // jstree7 - dnd
|
|
|
|
$('#jstree7').jstree({
|
|
plugins: ['types', 'dnd'],
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree3.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
},
|
|
check_callback: true
|
|
},
|
|
types: Looper.jsTreeTypes()
|
|
}); // jstree8 - massload
|
|
|
|
$('#jstree8').jstree({
|
|
plugins: ['massload', 'state'],
|
|
massload: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(nodes) {
|
|
return {
|
|
ids: nodes.join(',')
|
|
};
|
|
}
|
|
},
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
}); // jstree9 - search
|
|
|
|
$('#jstree9').jstree({
|
|
plugins: ['search'],
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
});
|
|
var to = false;
|
|
$('#jstree9_q').on('keyup', function () {
|
|
if (to) {
|
|
clearTimeout(to);
|
|
}
|
|
|
|
to = setTimeout(function () {
|
|
var v = $('#jstree9_q').val();
|
|
$('#jstree9').jstree(true).search(v);
|
|
}, 250);
|
|
}); // jstree10 - sort
|
|
|
|
$('#jstree10').jstree({
|
|
plugins: ['sort'],
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
}); // jstree11 - wholerow
|
|
|
|
$('#jstree11').jstree({
|
|
plugins: ['wholerow'],
|
|
core: {
|
|
data: {
|
|
url: 'assets/data/jstree2.json',
|
|
data: function data(node) {
|
|
return {
|
|
id: node.id
|
|
};
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return TreeviewDemo;
|
|
}();
|
|
/**
|
|
* Keep in mind that your scripts may not always be executed after the theme is completely ready,
|
|
* you might need to observe the `theme:load` event to make sure your scripts are executed after the theme is ready.
|
|
*/
|
|
|
|
|
|
$(document).on('theme:init', function () {
|
|
new TreeviewDemo();
|
|
}); |