diff --git a/assets/lib/proekton-components/build/init.js b/assets/lib/proekton-components/build/init.js index e082848..131b7a0 100644 --- a/assets/lib/proekton-components/build/init.js +++ b/assets/lib/proekton-components/build/init.js @@ -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
\n
\n
" + header + "
\n \n
\n
\n " + selectBox + "\n
\n
\n
\n
    \n \n
\n
\n
\n
\n
\n
\n
    \n
\n
\n
\n \u0418\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u043A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u0439\n
    \n
\n
\n
\n \n
\n \n
\n"; + id = _ref.id, + classes = _ref.classes; + return "\n
\n
\n
" + header + "
\n \n
\n
\n " + selectBox + "\n
\n
\n
\n
    \n \n
\n
\n
\n
\n
\n
\n
    \n
\n
\n
\n \u0418\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u043A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u0439\n
    \n
\n
\n
\n \n
\n \n
\n"; }; var tmpl_light = function tmpl_light(el) { return "" + el + ""; @@ -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 = "" + chainHeader + ""; 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('
  • Ничего не найдено
    • '); @@ -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() { diff --git a/assets/lib/proekton-components/css/other.css b/assets/lib/proekton-components/css/other.css index 0a73de3..771bc63 100644 --- a/assets/lib/proekton-components/css/other.css +++ b/assets/lib/proekton-components/css/other.css @@ -1,5 +1,5 @@ /*DEMO*/ -.wrapper{ +.wrapper { background-color: #f2f2f2; padding: 40px; margin: 50px 30px; @@ -14,21 +14,44 @@ margin-bottom: 5px; } -.custom-check { +.custom-check{ + cursor: pointer; + display: inline-block +} + +.custom-check .checked{ background: url("../img/rect01.png") no-repeat center; background-size: 210px 51px; width: 210px; height: 51px; - cursor: pointer; } -.custom-check.checked { +.custom-check .not-checked { background: url("../img/rect02.png") no-repeat center; background-size: 210px 51px; width: 210px; height: 51px; } +.titleResF1, div p.titleResF1 { + font-size: 12pt; +} + +.border:after { + background-color: #CFCFCF; + content: ""; + display: inline-block; + height: 1px; + position: relative; + vertical-align: middle; + width: 100%; +} + +.border:after { + left: 0.5em; + margin-right: -100%; +} + #page-preloader { position: absolute; left: 0; diff --git a/assets/lib/proekton-components/css/select-box.css b/assets/lib/proekton-components/css/select-box.css index 5b8def4..c87fec6 100644 --- a/assets/lib/proekton-components/css/select-box.css +++ b/assets/lib/proekton-components/css/select-box.css @@ -64,16 +64,16 @@ display: block; max-height: 200px; overflow-y: auto; - /*border: 1px solid #cccccc;*/ + border-top: 1px solid #cccccc; background-color: #F2F2F2; - box-shadow: 0 12px 10px -6px rgba(0, 0, 0, .2); + box-shadow: 5px 12px 10px -6px rgba(0, 0, 0, .2); } .select-box-results input[type=checkbox] { margin: 0 5px 0 5px; } -.select-box-results .header{ +.select-box-results .header { font-size: 8pt; color: #757575; pointer-events: none; @@ -109,10 +109,10 @@ } /*.select-box-results span:hover{*/ - /*color: green;*/ +/*color: green;*/ /*}*/ /*.select-box-search{*/ - /*position: relative;*/ +/*position: relative;*/ /*}*/ input.select-box-search { @@ -127,6 +127,17 @@ input.select-box-search { margin-bottom: -1px; } +input.select-box-search:-webkit-autofill, +input.select-box-search:-webkit-autofill:hover, +input.select-box-search:-webkit-autofill:focus, +input.select-box-search:-webkit-autofill { + /*border: 0;*/ + /*-webkit-text-fill-color: black;*/ + /*-webkit-box-shadow: 0 0 0 1000px transparent inset;*/ + transition: background-color 5000s ease-in-out 0s; + /*background: white;*/ +} + .select-box-results .main-part { display: block; } @@ -148,46 +159,32 @@ input.select-box-search { min-width: 300px; max-width: 400px; } -button.button-add{ + +button.button-add { box-shadow: none; border: none; } .button-add { - /*position: absolute;*/ + position: relative; + top: 3px; float: right; z-index: 999; font-family: Myriad; font-weight: normal; font-style: normal; - font-size: 12pt; + font-size: 10pt; -moz-border-radius: 15px; /* Firefox */ -webkit-border-radius: 15px; /* Safari 4 */ border-radius: 15px; /* IE 9, Safari 5, Chrome */ background-color: #FF0029; - padding: 0 15px; + padding: 4px 15px 2px 15px; /*border: none;*/ text-decoration: none; color: white; } -/*.button-add .results {*/ - /*position: absolute;*/ - /*left: 280px;*/ - /*z-index: 999;*/ -/*}*/ - -/*.button-add.options {*/ - /*position: absolute;*/ - /*!*FIXME: костыль*!*/ - /*left: 160px;*/ - /*z-index: 999;*/ - /*!*right: auto;*!*/ - /*!*@position: absolute;*!*/ - /*!*top: 40px;*!*/ -/*}*/ - .highlight { color: red; } diff --git a/assets/lib/proekton-components/src/base/AbsBaseSelect.js b/assets/lib/proekton-components/src/base/AbsBaseSelect.js index d54bc76..c49a497 100644 --- a/assets/lib/proekton-components/src/base/AbsBaseSelect.js +++ b/assets/lib/proekton-components/src/base/AbsBaseSelect.js @@ -23,9 +23,9 @@ const tmpl_elementResult = (el, id, header) => const tmpl_elementOption = (el) => `
  • ${el.name}
    • `; //${vertical_child} -const htmlTemplate = ({header, selectBox, id}) => +const htmlTemplate = ({header, selectBox, id, classes}) => ` -
    +
    ${header}
    @@ -65,18 +65,18 @@ export default class AbsBaseSelect { 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; - let template = this.getTemplate(); + let classes = $container.attr('class'); + if (classes) classes = classes.split(/\s+/); + let template = this.getTemplate(classes); $container.replaceWith(template); this._buildComponents(); this._bindEvents(); - // if (!has_editable_container) this.hide(); // INIT EMPTY PROP this.selectedEl = {id: undefined, value: undefined}; this.parentId = undefined; @@ -84,9 +84,10 @@ export default class AbsBaseSelect { } // getTemplate(header, id, editable_container, vertical_child) { - getTemplate() { + getTemplate(classes) { let selectBox = this.hasEditableContainer ? tmpl_selectBoxEditCont() : tmpl_selectBox(); - return htmlTemplate({header: "TestHeader", selectBox, id: this.containerId}) + classes = classes ? classes.join(" "): ""; + return htmlTemplate({header: "TestHeader", selectBox, id: this.containerId, classes}) } static getHeader(catChain, {separator = " / ", maxLen = 60}) { @@ -107,7 +108,6 @@ export default class AbsBaseSelect { let index = lastIndex ? string.toLowerCase().lastIndexOf(sub_string.toLowerCase()) : string.toLowerCase().indexOf(sub_string.toLowerCase()); - console.log("index = ", index); if (index === -1) return string; let before, select, after; if (lastIndex) { @@ -124,7 +124,6 @@ export default class AbsBaseSelect { } clear() { - console.log("clear"); this.$searchInput.val(""); this.$optionsBox.hide(); this.$resultsBox.hide(); @@ -172,7 +171,6 @@ export default class AbsBaseSelect { if (this.$editableContainer.length) { const separator = ' / '; let chainHeader = AbsBaseSelect.getHeader(this.dataTree.getSpecChain(elId, true), {separator: separator}); - console.log('chainHeader = ', chainHeader); chainHeader = AbsBaseSelect.highlight(chainHeader, separator, true); let elTemplate = `${chainHeader}`; this.$editableContainer.html(elTemplate); @@ -220,8 +218,6 @@ export default class AbsBaseSelect { function search({searchText, parentCategoryId = null, excludeCategoryId = null}) { // :FORMAT spec_list [{name, id}, ...] let specList = self.dataTree.dataToList(parentCategoryId, true, excludeCategoryId); - // console.log("search -->", spec_list.length); - // console.log("parent_id ", parentCategoryId); return specList.filter(function (el) { return el.name.toLowerCase().indexOf(searchText.toLowerCase()) !== -1; }); @@ -231,8 +227,6 @@ export default class AbsBaseSelect { $container.html(""); $('.other-part').show(); let searchRes = search({searchText, parentCategoryId, excludeCategoryId}); - // || (!excludeCategoryId && parentCategoryId === null) - console.log("searchRes = ", searchRes); if (!searchRes.length) { if ($container.closest('div').hasClass('main-part')) { $container.append('
  • Ничего не найдено
    • '); @@ -258,7 +252,6 @@ export default class AbsBaseSelect { // OTHER PART // Если нет parentId, не нужно искать в других категориях - // console.log("parentID = ", this.parentId); if (!this.parentId) { $('.other-part').hide(); } else { @@ -275,12 +268,9 @@ export default class AbsBaseSelect { this.$resultsBox.find('li').on("mouseout", function (event) { let e = event.toElement || event.relatedTarget; - console.log(e.parentNode, ' ==', this); - console.log(e, ' ==', this); if (e.parentNode == this || e == this) { return; } - console.log("OUT"); $(this).find('.header').hide(); }) @@ -307,7 +297,6 @@ export default class AbsBaseSelect { let self = this; this.getIdsSelectedElements().each(function () { - console.log("add el -->", this); self._addToSelectedContainer(this); }); this.clear(); @@ -357,6 +346,5 @@ export default class AbsBaseSelect { } else { this.$searchInput.val(this.selectedEl.value); } - console.log("loose ", this.selectedEl.id); } } \ No newline at end of file diff --git a/assets/lib/proekton-components/src/init.js b/assets/lib/proekton-components/src/init.js index d7a525e..d1b5fbc 100644 --- a/assets/lib/proekton-components/src/init.js +++ b/assets/lib/proekton-components/src/init.js @@ -49,12 +49,12 @@ $(function () { } function createFilerLocations(data) { - let sb_loc_main = new TreeSelect({$container:$('#sb-location-1'), data: data}); + let sb_loc_main = new TreeSelect({$container: $('#sb-location-1'), data: data}); sb_loc_main.setHeader("Местоположение"); - let select_loc = new SelectedContainer($('#selected-location'), data, true); + let select_loc = new SelectedContainer($('#selected-location'), data); sb_loc_main.connectSelectedContainer(select_loc); - let sb_loc_1 = new TreeSelect({$container:$('#sb-location-2'), data: data}); - let sb_loc_2 = new TreeSelect({$container:$('#sb-location-3'), data: data}); + let sb_loc_1 = new TreeSelect({$container: $('#sb-location-2'), data: data}); + let sb_loc_2 = new TreeSelect({$container: $('#sb-location-3'), data: data}); sb_loc_main.setNearbySelectBox(sb_loc_1); sb_loc_1.setNearbySelectBox(sb_loc_2, sb_loc_main); @@ -106,19 +106,20 @@ $(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') - let inside_checkBox = $(e.target).find("input"); - inside_checkBox.prop("checked", !inside_checkBox.prop("checked")); - - }); + let currentState = $boxes.find("input").prop("checked") ? 'checked' : 'not-checked'; + $boxes.find("div").hide(); + $boxes.find("div." + currentState).show(); } - tuneCheckBoxes($('.custom-check')); + let $boxes = $('.custom-check'); + tuneCheckBoxes($boxes); + $boxes.on("click", function (e) { + let 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() { diff --git a/projects/templates/partials/inc-projects-filter.html b/projects/templates/partials/inc-projects-filter.html index 0c83222..243cdce 100644 --- a/projects/templates/partials/inc-projects-filter.html +++ b/projects/templates/partials/inc-projects-filter.html @@ -10,16 +10,16 @@
    -
    +
    -
    +
    -
    +
    -
    +
    @@ -47,7 +47,7 @@ name="keywords" onkeydown="event.keyCode === 13 && $(this).closest('form').submit()" value="{{ form.keywords.value }}" - class="searchInp box-sizing" + class="select-box-search searchInp box-sizing" placeholder="Ключевые слова, фразы">
    @@ -80,51 +80,43 @@
    -
    -
    -
    -
    -
    -
    +
    +
    -
    -
    -
    +
    -
    -
    -
    -
    -
    -
    -
    -
    -
    +
    +
    +
    -
    -
    - Требуется допуск (СРО) - -
    -
    - -
    +
    + Требуется допуск (СРО) + +
    +{#
    #} +{# #} +{#
    #} + +
    +
    +
    +