PR-19 Цвет текста в формах заполнения

Добавлен placeholder в формах фильтра
Исправлен баг с очисткой формы

assets/lib/proekton-components/js/SelectBox.js

@@ -16,7 +16,7 @@ class SelectBox {
         let main = `
             <div class="row">
             <div class="col-lg-3 test">
-                <input class="select-box-search" type="text">
+                <input class="select-box-search" type="text" placeholder="Выберите/Поиск">
                 <button class="button-add options">добавить</button>
             </div>
             <div class="col-lg-9">
@@ -25,12 +25,12 @@ class SelectBox {
             </div>
 `;
         let child = `
-<input class="select-box-search" type="text">
+            <input class="select-box-search" type="text" placeholder="Выберите/Поиск">
-<span style="clear:both; display:block"></span>
+            <span style="clear:both; display:block"></span>
-<button class="button-add options">добавить</button>
+            <button class="button-add options">добавить</button>
 `;
         let insert_template = editable_container ? main : child;
-        vertical_child = vertical_child ? 'vertical-child': '';
+        vertical_child = vertical_child ? 'vertical-child' : '';
         let htmlTemplate =
             `
 <span class="select-box-container ${vertical_child}" id="${id}">
@@ -106,16 +106,17 @@ class SelectBox {
         this.$search_input.val("");
         this.$options_box.hide();
         this.$results_box.hide();
-        // this.$button_add.hide();
         this.$button_add_options.hide();
         this.element_id = undefined;
         this.parent_id = undefined;
         this.$editable_container.html("");
         if (this.prev_select_box) this.hide();
+        this.selected_id = undefined;
+        this.selected_val = "";
     }
 
     clearAll(only_next) {
-        console.log("only_next = ", only_next);
+        // console.log("only_next = ", only_next);
         if (this.next_select_box) {
             this.next_select_box.clear()
         }
@@ -174,9 +175,10 @@ class SelectBox {
         this.clearAll(true);
         let el_id = $(e.target).data("id");
         this.selected_id = el_id;
+        this.selected_val = $(e.target).html();
         this.updateEditableContainer(el_id);
         this.$search_input.val($(e.target).html());
-        this.element_id = el_id;
+        // this.element_id = el_id;
         if (this.next_select_box) {
             this.next_select_box.setParent(el_id);
             this.next_select_box.setHeader($(e.target).html());
@@ -259,7 +261,11 @@ class SelectBox {
     _looseFocus() {
         this.$results_box.hide();
         this.$options_box.hide();
-        if (!this.selected_id) this.$search_input.val("");
+        if (!this.selected_id) {
+            this.$search_input.val("");
+        } else {
+            this.$search_input.val(this.selected_val);
+        }
     }
 
     _bindEvents() {

assets/lib/proekton-components/js/SimpleSelect.js

@@ -11,7 +11,7 @@ class SimpleSelect {
 
     static getTemplate(header, id) {
         let insert_template = `
-<input class="select-box-search" type="text">
+<input class="select-box-search" type="text" placeholder="Выберите/Поиск">
 <span style="clear:both; display:block"></span>
 `;
 
@@ -38,6 +38,7 @@ class SimpleSelect {
                 <ul>
                 </ul>
             </span>
+            <button class="button-add results">добавить</button>
         </span>
     </span>
     <span style="clear: both"></span>
@@ -63,6 +64,13 @@ class SimpleSelect {
         this.$header.html(header);
     }
 
+    getSelectedElements() {
+        let all_checked = this.$results_box.find(":checked");
+        return all_checked.map(function () {
+            return $(this).data("id");
+        })
+    }
+
 
     static _collectData($container) {
         let $options = $container.find('option');
@@ -126,7 +134,7 @@ class SimpleSelect {
         this.$results_box = this.$select_box.find('.select-box-results');
         this.$options_box = this.$select_box.find('.select-box-options');
         this.$search_input = this.$select_box.find('input.select-box-search');
-        // this.$button_add = this.$results_box.find('.button-add');
+        this.$button_add = this.$results_box.find('.button-add');
         // this.$button_add_options = this.$select_box.find('.button-add.options');
         // this.$editable_container = this.$select_box.find('.editable-container');
         this._fillOptionsData();
@@ -139,7 +147,7 @@ class SimpleSelect {
     _looseFocus() {
         this.$results_box.hide();
         this.$options_box.hide();
-        if (!this.selected_id) this.$search_input.val("");
+        this.$search_input.val("");
     }
 
     _bindEvents() {
@@ -166,20 +174,30 @@ class SimpleSelect {
         });
 
 
-        // this.$button_add.on("click", function (e) {
+        this.$button_add.on("click", function (e) {
-        //     self._onButtonAdd(e);
+            self._onButtonAdd(e);
-        // });
+        });
 
     }
 
     _onclickOptionsElement(e) {
         console.log("selelc with id =", $(e.target).data("id"));
-        let el_id = $(e.target).data("id");
+        this.selected_id = $(e.target).data("id");
-        this.selected_id = el_id;
-        // this.$search_input.val($(e.target).html());
         if (this.selected_container) this.selected_container.add(this.selected_id, 40);
         this.$options_box.hide();
     }
 
+    _onButtonAdd(e) {
+        let self = this;
+
+        this.getSelectedElements().each(function () {
+            console.log("add el -->", this);
+            self.selected_container.add(this, 40);
+        });
+        this.clear();
+        e.preventDefault();
+        return false;
+    }
+
 
 }