@10yun/cv-mobile-ui 0.5.3 → 0.5.5

package/ui-cv/cv-input-digit/cv-input-digit.vue

@@ -24,30 +24,86 @@
 </template>
 
 <script>
-import MixinsInput from '../mixins/mixins-input.js';
 export default {
-  mixins: [MixinsInput],
   name: 'cvInputDigit',
-  inject: {
-    cvFormGroup: {
-      default() {
-        return null;
-      }
-    }
-  },
   props: {
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
     placeholder: {
       type: [String],
       default: '请输入数字'
+    },
+    disabled: {
+      type: [Boolean],
+      default: false
+    },
+    clearable: {
+      type: [Boolean],
+      default: false
+    },
+    maxlength: {
+      type: [Number, String],
+      default: -1
     }
   },
   // 监听动态数据变化
-  watch: {},
+  watch: {
+    value(newVal) {
+      this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+    }
+  },
   data() {
-    return {};
+    return {
+      localStyle: '',
+      localVal: ''
+    };
   },
-  created() {},
-  methods: {}
+  created() {
+    this.localVal = this.doValueGet();
+  },
+  mounted() {
+    this._itemStyle();
+  },
+  methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
+    _itemStyle() {
+      /* 计算输入框右侧预留空间 */
+      let paddingRight = 0;
+      if (this.$slots['append']) {
+        paddingRight += 20;
+      }
+      if (this.clearable) {
+        paddingRight += 30;
+      }
+      this.localStyle = 'margin-right:' + paddingRight + 'px;';
+    },
+    onBlur(e) {
+      this.localVal = e.detail.value;
+      this.funcOnInput();
+    },
+    funcOnInput(e) {
+      this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    /* 监听自己清除按钮点击事件 */
+    onEmpty() {
+      this.localVal = '';
+      this.funcOnInput();
+    }
+  }
 };
 </script>
 <style>

package/ui-cv/cv-input-idcard/cv-input-idcard.vue

@@ -20,34 +20,90 @@
 </template>
 
 <script>
-import MixinsInput from '../mixins/mixins-input.js';
 export default {
-  mixins: [MixinsInput],
   name: 'cvInputIdcard',
-  inject: {
-    cvFormGroup: {
-      default() {
-        return null;
-      }
-    }
-  },
   props: {
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
     placeholder: {
       type: [String],
       default: '请输入身份证'
+    },
+    disabled: {
+      type: [Boolean],
+      default: false
+    },
+    clearable: {
+      type: [Boolean],
+      default: false
+    },
+    maxlength: {
+      type: [Number, String],
+      default: -1
     }
   },
   data() {
-    return {};
+    return {
+      localStyle: '',
+      localVal: ''
+    };
+  },
+  watch: {
+    value(newVal) {
+      this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+    }
   },
-  watch: {},
-  created() {},
-  methods: {}
+  created() {
+    this.localVal = this.doValueGet();
+  },
+  mounted() {
+    this._itemStyle();
+  },
+  methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
+    _itemStyle() {
+      /* 计算输入框右侧预留空间 */
+      let paddingRight = 0;
+      if (this.$slots['append']) {
+        paddingRight += 20;
+      }
+      if (this.clearable) {
+        paddingRight += 30;
+      }
+      this.localStyle = 'margin-right:' + paddingRight + 'px;';
+    },
+    onBlur(e) {
+      this.localVal = e.detail.value;
+      this.funcOnInput();
+    },
+    funcOnInput(e) {
+      this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    /* 监听自己清除按钮点击事件 */
+    onEmpty() {
+      this.localVal = '';
+      this.funcOnInput();
+    }
+  }
 };
 </script>
 <style>
 .cv-input__content {
-  height: 36px;
+  min-height: 36px;
   line-height: 36px;
   font-size: 14px;
 }

package/ui-cv/cv-input-number/cv-input-number.vue

