centaline-data-driven 1.1.54 → 1.1.55

package/src/centaline/dynamicComboBoxWithTextBox/src/dynamicComboBoxWithTextBox.vue

@@ -1,240 +1,240 @@
-<template>
-  <div class="field-top">
-    <div style="width:100%;display:flex">
-      <div style="flex:1" class="ct-combobox-with-textbox" :class="[(focus || showDrop)?'isfocus':'',model.attrs.size?'ct-combobox-with-textbox-'+model.attrs.size:''
-       ]" @mouseover="mouseOverHandle" @mouseout="mouseOutHandle">
-        <div :class="[model.showLabel?'el-input-group el-input-group--prepend':'',!valid?'inputError':'']">
-          <div v-if="model.showLabel && model.label" class="el-input-group__prepend" :class="[model.labelClass]">
-            {{model.label}}
-          </div>
-          <div class="ct-combobox-with-textbox-label">
-            <el-select v-model="model.value" size="mini" v-bind="model.attrs"
-                       :placeholder="model.placeholder"
-                       @change="onChangeHandler"
-                       @visible-change="visibleChangeHandle"
-                       :disabled="model.lock"
-                       clearable>
-              <el-option v-for="item in model.options"
-                         :key="item.code"
-                         :label="item.name"
-                         :value="item.code">
-              </el-option>
-            </el-select>
-            <el-select v-if="model.id1"
-                       v-model="model.value1" v-bind="model.attrs"
-                       :placeholder="model.placeholder1"
-                       @change="onChangeHandler1"
-                       @visible-change="visibleChangeHandle1"
-                       :disabled="model.lock"
-                       clearable>
-              <el-option v-for="item in model.options1"
-                         :key="item.code"
-                         :label="item.name"
-                         :value="item.code">
-              </el-option>
-            </el-select>
-            <el-select v-if="model.id2" size="mini" v-bind="model.attrs"
-                       v-model="model.value2" :placeholder="model.placeholder2"
-                       @change="onChangeHandler2"
-                       @visible-change="visibleChangeHandle2"
-                       :disabled="model.lock"
-                       clearable>
-              <el-option v-for="item in model.options2"
-                         :key="item.code"
-                         :label="item.name"
-                         :value="item.code">
-              </el-option>
-            </el-select>
-            <el-input v-if="model.id3" v-bind="model.attrs"
-                      :placeholder="model.placeholder3" v-model="model.value3"
-                      @input="inputHandler($event)" @change="changeHandler($event)"
-                      :disabled="model.lock" :maxlength="model.max"></el-input>
-          </div>
-        </div>
-      </div>
-      <transition name="el-fade-in">
-        <span v-show="!valid" class="errorMessage">
-          {{validMessage}}
-        </span>
-      </transition>
-    </div>
-  </div>
-</template>
-
-<script>
-  import dynamicElement from '../../mixins/dynamicElement'
-  export default {
-    name: 'ct-combobox-with-textbox',
-    mixins: [dynamicElement],
-    components: {
-    },
-    props: {
-      api: String,
-      vmodel: Object,
-      popShow: {
-        type: Boolean,
-        default: true
-      }
-    },
-    data() {
-      return {
-        focus: false,
-        showDrop: false,
-        showClear: false
-      }
-    },
-    created() {
-      if (typeof this.vmodel === 'undefined') {
-        this.model = this.loaderObj.ComboBoxWithTextBox(this.source);
-      }
-      else {
-        this.model = this.vmodel;
-      }
-      this.$watch('model.value', (n, o) => {
-        if (typeof this.model.child !== 'undefined') {
-          this.model.child.value = this.model.child.defaultValue || '';
-          this.model.child.text = this.model.child.defaultText || '';
-        }
-      });
-    },
-    computed: {
-      soPlaceholder: {
-        get: function () {
-          if (this.model.value !== '') {
-            return '';
-          }
-          else {
-            return this.model.label;
-          }
-        },
-        set: function (v) {
-
-        }
-      }
-    },
-    mounted() {
-      var self = this;
-      this.$nextTick(function () {
-        self.$watch('model.options', function (newVal, oldVal) {
-
-        }, { deep: true, immediate: true });
-      });
-    },
-    methods: {
-      getOptions: function () {
-        this.model.getOptions(this.api);
-      },
-      soChange: function () {
-        var self = this;
-        if (typeof this.model.child !== 'undefined') {
-          this.model.child.value = this.model.child.defaultValue || '';
-          this.model.child.text = this.model.child.defaultText || '';
-        }
-        this.inputHandler(self.model.value);
-        this.changeHandler(self.model.value);
-      },
-      onChangeHandler: function () {
-        this.model.value1 = '';
-        this.model.value2 = '';
-        this.inputHandler(this.model.value);
-        this.changeHandler(this.model.value);
-      },
-      onChangeHandler1: function () {
-        this.model.value2 = '';
-        this.inputHandler(this.model.value1);
-        this.changeHandler(this.model.value1);
-      },
-      onChangeHandler2: function () {
-        this.inputHandler(this.model.value2);
-        this.changeHandler(this.model.value2);
-      },
-      visibleChangeHandle: function (visible) {
-        if (visible) {
-          this.model.getOptions(this.api, '');
-        }
-      },
-      visibleChangeHandle1: function (visible) {
-        if (visible) {
-          if (this.model.value !== '') {
-            this.model.getOptions(this.api, '1', this.model.value);
-          }
-          else {
-            this.model.options1.splice(0, this.model.options1.length)
-          }
-        }
-      },
-      visibleChangeHandle2: function (visible) {
-        if (visible) {
-          if (this.model.value1 !== '') {
-            this.model.getOptions(this.api, '2', this.model.value1);
-          }
-          else {
-            this.model.options2.splice(0, this.model.options2.length)
-          }
-        }
-      },
-      getOptionText: function (value) {
-        var self = this;
-        var option = this.model.options.find((v) => { return v[self.model.optionAttrs.value] === value });
-        if (option) {
-          return option[self.model.optionAttrs.label];
-        } else {
-          return value;
-        }
-      },
-      getOptionSelect(value) {
-        if (this.model.value === value) {
-          return "danger";
-        }
-        else {
-          return "success";
-        }
-      },
-      selectOption(value) {
-        if (this.model.value === value) {
-          //this.model.value = '';
-          this.$set(this, 'showDrop', false);
-          return;
-        }
-        else {
-          this.model.value = value;
-        }
-        this.soChange();
-        this.$set(this, 'showDrop', false);
-      },
-      mouseOverHandle: function () {
-        if (this.model.value !== '' && this.model.clearable) {
-          this.$set(this, 'showClear', true);
-        }
-      },
-      mouseOutHandle: function () {
-        this.$set(this, 'showClear', false);
-      },
-      clearClickHandle: function () {
-        this.model.value = '';
-        this.soChange();
-      }
-    }
-  }
-</script>
-<style>
-  .ct-combobox-with-textbox {
-    font-size: 12px;
-    align-items: center;
-    height: 26px;
-  }
-
-    .ct-combobox-with-textbox .ct-combobox-with-textbox-label {
-      align-items: center;
-      display: flex;
-      font-size: 12px;
-    }
-
-    .ct-combobox-with-textbox .ct-combobox-div {
-      position: relative;
-    }
-
-  .ct-combobox-with-textbox .el-input.is-focus .el-input__inner {
-    border: 1px solid #409EFF !important;
-  }
-</style>
+<template>
+  <div class="field-top">
+    <div style="width:100%;display:flex">
+      <div style="flex:1" class="ct-combobox-with-textbox" :class="[(focus || showDrop)?'isfocus':'',model.attrs.size?'ct-combobox-with-textbox-'+model.attrs.size:''
+       ]" @mouseover="mouseOverHandle" @mouseout="mouseOutHandle">
+        <div :class="[model.showLabel?'el-input-group el-input-group--prepend':'',!valid?'inputError':'']">
+          <div v-if="model.showLabel && model.label" class="el-input-group__prepend" :class="[model.labelClass]">
+            {{model.label}}
+          </div>
+          <div class="ct-combobox-with-textbox-label">
+            <el-select v-model="model.value" size="mini" v-bind="model.attrs"
+                       :placeholder="model.placeholder"
+                       @change="onChangeHandler"
+                       @visible-change="visibleChangeHandle"
+                       :disabled="model.lock"
+                       clearable>
+              <el-option v-for="item in model.options"
+                         :key="item.code"
+                         :label="item.name"
+                         :value="item.code">
+              </el-option>
+            </el-select>
+            <el-select v-if="model.id1"
+                       v-model="model.value1" v-bind="model.attrs"
+                       :placeholder="model.placeholder1"
+                       @change="onChangeHandler1"
+                       @visible-change="visibleChangeHandle1"
+                       :disabled="model.lock"
+                       clearable>
+              <el-option v-for="item in model.options1"
+                         :key="item.code"
+                         :label="item.name"
+                         :value="item.code">
+              </el-option>
+            </el-select>
+            <el-select v-if="model.id2" size="mini" v-bind="model.attrs"
+                       v-model="model.value2" :placeholder="model.placeholder2"
+                       @change="onChangeHandler2"
+                       @visible-change="visibleChangeHandle2"
+                       :disabled="model.lock"
+                       clearable>
+              <el-option v-for="item in model.options2"
+                         :key="item.code"
+                         :label="item.name"
+                         :value="item.code">
+              </el-option>
+            </el-select>
+            <el-input v-if="model.id3" v-bind="model.attrs"
+                      :placeholder="model.placeholder3" v-model="model.value3"
+                      @input="inputHandler($event)" @change="changeHandler($event)"
+                      :disabled="model.lock" :maxlength="model.max"></el-input>
+          </div>
+        </div>
+      </div>
+      <transition name="el-fade-in">
+        <span v-show="!valid" class="errorMessage">
+          {{validMessage}}
+        </span>
+      </transition>
+    </div>
+  </div>
+</template>
+
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  export default {
+    name: 'ct-combobox-with-textbox',
+    mixins: [dynamicElement],
+    components: {
+    },
+    props: {
+      api: String,
+      vmodel: Object,
+      popShow: {
+        type: Boolean,
+        default: true
+      }
+    },
+    data() {
+      return {
+        focus: false,
+        showDrop: false,
+        showClear: false
+      }
+    },
+    created() {
+      if (typeof this.vmodel === 'undefined') {
+        this.model = this.loaderObj.ComboBoxWithTextBox(this.source);
+      }
+      else {
+        this.model = this.vmodel;
+      }
+      this.$watch('model.value', (n, o) => {
+        if (typeof this.model.child !== 'undefined') {
+          this.model.child.value = this.model.child.defaultValue || '';
+          this.model.child.text = this.model.child.defaultText || '';
+        }
+      });
+    },
+    computed: {
+      soPlaceholder: {
+        get: function () {
+          if (this.model.value !== '') {
+            return '';
+          }
+          else {
+            return this.model.label;
+          }
+        },
+        set: function (v) {
+
+        }
+      }
+    },
+    mounted() {
+      var self = this;
+      this.$nextTick(function () {
+        self.$watch('model.options', function (newVal, oldVal) {
+
+        }, { deep: true, immediate: true });
+      });
+    },
+    methods: {
+      getOptions: function () {
+        this.model.getOptions(this.api);
+      },
+      soChange: function () {
+        var self = this;
+        if (typeof this.model.child !== 'undefined') {
+          this.model.child.value = this.model.child.defaultValue || '';
+          this.model.child.text = this.model.child.defaultText || '';
+        }
+        this.inputHandler(self.model.value);
+        this.changeHandler(self.model.value);
+      },
+      onChangeHandler: function () {
+        this.model.value1 = '';
+        this.model.value2 = '';
+        this.inputHandler(this.model.value);
+        this.changeHandler(this.model.value);
+      },
+      onChangeHandler1: function () {
+        this.model.value2 = '';
+        this.inputHandler(this.model.value1);
+        this.changeHandler(this.model.value1);
+      },
+      onChangeHandler2: function () {
+        this.inputHandler(this.model.value2);
+        this.changeHandler(this.model.value2);
+      },
+      visibleChangeHandle: function (visible) {
+        if (visible) {
+          this.model.getOptions(this.api, '');
+        }
+      },
+      visibleChangeHandle1: function (visible) {
+        if (visible) {
+          if (this.model.value !== '') {
+            this.model.getOptions(this.api, '1', this.model.value);
+          }
+          else {
+            this.model.options1.splice(0, this.model.options1.length)
+          }
+        }
+      },
+      visibleChangeHandle2: function (visible) {
+        if (visible) {
+          if (this.model.value1 !== '') {
+            this.model.getOptions(this.api, '2', this.model.value1);
+          }
+          else {
+            this.model.options2.splice(0, this.model.options2.length)
+          }
+        }
+      },
+      getOptionText: function (value) {
+        var self = this;
+        var option = this.model.options.find((v) => { return v[self.model.optionAttrs.value] === value });
+        if (option) {
+          return option[self.model.optionAttrs.label];
+        } else {
+          return value;
+        }
+      },
+      getOptionSelect(value) {
+        if (this.model.value === value) {
+          return "danger";
+        }
+        else {
+          return "success";
+        }
+      },
+      selectOption(value) {
+        if (this.model.value === value) {
+          //this.model.value = '';
+          this.$set(this, 'showDrop', false);
+          return;
+        }
+        else {
+          this.model.value = value;
+        }
+        this.soChange();
+        this.$set(this, 'showDrop', false);
+      },
+      mouseOverHandle: function () {
+        if (this.model.value !== '' && this.model.clearable) {
+          this.$set(this, 'showClear', true);
+        }
+      },
+      mouseOutHandle: function () {
+        this.$set(this, 'showClear', false);
+      },
+      clearClickHandle: function () {
+        this.model.value = '';
+        this.soChange();
+      }
+    }
+  }
+</script>
+<style>
+  .ct-combobox-with-textbox {
+    font-size: 12px;
+    align-items: center;
+    height: 26px;
+  }
+
+    .ct-combobox-with-textbox .ct-combobox-with-textbox-label {
+      align-items: center;
+      display: flex;
+      font-size: 12px;
+    }
+
+    .ct-combobox-with-textbox .ct-combobox-div {
+      position: relative;
+    }
+
+  .ct-combobox-with-textbox .el-input.is-focus .el-input__inner {
+    border: 1px solid #409EFF !important;
+  }
+</style>

package/src/centaline/dynamicD/index.js

@@ -1,11 +1,11 @@
-import dynamicD from './src/dynamicD'
-
-dynamicD.install = function (Vue) {
-  Vue.component(dynamicD.name, dynamicD);
-}
-
-if (typeof window !== 'undefined' && window.Vue) {
-  window.Vue.use(dynamicD);
-}
-
-export default dynamicD;
+import dynamicD from './src/dynamicD'
+
+dynamicD.install = function (Vue) {
+  Vue.component(dynamicD.name, dynamicD);
+}
+
+if (typeof window !== 'undefined' && window.Vue) {
+  window.Vue.use(dynamicD);
+}
+
+export default dynamicD;