diff --git a/.babelrc b/.babelrc index c13c5f6..32848ab 100644 --- a/.babelrc +++ b/.babelrc @@ -1,3 +1,8 @@ { - "presets": ["es2015"] -} + "presets": [ + "es2015" + ], + "plugins": [ + "transform-decorators-legacy" + ] +} \ No newline at end of file diff --git a/assets/css/reset.css b/assets/css/reset.css index 3c5f193..35eeb3d 100644 --- a/assets/css/reset.css +++ b/assets/css/reset.css @@ -17,17 +17,17 @@ body, code, dl, dd, form, pre { margin: 0; } -a:link { - color: #009; -} +/*a:link {*/ + /*color: #009;*/ +/*}*/ a:link, a:visited, ins { text-decoration: none; } -a:visited { - color: #505; -} +/*a:visited {*/ + /*color: #505;*/ +/*}*/ a:link img, a:visited img, object, fieldset, abbr, acronym { border: none; diff --git a/assets/img/avatar_default.png b/assets/img/avatar_default.png new file mode 100644 index 0000000..30c099e Binary files /dev/null and b/assets/img/avatar_default.png differ diff --git a/assets/js/jquery.mask.min.js b/assets/js/jquery.mask.min.js new file mode 100644 index 0000000..16460bb --- /dev/null +++ b/assets/js/jquery.mask.min.js @@ -0,0 +1,15 @@ +// jQuery Mask Plugin v1.14.0 +// github.com/igorescobar/jQuery-Mask-Plugin +(function(b){"function"===typeof define&&define.amd?define(["jquery"],b):"object"===typeof exports?module.exports=b(require("jquery")):b(jQuery||Zepto)})(function(b){var y=function(a,e,d){var c={invalid:[],getCaret:function(){try{var r,b=0,e=a.get(0),d=document.selection,f=e.selectionStart;if(d&&-1===navigator.appVersion.indexOf("MSIE 10"))r=d.createRange(),r.moveStart("character",-c.val().length),b=r.text.length;else if(f||"0"===f)b=f;return b}catch(g){}},setCaret:function(r){try{if(a.is(":focus")){var c, +b=a.get(0);b.setSelectionRange?(b.focus(),b.setSelectionRange(r,r)):(c=b.createTextRange(),c.collapse(!0),c.moveEnd("character",r),c.moveStart("character",r),c.select())}}catch(e){}},events:function(){a.on("keydown.mask",function(c){a.data("mask-keycode",c.keyCode||c.which)}).on(b.jMaskGlobals.useInput?"input.mask":"keyup.mask",c.behaviour).on("paste.mask drop.mask",function(){setTimeout(function(){a.keydown().keyup()},100)}).on("change.mask",function(){a.data("changed",!0)}).on("blur.mask",function(){n=== +c.val()||a.data("changed")||a.trigger("change");a.data("changed",!1)}).on("blur.mask",function(){n=c.val()}).on("focus.mask",function(a){!0===d.selectOnFocus&&b(a.target).select()}).on("focusout.mask",function(){d.clearIfNotMatch&&!p.test(c.val())&&c.val("")})},getRegexMask:function(){for(var a=[],c,b,d,f,l=0;l\n
\n ' + header + '\n
\n
\n ' + name + '\n
\n \n \n'; }; -var SelectedContainer = function () { +var SelectedContainer = (_class = function () { function SelectedContainer($container, _ref) { var _this = this; var obj = _ref.obj, _ref$noTree = _ref.noTree, - noTree = _ref$noTree === undefined ? false : _ref$noTree; + noTree = _ref$noTree === undefined ? false : _ref$noTree, + _ref$onlyOne = _ref.onlyOne, + onlyOne = _ref$onlyOne === undefined ? false : _ref$onlyOne; _classCallCheck(this, SelectedContainer); // TODO: rename variables to camelCase this.$self = $container; this.elements_id = []; // [spec_id, spec_id, ...] + this.onlyOne = onlyOne; var self = this; + this.$self.hide(); obj.dataPromise.then(function (data) { _this.dataTree = noTree ? new _NoTreeData2.default(data.results) : new _DataTree2.default(data.results); @@ -129,23 +170,31 @@ var SelectedContainer = function () { value: function restoreElements() { var self = this; if (this.$input && this.$input.val()) { - var data = this.$input.val().split(',').filter(function (el) { + + var clearString = this.$input.val().replace(/[\[\]\'\'\"\"]/g, ''); + var data = clearString.split(',').filter(function (el) { return el; }); this.elements_id = []; + if (this.$input) this.$input.val(this.elements_id.join(',')); data.forEach(function (el) { return self.add(el); }); } } + }, { + key: 'on', + value: function on(methodName, func) { + this[methodName] = this[methodName].bind(this, { func: func, bindFunc: true }); + } }, { key: '_removeById', - value: function _removeById(spec_id) { - var index = this.elements_id.indexOf(spec_id); + value: function _removeById(id) { + var index = this.elements_id.indexOf(id); if (index >= 0) { this.elements_id.splice(index, 1); } - this.$self.find('span[data-id=\'' + spec_id + '\']').parents('.selected-element').remove(); + this.$self.find('span[data-id=\'' + id + '\']').parents('.selected-element').remove(); } }, { key: '_onLoadDataError', @@ -158,13 +207,42 @@ var SelectedContainer = function () { var spec_id = $(e.target).data("id"); this._removeById(spec_id); if (this.$input) this.$input.val(this.elements_id.join(',')); + if (!this.elements_id.length) this.$self.hide(); e.preventDefault(); } + }, { + key: 'replace', + value: function replace(_id, max_len) { + var id = Number(_id); + if (this.elements_id.length > 1) throw new RangeError("Replace error: more than one element"); + // Remove old + this._removeById(this.elements_id[0]); + //Add new + this._addElementToHtml(id, max_len); + this.elements_id = [id]; + } + }, { + key: '_addElementToHtml', + value: function _addElementToHtml(id, max_len) { + var self = this; + var header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); + var name = this.dataTree.getElementById(id).name; + this.elements_id.push(id); + if (this.$input) this.$input.val(this.elements_id.join(',')); + this.$self.append(SelectedContainer.getTemplate(header || " ", name, id)); + this.btn_remove = this.$self.find('.icon-remove'); + this.btn_remove.on("click", this.remove.bind(self)); + if (this.elements_id.length) this.$self.show(); + } }, { key: 'add', value: function add(_id, max_len) { var id = Number(_id); var self = this; + if (this.onlyOne) { + this.replace(_id, max_len); + return; + } var has_already = this.elements_id.filter(function (el) { return self.dataTree.isChild(el, id); @@ -182,14 +260,7 @@ var SelectedContainer = function () { not_valid.forEach(function (el) { self._removeById(el); }); - - var header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); - var name = this.dataTree.getElementById(id).name; - this.elements_id.push(id); - if (this.$input) this.$input.val(this.elements_id.join(',')); - this.$self.append(SelectedContainer.getTemplate(header || " ", name, id)); - this.btn_remove = this.$self.find('.icon-remove'); - this.btn_remove.on("click", this.remove.bind(self)); + this._addElementToHtml(id, max_len); } }], [{ key: 'getTemplate', @@ -215,16 +286,16 @@ var SelectedContainer = function () { }]); return SelectedContainer; -}(); - +}(), (_applyDecoratedDescriptor(_class.prototype, 'remove', [_decorators2.default], Object.getOwnPropertyDescriptor(_class.prototype, 'remove'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'add', [_decorators2.default], Object.getOwnPropertyDescriptor(_class.prototype, 'add'), _class.prototype)), _class); exports.default = SelectedContainer; -},{"./data/DataTree":5,"./data/NoTreeData":6}],3:[function(require,module,exports){ +},{"./data/DataTree":5,"./data/NoTreeData":6,"./decorators":7}],3:[function(require,module,exports){ 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); +exports.default = undefined; var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); @@ -304,13 +375,16 @@ var TreeSelect = function (_AbsBaseSelect) { value: function _onclickOptionsElement(e) { this.clearAllNext(); _get(TreeSelect.prototype.__proto__ || Object.getPrototypeOf(TreeSelect.prototype), '_onclickOptionsElement', this).call(this, e); - if (this.prevSelectBox && this.dataTree.hasChildren(this.selectedEl.id)) this.$searchInput.removeClass('active'); if (this.nextSelectBox && this.dataTree.hasChildren(this.selectedEl.id)) { this.nextSelectBox.setParent(this.selectedEl.id); this.nextSelectBox.setHeader(this.selectedEl.value); this.nextSelectBox.show(); } - if (this.prevSelectBox) this.prevSelectBox.$buttonAddOptions.hide(); + if (this.prevSelectBox) { + this.prevSelectBox.$buttonAddOptions.hide(); + this.prevSelectBox.$searchInput.removeClass("active"); + } + this.$searchInput.addClass('active'); } }, { key: '_onButtonAddOptions', @@ -364,7 +438,7 @@ var tmpl_selectBoxEditCont = function tmpl_selectBoxEditCont() { _ref$preloaderTemplat = _ref.preloaderTemplate, preloaderTemplate = _ref$preloaderTemplat === undefined ? "" : _ref$preloaderTemplat; - return "\n
\n
\n \n
\n " + preloaderTemplate + "\n \n \n
\n
\n
\n \n
\n
\n"; + return "\n
\n
\n \n
\n " + preloaderTemplate + "\n \n \n
\n
\n
\n \n
\n
\n"; }; var tmpl_selectBox = function tmpl_selectBox() { @@ -372,7 +446,7 @@ var tmpl_selectBox = function tmpl_selectBox() { _ref2$preloaderTempla = _ref2.preloaderTemplate, preloaderTemplate = _ref2$preloaderTempla === undefined ? "" : _ref2$preloaderTempla; - return " \n " + preloaderTemplate + "\n \n \n"; + return " \n " + preloaderTemplate + "\n \n \n"; }; var tmpl_elementResult = function tmpl_elementResult(el, id, header) { @@ -394,7 +468,7 @@ var tmpl_selectBoxOptions = function tmpl_selectBoxOptions() { }; var tmpl_selectBoxResults = function tmpl_selectBoxResults() { - return "\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"; + return "\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"; }; var htmlTemplate = function htmlTemplate(_ref4) { @@ -516,6 +590,7 @@ var AbsBaseSelect = function () { this.$editableContainer.html(""); this.$editableContainer.hide(); } + this.$searchInput.removeClass("active"); } }, { key: "hide", @@ -544,7 +619,6 @@ var AbsBaseSelect = function () { value: function setParent(parentId) { this.parentId = parentId; this._fillOptionsData(); - this.$searchInput.addClass('active'); } }, { key: "connectSelectedContainer", @@ -747,7 +821,6 @@ var AbsBaseSelect = function () { value: function _onButtonAddOptions(e) { this._addToSelectedContainer(this.selectedEl.id); this.clear(); - this.$searchInput.removeClass('active'); e.preventDefault(); return false; } @@ -793,7 +866,6 @@ var AbsBaseSelect = function () { this.$searchInput.on("click", function (e) { self.$optionsBox.show(); self.$resultsBox.hide(); - self.$buttonAddOptions.hide(); self.$searchInput.val(""); }); @@ -1071,6 +1143,86 @@ var NoTreeData = function () { exports.default = NoTreeData; },{}],7:[function(require,module,exports){ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = onBind; +function onBind(target, name, descriptor) { + var method = descriptor.value; + + descriptor.value = function () { + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var binds = []; + args = Array.from(args); + var _iteratorNormalCompletion = true; + var _didIteratorError = false; + var _iteratorError = undefined; + + try { + for (var _iterator = args.slice()[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { + var arg = _step.value; + + // console.log("onBind -->", typeof arg, "arg = ", arg); + // console.log("arg.func -->", typeof arg.originalEvent); + // typeof arg === 'object' && !(arg.originalEvent) + if (arg.bindFunc) { + binds.push(arg); + args.splice(args.indexOf(arg), 1); + } + } + } catch (err) { + _didIteratorError = true; + _iteratorError = err; + } finally { + try { + if (!_iteratorNormalCompletion && _iterator.return) { + _iterator.return(); + } + } finally { + if (_didIteratorError) { + throw _iteratorError; + } + } + } + + method.apply(this, args); + var _iteratorNormalCompletion2 = true; + var _didIteratorError2 = false; + var _iteratorError2 = undefined; + + try { + for (var _iterator2 = binds[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { + var bind = _step2.value; + + bind.func.bind(this)(); + } + } catch (err) { + _didIteratorError2 = true; + _iteratorError2 = err; + } finally { + try { + if (!_iteratorNormalCompletion2 && _iterator2.return) { + _iterator2.return(); + } + } finally { + if (_didIteratorError2) { + throw _iteratorError2; + } + } + } + + return this; + }; +} + +// export {onBind}; + +},{}],8:[function(require,module,exports){ 'use strict'; var _SelectedContainer = require('./SelectedContainer'); @@ -1091,7 +1243,7 @@ $(function () { function createFilterSpecs(url) { // SPECIALIZATIONS FILTER var sb_main = new _TreeSelect2.default($('#select-box-1'), { url: url, hasEditableContainer: true }); - sb_main.setHeader("Специализации"); + sb_main.setHeader("Специальность"); var select_container = new _SelectedContainer2.default($('#selected-spec'), { obj: sb_main }); sb_main.connectSelectedContainer(select_container); var sb_1 = new _TreeSelect2.default($('#select-box-2'), { obj: sb_main }); @@ -1169,4 +1321,4 @@ $(function () { // fullData({next: '/api/locations_flat', results: []}); }); // ` -},{"./NoTreeSelect":1,"./SelectedContainer":2,"./TreeSelect":3}]},{},[7]); +},{"./NoTreeSelect":1,"./SelectedContainer":2,"./TreeSelect":3}]},{},[8]); diff --git a/assets/lib/proekton-components/js/build/init_user_profile.js b/assets/lib/proekton-components/js/build/init_user_profile.js new file mode 100644 index 0000000..9bc1d2e --- /dev/null +++ b/assets/lib/proekton-components/js/build/init_user_profile.js @@ -0,0 +1,1325 @@ +(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o\n
\n ' + header + '\n
\n
\n ' + name + '\n
\n \n \n'; +}; + +var SelectedContainer = (_class = function () { + function SelectedContainer($container, _ref) { + var _this = this; + + var obj = _ref.obj, + _ref$noTree = _ref.noTree, + noTree = _ref$noTree === undefined ? false : _ref$noTree, + _ref$onlyOne = _ref.onlyOne, + onlyOne = _ref$onlyOne === undefined ? false : _ref$onlyOne; + + _classCallCheck(this, SelectedContainer); + + // TODO: rename variables to camelCase + this.$self = $container; + this.elements_id = []; // [spec_id, spec_id, ...] + this.onlyOne = onlyOne; + var self = this; + this.$self.hide(); + + obj.dataPromise.then(function (data) { + _this.dataTree = noTree ? new _NoTreeData2.default(data.results) : new _DataTree2.default(data.results); + _this.$input = _this.$self.find('input[type="hidden"]'); + _this.restoreElements(); + }).catch(self._onLoadDataError.bind(self)); + } + + _createClass(SelectedContainer, [{ + key: 'restoreElements', + value: function restoreElements() { + var self = this; + if (this.$input && this.$input.val()) { + + var clearString = this.$input.val().replace(/[\[\]\'\'\"\"]/g, ''); + var data = clearString.split(',').filter(function (el) { + return el; + }); + this.elements_id = []; + if (this.$input) this.$input.val(this.elements_id.join(',')); + data.forEach(function (el) { + return self.add(el); + }); + } + } + }, { + key: 'on', + value: function on(methodName, func) { + this[methodName] = this[methodName].bind(this, { func: func, bindFunc: true }); + } + }, { + key: '_removeById', + value: function _removeById(id) { + var index = this.elements_id.indexOf(id); + if (index >= 0) { + this.elements_id.splice(index, 1); + } + this.$self.find('span[data-id=\'' + id + '\']').parents('.selected-element').remove(); + } + }, { + key: '_onLoadDataError', + value: function _onLoadDataError(error) { + console.log("Error loading data -->", error); + } + }, { + key: 'remove', + value: function remove(e) { + var spec_id = $(e.target).data("id"); + this._removeById(spec_id); + if (this.$input) this.$input.val(this.elements_id.join(',')); + if (!this.elements_id.length) this.$self.hide(); + e.preventDefault(); + } + }, { + key: 'replace', + value: function replace(_id, max_len) { + var id = Number(_id); + if (this.elements_id.length > 1) throw new RangeError("Replace error: more than one element"); + // Remove old + this._removeById(this.elements_id[0]); + //Add new + this._addElementToHtml(id, max_len); + this.elements_id = [id]; + } + }, { + key: '_addElementToHtml', + value: function _addElementToHtml(id, max_len) { + var self = this; + var header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); + var name = this.dataTree.getElementById(id).name; + this.elements_id.push(id); + if (this.$input) this.$input.val(this.elements_id.join(',')); + this.$self.append(SelectedContainer.getTemplate(header || " ", name, id)); + this.btn_remove = this.$self.find('.icon-remove'); + this.btn_remove.on("click", this.remove.bind(self)); + if (this.elements_id.length) this.$self.show(); + } + }, { + key: 'add', + value: function add(_id, max_len) { + var id = Number(_id); + var self = this; + if (this.onlyOne) { + this.replace(_id, max_len); + return; + } + + var has_already = this.elements_id.filter(function (el) { + return self.dataTree.isChild(el, id); + }); + + if (has_already.length || this.elements_id.indexOf(Number(id)) != -1) { + //TODO: do popup messages + return; + } + + var not_valid = this.elements_id.filter(function (el) { + return self.dataTree.isChild(id, el); + }); + + not_valid.forEach(function (el) { + self._removeById(el); + }); + this._addElementToHtml(id, max_len); + } + }], [{ + key: 'getTemplate', + value: function getTemplate(header, name, id) { + return tmpl_selectedElement(header, name, id); + } + }, { + key: 'getHeader', + value: function getHeader(spec_chain, separator, max_len) { + function toShortString(string, max_len) { + return string.slice(0, max_len) + (string.length > max_len ? "..." : ""); + } + + separator = separator || ' / '; + var str_chain = ""; + + spec_chain.forEach(function (el) { + str_chain = (max_len ? toShortString(el.name, max_len) : el.name) + (str_chain ? separator : "") + str_chain; + }); + + return str_chain; + } + }]); + + return SelectedContainer; +}(), (_applyDecoratedDescriptor(_class.prototype, 'remove', [_decorators2.default], Object.getOwnPropertyDescriptor(_class.prototype, 'remove'), _class.prototype), _applyDecoratedDescriptor(_class.prototype, 'add', [_decorators2.default], Object.getOwnPropertyDescriptor(_class.prototype, 'add'), _class.prototype)), _class); +exports.default = SelectedContainer; + +},{"./data/DataTree":5,"./data/NoTreeData":6,"./decorators":7}],3:[function(require,module,exports){ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = undefined; + +var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; + +var _AbsBaseSelect2 = require('./base/AbsBaseSelect'); + +var _AbsBaseSelect3 = _interopRequireDefault(_AbsBaseSelect2); + +var _DataTree = require('./data/DataTree'); + +var _DataTree2 = _interopRequireDefault(_DataTree); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + +function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + +var TreeSelect = function (_AbsBaseSelect) { + _inherits(TreeSelect, _AbsBaseSelect); + + function TreeSelect($container, _ref) { + var url = _ref.url, + obj = _ref.obj, + _ref$hasEditableConta = _ref.hasEditableContainer, + hasEditableContainer = _ref$hasEditableConta === undefined ? false : _ref$hasEditableConta, + _ref$visible = _ref.visible, + visible = _ref$visible === undefined ? hasEditableContainer : _ref$visible; + + _classCallCheck(this, TreeSelect); + + //TODO: сделать автоматическую передачу всех параметров родителю + return _possibleConstructorReturn(this, (TreeSelect.__proto__ || Object.getPrototypeOf(TreeSelect)).call(this, $container, { url: url, obj: obj, hasEditableContainer: hasEditableContainer, visible: visible })); + } + + _createClass(TreeSelect, [{ + key: 'setNearbySelectBox', + value: function setNearbySelectBox(next, prev) { + this.nextSelectBox = next; + this.prevSelectBox = prev; + } + }, { + key: 'clearAllNext', + value: function clearAllNext() { + this.clear(); + if (this.nextSelectBox) { + this.nextSelectBox.hide(); + this.nextSelectBox.clearAllNext(); + } + } + }, { + key: 'clearAllPrev', + value: function clearAllPrev() { + this.clear(); + if (this.prevSelectBox) { + this.clear(); + this.hide(); + this.prevSelectBox.clearAllPrev(); + } + } + }, { + key: '_buildComponents', + value: function _buildComponents(data) { + _get(TreeSelect.prototype.__proto__ || Object.getPrototypeOf(TreeSelect.prototype), '_buildComponents', this).call(this, data); + //TODO: Изменять свойство visible при show/hide + if (!this.visible) this.hide(); + if (this.hasEditableContainer) this.$editableContainer.hide(); + this.dataTree = this.dataTree || new _DataTree2.default(data.results); + this._fillOptionsData(); + this._bindEvents(); + } + }, { + key: '_onclickOptionsElement', + value: function _onclickOptionsElement(e) { + this.clearAllNext(); + _get(TreeSelect.prototype.__proto__ || Object.getPrototypeOf(TreeSelect.prototype), '_onclickOptionsElement', this).call(this, e); + if (this.nextSelectBox && this.dataTree.hasChildren(this.selectedEl.id)) { + this.nextSelectBox.setParent(this.selectedEl.id); + this.nextSelectBox.setHeader(this.selectedEl.value); + this.nextSelectBox.show(); + } + if (this.prevSelectBox) { + this.prevSelectBox.$buttonAddOptions.hide(); + this.prevSelectBox.$searchInput.removeClass("active"); + } + this.$searchInput.addClass('active'); + } + }, { + key: '_onButtonAddOptions', + value: function _onButtonAddOptions(e) { + // this._addToSelectedContainer(this.selectedEl.id); + // this.clear(); + // e.preventDefault(); + // return false; + _get(TreeSelect.prototype.__proto__ || Object.getPrototypeOf(TreeSelect.prototype), '_onButtonAddOptions', this).call(this, e); + this.clearAllNext(); + this.clearAllPrev(); + } + }, { + key: '_onButtonAdd', + value: function _onButtonAdd(e) { + _get(TreeSelect.prototype.__proto__ || Object.getPrototypeOf(TreeSelect.prototype), '_onButtonAdd', this).call(this, e); + this.clearAllNext(); + this.clearAllPrev(); + } + }, { + key: '_addToSelectedContainer', + value: function _addToSelectedContainer(id) { + if (this.selectedContainer) { + this.selectedContainer.add(id); + return; + } + + this.prevSelectBox._addToSelectedContainer(id); + } + }]); + + return TreeSelect; +}(_AbsBaseSelect3.default); + +exports.default = TreeSelect; + +},{"./base/AbsBaseSelect":4,"./data/DataTree":5}],4:[function(require,module,exports){ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +//TEMPLATES ` +var tmpl_selectBoxEditCont = function tmpl_selectBoxEditCont() { + var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, + _ref$preloaderTemplat = _ref.preloaderTemplate, + preloaderTemplate = _ref$preloaderTemplat === undefined ? "" : _ref$preloaderTemplat; + + return "\n
\n
\n \n
\n " + preloaderTemplate + "\n \n \n
\n
\n
\n \n
\n
\n"; +}; + +var tmpl_selectBox = function tmpl_selectBox() { + var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, + _ref2$preloaderTempla = _ref2.preloaderTemplate, + preloaderTemplate = _ref2$preloaderTempla === undefined ? "" : _ref2$preloaderTempla; + + return " \n " + preloaderTemplate + "\n \n \n"; +}; + +var tmpl_elementResult = function tmpl_elementResult(el, id, header) { + return "
    • "; +}; + +var tmpl_elementOption = function tmpl_elementOption(el) { + return "
  • " + el.name + "
    • "; +}; + +var tmpl_plug = function tmpl_plug(_ref3) { + var header = _ref3.header, + selectBox = _ref3.selectBox; + return htmlTemplate({ header: header, selectBox: selectBox }); +}; + +var tmpl_selectBoxOptions = function tmpl_selectBoxOptions() { + return "\n
    \n
    \n
      \n \n
    \n
    \n
    \n"; +}; + +var tmpl_selectBoxResults = function tmpl_selectBoxResults() { + return "\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"; +}; + +var htmlTemplate = function htmlTemplate(_ref4) { + var header = _ref4.header, + selectBox = _ref4.selectBox, + _ref4$id = _ref4.id, + id = _ref4$id === undefined ? "" : _ref4$id, + _ref4$classes = _ref4.classes, + classes = _ref4$classes === undefined ? "" : _ref4$classes, + _ref4$tmpl_selectBoxO = _ref4.tmpl_selectBoxOptions, + tmpl_selectBoxOptions = _ref4$tmpl_selectBoxO === undefined ? function () { + return ""; + } : _ref4$tmpl_selectBoxO, + _ref4$tmpl_selectBoxR = _ref4.tmpl_selectBoxResults, + tmpl_selectBoxResults = _ref4$tmpl_selectBoxR === undefined ? function () { + return ""; + } : _ref4$tmpl_selectBoxR; + return "\n
    \n
    \n
    " + header + "
    \n \n
    \n
    \n " + selectBox + "\n
    \n \n " + tmpl_selectBoxOptions() + "\n " + tmpl_selectBoxResults() + "\n \n
    \n"; +}; +var tmpl_light = function tmpl_light(el) { + return "" + el + ""; +}; + +var tmpl_preloader = function tmpl_preloader() { + return "
    "; +}; + +var AbsBaseSelect = function () { + function AbsBaseSelect($container, _ref5) { + var url = _ref5.url, + obj = _ref5.obj, + _ref5$hasEditableCont = _ref5.hasEditableContainer, + hasEditableContainer = _ref5$hasEditableCont === undefined ? false : _ref5$hasEditableCont, + _ref5$visible = _ref5.visible, + visible = _ref5$visible === undefined ? false : _ref5$visible; + + _classCallCheck(this, AbsBaseSelect); + + if (new.target === AbsBaseSelect) { + throw new TypeError("Cannot construct Abstract instances directly"); + } + if (obj && url) { + throw new URIError("Must be either the date or url"); + } + + var self = this; + //TODO: проверка наличия id контейнера + this.containerId = $container.attr("id"); + this.$container = $container; + this.hasEditableContainer = hasEditableContainer; + this.visible = visible; + // Быстрая заглушка, до отображения данных + if (visible) { + var preloaderTemplate = tmpl_preloader(); + var selectBox = this.hasEditableContainer ? tmpl_selectBoxEditCont({ preloaderTemplate: preloaderTemplate }) : tmpl_selectBox({ preloaderTemplate: preloaderTemplate }); + var plugTemplate = tmpl_plug({ header: "Loading...", selectBox: selectBox }); + $container.html(plugTemplate); + + this.$preloader = $container.find('#component-preloader'); + this.$spinner = this.$preloader.find('.spinner'); + } + if (url) this.dataPromise = this.getData(url); + var _dataPromise = void 0; + if (url) { + _dataPromise = this.dataPromise; + } else { + _dataPromise = obj.dataPromise; + } + // if (dataTree) this.dataTree = dataTree; + _dataPromise.then(self._buildComponents.bind(self)).catch(self._onLoadDataError.bind(self)); + + // INIT EMPTY PROP + this.selectedEl = { id: undefined, value: undefined }; + this.parentId = undefined; + } + + // getTemplate(header, id, editable_container, vertical_child) { + + + _createClass(AbsBaseSelect, [{ + key: "getTemplate", + value: function getTemplate(classes) { + var selectBox = this.hasEditableContainer ? tmpl_selectBoxEditCont() : tmpl_selectBox(); + classes = classes ? classes.join(" ") : ""; + return htmlTemplate({ + header: "TestHeader", selectBox: selectBox, id: this.containerId, classes: classes, + tmpl_selectBoxOptions: tmpl_selectBoxOptions, tmpl_selectBoxResults: tmpl_selectBoxResults + }); + } + }, { + key: "getData", + value: function getData(url) { + var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + var self = this; + return Promise.resolve($.ajax({ + url: url, + dataType: 'json', + data: data + })); + } + }, { + key: "hidePreloader", + value: function hidePreloader() { + // console.log("hide preloader ", this.$preloader); + this.$spinner.fadeOut(); + return Promise.resolve(this.$preloader.delay(500).fadeOut(2000)); + } + }, { + key: "clear", + value: function clear() { + this.$searchInput.val(""); + this.$optionsBox.hide(); + this.$resultsBox.hide(); + this.$buttonAdd.hide(); + this.$buttonAddOptions.hide(); + this.selectedEl = { id: undefined, value: undefined }; + if (this.hasEditableContainer) { + this.$editableContainer.html(""); + this.$editableContainer.hide(); + } + this.$searchInput.removeClass("active"); + } + }, { + key: "hide", + value: function hide() { + this.$selectBox.hide(); + } + }, { + key: "show", + value: function show() { + this.$selectBox.show(); + } + }, { + key: "setHeader", + value: function setHeader(header) { + + if (this.$header) { + this.$header.html(header); + } else { + this.header = header; + } + // default hide + // this.show(); + } + }, { + key: "setParent", + value: function setParent(parentId) { + this.parentId = parentId; + this._fillOptionsData(); + } + }, { + key: "connectSelectedContainer", + value: function connectSelectedContainer(selectedContainer) { + this.selectedContainer = selectedContainer; + } + }, { + key: "getIdsSelectedElements", + value: function getIdsSelectedElements() { + var allChecked = this.$resultsBox.find(":checked"); + return allChecked.map(function () { + return $(this).data("id"); + }); + } + }, { + key: "updateEditableContainer", + value: function updateEditableContainer(elId) { + // Если нет контейнера для отображения ... + if (this.$editableContainer.length) { + var separator = ' / '; + var chainHeader = AbsBaseSelect.getHeader(this.dataTree.getSpecChain(elId, true), { separator: separator }); + chainHeader = AbsBaseSelect.highlight(chainHeader, separator, true); + var elTemplate = "" + chainHeader + ""; + this.$editableContainer.html(elTemplate); + this.$editableContainer.show(); + return; + } + //..., передаем отображение предыдущему selectBox + if (this.prevSelectBox) this.prevSelectBox.updateEditableContainer(elId); + } + }, { + key: "_buildComponents", + value: function _buildComponents(data) { + // AFTER PRELOAD + // this.hidePreloader().then(() => console.log("END -)")); + var classes = this.$container.attr('class'); + if (classes) classes = classes.split(/\s+/); + var template = this.getTemplate(classes); + this.$container.replaceWith(template); + + this.$selectBox = $("#" + this.containerId); + this.$header = this.$selectBox.find('.select-box-header .header'); + this.$header.html(this.header); + this.$resultsBox = this.$selectBox.find('.select-box-results'); + this.$optionsBox = this.$selectBox.find('.select-box-options'); + this.$searchInput = this.$selectBox.find('input.select-box-search'); + this.$buttonAdd = this.$selectBox.find('.button-add.results'); + this.$buttonAddOptions = this.$selectBox.find('.button-add.options'); + this.$editableContainer = this.$selectBox.find('.editable-container'); + this.$resultsBox.hide(); + this.$optionsBox.hide(); + this.$buttonAddOptions.hide(); + // TODO: сделать проверку на наличие всех нужных элементов и их корректый jq select + + // REDEFINE IN CHILD + // this.dataTree = data; + // this._bindEvents(); + } + }, { + key: "_fillOptionsData", + value: function _fillOptionsData() { + var self = this; + var dataList = this.dataTree.dataToList(this.parentId); + var $container = this.$optionsBox.find('ul'); + $container.html(""); + var _iteratorNormalCompletion = true; + var _didIteratorError = false; + var _iteratorError = undefined; + + try { + for (var _iterator = dataList[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { + var el = _step.value; + + $container.append($(tmpl_elementOption(el))); + } + } catch (err) { + _didIteratorError = true; + _iteratorError = err; + } finally { + try { + if (!_iteratorNormalCompletion && _iterator.return) { + _iterator.return(); + } + } finally { + if (_didIteratorError) { + throw _iteratorError; + } + } + } + + this.$selectBox.find('li').on("click", this._onclickOptionsElement.bind(self)); + } + }, { + key: "_fillResultsData", + value: function _fillResultsData(searchText) { + var self = this; + + function search(_ref6) { + var searchText = _ref6.searchText, + _ref6$parentCategoryI = _ref6.parentCategoryId, + parentCategoryId = _ref6$parentCategoryI === undefined ? null : _ref6$parentCategoryI, + _ref6$excludeCategory = _ref6.excludeCategoryId, + excludeCategoryId = _ref6$excludeCategory === undefined ? null : _ref6$excludeCategory; + + // :FORMAT spec_list [{name, id}, ...] + var specList = self.dataTree.dataToList(parentCategoryId, true, excludeCategoryId); + return specList.filter(function (el) { + return el.name.toLowerCase().indexOf(searchText.toLowerCase()) !== -1; + }); + } + + function fillContainer($container, template, _ref7) { + var _ref7$searchText = _ref7.searchText, + searchText = _ref7$searchText === undefined ? "" : _ref7$searchText, + _ref7$parentCategoryI = _ref7.parentCategoryId, + parentCategoryId = _ref7$parentCategoryI === undefined ? null : _ref7$parentCategoryI, + _ref7$excludeCategory = _ref7.excludeCategoryId, + excludeCategoryId = _ref7$excludeCategory === undefined ? null : _ref7$excludeCategory; + + $container.html(""); + $('.other-part').show(); + var searchRes = search({ searchText: searchText, parentCategoryId: parentCategoryId, excludeCategoryId: excludeCategoryId }); + // || (!excludeCategoryId && parentCategoryId === null) + if (!searchRes.length) { + if ($container.closest('div').hasClass('main-part')) { + $container.append('
  • Ничего не найдено
    • '); + self.$resultsBox.find('.button-add.results').hide(); + } else { + $('.other-part').hide(); + } + return; + } + self.$resultsBox.find('.button-add.results').show(); + var _iteratorNormalCompletion2 = true; + var _didIteratorError2 = false; + var _iteratorError2 = undefined; + + try { + for (var _iterator2 = searchRes[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { + var el = _step2.value; + + var header = AbsBaseSelect.getHeader(self.dataTree.getSpecChain(el.id), {}); + $container.append(template(AbsBaseSelect.highlight(el.name, searchText), el.id, header)); + } + } catch (err) { + _didIteratorError2 = true; + _iteratorError2 = err; + } finally { + try { + if (!_iteratorNormalCompletion2 && _iterator2.return) { + _iterator2.return(); + } + } finally { + if (_didIteratorError2) { + throw _iteratorError2; + } + } + } + } + + // FILL RESULTS + // MAIN PART + var $container = this.$resultsBox.find('.main-part ul'); + fillContainer($container, tmpl_elementResult, { searchText: searchText, parentCategoryId: self.parentId }); + + // OTHER PART + // Если нет parentId, не нужно искать в других категориях + if (!this.parentId) { + $('.other-part').hide(); + } else { + $container = this.$resultsBox.find('.other-part ul'); + fillContainer($container, tmpl_elementResult, { searchText: searchText, excludeCategoryId: self.parentId }); + } + this.$resultsBox.find('div.header').hide(); + this.$resultsBox.find('li').on("mouseover", function (e) { + $(e.target).children('.header').show(300); + e.preventDefault(); + }); + + this.$resultsBox.find('li').on("mouseout", function (event) { + var e = event.toElement || event.relatedTarget; + if (e.parentNode == this || e == this) { + return; + } + $(this).find('.header').hide(); + }); + } + }, { + key: "_onclickOptionsElement", + value: function _onclickOptionsElement(e) { + this.selectedEl.id = $(e.target).data("id"); + this.selectedEl.value = $(e.target).html(); + this.$searchInput.val($(e.target).html()); + this.updateEditableContainer($(e.target).data("id")); + this.$buttonAddOptions.show(); + this.$optionsBox.hide(); + } + }, { + key: "_onButtonAddOptions", + value: function _onButtonAddOptions(e) { + this._addToSelectedContainer(this.selectedEl.id); + this.clear(); + e.preventDefault(); + return false; + } + }, { + key: "_onButtonAdd", + value: function _onButtonAdd(e) { + var self = this; + + this.getIdsSelectedElements().each(function () { + self._addToSelectedContainer(this); + }); + this.clear(); + e.preventDefault(); + return false; + } + }, { + key: "_onLoadDataError", + value: function _onLoadDataError(error) { + console.log("Error loading data -->", error); + } + }, { + key: "_addToSelectedContainer", + value: function _addToSelectedContainer(id) { + this.selectedContainer.add(id); + } + }, { + key: "_bindEvents", + value: function _bindEvents() { + var self = this; + $(document).click(function (event) { + if ($(event.target).closest("#" + self.containerId).length) { + return; + } + self._looseFocus(); + }); + // RESULTS BOX + this.$searchInput.on("input", function (e) { + self._fillResultsData(self.$searchInput.val()); + self.$resultsBox.show(); + self.$optionsBox.hide(); + }); + // OPTIONS BOX + this.$searchInput.on("click", function (e) { + self.$optionsBox.show(); + self.$resultsBox.hide(); + self.$searchInput.val(""); + }); + + this.$buttonAdd.on("click", function (e) { + self._onButtonAdd(e); + }); + + this.$buttonAddOptions.on("click", this._onButtonAddOptions.bind(self)); + } + }, { + key: "_looseFocus", + value: function _looseFocus() { + this.$resultsBox.hide(); + this.$optionsBox.hide(); + if (!this.selectedEl.id) { + this.$searchInput.val(""); + } else { + this.$searchInput.val(this.selectedEl.value); + } + } + }], [{ + key: "getHeader", + value: function getHeader(catChain, _ref8) { + var _ref8$separator = _ref8.separator, + separator = _ref8$separator === undefined ? " / " : _ref8$separator, + _ref8$maxLen = _ref8.maxLen, + maxLen = _ref8$maxLen === undefined ? 60 : _ref8$maxLen; + + function toShortString(string, maxLen) { + return string.slice(0, maxLen) + (string.length > maxLen ? "..." : ""); + } + + var strChain = ""; + + catChain.forEach(function (el) { + strChain = (maxLen ? toShortString(el.name, maxLen) : el.name) + (strChain ? separator : "") + strChain; + }); + + return strChain; + } + }, { + key: "highlight", + value: function highlight(string, sub_string) { + 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()); + if (index === -1) return string; + var before = void 0, + select = void 0, + after = void 0; + if (lastIndex) { + var _ref9 = [string.slice(0, index), string.slice(index, string.length), ""]; + before = _ref9[0]; + select = _ref9[1]; + after = _ref9[2]; + } else { + var _ref10 = [string.slice(0, index), string.slice(index, index + sub_string.length), string.slice(index + sub_string.length)]; + before = _ref10[0]; + select = _ref10[1]; + after = _ref10[2]; + } + + return "" + before + tmpl_light(select) + after; + } + }]); + + return AbsBaseSelect; +}(); + +exports.default = AbsBaseSelect; + +},{}],5:[function(require,module,exports){ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +var Node = function Node(data, tree) { + _classCallCheck(this, Node); + + this.name = data.name; + this.id = data.id; + if (data.parent === null) { + this.parent = "root"; + data.parent = { id: "root" }; + this.name = ""; + } + if (data.parent.id && data.parent.id !== 'root') { + var el = tree._getElementById(data.parent.id); + this.parent = el.node || new Node(el, tree); + } + data.node = this; + this.children = data.children.map(function (el_obj) { + var el = tree._getElementById(el_obj.id); + if (el.node) return el.node; + el.node = new Node(el, tree); + return el.node; + }); + + this.children = this.children || []; +}; + +var DataTree = function () { + function DataTree(data) { + _classCallCheck(this, DataTree); + + this.baseData = data; + this._root = new Node(data[0], this); + } + + /** + * получить element в базовой структуре + */ + + + _createClass(DataTree, [{ + key: "_getElementById", + value: function _getElementById(id) { + for (var i = 0; i < this.baseData.length; i++) { + if (this.baseData[i].id == id) return this.baseData[i]; + } + } + + /** + * получить element в дереве + */ + + }, { + key: "getElementById", + value: function getElementById(id) { + function searchInChildren(children) { + for (var i = 0; i < children.length; i++) { + if (children[i].id == id) return children[i]; + var res = searchInChildren(children[i].children); + if (res) return res; + } + } + + return searchInChildren(this._root.children); + } + + /** + * Является ли узел c el_id дочерним для parent_id + * @param el_id + * @param parent_id + */ + + }, { + key: "isChild", + value: function isChild(elId, parent_id) { + function checkParent(el, parent) { + if (el.parent == parent) return true; + if (el.parent && el.parent != 'root') return checkParent(el.parent, parent); + return false; + } + return checkParent(this.getElementById(elId), this.getElementById(parent_id)); + } + }, { + key: "hasChildren", + value: function hasChildren(elId) { + return this.getElementById(elId).children.length ? true : false; + } + + /** + * @param start_parent_id(number) - начиная с + * @param attached(bool) - включая вложенные/дочерние + * @param exclude_id - исключая узел c exclude_id и всеми его вложенными узлами + * @returns [{name, id}, ...] + */ + + }, { + key: "dataToList", + value: function dataToList(start_parent_id, attached, exclude_id) { + var data_list = []; + + function goInChildren(children) { + for (var i = 0; i < children.length; i++) { + if (children[i].id == exclude_id) continue; + data_list.push({ name: children[i].name, id: children[i].id }); + if (attached) goInChildren(children[i].children); + } + } + var start = start_parent_id ? this.getElementById(start_parent_id) : this._root; + goInChildren(start.children); + return data_list; + } + + /** + * + * @param id + * @param incl(bool) - исключая сам элемент + * @returns {Array} всех узлов/элементов от элемента с id до корня + */ + + }, { + key: "getSpecChain", + value: function getSpecChain(id) { + var incl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + + var chain = []; + var el = this.getElementById(id); + function getParent(el) { + if (el.parent && el.parent != "root") { + chain.push(el.parent); + getParent(el.parent); + } + } + getParent(el); + if (incl) chain.unshift(el); + return chain; + } + }]); + + return DataTree; +}(); + +exports.default = DataTree; + +},{}],6:[function(require,module,exports){ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +var NoTreeData = function () { + function NoTreeData(data) { + _classCallCheck(this, NoTreeData); + + this.data = data; + this.specChain = []; + } + + _createClass(NoTreeData, [{ + key: "getElementById", + value: function getElementById(id) { + for (var i = 0; i < this.data.length; i++) { + if (this.data[i].id == id) return this.data[i]; + } + } + }, { + key: "getSpecChain", + value: function getSpecChain(id, incl) { + return this.specChain; + } + }, { + key: "isChild", + value: function isChild(el_id, parent_id) { + return false; + } + }, { + key: "hasChildren", + value: function hasChildren() { + return false; + } + }, { + key: "dataToList", + value: function dataToList() { + return this.data; + } + }]); + + return NoTreeData; +}(); + +exports.default = NoTreeData; + +},{}],7:[function(require,module,exports){ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.default = onBind; +function onBind(target, name, descriptor) { + var method = descriptor.value; + + descriptor.value = function () { + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var binds = []; + args = Array.from(args); + var _iteratorNormalCompletion = true; + var _didIteratorError = false; + var _iteratorError = undefined; + + try { + for (var _iterator = args.slice()[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { + var arg = _step.value; + + // console.log("onBind -->", typeof arg, "arg = ", arg); + // console.log("arg.func -->", typeof arg.originalEvent); + // typeof arg === 'object' && !(arg.originalEvent) + if (arg.bindFunc) { + binds.push(arg); + args.splice(args.indexOf(arg), 1); + } + } + } catch (err) { + _didIteratorError = true; + _iteratorError = err; + } finally { + try { + if (!_iteratorNormalCompletion && _iterator.return) { + _iterator.return(); + } + } finally { + if (_didIteratorError) { + throw _iteratorError; + } + } + } + + method.apply(this, args); + var _iteratorNormalCompletion2 = true; + var _didIteratorError2 = false; + var _iteratorError2 = undefined; + + try { + for (var _iterator2 = binds[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { + var bind = _step2.value; + + bind.func.bind(this)(); + } + } catch (err) { + _didIteratorError2 = true; + _iteratorError2 = err; + } finally { + try { + if (!_iteratorNormalCompletion2 && _iterator2.return) { + _iterator2.return(); + } + } finally { + if (_didIteratorError2) { + throw _iteratorError2; + } + } + } + + return this; + }; +} + +// export {onBind}; + +},{}],8:[function(require,module,exports){ +'use strict'; + +var _SelectedContainer = require('./SelectedContainer'); + +var _SelectedContainer2 = _interopRequireDefault(_SelectedContainer); + +var _NoTreeSelect = require('./NoTreeSelect'); + +var _NoTreeSelect2 = _interopRequireDefault(_NoTreeSelect); + +var _TreeSelect = require('./TreeSelect'); + +var _TreeSelect2 = _interopRequireDefault(_TreeSelect); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +$(function () { + function createFilterSpecs(url) { + // SPECIALIZATIONS FILTER + var sb_main = new _TreeSelect2.default($('#select-box-1'), { url: url, hasEditableContainer: true }); + sb_main.setHeader("Специализации"); + var select_container = new _SelectedContainer2.default($('#selected-spec'), { obj: sb_main }); + sb_main.connectSelectedContainer(select_container); + var sb_1 = new _TreeSelect2.default($('#select-box-2'), { obj: sb_main }); + var sb_2 = new _TreeSelect2.default($('#select-box-3'), { obj: sb_main }); + var sb_3 = new _TreeSelect2.default($('#select-box-4'), { obj: sb_main }); + var sb_4 = new _TreeSelect2.default($('#select-box-5'), { obj: sb_main }); + + sb_main.setNearbySelectBox(sb_1); + sb_1.setNearbySelectBox(sb_2, sb_main); + sb_2.setNearbySelectBox(sb_3, sb_1); + sb_3.setNearbySelectBox(sb_4, sb_2); + sb_4.setNearbySelectBox("", sb_3); + } + + function createFilterBuildingClass(url) { + // BUILDING-CLASSIFICATION FILTER + var sb_build_main = new _TreeSelect2.default($('#sb-building-classification'), { url: url, visible: true }); + sb_build_main.setHeader("Классификация здания"); + + var sb_build_1 = new _TreeSelect2.default($('#sb-building-sub-classification'), { obj: sb_build_main }); + + var select_build_container = new _SelectedContainer2.default($('#selected-building-classification'), { obj: sb_build_main }); + sb_build_main.connectSelectedContainer(select_build_container); + + sb_build_main.setNearbySelectBox(sb_build_1); + sb_build_1.setNearbySelectBox("", sb_build_main); + } + + function createFilterConstructionType(url) { + var sb_constr_main = new _NoTreeSelect2.default($('#sb-construction-type'), { url: url, visible: true }); + sb_constr_main.setHeader("Вид строительства"); + var select_constr_type = new _SelectedContainer2.default($('#selected-construction-type'), { obj: sb_constr_main, noTree: true }); + sb_constr_main.connectSelectedContainer(select_constr_type); + } + + function createFilerLocations(url) { + var sb_loc_main = new _TreeSelect2.default($('#sb-location-1'), { url: url, visible: true }); + sb_loc_main.setHeader("Местоположение"); + var select_loc = new _SelectedContainer2.default($('#selected-location'), { obj: sb_loc_main, onlyOne: true }); + sb_loc_main.connectSelectedContainer(select_loc); + var sb_loc_1 = new _TreeSelect2.default($('#sb-location-2'), { obj: sb_loc_main }); + var sb_loc_2 = new _TreeSelect2.default($('#sb-location-3'), { obj: sb_loc_main }); + + // Убираем кнопки add-options, блокирем поиск, меняем подсказки + sb_loc_main.dataPromise.then(function () { + sb_loc_1.$buttonAddOptions.remove(); + sb_loc_main.$buttonAddOptions.remove(); + sb_loc_main.$searchInput.prop("readonly", true); + sb_loc_1.$searchInput.prop("readonly", true); + sb_loc_2.$searchInput.prop("readonly", true); + sb_loc_main.$searchInput.prop("placeholder", "Выберите"); + sb_loc_1.$searchInput.prop("placeholder", "Выберите"); + sb_loc_2.$searchInput.prop("placeholder", "Выберите"); + }); + + sb_loc_main.setNearbySelectBox(sb_loc_1); + sb_loc_1.setNearbySelectBox(sb_loc_2, sb_loc_main); + sb_loc_2.setNearbySelectBox("", sb_loc_1); + blockNonEmpty(sb_loc_main, select_loc); + } + + function blockNonEmpty(select, container) { + container.on("add", function () { + select.$searchInput.parent().append("
    Местоположение выбрано
    "); + select.$searchInput.hide(); + }); + container.on("remove", function () { + select.$searchInput.siblings('div.simple-select').remove(); + select.$searchInput.show(); + }); + } + + createFilterSpecs('/api/specializations_flat'); + createFilterBuildingClass('/api/building_classifications'); + createFilterConstructionType('/api/construction_type'); + createFilerLocations('/api/locations_flat'); +}); + +},{"./NoTreeSelect":1,"./SelectedContainer":2,"./TreeSelect":3}]},{},[8]); diff --git a/assets/lib/proekton-components/js/src/SelectedContainer.js b/assets/lib/proekton-components/js/src/SelectedContainer.js index 6cec176..044cd12 100644 --- a/assets/lib/proekton-components/js/src/SelectedContainer.js +++ b/assets/lib/proekton-components/js/src/SelectedContainer.js @@ -1,6 +1,7 @@ // ` import DataTree from './data/DataTree' import NoTreeData from './data/NoTreeData' +import onBind from './decorators' let tmpl_selectedElement = (header, name, id) => ` @@ -16,11 +17,13 @@ let tmpl_selectedElement = (header, name, id) => `; export default class SelectedContainer { - constructor($container, {obj, noTree = false}) { + constructor($container, {obj, noTree = false, onlyOne = false}) { // TODO: rename variables to camelCase this.$self = $container; this.elements_id = []; // [spec_id, spec_id, ...] + this.onlyOne = onlyOne; const self = this; + this.$self.hide(); obj.dataPromise .then( @@ -39,8 +42,11 @@ export default class SelectedContainer { restoreElements() { const self = this; if (this.$input && this.$input.val()) { - let data = this.$input.val().split(',').filter((el) => el); + + let clearString = this.$input.val().replace(/[\[\]\'\'\"\"]/g, ''); + let data = clearString.split(',').filter((el) => el); this.elements_id = []; + if (this.$input) this.$input.val(this.elements_id.join(',')); data.forEach((el) => self.add(el)); } } @@ -64,29 +70,61 @@ export default class SelectedContainer { return str_chain; } - _removeById(spec_id) { - let index = this.elements_id.indexOf(spec_id); + on(methodName, func) { + this[methodName] = this[methodName].bind(this, {func, bindFunc: true}); + } + + _removeById(id) { + let index = this.elements_id.indexOf(id); if (index >= 0) { this.elements_id.splice(index, 1); } - this.$self.find(`span[data-id='${spec_id}']`).parents('.selected-element').remove(); + this.$self.find(`span[data-id='${id}']`).parents('.selected-element').remove(); } _onLoadDataError(error) { console.log("Error loading data -->", error); } - + @onBind remove(e) { let spec_id = $(e.target).data("id"); this._removeById(spec_id); if (this.$input) this.$input.val(this.elements_id.join(',')); + if (!this.elements_id.length) this.$self.hide(); e.preventDefault(); } + replace(_id, max_len) { + const id = Number(_id); + if (this.elements_id.length > 1) throw new RangeError("Replace error: more than one element"); + // Remove old + this._removeById(this.elements_id[0]); + //Add new + this._addElementToHtml(id, max_len); + this.elements_id = [id]; + } + + _addElementToHtml(id, max_len) { + let self = this; + const header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); + const name = this.dataTree.getElementById(id).name; + this.elements_id.push(id); + if (this.$input) this.$input.val(this.elements_id.join(',')); + this.$self.append(SelectedContainer.getTemplate(header || " ", name, id)); + this.btn_remove = this.$self.find('.icon-remove'); + this.btn_remove.on("click", this.remove.bind(self)); + if (this.elements_id.length) this.$self.show(); + } + + @onBind add(_id, max_len) { const id = Number(_id); let self = this; + if (this.onlyOne) { + this.replace(_id, max_len); + return + } let has_already = this.elements_id.filter(function (el) { return self.dataTree.isChild(el, id) @@ -104,13 +142,6 @@ export default class SelectedContainer { not_valid.forEach(function (el) { self._removeById(el); }); - - const header = SelectedContainer.getHeader(this.dataTree.getSpecChain(id), "", max_len); - const name = this.dataTree.getElementById(id).name; - this.elements_id.push(id); - if (this.$input) this.$input.val(this.elements_id.join(',')); - this.$self.append(SelectedContainer.getTemplate(header || " ", name, id)); - this.btn_remove = this.$self.find('.icon-remove'); - this.btn_remove.on("click", this.remove.bind(self)); + this._addElementToHtml(id, max_len); } } diff --git a/assets/lib/proekton-components/js/src/TreeSelect.js b/assets/lib/proekton-components/js/src/TreeSelect.js index 0dd6774..ffb2433 100644 --- a/assets/lib/proekton-components/js/src/TreeSelect.js +++ b/assets/lib/proekton-components/js/src/TreeSelect.js @@ -42,13 +42,16 @@ export default class TreeSelect extends AbsBaseSelect{ _onclickOptionsElement(e) { this.clearAllNext(); super._onclickOptionsElement(e); - if (this.prevSelectBox && this.dataTree.hasChildren(this.selectedEl.id)) this.$searchInput.removeClass('active'); if (this.nextSelectBox && this.dataTree.hasChildren(this.selectedEl.id)) { this.nextSelectBox.setParent(this.selectedEl.id); this.nextSelectBox.setHeader(this.selectedEl.value); this.nextSelectBox.show(); } - if (this.prevSelectBox) this.prevSelectBox.$buttonAddOptions.hide(); + if (this.prevSelectBox) { + this.prevSelectBox.$buttonAddOptions.hide(); + this.prevSelectBox.$searchInput.removeClass("active"); + } + this.$searchInput.addClass('active'); } _onButtonAddOptions(e) { diff --git a/assets/lib/proekton-components/js/src/base/AbsBaseSelect.js b/assets/lib/proekton-components/js/src/base/AbsBaseSelect.js index dda4f8e..4a5b656 100644 --- a/assets/lib/proekton-components/js/src/base/AbsBaseSelect.js +++ b/assets/lib/proekton-components/js/src/base/AbsBaseSelect.js @@ -7,7 +7,7 @@ const tmpl_selectBoxEditCont = ({preloaderTemplate = ""}={}) =>
    ${preloaderTemplate} - +
    @@ -20,7 +20,7 @@ const tmpl_selectBox = ({preloaderTemplate = ""}={}) => ` ${preloaderTemplate} - + `; const tmpl_elementResult = (el, id, header) => @@ -59,7 +59,7 @@ const tmpl_selectBoxResults = () =>
    - + `; @@ -203,6 +203,7 @@ export default class AbsBaseSelect { this.$editableContainer.html(""); this.$editableContainer.hide() } + this.$searchInput.removeClass("active"); } hide() { @@ -223,7 +224,6 @@ export default class AbsBaseSelect { setParent(parentId) { this.parentId = parentId; this._fillOptionsData(); - this.$searchInput.addClass('active'); } connectSelectedContainer(selectedContainer) { @@ -368,7 +368,6 @@ export default class AbsBaseSelect { _onButtonAddOptions(e) { this._addToSelectedContainer(this.selectedEl.id); this.clear(); - this.$searchInput.removeClass('active'); e.preventDefault(); return false; } @@ -411,7 +410,6 @@ export default class AbsBaseSelect { this.$searchInput.on("click", function (e) { self.$optionsBox.show(); self.$resultsBox.hide(); - self.$buttonAddOptions.hide(); self.$searchInput.val(""); }); diff --git a/assets/lib/proekton-components/js/src/decorators.js b/assets/lib/proekton-components/js/src/decorators.js new file mode 100644 index 0000000..b112c79 --- /dev/null +++ b/assets/lib/proekton-components/js/src/decorators.js @@ -0,0 +1,24 @@ +export default function onBind(target, name, descriptor) { + const method = descriptor.value; + + descriptor.value = function (...args) { + let binds = []; + args = Array.from(args); + for (let arg of args.slice()) { + // console.log("onBind -->", typeof arg, "arg = ", arg); + // console.log("arg.func -->", typeof arg.originalEvent); + // typeof arg === 'object' && !(arg.originalEvent) + if (arg.bindFunc) { + binds.push(arg); + args.splice(args.indexOf(arg), 1); + } + } + method.apply(this, args); + for (let bind of binds) { + bind.func.bind(this)(); + } + return this; + } +} + +// export {onBind}; \ No newline at end of file diff --git a/assets/lib/proekton-components/js/src/init.js b/assets/lib/proekton-components/js/src/init.js index 5781caa..052004d 100644 --- a/assets/lib/proekton-components/js/src/init.js +++ b/assets/lib/proekton-components/js/src/init.js @@ -7,7 +7,7 @@ $(function () { function createFilterSpecs(url) { // SPECIALIZATIONS FILTER let sb_main = new TreeSelect($('#select-box-1'), {url, hasEditableContainer: true}); - sb_main.setHeader("Специализации"); + sb_main.setHeader("Специальность"); let select_container = new SelectedContainer($('#selected-spec'), {obj: sb_main}); sb_main.connectSelectedContainer(select_container); let sb_1 = new TreeSelect($('#select-box-2'), {obj: sb_main}); diff --git a/assets/lib/proekton-components/js/src/init_user_profile.js b/assets/lib/proekton-components/js/src/init_user_profile.js new file mode 100644 index 0000000..4d9d110 --- /dev/null +++ b/assets/lib/proekton-components/js/src/init_user_profile.js @@ -0,0 +1,90 @@ +import SelectedContainer from './SelectedContainer'; +import NoTreeSelect from './NoTreeSelect'; +import TreeSelect from './TreeSelect'; + +$(function () { + function createFilterSpecs(url) { + // SPECIALIZATIONS FILTER + let sb_main = new TreeSelect($('#select-box-1'), {url, hasEditableContainer: true}); + sb_main.setHeader("Специализации"); + let select_container = new SelectedContainer($('#selected-spec'), {obj: sb_main}); + sb_main.connectSelectedContainer(select_container); + let sb_1 = new TreeSelect($('#select-box-2'), {obj: sb_main}); + let sb_2 = new TreeSelect($('#select-box-3'), {obj: sb_main}); + let sb_3 = new TreeSelect($('#select-box-4'), {obj: sb_main}); + let sb_4 = new TreeSelect($('#select-box-5'), {obj: sb_main}); + + sb_main.setNearbySelectBox(sb_1); + sb_1.setNearbySelectBox(sb_2, sb_main); + sb_2.setNearbySelectBox(sb_3, sb_1); + sb_3.setNearbySelectBox(sb_4, sb_2); + sb_4.setNearbySelectBox("", sb_3); + + } + + function createFilterBuildingClass(url) { + // BUILDING-CLASSIFICATION FILTER + let sb_build_main = new TreeSelect($('#sb-building-classification'), {url, visible:true}); + sb_build_main.setHeader("Классификация здания"); + + let sb_build_1 = new TreeSelect($('#sb-building-sub-classification'), {obj: sb_build_main}); + + let select_build_container = new SelectedContainer($('#selected-building-classification'), {obj: sb_build_main}); + sb_build_main.connectSelectedContainer(select_build_container); + + sb_build_main.setNearbySelectBox(sb_build_1); + sb_build_1.setNearbySelectBox("", sb_build_main); + } + + function createFilterConstructionType(url) { + let sb_constr_main = new NoTreeSelect($('#sb-construction-type'), {url, visible:true}); + sb_constr_main.setHeader("Вид строительства"); + let select_constr_type = new SelectedContainer($('#selected-construction-type'), {obj:sb_constr_main, noTree: true}); + sb_constr_main.connectSelectedContainer(select_constr_type); + } + + function createFilerLocations(url) { + let sb_loc_main = new TreeSelect($('#sb-location-1'), {url, visible:true}); + sb_loc_main.setHeader("Местоположение"); + let select_loc = new SelectedContainer($('#selected-location'), {obj: sb_loc_main, onlyOne: true}); + sb_loc_main.connectSelectedContainer(select_loc); + let sb_loc_1 = new TreeSelect($('#sb-location-2'), {obj: sb_loc_main}); + let sb_loc_2 = new TreeSelect($('#sb-location-3'), {obj: sb_loc_main}); + + // Убираем кнопки add-options, блокирем поиск, меняем подсказки + sb_loc_main.dataPromise.then(()=>{ + sb_loc_1.$buttonAddOptions.remove(); + sb_loc_main.$buttonAddOptions.remove(); + sb_loc_main.$searchInput.prop("readonly", true); + sb_loc_1.$searchInput.prop("readonly", true); + sb_loc_2.$searchInput.prop("readonly", true); + sb_loc_main.$searchInput.prop("placeholder", "Выберите"); + sb_loc_1.$searchInput.prop("placeholder", "Выберите"); + sb_loc_2.$searchInput.prop("placeholder", "Выберите"); + }); + + + sb_loc_main.setNearbySelectBox(sb_loc_1); + sb_loc_1.setNearbySelectBox(sb_loc_2, sb_loc_main); + sb_loc_2.setNearbySelectBox("", sb_loc_1); + blockNonEmpty(sb_loc_main, select_loc); + } + + function blockNonEmpty(select, container) { + container.on("add", () => { + select.$searchInput.parent().append("
    Местоположение выбрано
    "); + select.$searchInput.hide(); + }); + container.on("remove", () => { + select.$searchInput.siblings('div.simple-select').remove(); + select.$searchInput.show(); + }); + } + + createFilterSpecs('/api/specializations_flat'); + createFilterBuildingClass('/api/building_classifications'); + createFilterConstructionType('/api/construction_type'); + createFilerLocations('/api/locations_flat'); + + +}); \ No newline at end of file diff --git a/assets/projects-filter.js b/assets/projects-filter.js index fc12b86..4a489f6 100644 --- a/assets/projects-filter.js +++ b/assets/projects-filter.js @@ -1,20 +1,22 @@ $(function () { let $buttonF1 = $('.resButton'); - if ($('.slide').hasClass("active")) $buttonF1.css('transform', 'rotate(180deg)'); + if ($('.slide').hasClass("active")) $buttonF1.css('transform', 'rotate(0deg)'); $buttonF1.on("click", function (e) { e.preventDefault(); let $slide = $('.slide'); if ($slide.hasClass("active")) { - $buttonF1.css('transform', 'rotate(0deg)'); + $buttonF1.css('transform', 'rotate(180deg)'); $slide.slideUp(300); } else { - $buttonF1.css('transform', 'rotate(180deg)'); + $buttonF1.css('transform', 'rotate(0deg)'); $slide.slideDown(300); } $slide.toggleClass("active"); }); + //CUSTOM-CHECKBOX + function tuneCheckBoxes($boxes) { let currentState = $boxes.find("input").prop("checked") ? 'checked' : 'not-checked'; $boxes.find("div").hide(); @@ -31,6 +33,40 @@ $(function () { return false; }); + // CUSTOM-SELECT + let $select_container = $('.custom-select'); + let $sc_headers = $select_container.find('.simple-select'); + let $sc_options = $select_container.find('.select-box-options'); + + $sc_options.hide(); + + $sc_headers.on("click", function (e) { + $(e.target).siblings('.select-box-options').show(); + }); + + let $options = $sc_options.find('li'); + $options.on("click", function (e) { + const target = $(e.target); + let header = target.closest('.select-box-options').siblings('.simple-select'); + let data = target.closest('.select-box-options').siblings('input[type=hidden]'); + header.val(target.html()); + data.val(target.data("id")); + // $sc_data.val($(e.target).data("id")); + $sc_options.hide(); + e.preventDefault() + }); + + $(document).click(function (event) { + //FIXME: запомнить на ком был клик, и не закрывать именно его + if ($(event.target).closest($select_container).length) { + return; + } + $sc_options.hide(); + //... + }); + + //* Edn CUSTOM SELECT + // $("#myBtn").click(function () { // $('
    ' + diff --git a/package.json b/package.json index 64f1d62..ee9f529 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "author": "Booblegum", "license": "ISC", "devDependencies": { + "babel-plugin-transform-decorators-legacy": "^1.3.4", "babel-preset-es2015": "^6.18.0", "babelify": "^7.3.0" } diff --git a/projects/static/css/project_filter.css b/projects/static/css/project_filter.css index e9b895e..a46e178 100644 --- a/projects/static/css/project_filter.css +++ b/projects/static/css/project_filter.css @@ -22,26 +22,39 @@ body { margin-top: 30px; } -.custom-check{ +.custom-check { cursor: pointer; - display: inline-block + display: inline-block; + width: 100%; } -.custom-check .checked{ +.header { + font-size: 12pt; + color: black; +} + +.block-header { + display: inline-block; + padding-top: 10px; +} + +.custom-check .checked { background: url("../img/checkbox_Check.png.png") no-repeat center; - background-size: 210px 51px; - width: 210px; + background-size: 100% 51px; + width: 100%; height: 51px; } .custom-check .not-checked { background: url("../img/checkbox_notCheck.png") no-repeat center; - background-size: 210px 51px; - width: 210px; + background-size: 100% 51px; + width: 100%; height: 51px; } .resButton { + position: relative; + top: -15px; width: 50px; height: 50px; background-color: white; @@ -51,22 +64,26 @@ body { font-size: 16px; float: left; border-radius: 100%; - margin: -15px 20px 0 28px; + /* margin: -15px 20px 0 28px; */ + margin-left: 25px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; + transform: rotate(180deg); } -button.resButton:focus {outline:0;} +button.resButton:focus { + outline: 0; +} .flex { display: flex; } -.flex .header{ - font-size: 12pt; - padding-right: 10px; -} +/*.flex .header {*/ +/*padding-right: 10px;*/ +/*}*/ + .header .fa { padding-left: 3px; color: #5e5e5e; @@ -77,7 +94,7 @@ button.resButton:focus {outline:0;} .border { flex: 1 1 auto; float: left; - margin: 10px 0 0 0; + margin: 10px 0 0 25px; border-top: 1px solid #CFCFCF; } diff --git a/projects/templates/partials/inc-projects-filter.html b/projects/templates/partials/inc-projects-filter.html index 79f5c3b..1c038f9 100644 --- a/projects/templates/partials/inc-projects-filter.html +++ b/projects/templates/partials/inc-projects-filter.html @@ -1,7 +1,6 @@
    - {#
    #}
    diff --git a/templates/partials/base.html b/templates/partials/base.html index 9f0382a..ecf18c9 100644 --- a/templates/partials/base.html +++ b/templates/partials/base.html @@ -12,10 +12,10 @@ PROEKTON {# {% compress css %}#} + - diff --git a/users/forms.py b/users/forms.py index b1a3c19..3aa037f 100644 --- a/users/forms.py +++ b/users/forms.py @@ -42,6 +42,78 @@ class ContractorResumeFilesForm(forms.ModelForm): ) +class UserProfileEditFullForm(forms.ModelForm): + gender = forms.ChoiceField( + choices=GENDERS, + widget=forms.RadioSelect, + required=False, + ) + contractor_status = forms.ChoiceField( + choices=User.STATUSES, + widget=forms.RadioSelect, + required=False, + ) + + live_image = forms.ModelChoiceField( + queryset=LiveImageUpload.objects.all(), + required=False, + ) + + class Meta: + model = User + + fields = ( + 'id', + 'avatar', + 'first_name', + 'last_name', + 'patronym', + 'location', + 'contractor_specializations', # Специализации + 'contractor_building_classifications', # Классификация зданий + 'contractor_construction_types', # Вид строительства + 'cro', + # Общая информация + 'date_of_birth', + 'gender', + 'contractor_status', + 'skype', + 'website', + 'phone', + 'phone2', + # Финансовая информация + # ... + ) + + widgets = { + # TODO: Use common format with jQueryUI Datepicker: + 'date_of_birth': forms.TextInput(attrs={'class': 'datepicker box-sizing simple-input'}), + 'contractor_status': forms.Select(attrs={'class': 'simple-select'}) + } + + def __init__(self, *args, **kwargs): + if kwargs.get("request"): self.request = kwargs.pop('request') + super().__init__(*args, **kwargs) + + # def clean_location(self): + # data = self.cleaned_data['location'] + # return data + + def clean_contractor_specializations(self): + data = self.cleaned_data['contractor_specializations'] + return data + + def get_gender_display(self): + for gender in GENDERS: + if gender[0] == self.initial['gender']: + return gender[1] + + def get_status_display(self): + for status in User.STATUSES: + if status[0] == self.initial['contractor_status']: + return status[1] + + class UserProfileEditForm(forms.ModelForm): gender = forms.ChoiceField( choices=GENDERS, @@ -75,7 +147,7 @@ class UserProfileEditForm(forms.ModelForm): widgets = { # TODO: Use common format with jQueryUI Datepicker: - 'date_of_birth': forms.TextInput(attrs={'class': 'datepicker box-sizing surr surr2'}), + 'date_of_birth': forms.TextInput(attrs={'class': 'datepicker box-sizing simple-input'}), } def __init__(self, *args, **kwargs): diff --git a/users/static/css/custom-checkboxes.css b/users/static/css/custom-checkboxes.css new file mode 100644 index 0000000..e0c0043 --- /dev/null +++ b/users/static/css/custom-checkboxes.css @@ -0,0 +1,41 @@ +.rad { + cursor: pointer; + user-select: none; + -webkit-user-select: none; + -webkit-touch-callout: none; +} + +.rad > input { /* HIDE ORG RADIO & CHECKBOX */ + visibility: hidden; + position: absolute; +} + +/* RADIO & CHECKBOX STYLES */ +.rad > i { /* DEFAULT STYLE */ + display: inline-block; + vertical-align: middle; + width: 24px; + height: 24px; + border-radius: 50%; + transition: 0.2s; + box-shadow: inset 0 0 0 16px #fff; + border: 1px solid #cccccc; + background: #cccccc; + margin-right: 5px; +} + +/* CHECKBOX OVERWRITE STYLES */ +.rad:hover > i { /* HOVER STYLE */ + box-shadow: inset 0 0 0 3px #fff; + background: #cccccc; +} + +.rad > input:checked + i { /* (RADIO CHECKED) STYLE */ + box-shadow: inset 0 0 0 3px #fff; + background: #cccccc; +} + +label.rad { + font-style: italic; + color: #606060; +} \ No newline at end of file diff --git a/users/static/css/user_profile_edit.css b/users/static/css/user_profile_edit.css new file mode 100644 index 0000000..bf837e1 --- /dev/null +++ b/users/static/css/user_profile_edit.css @@ -0,0 +1,144 @@ +.mainContent { + padding: 43px 25px 40px 25px; +} + +.avatarInset { + width: 200px; + height: 200px; +} + +.avatar { + width: 220px; + height: 220px; + padding: 10px; + +} + +.simple-input, .simple-select { + height: 51px; + width: 100%; + border: 1px solid #cccccc; + outline: none; + padding: 5px 40px 5px 20px; + background-color: white; + margin-bottom: -1px; +} + +.simple-select select { + background-color: darkgray; +} + +.simple-select { + display: flex; + align-items: center; + text-align: center; +} + +.simple-select.fill{ + background-color: #F2F2F2; +} + +.simple-select .text{ + color: #a3a3a3; +} + +.toggle .btn { + padding: 14px 20px; + border-radius: 40px; +} + +.bottom-line { + padding-bottom: 10px; + border-bottom: 1px solid #cccccc; +} + +.top-line { + /*padding-bottom: 10px;*/ + border-top: 1px solid #cccccc; +} + +/* СУПЕР-костыльная кнопка. Не прикасаться!*/ +.upload-new { + width: 60%; + height: 30px; + overflow: hidden; + cursor: pointer; + border-radius: 40px; + border: 1px solid #FF0029; +} + +.upload-new:hover, .btn-simple:hover { + box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); + -webkit-transform: scale(1.04); + -moz-transform: scale(1.04); + transform: scale(1.04); +} + +.upload-new, .btn-simple { + transition: all 0.3s; + cursor: pointer; +} + +.upload-new input { + display: block !important; + width: 100% !important; + height: 30px !important; + opacity: 0 !important; + cursor: pointer; +} + +.upload-new p { + line-height: 30px; + text-transform: uppercase; + margin: -30px 0 0 0; + /*padding: 0 5px 0 5px;*/ + font-size: 10px; + text-align: center; + font-family: Miriad; +} + +/** Конец супер-костыля**/ + +.row-eq-height { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.info { + background-color: #F2F2F2; + padding: 50px 40px; + margin-top: 20px; +} + +.btn-simple { + border-radius: 40px; + padding: 10px 15px; + border: 1px solid #FF0029; + color: black; + background: none; + font-family: Miriad; +} + +/*.btn-simple:hover {*/ +/*box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);*/ +/*-webkit-transform: scale(1.04);*/ +/*-moz-transform: scale(1.04);*/ +/*transform: scale(1.04);*/ +/*}*/ + +.no-margin .selected-element { + margin: 0; +} + +.-live-image-avatar-upload-container .-position-relative-parent { + position: relative +} + +.-live-image-avatar-upload-container .-live-image-delete { + position: absolute; + top: 0; + right: 0; + background-color: white; +} \ No newline at end of file diff --git a/users/templates/user_profile_edit.html b/users/templates/user_profile_edit.html index d88cf7e..89b035b 100644 --- a/users/templates/user_profile_edit.html +++ b/users/templates/user_profile_edit.html @@ -1,220 +1,317 @@ {% extends 'partials/base.html' %} - +{% load staticfiles %} {% load thumbnail %} - - {% block head_css %} - + + + + + {# other #} + + + {% endblock %} {% block content %} {% include 'partials/header.html' %} - + {# {% if request.user.is_customer %}#} + {# #} + {# {% elif request.user.is_contractor %}#} + {# #} + {# {% endif %}#} +
    -
    + +
    {% csrf_token %} - - {% if request.user.is_customer %} - - {% elif request.user.is_contractor %} - - {% endif %} - -
    -
    -
    -
    + +
    +
    +
    +
    - - + + {% if request.user.avatar %} {% thumbnail request.user.avatar "235x224" crop="center" as avatar %} profile-image {% endthumbnail %} {% else %} - profile-image + profile-image {% endif %}
    - -
    -
    +
    +
    + {#
    #} - +

    Загрузить фотографию

    + {#
    #}
    -
    - -
    -
    -

    ФИО

    - - - - -
    - - {% if request.user.is_contractor %} -
    -

    Специализации

    - -
    - - - {% for spec_id in form.contractor_specializations.value %} -
    - - -
    - {% endfor %} -
    - - - Добавить еще - -
    - {% endif %} - -
    -

    Местоположение

    - -
    -
    -
    -
    - - +
    +
    +
    +
    + + Параметры заполнения прифиля влияют на фильтр поиска специалистов, ранжирования в списке + + +
    -
    -
    -
    - -
    -
    - Общая информация - Финансовая информация - {% if request.user.is_contractor %} - Опыт - {% endif %} -
    -
    - -
    -
    - {% if request.experience_edit %} -
    -
    Классификация зданий
    -
    Виды строительства
    +
    +
    + + Личная информация + +
    -
    -
    - {{ form.contractor_building_classifications }} +
    +
    +
    - -
    - {{ form.contractor_construction_types }} +
    + +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
     
    + +
    +
    +
    -
    - +
    +
    +
    +
    +
    + + Мой опыт работы в проектировании / дизайне / сопровождении проектной документации + + +
    +
    - {% else %} -
    -
    Дата рождения
    -
    Пол
    -
    Статус
    +
    +
    +
    +
    +
    - -
    -
    - {{ form.date_of_birth }} +
    +
    +
    +
    - -
    - {% for id, text in form.gender.field.choices %} - - -

    {{ text }}    

    - {% endfor %} +
    +
    +
    +
    +
    +
    +
    -
    - {{ form.contractor_status }} +
    +
    - -
    -
    Сайт
    -
    Skype
    -
    Телефон
    -
    Второй телефон
    +
    +
    +
    + +
    +
    - -
    +
    - +
    +
    +
    +
    +
    + +
    -
    - +
    +
    +
    + +
    +
    +
    + Требуется допуск (СРО) + +
    +
    +
    + + +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + Общая информация + Финансовая информация +
    +
    +
    +
    +
    - +
    Дата рождения
    +
    + {{ form.date_of_birth }} +
    +
    +
    +
    +
    Пол
    +
    + + + +
    +
    - +
    +
    +
    Статус
    +
    + + + +
    -
    - -
    -
    - -

    Есть допуск СРО

    +
    +
    Skype
    + +
    +
    +
    +
    Сайт
    + +
    +
    +
    Телефон
    + +
    +
    +
    Второй телефон
    + +
    +
    +
     
    +
    -
    - -
    - {% endif %} -
    +
    +
    - +
    +
    {% include 'partials/footer.html' %}
    +
    + +{% endblock %} +{% block js_block %} + {{ block.super }} + + + + {% endblock %} diff --git a/users/templates/user_profile_edit_old.html b/users/templates/user_profile_edit_old.html new file mode 100644 index 0000000..d88cf7e --- /dev/null +++ b/users/templates/user_profile_edit_old.html @@ -0,0 +1,220 @@ +{% extends 'partials/base.html' %} + +{% load thumbnail %} + + +{% block head_css %} + +{% endblock %} + +{% block content %} + {% include 'partials/header.html' %} + +
    +
    +
    + {% csrf_token %} + + {% if request.user.is_customer %} + + {% elif request.user.is_contractor %} + + {% endif %} + +
    +
    +
    +
    +
    + + + {% if request.user.avatar %} + {% thumbnail request.user.avatar "235x224" crop="center" as avatar %} + profile-image + {% endthumbnail %} + {% else %} + profile-image + {% endif %} +
    +
    + +
    +
    + + +

    Загрузить фотографию

    +
    +
    + +
    + +
    +
    + +
    +
    +

    ФИО

    + + + + +
    + + {% if request.user.is_contractor %} +
    +

    Специализации

    + +
    + + + {% for spec_id in form.contractor_specializations.value %} +
    + + +
    + {% endfor %} +
    + + + Добавить еще + +
    + {% endif %} + +
    +

    Местоположение

    + +
    +
    +
    +
    + + +
    +
    +
    +
    +
    + +
    +
    + Общая информация + Финансовая информация + {% if request.user.is_contractor %} + Опыт + {% endif %} +
    +
    + +
    +
    + {% if request.experience_edit %} +
    +
    Классификация зданий
    +
    Виды строительства
    +
    + +
    +
    + {{ form.contractor_building_classifications }} +
    + +
    + {{ form.contractor_construction_types }} +
    +
    + +
    + +
    + {% else %} +
    +
    Дата рождения
    +
    Пол
    +
    Статус
    +
    + +
    +
    + {{ form.date_of_birth }} +
    + +
    + {% for id, text in form.gender.field.choices %} + + +

    {{ text }}    

    + {% endfor %} +
    + +
    + {{ form.contractor_status }} +
    +
    + +
    +
    Сайт
    +
    Skype
    +
    Телефон
    +
    Второй телефон
    +
    + +
    +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    +
    + +
    +
    + +

    Есть допуск СРО

    +
    +
    + +
    + +
    + {% endif %} +
    +
    +
    + + {% include 'partials/footer.html' %} +
    +
    +{% endblock %} diff --git a/users/urls.py b/users/urls.py index 1bf8480..d81da53 100755 --- a/users/urls.py +++ b/users/urls.py @@ -18,16 +18,18 @@ from .views import ( TeamProfileView, UserFinancialInfoEditView, UserProfileEditView, + UserProfileEditViewFull, ) app_name = 'users' urlpatterns = [ - urls.url(r'^(?P\d+)/edit/$', UserProfileEditView.as_view(), name='user-profile-edit'), - urls.url(r'^(?P\d+)/financial-info/edit/$', UserFinancialInfoEditView.as_view(), - name='user-financial-info-edit'), + # urls.url(r'^(?P\d+)/edit/$', UserProfileEditView.as_view(), name='user-profile-edit'), + urls.url(r'^(?P\d+)/edit/$', UserProfileEditViewFull.as_view(), name='user-profile-edit'), + # urls.url(r'^(?P\d+)/financial-info/edit/$', UserFinancialInfoEditView.as_view(), + # name='user-financial-info-edit'), - urls.url(r'^(?P\d+)/experience/edit/$', UserProfileEditView.as_view(), name='user-experience-edit'), + # urls.url(r'^(?P\d+)/experience/edit/$', UserProfileEditView.as_view(), name='user-experience-edit'), urls.url(r'^customers/(?P\d+)/$', CustomerProfileOpenProjectsView.as_view(), name='customer-profile-open-projects'), diff --git a/users/views.py b/users/views.py index a3add17..4fdb5e2 100644 --- a/users/views.py +++ b/users/views.py @@ -1,5 +1,6 @@ import itertools import json +import re from pprint import pformat import natsort @@ -36,6 +37,7 @@ from .forms import ( UserFinancialInfoEditForm, UserProfileBasicInfoEditForm, UserProfileEditForm, + UserProfileEditFullForm, UserProfileExperienceEditForm, ) @@ -100,6 +102,74 @@ class UserProfileEditView(BaseMixin, View): return render(request, self.template_name, context) +class UserProfileEditViewFull(BaseMixin, View): + form_class = UserProfileEditFullForm + template_name = 'user_profile_edit.html' + + def dispatch(self, request, *args, **kwargs): + # if request.resolver_match.url_name == 'user-experience-edit': + # if not request.user.is_contractor(): + # raise PermissionDenied + # self.form_class = UserProfileExperienceEditForm + # request.experience_edit = True + if request.user.is_authenticated() and request.user.pk == int(kwargs.get('pk')): + return super().dispatch(request, *args, **kwargs) + else: + raise PermissionDenied + + def get(self, request, *args, **kwargs): + context = self.get_context_data(**_.merge({}, request.GET, kwargs)) + + form = self.form_class(instance=request.user) + # import code + # code.interact(local=dict(globals(), **locals())) + context.update({'form': form}) + + return render(request, self.template_name, context) + + def post(self, request, *args, **kwargs): + context = self.get_context_data(**kwargs) + + specs = tuple(filter(None, re.split(r'\s|,|;', request.POST.get('contractor_specializations')))) + request.POST.setlist('contractor_specializations', specs) + + builds = tuple(filter(None, re.split(r'\s|,|;', request.POST.get('contractor_building_classifications')))) + request.POST.setlist('contractor_building_classifications', builds) + + constructs = tuple(filter(None, re.split(r'\s|,|;', request.POST.get('contractor_construction_types')))) + request.POST.setlist('contractor_construction_types', constructs) + + form = self.form_class(request.POST, request=request, instance=request.user) + + if form.is_valid(): + user = form.save() + + live_image = form.cleaned_data.get('live_image') + + if live_image: + new_image = ContentFile(live_image.file.read()) + new_image.name = live_image.file.name + + user.avatar = new_image + user.save() + + live_image.file.delete() + live_image.delete() + + messages.info(request, 'Пользователь успешно отредактирован') + redirect_to = request.POST.get('next') + return redirect(redirect_to) + else: + if form.errors: + messages.info(request, ( + '

    Произошла ошибка (form)

    ' + '
    {form}
    ' + ).format(form=pformat(form.errors))) + + context.update({'form': form}) + return render(request, self.template_name, context) + + class UserFinancialInfoEditView(BaseMixin, View): form_class = UserProfileBasicInfoEditForm fin_info_form_class = UserFinancialInfoEditForm