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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@10yun/cv-mobile-ui",
-  "version": "0.5.3",
+  "version": "0.5.5",
   "description": "十云cvjs移动端ui，适用uniapp",
   "author": "",
   "license": "Apache-2.0",

package/ui-cv/{cv-button/cv-button.vue → cv-btn-base/cv-btn-base.vue}

@@ -1,12 +1,9 @@
 <template>
-  <view class="cv-button-wrap">
-    <button class="cv-button-item" :type="type" :form-type="formType" @click="parentClick"><slot /></button>
-  </view>
+  <button class="cv-button-wrap" :type="type" :form-type="formType" :size="size" @click="parentClick"><slot /></button>
 </template>
-
 <script>
 export default {
-  name: 'cvButton',
+  name: 'cvBtnBase',
   props: {
     size: {
       type: [String],
@@ -14,7 +11,7 @@ export default {
     },
     type: {
       type: [String],
-      default: 'default'
+      default: 'primary'
     },
     formType: {
       type: [String],
@@ -22,6 +19,10 @@ export default {
     },
     click: {
       type: [Function]
+    },
+    autoLoading: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -36,6 +37,12 @@ export default {
     },
     parentClick(evt) {
       this.$emit('click', evt);
+      if (this.autoLoading) {
+        this.loadingStatus = true;
+      }
+      this.$emit('click', () => {
+        this.loadingStatus = false;
+      });
     }
   }
 };
@@ -44,15 +51,13 @@ export default {
 <style>
 .cv-button-wrap {
   padding: 0 10px;
-  margin-top: 10px;
-}
-.cv-button-item {
-  letter-spacing: 2px;
+  /* margin-top: 10px;
   font-size: 14px;
-  margin: 0px 15px;
-  line-height: 100%;
-  padding: 10px 0;
-  border-radius: 40px;
+  margin: 0px 15px; */
+  /* line-height: 100%; */
+  /* padding: 6px 5px; */
+  /* margin-bottom: 5px; */
+  margin: 0 10px;
 }
 
 .cv-button-item2 {

package/ui-cv/cv-checkbox-group/cv-checkbox-group.vue

@@ -1,11 +1,12 @@
 <template>
   <view class="cv-checkbox-group-wrap">
-    <checkbox-group @change="checkboxChange" class="cv-radio-group__box">
+    <checkbox-group @change="checkboxChange" class="cv-checkbox-group__box" :style="localStyle">
       <slot>
         <cv-checkbox-opt-base
           v-if="type == 'base'"
-          v-for="item in items"
+          v-for="item in localList"
           :key="item.value"
+          :label="item.text"
           :value="item.value"
           :checked="item.checked"
         >
@@ -13,14 +14,15 @@
         </cv-checkbox-opt-base>
         <cv-checkbox-opt-tag
           v-if="type == 'tag'"
-          v-for="item in items"
+          v-for="item in localList"
           :key="item.value"
+          :label="item.text"
           :value="item.value"
           :checked="item.checked"
         >
           {{ item.text }}
         </cv-checkbox-opt-tag>
-        <!-- <label class="cv-checkbox-group__label"  v-for="item in items" :value="value" :key="item.value">
+        <!-- <label class="cv-checkbox-group__label"  v-for="item in localList" :value="value" :key="item.value">
           <view class="">
             <checkbox :value="item.value" :checked="item.checked" style="transform: scale(0.7)" />
           </view>
@@ -40,14 +42,21 @@ export default {
     cvCheckboxOptTag
   },
   props: {
+    value: {
+      type: [Array, String, Number],
+      default: []
+    },
+    modelValue: {
+      type: [Array, String, Number],
+      default: []
+    },
     type: {
       type: [String],
       default: 'base'
     },
-    //默认内容
-    value: {
-      type: [Array, String, Number],
-      default: []
+    align: {
+      type: [String],
+      default: 'left'
     },
     dataType: {
       type: String,
@@ -82,29 +91,45 @@ export default {
   data() {
     return {
       localVal: [],
-      items: []
+      localList: [],
+      localStyle: ''
     };
   },
   watch: {
     value(newVal) {
-      this._doValueType(newVal);
+      this.dealValue(newVal);
+    },
+    modelValue(newVal) {
+      this.dealValue(newVal);
     },
     dataLists(newVal) {
-      this.dataLists = newVal;
-      this.items = this.itemsSortOut();
-      // this._dealValue();
+      this.localList = this.dealDataList(newVal || []);
     }
   },
   created() {
-    this._doValueType(this.value);
+    this.dealValue(this.doValueGet());
     if (this.maxNumber > 0) {
       this.message = '最多只能选择' + this.maxNumber + '个';
     }
-    this.items = this.itemsSortOut();
+    this.localList = this.dealDataList(this.dataLists) || [];
+    this._dealStyle();
   },
   methods: {
+    doValueGet() {
+      if (this.value === '' || (Array.prototype.isPrototypeOf(this.value) && this.value.length === 0)) {
+        return this.modelValue;
+      }
+      if (this.modelValue === '' || (Array.prototype.isPrototypeOf(this.modelValue) && this.modelValue.length === 0)) {
+        return this.value;
+      }
+      return this.value;
+    },
+    _dealStyle() {
+      let alignStyle = this.align == 'right' ? 'flex-end' : 'flex-start';
+      this.localStyle = `justify-content:${alignStyle};`;
+    },
     // 处理传递的内容问题，全部转成数组
-    _doValueType(oldVal) {
+    dealValue(oldVal) {
       let newVal = [];
       if (Object.prototype.toString.call(oldVal) == '[object String]') {
         if (oldVal != '') {
@@ -115,17 +140,19 @@ export default {
           newVal = oldVal;
         }
       }
+      for (let i in newVal) {
+        if (typeof newVal[i] == 'number') {
+          newVal[i] = newVal[i].toString();
+        }
+      }
       this.localVal = newVal;
-      console.log(this.localVal);
     },
-    itemsSortOut() {
+    dealDataList(oldList) {
       let original = [];
-      original = this.dataLists || [];
-
+      original = oldList || [];
       if (typeof original == 'string') {
         original = JSON.parse(original);
       }
-
       //整理数据
       let items = [];
       let dataValue = this.dataValue ? this.dataValue : 'value';
@@ -133,62 +160,67 @@ export default {
       let dataChecked = this.dataChecked ? this.dataChecked : 'checked';
       let i = 0;
       for (i in original) {
-        let data = original[i];
-        let checked = false;
-        let text = data[dataText];
-        let value = data[dataValue];
-        if (typeof value == 'number') {
-          value = value.toString();
+        let itemData = original[i];
+        let itemChecked = false;
+        let itemText = itemData[dataText];
+        let itemValue = itemData[dataValue];
+        if (typeof itemValue == 'number') {
+          itemValue = itemValue.toString();
         }
-        if (data[dataChecked] == true) {
-          checked = true;
+        if (itemData[dataChecked] == true) {
+          itemChecked = true;
         }
         let localVal = this.localVal || [];
         // let tempLocalVal = localVal.split(',');
         //写入已选选项
         for (const ii in localVal) {
           if (this.dataType == 'text') {
-            if (localVal[ii] == text) {
-              checked = true;
+            if (localVal[ii] == itemText) {
+              itemChecked = true;
             }
           } else {
-            if (localVal[ii] == value) {
-              checked = true;
+            if (localVal[ii] == itemValue) {
+              itemChecked = true;
             }
           }
         }
         items.push({
-          value: value,
-          text: text,
-          checked: checked
+          value: itemValue,
+          text: itemText,
+          checked: itemChecked
         });
       }
       return items;
     },
     checkboxChange(e) {
-      let items = this.items;
+      let items = this.localList;
       let values = e.detail.value;
-      this.$emit('input', values);
-      console.log(values);
-      for (var i = 0, lenI = items.length; i < lenI; ++i) {
-        const item = items[i];
-        if (values.includes(item.value)) {
-          this.$set(item, 'checked', true);
-        } else {
-          this.$set(item, 'checked', false);
-        }
-      }
-      // console.log(items);
-
       let localVal = [];
-      for (let i in items) {
-        if (items[i].checked) {
-          if (this.dataType == 'text') {
-            localVal.push(items[i].text);
+      if (items && Array.prototype.isPrototypeOf(items) && items.length > 0) {
+        for (var i = 0, lenI = items.length; i < lenI; ++i) {
+          const item = items[i];
+          if (values.includes(item.value)) {
+            this.$set(item, 'checked', true);
           } else {
-            localVal.push(items[i].value);
+            this.$set(item, 'checked', false);
+          }
+        }
+        for (let i in items) {
+          if (items[i].checked) {
+            if (this.dataType == 'text') {
+              localVal.push(items[i].text);
+            } else {
+              localVal.push(items[i].value);
+            }
           }
         }
+      } else {
+        localVal = values;
+      }
+      for (let i in localVal) {
+        if (typeof localVal[i] == 'number') {
+          localVal[i] = localVal[i].toString();
+        }
       }
       if (this.maxNumber !== 0 && localVal.length > this.maxNumber) {
         this.messageDisplay = true;
@@ -196,8 +228,9 @@ export default {
         this.messageDisplay = false;
       }
       // this.localVal = localVal;
-      // // this.$emit('input', this.localVal.join(','));
-      // this.$emit('input', this.localVal);
+      // console.log('--checkboxChange--', items, values, this.localVal);
+      this.$emit('input', localVal);
+      this.$emit('update:modelValue', localVal);
     }
   }
 };

package/ui-cv/cv-checkbox-opt-base/cv-checkbox-opt-base.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="cv-checkbox-opt-base">
     <label class="cv-checkbox-opt__label">
-      <checkbox :value="localVal" :checked="checked" style="transform: scale(0.7)" />
+      <checkbox :value="localVal" :checked="localChecked" style="transform: scale(0.7)" />
       <view>
         <slot>{{ label }}</slot>
       </view>
@@ -27,18 +27,58 @@ export default {
   },
   data() {
     return {
-      localVal: ''
+      localVal: '',
+      localChecked: false,
+      parentObj: null
     };
   },
   watch: {
     value(newVal) {
       this.localVal = String(newVal);
+    },
+    checked(newVal) {
+      this.localChecked = newVal;
+    },
+    'parentObj.localVal'(newVal) {
+      if (Object.prototype.toString.call(newVal) == '[object Array]') {
+        if (this.parentObj && this.parentObj.dataType == 'text') {
+          this.localChecked = newVal.includes(this.label) ? true : false;
+        } else if (this.parentObj && this.parentObj.dataType == 'value') {
+          this.localChecked = newVal.includes(this.localVal) ? true : false;
+        }
+      }
     }
   },
   created() {
     this.localVal = String(this.value);
+    this.localChecked = this.checked;
+    console.log('---', this.localVal, this.localChecked);
+  },
+  mounted() {
+    this.parentObj = this.getParent();
   },
-  methods: {}
+  methods: {
+    funcOnClick() {
+      // let parentObj = this.getParent();
+      // console.log(parentObj.$children);
+      // let { value } = parentObj;
+      // console.log(value, this.localVal);
+      // this.localChecked = newVal == this.value ? true : false;
+    },
+    /**
+     * 获取父元素实例
+     */
+    getParent(name = 'cvCheckboxGroup') {
+      let parent = this.$parent;
+      let parentName = parent.$options.name;
+      while (parentName !== name) {
+        parent = parent.$parent;
+        if (!parent) return false;
+        parentName = parent.$options.name;
+      }
+      return parent;
+    }
+  }
 };
 </script>
 <style>

package/ui-cv/cv-checkbox-opt-tag/cv-checkbox-opt-tag.vue

@@ -39,9 +39,13 @@ export default {
     checked(newVal) {
       this.localChecked = newVal;
     },
-    'parentObj.value'(newVal) {
+    'parentObj.localVal'(newVal) {
       if (Object.prototype.toString.call(newVal) == '[object Array]') {
-        this.localChecked = newVal.includes(this.localVal) ? true : false;
+        if (this.parentObj && this.parentObj.dataType == 'text') {
+          this.localChecked = newVal.includes(this.label) ? true : false;
+        } else if (this.parentObj && this.parentObj.dataType == 'value') {
+          this.localChecked = newVal.includes(this.localVal) ? true : false;
+        }
       }
     }
   },

package/ui-cv/cv-code-sms/cv-code-sms.vue

@@ -13,6 +13,7 @@
     </view>
     <view class="cv-code-button-area">
       <button
+        size="mini"
         class="cv-code-button-item"
         :class="btnDisabled ? 'cv-code-button-wait' : ''"
         :disabled="btnDisabled"
@@ -26,22 +27,19 @@
 <script>
 export default {
   name: 'cvCodeSms',
-  inject: {
-    cvFormGroup: {
-      default() {
-        return null;
-      }
-    }
-  },
   props: {
-    maxlength: {
+    value: {
       type: [Number, String],
-      default: -1
+      default: ''
     },
-    value: {
+    modelValue: {
       type: [Number, String],
       default: ''
     },
+    maxlength: {
+      type: [Number, String],
+      default: -1
+    },
     mobile: {
       type: [Number, String],
       default: ''
@@ -50,15 +48,11 @@ export default {
       type: String,
       default: 'mobile'
     },
-    codeUrl: {
-      type: String,
-      default: ''
-    },
     codeSign: {
       type: Boolean,
       default: false
     },
-    codeApiFunc: {
+    apiFunc: {
       type: Function,
       default: null
     },
@@ -74,12 +68,15 @@ export default {
     },
     value(newVal) {
       this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
     }
   },
   data() {
     return {
       // 验证码
-      localVal: this.value,
+      localVal: '',
       localMobile: '',
       nextTime: 0,
       diyPlaceholder: '短信验证码',
@@ -92,9 +89,16 @@ export default {
     };
   },
   created() {
+    this.localVal = this.doValueGet();
     this.localMobile = this.mobile;
+    console.log(this.apiFunc);
   },
   methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
     showDiyMsg(msg) {
       uni.showToast({
         title: msg,
@@ -114,8 +118,8 @@ export default {
         return;
       }
 
-      if (!this.codeUrl && !this.codeApiFunc) {
-        this.showDiyMsg('短信接口地址不能为空');
+      if (!this.apiFunc) {
+        this.showDiyMsg('短信接口方法不能为空');
         return;
       }
 
@@ -129,9 +133,8 @@ export default {
 
       if (this.btnDisabled) {
         this.btnText = '请稍后...';
-        if (this.codeApiFunc) {
-          this.codeApiFunc({
-            postType: 'sendSms',
+        if (this.apiFunc) {
+          this.apiFunc({
             cto_sms_type: 'alterMobile',
             sendCode: '发送验证码',
             [this.mobileParam]: this.localMobile
@@ -158,7 +161,7 @@ export default {
               this.btnText = '获取验证码';
             });
         } else {
-          console.warn('url请求未完善，请使用：codeApiFunc');
+          console.warn('url请求未完善，请使用：apiFunc');
           this.btnDisabled = false;
           this.btnText = '重新获取验证码';
         }
@@ -181,6 +184,7 @@ export default {
     },
     funcOnInput(e) {
       this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
     }
   }
 };
@@ -191,6 +195,14 @@ export default {
   height: 35px;
   line-height: 35px;
   font-size: 14px;
+  width: 100%;
+  padding-right: 10px;
+
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  width: 100%;
+  padding-right: 10px;
 }
 .cv-code-input-area {
   width: calc(100% - 120px - 10px);
@@ -204,14 +216,12 @@ export default {
   font-size: 14px;
 }
 .cv-code-button-area {
-  width: 120px;
   float: right;
   height: 35px;
 }
 .cv-code-button-item {
   height: 35px;
   line-height: 35px;
-  font-size: 14px;
   background-color: #007aff;
   color: #ffffff;
 }

package/ui-cv/cv-date-base/cv-date-base.vue

@@ -16,11 +16,8 @@
     </picker>
   </view>
 </template>
-
 <script>
-import MixinsPicker from '../mixins/mixins-picker.js';
 export default {
-  mixins: [MixinsPicker],
   name: 'cvPickerDate',
   props: {
     //默认输入框
@@ -28,6 +25,10 @@ export default {
       type: String,
       default: ''
     },
+    modelValue: {
+      type: String,
+      default: ''
+    },
     startDate: {
       type: String,
       default: ''
@@ -39,11 +40,19 @@ export default {
     fields: {
       type: String,
       default: 'day'
+    },
+    // 占位符
+    placeholder: {
+      type: String,
+      default: '请选择'
     }
   },
   watch: {
-    value(newValue) {
-      this.localVal = this.value;
+    value(newVal) {
+      this.localVal = newVal;
+    },
+    modelValue(newVal) {
+      this.localVal = newVal;
     }
   },
   data() {
@@ -53,13 +62,25 @@ export default {
     };
   },
   created() {
-    this.localVal = this.value;
+    this.localVal = this.doValueGet();
   },
   methods: {
+    doValueGet() {
+      if (this.value === '') return this.modelValue;
+      if (this.modelValue === '') return this.value;
+      return this.value;
+    },
     bindDateChange: function (e) {
+      this.iconTop = false;
       this.localVal = e.detail.value;
       this.$emit('input', this.localVal);
+      this.$emit('update:modelValue', this.localVal);
+    },
+    bindPickerCancel() {
       this.iconTop = false;
+    },
+    changeIconTop() {
+      this.iconTop = true;
     }
   }
 };