|
|
|
|
@ -163,7 +163,9 @@ var SelectedContainer = function () { |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
var header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); |
|
|
|
|
// console.log("header = ", header);
|
|
|
|
|
console.log("id = ", id); |
|
|
|
|
console.log("chain = ", this.dataTree.getSpecChain(id)); |
|
|
|
|
console.log("header = ", header); |
|
|
|
|
var name = this.dataTree.getElementById(id).name; |
|
|
|
|
this.elements_id.push(id); |
|
|
|
|
if (this.$input) this.$input.val(this.elements_id.join(',')); |
|
|
|
|
@ -343,8 +345,9 @@ var tmpl_elementOption = function tmpl_elementOption(el) { |
|
|
|
|
var htmlTemplate = function htmlTemplate(_ref) { |
|
|
|
|
var header = _ref.header, |
|
|
|
|
selectBox = _ref.selectBox, |
|
|
|
|
id = _ref.id; |
|
|
|
|
return "\n<div class=\"select-box-container\" id=\"" + id + "\">\n <div class=\"select-box-header\">\n <div class=\"header\">" + header + "</div>\n <i class=\"fa fa-question-circle-o\" aria-hidden=\"true\" title=\"bla-bla-bla...\"></i>\n </div>\n <div class=\"select-box-search\">\n " + selectBox + "\n </div>\n <div class=\"select-box-options\">\n <div class=\"box-wrapper\">\n <ul>\n \n </ul>\n </div>\n </div>\n <div class=\"select-box-results\">\n <div class=\"box-wrapper\">\n <div class=\"main-part\">\n <ul>\n </ul>\n </div>\n <div class=\"other-part\">\n <span class=\"other-header\">\u0418\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u043A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u0439</span>\n <ul>\n </ul>\n </div>\n </div>\n <button class=\"button-add results\">\u0414\u041E\u0411\u0410\u0412\u0418\u0422\u042C</button>\n </div>\n <span style=\"clear: both\"></span>\n</div>\n"; |
|
|
|
|
id = _ref.id, |
|
|
|
|
classes = _ref.classes; |
|
|
|
|
return "\n<div class=\"select-box-container " + classes + "\" id=\"" + id + "\">\n <div class=\"select-box-header\">\n <div class=\"header\">" + header + "</div>\n <i class=\"fa fa-question-circle-o\" aria-hidden=\"true\" title=\"bla-bla-bla...\"></i>\n </div>\n <div class=\"select-box-search\">\n " + selectBox + "\n </div>\n <div class=\"select-box-options\">\n <div class=\"box-wrapper\">\n <ul>\n \n </ul>\n </div>\n </div>\n <div class=\"select-box-results\">\n <div class=\"box-wrapper\">\n <div class=\"main-part\">\n <ul>\n </ul>\n </div>\n <div class=\"other-part\">\n <span class=\"other-header\">\u0418\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u043A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u0439</span>\n <ul>\n </ul>\n </div>\n </div>\n <button class=\"button-add results\">\u0414\u041E\u0411\u0410\u0412\u0418\u0422\u042C</button>\n </div>\n <span style=\"clear: both\"></span>\n</div>\n"; |
|
|
|
|
}; |
|
|
|
|
var tmpl_light = function tmpl_light(el) { |
|
|
|
|
return "<span class=\"highlight\">" + el + "</span>"; |
|
|
|
|
@ -363,14 +366,15 @@ var AbsBaseSelect = function () { |
|
|
|
|
if (new.target === AbsBaseSelect) { |
|
|
|
|
throw new TypeError("Cannot construct Abstract instances directly"); |
|
|
|
|
} |
|
|
|
|
//TODO: добавить применение классов контейнера
|
|
|
|
|
//TODO: проверка наличия id контейнера
|
|
|
|
|
this.containerId = $container.attr("id"); |
|
|
|
|
this.dataTree = data; |
|
|
|
|
console.log("data = ", data); |
|
|
|
|
// console.log("data = ", data);
|
|
|
|
|
// Вариант не выбран
|
|
|
|
|
this.hasEditableContainer = hasEditableContainer; |
|
|
|
|
var template = this.getTemplate(); |
|
|
|
|
var classes = $container.attr('class'); |
|
|
|
|
if (classes) classes = classes.split(/\s+/); |
|
|
|
|
var template = this.getTemplate(classes); |
|
|
|
|
$container.replaceWith(template); |
|
|
|
|
this._buildComponents(); |
|
|
|
|
this._bindEvents(); |
|
|
|
|
@ -386,14 +390,15 @@ var AbsBaseSelect = function () { |
|
|
|
|
|
|
|
|
|
_createClass(AbsBaseSelect, [{ |
|
|
|
|
key: "getTemplate", |
|
|
|
|
value: function getTemplate() { |
|
|
|
|
value: function getTemplate(classes) { |
|
|
|
|
var selectBox = this.hasEditableContainer ? tmpl_selectBoxEditCont() : tmpl_selectBox(); |
|
|
|
|
return htmlTemplate({ header: "TestHeader", selectBox: selectBox, id: this.containerId }); |
|
|
|
|
classes = classes ? classes.join(" ") : ""; |
|
|
|
|
return htmlTemplate({ header: "TestHeader", selectBox: selectBox, id: this.containerId, classes: classes }); |
|
|
|
|
} |
|
|
|
|
}, { |
|
|
|
|
key: "clear", |
|
|
|
|
value: function clear() { |
|
|
|
|
console.log("clear"); |
|
|
|
|
// console.log("clear");
|
|
|
|
|
this.$searchInput.val(""); |
|
|
|
|
this.$optionsBox.hide(); |
|
|
|
|
this.$resultsBox.hide(); |
|
|
|
|
@ -448,7 +453,7 @@ var AbsBaseSelect = function () { |
|
|
|
|
if (this.$editableContainer.length) { |
|
|
|
|
var separator = ' / '; |
|
|
|
|
var chainHeader = AbsBaseSelect.getHeader(this.dataTree.getSpecChain(elId, true), { separator: separator }); |
|
|
|
|
console.log('chainHeader = ', chainHeader); |
|
|
|
|
// console.log('chainHeader = ', chainHeader);
|
|
|
|
|
chainHeader = AbsBaseSelect.highlight(chainHeader, separator, true); |
|
|
|
|
var elTemplate = "<span class=\"\">" + chainHeader + "</span>"; |
|
|
|
|
this.$editableContainer.html(elTemplate); |
|
|
|
|
@ -543,7 +548,7 @@ var AbsBaseSelect = function () { |
|
|
|
|
$('.other-part').show(); |
|
|
|
|
var searchRes = search({ searchText: searchText, parentCategoryId: parentCategoryId, excludeCategoryId: excludeCategoryId }); |
|
|
|
|
// || (!excludeCategoryId && parentCategoryId === null)
|
|
|
|
|
console.log("searchRes = ", searchRes); |
|
|
|
|
// console.log("searchRes = ", searchRes);
|
|
|
|
|
if (!searchRes.length) { |
|
|
|
|
if ($container.closest('div').hasClass('main-part')) { |
|
|
|
|
$container.append('<li>Ничего не найдено</li>'); |
|
|
|
|
@ -606,12 +611,12 @@ var AbsBaseSelect = function () { |
|
|
|
|
|
|
|
|
|
this.$resultsBox.find('li').on("mouseout", function (event) { |
|
|
|
|
var e = event.toElement || event.relatedTarget; |
|
|
|
|
console.log(e.parentNode, ' ==', this); |
|
|
|
|
console.log(e, ' ==', this); |
|
|
|
|
// console.log(e.parentNode, ' ==', this);
|
|
|
|
|
// console.log(e, ' ==', this);
|
|
|
|
|
if (e.parentNode == this || e == this) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
console.log("OUT"); |
|
|
|
|
// console.log("OUT");
|
|
|
|
|
$(this).find('.header').hide(); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
@ -639,7 +644,7 @@ var AbsBaseSelect = function () { |
|
|
|
|
var self = this; |
|
|
|
|
|
|
|
|
|
this.getIdsSelectedElements().each(function () { |
|
|
|
|
console.log("add el -->", this); |
|
|
|
|
// console.log("add el -->", this);
|
|
|
|
|
self._addToSelectedContainer(this); |
|
|
|
|
}); |
|
|
|
|
this.clear(); |
|
|
|
|
@ -691,7 +696,7 @@ var AbsBaseSelect = function () { |
|
|
|
|
} else { |
|
|
|
|
this.$searchInput.val(this.selectedEl.value); |
|
|
|
|
} |
|
|
|
|
console.log("loose ", this.selectedEl.id); |
|
|
|
|
// console.log("loose ", this.selectedEl.id);
|
|
|
|
|
} |
|
|
|
|
}], [{ |
|
|
|
|
key: "getHeader", |
|
|
|
|
@ -719,7 +724,7 @@ var AbsBaseSelect = function () { |
|
|
|
|
var lastIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; |
|
|
|
|
|
|
|
|
|
var index = lastIndex ? string.toLowerCase().lastIndexOf(sub_string.toLowerCase()) : string.toLowerCase().indexOf(sub_string.toLowerCase()); |
|
|
|
|
console.log("index = ", index); |
|
|
|
|
// console.log("index = ", index);
|
|
|
|
|
if (index === -1) return string; |
|
|
|
|
var before = void 0, |
|
|
|
|
select = void 0, |
|
|
|
|
@ -884,6 +889,7 @@ var DataTree = function () { |
|
|
|
|
|
|
|
|
|
var chain = []; |
|
|
|
|
var el = this.getElementById(id); |
|
|
|
|
console.log("el = ", el); |
|
|
|
|
function getParent(el) { |
|
|
|
|
if (el.parent && el.parent != "root") { |
|
|
|
|
chain.push(el.parent); |
|
|
|
|
@ -1019,7 +1025,7 @@ $(function () { |
|
|
|
|
function createFilerLocations(data) { |
|
|
|
|
var sb_loc_main = new _TreeSelect2.default({ $container: $('#sb-location-1'), data: data }); |
|
|
|
|
sb_loc_main.setHeader("Местоположение"); |
|
|
|
|
var select_loc = new _SelectedContainer2.default($('#selected-location'), data, true); |
|
|
|
|
var select_loc = new _SelectedContainer2.default($('#selected-location'), data); |
|
|
|
|
sb_loc_main.connectSelectedContainer(select_loc); |
|
|
|
|
var sb_loc_1 = new _TreeSelect2.default({ $container: $('#sb-location-2'), data: data }); |
|
|
|
|
var sb_loc_2 = new _TreeSelect2.default({ $container: $('#sb-location-3'), data: data }); |
|
|
|
|
@ -1073,18 +1079,22 @@ $(function () { |
|
|
|
|
fullData({ next: '/api/locations_flat', results: [] }); |
|
|
|
|
|
|
|
|
|
function tuneCheckBoxes($boxes) { |
|
|
|
|
$boxes.each(function () { |
|
|
|
|
if ($(this).find("input").prop("checked")) $(this).toggleClass('checked'); |
|
|
|
|
}); |
|
|
|
|
$boxes.on("click", function (e) { |
|
|
|
|
$(e.target).toggleClass('checked'); |
|
|
|
|
$(e.target).attr('data-state', $(e.target).attr('data-state') == 'enabled' ? 'disabled' : 'enabled'); |
|
|
|
|
var inside_checkBox = $(e.target).find("input"); |
|
|
|
|
inside_checkBox.prop("checked", !inside_checkBox.prop("checked")); |
|
|
|
|
}); |
|
|
|
|
var currentState = $boxes.find("input").prop("checked") ? 'checked' : 'not-checked'; |
|
|
|
|
console.log("currentState = ", currentState); |
|
|
|
|
|
|
|
|
|
$boxes.find("div").hide(); |
|
|
|
|
$boxes.find("div." + currentState).show(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
tuneCheckBoxes($('.custom-check')); |
|
|
|
|
var $boxes = $('.custom-check'); |
|
|
|
|
tuneCheckBoxes($boxes); |
|
|
|
|
$boxes.on("click", function (e) { |
|
|
|
|
var inside_checkBox = $(e.target).parent().find("input"); |
|
|
|
|
inside_checkBox.prop("checked", !inside_checkBox.prop("checked")); |
|
|
|
|
tuneCheckBoxes($boxes); |
|
|
|
|
e.preventDefault(); |
|
|
|
|
return false; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// $(window).on('load',
|
|
|
|
|
// function hidePreloader() {
|
|
|
|
|
|
booblegum
9 years ago