rb-document-form-constructor 0.9.16 → 0.9.18

package/src/components/DocTemplateFacetList.vue

@@ -1,127 +1,127 @@
-<template>
-  <div class="rb-facets-sidebar">
-    <div class="d-flex justify-content-between align-items-center">
-      <h4>Компоненты</h4>
-      <slot name="action"></slot>
-    </div>
-    <b-form>
-      <b-form-row>
-        <b-col lg="12">
-          <b-form-group>
-            <b-form-input v-model="facetSearchStr" placeholder="Название поля">
-            </b-form-input>
-          </b-form-group>
-        </b-col>
-      </b-form-row>
-    </b-form>
-    <div class="rb-facet-list">
-      <div v-for="facet in innerFacets" v-if="facet.fields.length > 0"
-           :key="facet.name" class="rb-facet">
-        <h6 class="rb-facet-label d-flex cursor-pointer" @click="facet.expanded = !facet.expanded">
-          <rb-text class="flex-fill">{{ facet.labelRu }}</rb-text>
-          <rb-icon :icon="facet.expanded? iconCollapseFacet: iconExpandFacet"></rb-icon>
-        </h6>
-
-        <b-list-group v-if="facet.expanded">
-          <draggable v-model="facet.fields"
-                     :animation="200"
-                     :clone="onFieldCloned"
-                     :group="{name: 'fields', pull: 'clone', put: false}"
-                     ghost-class="rb-facet-field-moving"
-                     @end="onFieldMoveEnd($event)">
-            <b-list-group-item v-for="field in facet.fields"
-                               :id="field.name + 'Sidebar'"
-                               :key="field.name"
-                               class="cursor-pointer">
-              <rb-text>
-                <span class="d-flex flex-column">
-                   {{ field.name }}
-                <span class="rb-facet-label-sub-text">{{ field.labelRu }}</span>
-                </span>
-                <slot :field="field" name="actionField"></slot>
-              </rb-text>
-            </b-list-group-item>
-          </draggable>
-        </b-list-group>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import draggable from "vuedraggable";
-import {UtFormConstructor} from "../utils/UtFormConstructor";
-
-export default {
-  name: 'DocTemplateFacetList',
-  components: {draggable},
-  props: {
-    facets: {type: Array, default: () => []}
-  },
-  data() {
-    return {
-      allFacets: [],
-      innerFacets: [],
-      facetSearchStr: null,
-    }
-  },
-  computed: {
-    iconExpandFacet() {
-      return UtFormConstructor.config.icons.iconExpandFacet;
-    },
-    iconCollapseFacet() {
-      return UtFormConstructor.config.icons.iconCollapseFacet;
-    },
-  },
-  watch: {
-    facetSearchStr() {
-      this.findInFacets(this.facetSearchStr);
-    },
-    facets() {
-      this.handleFacetsProp();
-    }
-  },
-  methods: {
-    onFieldCloned(cloneField) {
-      let field = JSON.parse(JSON.stringify(cloneField));
-      field.input = UtFormConstructor.getDefaultInput(field);
-      return field;
-    },
-    onFieldMoveEnd(event) {
-      this.$emit('fieldMoveEnd', event);
-    },
-    findInFacets(str) {
-      str = str.toLowerCase();
-      if (!str || str.length === 0) {
-        this.innerFacets = this.allFacets;
-      }
-      let facets = JSON.parse(JSON.stringify(this.allFacets));
-      facets = facets.filter(facet => {
-        let facetFound = false;
-        facet.fields = facet.fields.filter(field => {
-          let fieldFound = field.labelRu.toLowerCase().indexOf(str) >= 0 || field.name.toLowerCase().indexOf(str) >= 0;
-          if (fieldFound) {
-            facetFound = true;
-          }
-          return fieldFound;
-        });
-        return facetFound;
-      });
-      this.innerFacets = facets;
-    },
-    handleFacetsProp() {
-      let innerFacets = this.facets.map(f => ({...f, expanded: false}));
-      if (innerFacets) {
-        innerFacets.forEach(facet => {
-          facet.fields = facet.fields.filter(field => !field.hiddenOnFormConfig);
-        })
-      }
-      this.innerFacets = JSON.parse(JSON.stringify(innerFacets));
-      this.allFacets = JSON.parse(JSON.stringify(innerFacets));
-    },
-  },
-  created() {
-    this.handleFacetsProp();
-  }
-}
-</script>
+<template>
+  <div class="rb-facets-sidebar">
+    <div class="d-flex justify-content-between align-items-center">
+      <h4>Компоненты</h4>
+      <slot name="action"></slot>
+    </div>
+    <b-form>
+      <b-form-row>
+        <b-col lg="12">
+          <b-form-group>
+            <b-form-input v-model="facetSearchStr" placeholder="Название поля">
+            </b-form-input>
+          </b-form-group>
+        </b-col>
+      </b-form-row>
+    </b-form>
+    <div class="rb-facet-list">
+      <div v-for="facet in innerFacets" v-if="facet.fields.length > 0"
+           :key="facet.name" class="rb-facet">
+        <h6 class="rb-facet-label d-flex cursor-pointer" @click="facet.expanded = !facet.expanded">
+          <rb-text class="flex-fill">{{ facet.labelRu }}</rb-text>
+          <rb-icon :icon="facet.expanded? iconCollapseFacet: iconExpandFacet"></rb-icon>
+        </h6>
+
+        <b-list-group v-if="facet.expanded">
+          <draggable v-model="facet.fields"
+                     :animation="200"
+                     :clone="onFieldCloned"
+                     :group="{name: 'fields', pull: 'clone', put: false}"
+                     ghost-class="rb-facet-field-moving"
+                     @end="onFieldMoveEnd($event)">
+            <b-list-group-item v-for="field in facet.fields"
+                               :id="field.name + 'Sidebar'"
+                               :key="field.name"
+                               class="cursor-pointer">
+              <rb-text>
+                <span class="d-flex flex-column">
+                   {{ field.name }}
+                <span class="rb-facet-label-sub-text">{{ field.labelRu }}</span>
+                </span>
+                <slot :field="field" name="actionField"></slot>
+              </rb-text>
+            </b-list-group-item>
+          </draggable>
+        </b-list-group>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import draggable from "vuedraggable";
+import {UtFormConstructor} from "../utils/UtFormConstructor";
+
+export default {
+  name: 'DocTemplateFacetList',
+  components: {draggable},
+  props: {
+    facets: {type: Array, default: () => []}
+  },
+  data() {
+    return {
+      allFacets: [],
+      innerFacets: [],
+      facetSearchStr: null,
+    }
+  },
+  computed: {
+    iconExpandFacet() {
+      return UtFormConstructor.config.icons.iconExpandFacet;
+    },
+    iconCollapseFacet() {
+      return UtFormConstructor.config.icons.iconCollapseFacet;
+    },
+  },
+  watch: {
+    facetSearchStr() {
+      this.findInFacets(this.facetSearchStr);
+    },
+    facets() {
+      this.handleFacetsProp();
+    }
+  },
+  methods: {
+    onFieldCloned(cloneField) {
+      let field = JSON.parse(JSON.stringify(cloneField));
+      field.input = UtFormConstructor.getDefaultInput(field);
+      return field;
+    },
+    onFieldMoveEnd(event) {
+      this.$emit('fieldMoveEnd', event);
+    },
+    findInFacets(str) {
+      str = str.toLowerCase();
+      if (!str || str.length === 0) {
+        this.innerFacets = this.allFacets;
+      }
+      let facets = JSON.parse(JSON.stringify(this.allFacets));
+      facets = facets.filter(facet => {
+        let facetFound = false;
+        facet.fields = facet.fields.filter(field => {
+          let fieldFound = field.labelRu.toLowerCase().indexOf(str) >= 0 || field.name.toLowerCase().indexOf(str) >= 0;
+          if (fieldFound) {
+            facetFound = true;
+          }
+          return fieldFound;
+        });
+        return facetFound;
+      });
+      this.innerFacets = facets;
+    },
+    handleFacetsProp() {
+      let innerFacets = this.facets.map(f => ({...f, expanded: false}));
+      if (innerFacets) {
+        innerFacets.forEach(facet => {
+          facet.fields = facet.fields.filter(field => !field.hiddenOnFormConfig);
+        })
+      }
+      this.innerFacets = JSON.parse(JSON.stringify(innerFacets));
+      this.allFacets = JSON.parse(JSON.stringify(innerFacets));
+    },
+  },
+  created() {
+    this.handleFacetsProp();
+  }
+}
+</script>