@@ -22,37 +22,80 @@
     </view>
   </view>
 </template>
-
 <script>
-import MixinsInput from '../mixins/mixins-input.js';
 export default {
-  mixins: [MixinsInput],
   name: 'cvInputNumber',
-  inject: {
-    cvFormGroup: {
-      default() {
-        return null;
-      }
-    }
-  },
   props: {
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
     placeholder: {
       type: [String],
       default: '请输入数字'
+    },
+    disabled: {
+      type: [Boolean],
+      default: false
+    },
+    clearable: {
+      type: [Boolean],
+      default: false
+    },
+    maxlength: {
+      type: [Number, String],
+      default: -1
     }
   },
   data() {
-    return {};
+    return {
+      localStyle: '',
+      localVal: ''
+    };
   },
   watch: {
     value(newVal) {
       this.localVal = this._dealValue(newVal);
+    },
+    modelValue(newVal) {
+      this.localVal = this._dealValue(newVal);
     }
   },
   created() {
-    this.localVal = this._dealValue(this.value);
+    // this.localVal = this._dealValue(this.value);
+  },
+  mounted() {
+    this._itemStyle();
   },
   methods: {
+    _itemStyle() {
+      /* 计算输入框右侧预留空间 */
+      let paddingRight = 0;
+      if (this.$slots['append']) {
+        paddingRight += 20;
+      }
+      if (this.clearable) {
+        paddingRight += 30;
+      }
+      this.localStyle = 'margin-right:' + paddingRight + 'px;';
+    },
+    onBlur(e) {
+      this.localVal = e.detail.value;
+      this.funcOnInput();
+    },
+    funcOnInput(e) {
+      this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    /* 监听自己清除按钮点击事件 */
+    onEmpty() {
+      this.localVal = '';
+      this.funcOnInput();
+    },
     _dealValue(value) {
       if (Object.prototype.toString.call(value) === '[object Number]') {
         return value.toString();
@@ -66,7 +109,7 @@ export default {
 
 <style>
 .cv-input__content {
-  height: 36px;
+  min-height: 36px;
   line-height: 36px;
   font-size: 14px;
 }

package/ui-cv/cv-input-password/cv-input-password.vue

@@ -30,35 +30,89 @@
 </template>
 
 <script>
-import MixinsInput from '../mixins/mixins-input.js';
 export default {
-  mixins: [MixinsInput],
   name: 'cvInputPassword',
-  inject: {
-    cvFormGroup: {
-      default() {
-        return null;
-      }
-    }
-  },
   props: {
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
     placeholder: {
       type: [String],
       default: '请输入密码'
     },
+    disabled: {
+      type: [Boolean],
+      default: false
+    },
+    clearable: {
+      type: [Boolean],
+      default: false
+    },
+    maxlength: {
+      type: [Number, String],
+      default: -1
+    },
     passwordIcon: {
       type: Boolean,
       default: true
     }
   },
-  watch: {},
+  watch: {
+    value(newVal) {
+      this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+    }
+  },
   data() {
     return {
+      localStyle: '',
+      localVal: '',
       showPassword: false
     };
   },
-  created() {},
+  created() {
+    this.localVal = this.doValueGet();
+  },
+  mounted() {
+    this._itemStyle();
+  },
   methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
+    _itemStyle() {
+      /* 计算输入框右侧预留空间 */
+      let paddingRight = 0;
+      if (this.$slots['append']) {
+        paddingRight += 20;
+      }
+      if (this.clearable) {
+        paddingRight += 30;
+      }
+      this.localStyle = 'margin-right:' + paddingRight + 'px;';
+    },
+    onBlur(e) {
+      this.localVal = e.detail.value;
+      this.funcOnInput();
+    },
+    funcOnInput(e) {
+      this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    /* 监听自己清除按钮点击事件 */
+    onEmpty() {
+      this.localVal = '';
+      this.funcOnInput();
+    },
     onEyes() {
       this.showPassword = !this.showPassword;
     }
@@ -67,7 +121,7 @@ export default {
 </script>
 <style>
 .cv-input__content {
-  height: 36px;
+  min-height: 36px;
   line-height: 36px;
   font-size: 14px;
 }

package/ui-cv/cv-input-text/cv-input-text.vue

@@ -23,31 +23,98 @@
     </view>
   </view>
 </template>
-
 <script>
-import MixinsInput from '../mixins/mixins-input.js';
 export default {
-  mixins: [MixinsInput],
   name: 'cvInputText',
   options: {
     addGlobalClass: true
   },
   props: {
+    value: {
+      type: [Number, String],
+      default: ''
+    },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
+    placeholder: {
+      type: [String],
+      default: '请输入'
+    },
+    clearable: {
+      type: [Boolean],
+      default: false
+    },
+    maxlength: {
+      type: [Number, String],
+      default: -1
+    },
+    disabled: {
+      type: [Boolean],
+      default: false
+    },
     placeholder: {
       type: [String],
       default: '请输入文本'
     }
   },
+  watch: {
+    value(newVal) {
+      this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+    }
+  },
   data() {
-    return {};
+    return {
+      localStyle: '',
+      localVal: ''
+    };
   },
-  created() {},
-  methods: {}
+  created() {
+    // this.localVal = this.doValueGet();
+  },
+  mounted() {
+    this._itemStyle();
+  },
+  methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
+    _itemStyle() {
+      /* 计算输入框右侧预留空间 */
+      let paddingRight = 0;
+      if (this.$slots['append']) {
+        paddingRight += 20;
+      }
+      if (this.clearable) {
+        paddingRight += 30;
+      }
+      this.localStyle = 'margin-right:' + paddingRight + 'px;';
+    },
+    onBlur(e) {
+      this.localVal = e.detail.value;
+      this.funcOnInput();
+    },
+    funcOnInput(e) {
+      this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    /* 监听自己清除按钮点击事件 */
+    onEmpty() {
+      this.localVal = '';
+      this.funcOnInput();
+    }
+  }
 };
 </script>
 <style>
 .cv-input__content {
-  height: 36px;
+  min-height: 36px;
   line-height: 36px;
   font-size: 14px;
 }

package/ui-cv/cv-picker1/cv-picker1.vue

@@ -16,16 +16,17 @@
 </template>
 
 <script>
-import MixinsPicker from '../mixins/mixins-picker.js';
 export default {
-  mixins: [MixinsPicker],
   name: 'cvPicker1',
   props: {
-    //默认输入框内容
     value: {
       type: [Number, String],
       default: ''
     },
+    modelValue: {
+      type: [Number, String],
+      default: ''
+    },
     dataType: {
       type: String,
       default: 'value'
@@ -44,6 +45,11 @@ export default {
     dataText: {
       type: String,
       default: 'text'
+    },
+    // 占位符
+    placeholder: {
+      type: String,
+      default: '请选择'
     }
   },
   data() {
@@ -71,14 +77,24 @@ export default {
     value(newVal) {
       this.localVal = newVal;
       this._dealValue();
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+      this._dealValue();
     }
   },
   created() {
-    this.localVal = this.value;
+    this.localVal = this.doValueGet();
+    console.log(this.localVal);
     this.localArr = this.itemsSortOut();
     this._dealValue();
   },
   methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
     /**
      * 处理-循环数组数据
      */
@@ -153,8 +169,16 @@ export default {
       } else {
         this.localVal = rowData.value;
       }
+      this.iconTop = false;
+      console.log(this.localVal);
       this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    bindPickerCancel() {
       this.iconTop = false;
+    },
+    changeIconTop() {
+      this.iconTop = true;
     }
   }
 };

package/ui-cv/cv-picker2/cv-picker2.vue

@@ -21,17 +21,17 @@
     </picker>
   </view>
 </template>
-
 <script>
-import MixinsPicker from '../mixins/mixins-picker.js';
 export default {
-  mixins: [MixinsPicker],
   name: 'cvPicker2',
   props: {
-    //默认输入框内容
     value: {
-      type: Array,
-      default: []
+      type: [Array],
+      default: () => []
+    },
+    modelValue: {
+      type: [Array],
+      default: () => []
     },
     dataType: {
       type: String,
@@ -59,6 +59,11 @@ export default {
     joint: {
       type: String,
       default: ''
+    },
+    // 占位符
+    placeholder: {
+      type: String,
+      default: '请选择'
     }
   },
   watch: {
@@ -71,6 +76,10 @@ export default {
     value(newVal) {
       this.localVal = newVal;
       this.itemsSortOut();
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
+      this.itemsSortOut();
     }
   },
   data() {
@@ -83,17 +92,26 @@ export default {
       items_sub: [],
       items_index: [0, 0], //当前下标
       lastRetDataIndex: [0, 0], // 最终确定选中的下标
-      localDataType: '',
+      localDataType: 'value',
       localDataValue: 'value',
       localDataText: 'label'
     };
   },
   created() {
-    this.localVal = this.value.length != 2 ? [0, 0] : this.value;
+    this.localVal = this.doValueGet();
     this.localDataType = this.dataType != 'text' ? 'value' : 'text';
     this.itemsSortOut();
   },
   methods: {
+    doValueGet() {
+      if (this.value === '' || (Array.prototype.isPrototypeOf(this.value) && this.value.length === 0)) {
+        return this.modelValue.length != 2 ? [0, 0] : this.modelValue;
+      }
+      if (this.modelValue === '' || (Array.prototype.isPrototypeOf(this.modelValue) && this.modelValue.length === 0)) {
+        return this.value.length != 2 ? [0, 0] : this.value;
+      }
+      return this.value.length != 2 ? [0, 0] : this.value;
+    },
     itemsSortOut() {
       let original = [];
       original = this.dataLists || [];
@@ -109,13 +127,14 @@ export default {
       let items = [];
       let dataValue = this.dataValue ? this.dataValue : 'value';
       let dataText = this.dataText ? this.dataText : 'text';
+
       let tree = this.dataTree;
       let items_index = this.items_index;
       let dataType = this.localDataType;
       for (let i in original) {
         let data = original[i];
         //查找一级绑定参数
-        if (this.localVal[0]) {
+        if (this.localVal && this.localVal.length >= 1) {
           if (dataType == 'text' && this.localVal[0] == data[dataText]) {
             items_index[0] = i;
           } else if (dataType == 'value' && this.localVal[0] == data[dataValue]) {
@@ -134,7 +153,7 @@ export default {
             let data = tree_data[ii];
 
             //查找二级绑定参数
-            if (this.localVal[1]) {
+            if (this.localVal && this.localVal.length >= 2) {
               if (dataType == 'text' && this.localVal[1] == data[dataText]) {
                 items_index[1] = ii;
               } else if (dataType == 'value' && this.localVal[1] == data[dataValue]) {
@@ -158,7 +177,7 @@ export default {
       this.range_data = [items, this.items_sub];
       this.last_range_data = [...this.range_data];
       this.items_index = items_index;
-      if (this.value.length == 2) {
+      if (this.localVal && this.localVal.length == 2) {
         this.lastRetDataIndex = [...this.items_index];
       }
     },
@@ -168,6 +187,9 @@ export default {
       this.updateLocalVal();
       this.iconTop = false;
     },
+    changeIconTop() {
+      this.iconTop = true;
+    },
     /* 取消选择 */
     onCancel(e) {
       this.iconTop = false;
@@ -203,6 +225,7 @@ export default {
       }
       this.localVal = value;
       this.$emit('input', value);
+      this.$emit('update:modelValue', value);
     }
   }
 };