@10yun/cv-mobile-ui 0.3.25 → 0.4.1

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

@@ -1,30 +1,26 @@
 <template>
-  <cv-form-item
-    :tip="tip"
-    :must="must"
-    :label="label"
-    :message="message"
-    :messageDisplay="messageDisplay"
-    :labelWidth="localLabelWidth"
-    :layout="localLayout"
-    :onQClear="onQClear"
-    :rtip="rtip"
-    :input-value="localVal"
-  >
-    <view class="cv-input-text">
-      <input
-        class="cv-input-text-item"
-        placeholder-class="cv-input-text-item-placeholder"
-        v-model="localVal"
-        type="number"
-        :maxlength="maxlength"
-        :disabled="disabled"
-        :placeholder="placeholder"
-        @input="updateInput"
-        @blur="onBlur"
-      />
+  <view class="cv-input-text">
+    <input
+      class="cv-input__content"
+      placeholder-class="cv-input__placeholder"
+      v-model="localVal"
+      type="number"
+      :maxlength="maxlength"
+      :disabled="disabled"
+      :placeholder="placeholder"
+      @input="funcOnInput"
+      @blur="onBlur"
+    />
+    <!-- 输入框右侧信息 -->
+    <view class="cv-input__right">
+      <!-- 清空 -->
+      <view class="cv-input__clear" @click="onEmpty" v-if="clearable == true && localVal != ''">X</view>
+      <!-- 追加-->
+      <view class="cv-input__append" v-if="$slots['append']">
+        <slot name="append"></slot>
+      </view>
     </view>
-  </cv-form-item>
+  </view>
 </template>
 
 <script>
@@ -39,7 +35,12 @@ export default {
       }
     }
   },
-  props: {},
+  props: {
+    placeholder: {
+      type: [String],
+      default: '请输入数字'
+    }
+  },
   data() {
     return {};
   },
@@ -48,7 +49,7 @@ export default {
       this.localVal = this._dealValue(newVal);
     }
   },
-  created: function () {
+  created() {
     this.localVal = this._dealValue(this.value);
   },
   methods: {
@@ -64,9 +65,40 @@ export default {
 </script>
 
 <style>
-.cv-input-text-item {
+.cv-input__content {
   height: 35px;
   line-height: 35px;
   font-size: 14px;
 }
+.cv-input__placeholder {
+  font-size: 14px;
+}
+.cv-input__right {
+  height: 16px;
+  position: absolute;
+  bottom: 10px;
+  right: 0px;
+  z-index: 2;
+}
+.cv-input__clear {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.4);
+  font-size: 8px;
+  line-height: 16px;
+  text-align: center;
+  color: #fff;
+  float: left;
+  margin-left: 10px;
+}
+.cv-input__append {
+  color: rgba(0, 0, 0, 0.4);
+  width: 25px;
+  text-align: center;
+  overflow: hidden;
+  height: 16px;
+  font-size: 12px;
+  line-height: 16px;
+}
 </style>

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

@@ -1,30 +1,32 @@
 <template>
-  <cv-form-item
-    :tip="tip"
-    :must="must"
-    :label="label"
-    :message="message"
-    :messageDisplay="messageDisplay"
-    :labelWidth="localLabelWidth"
-    :layout="localLayout"
-    :onQClear="onQClear"
-    :input-value="localVal"
-  >
-    <view class="cv-input-text">
-      <input
-        class="cv-input-text-item"
-        placeholder-class="cv-input-text-item-placeholder"
-        v-model="localVal"
-        type="text"
-        :maxlength="maxlength"
-        :disabled="disabled"
-        password
-        :placeholder="placeholder"
-        @input="updateInput"
-        @blur="onBlur"
-      />
+  <view class="cv-input-password">
+    <input
+      class="cv-input__content"
+      placeholder-class="cv-input__placeholder"
+      v-model="localVal"
+      type="text"
+      :maxlength="maxlength"
+      :disabled="disabled"
+      :password="!showPassword"
+      :placeholder="placeholder"
+      @input="funcOnInput"
+      @blur="onBlur"
+    />
+    <!-- 输入框右侧信息 -->
+    <view class="cv-input__right">
+      <!-- 清空 -->
+      <view class="cv-input__clear" @click="onEmpty" v-if="clearable == true && localVal != ''">X</view>
+      <!-- 眼睛-->
+      <cv-icons2
+        class="cv-input__eyes"
+        v-if="localVal != '' && passwordIcon"
+        :type="showPassword ? 'eye-slash-filled' : 'eye-filled'"
+        :size="18"
+        color="rgba(0, 0, 0, 0.4)"
+        @click="onEyes"
+      ></cv-icons2>
     </view>
-  </cv-form-item>
+  </view>
 </template>
 
 <script>
@@ -39,19 +41,67 @@ export default {
       }
     }
   },
-  props: {},
+  props: {
+    placeholder: {
+      type: [String],
+      default: '请输入密码'
+    },
+    passwordIcon: {
+      type: Boolean,
+      default: true
+    }
+  },
   watch: {},
   data() {
-    return {};
+    return {
+      showPassword: false
+    };
   },
-  created: function () {},
-  methods: {}
+  created() {},
+  methods: {
+    onEyes() {
+      this.showPassword = !this.showPassword;
+    }
+  }
 };
 </script>
 <style>
-.cv-input-text-item {
+.cv-input__content {
   height: 35px;
   line-height: 35px;
   font-size: 14px;
 }
+
+.cv-input__placeholder {
+  font-size: 14px;
+}
+.cv-input__right {
+  height: 16px;
+  position: absolute;
+  bottom: 10px;
+  right: 0px;
+  z-index: 2;
+}
+.cv-input__clear {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.4);
+  font-size: 8px;
+  line-height: 16px;
+  text-align: center;
+  color: #fff;
+  float: left;
+  margin-left: 10px;
+}
+.cv-input__eyes {
+  color: rgba(0, 0, 0, 0.4);
+  width: 25px;
+  text-align: center;
+  overflow: hidden;
+  height: 16px;
+  font-size: 12px;
+  line-height: 16px;
+  padding: 0 5px;
+}
 </style>

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

@@ -1,31 +1,27 @@
 <template>
-  <cv-form-item
-    :tip="tip"
-    :label="label"
-    :message="message"
-    :must="must"
-    :messageDisplay="messageDisplay"
-    :labelWidth="localLabelWidth"
-    :layout="localLayout"
-    :onQClear="onQClear"
-    :rtip="rtip"
-    :inputValue="localVal"
-  >
-    <view class="cv-input-text" ref="onEmpty">
-      <input
-        class="cv-input-text-item"
-        :style="localItemStyle"
-        placeholder-class="cv-input-text-item-placeholder"
-        v-model="localVal"
-        type="text"
-        :placeholder="placeholder"
-        :maxlength="maxlength"
-        :disabled="disabled"
-        @input="updateInput"
-        @blur="onBlur"
-      />
+  <view class="cv-input-text">
+    <input
+      class="cv-input__content"
+      :style="localStyle"
+      placeholder-class="cv-input__placeholder"
+      v-model="localVal"
+      type="text"
+      :placeholder="placeholder"
+      :maxlength="maxlength"
+      :disabled="disabled"
+      @input="funcOnInput"
+      @blur="onBlur"
+    />
+    <!-- 输入框右侧信息 -->
+    <view class="cv-input__right">
+      <!-- 清空 -->
+      <view class="cv-input__clear" @click="onEmpty" v-if="clearable == true && localVal != ''">X</view>
+      <!-- 追加-->
+      <view class="cv-input__append" v-if="$slots['append']">
+        <slot name="append"></slot>
+      </view>
     </view>
-  </cv-form-item>
+  </view>
 </template>
 
 <script>
@@ -37,31 +33,53 @@ export default {
     addGlobalClass: true
   },
   props: {
-    rtip: {
-      type: String,
-      default: ''
+    placeholder: {
+      type: [String],
+      default: '请输入文本'
     }
   },
   data() {
     return {};
   },
-  created: function () {},
+  created() {},
   methods: {}
 };
 </script>
 <style>
-.cv-input-text-item {
+.cv-input__content {
   height: 35px;
   line-height: 35px;
   font-size: 14px;
 }
-.cv-input-text-rtip {
-  color: #999;
-  width: 50rpx;
-  padding: 10rpx 0rpx 10rpx 0;
+.cv-input__placeholder {
+  font-size: 14px;
+}
+.cv-input__right {
+  height: 16px;
   position: absolute;
-  right: 0;
-  top: -7px;
+  bottom: 10px;
+  right: 0px;
+  z-index: 2;
+}
+.cv-input__clear {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.4);
+  font-size: 8px;
+  line-height: 16px;
+  text-align: center;
+  color: #fff;
+  float: left;
+  margin-left: 10px;
+}
+.cv-input__append {
+  color: rgba(0, 0, 0, 0.4);
+  width: 25px;
+  text-align: center;
   overflow: hidden;
+  height: 16px;
+  font-size: 12px;
+  line-height: 16px;
 }
 </style>

package/ui-cv/cv-link/uni-link.vue

@@ -0,0 +1,130 @@
+<template>
+  <a
+    v-if="isShowA"
+    class="uni-link"
+    :href="href"
+    :class="{ 'uni-link--withline': showUnderLine === true || showUnderLine === 'true' }"
+    :style="{ color, fontSize: fontSize + 'px' }"
+    :download="download"
+  >
+    <slot>{{ text }}</slot>
+  </a>
+  <text
+    v-else
+    class="uni-link"
+    :class="{ 'uni-link--withline': showUnderLine === true || showUnderLine === 'true' }"
+    :style="{ color, fontSize: fontSize + 'px' }"
+    @click="openURL"
+  >
+    <slot>{{ text }}</slot>
+  </text>
+</template>
+
+<script>
+/**
+ * Link 外部网页超链接组件
+ * @description uni-link是一个外部网页超链接组件，在小程序内复制url，在app内打开外部浏览器，在h5端打开新网页
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=1182
+ * @property {String} href 点击后打开的外部网页url
+ * @property {String} text 显示的文字
+ * @property {String} downlaod H5平台下载文件名
+ * @property {Boolean} showUnderLine 是否显示下划线
+ * @property {String} copyTips 在小程序端复制链接时显示的提示语
+ * @property {String} color 链接文字颜色
+ * @property {String} fontSize 链接文字大小
+ * @example * <uni-link href="https://ext.dcloud.net.cn" text="https://ext.dcloud.net.cn"></uni-link>
+ */
+export default {
+  name: 'uniLink',
+  props: {
+    href: {
+      type: String,
+      default: ''
+    },
+    text: {
+      type: String,
+      default: ''
+    },
+    download: {
+      type: String,
+      default: ''
+    },
+    showUnderLine: {
+      type: [Boolean, String],
+      default: true
+    },
+    copyTips: {
+      type: String,
+      default: '已自动复制网址，请在手机浏览器里粘贴该网址'
+    },
+    color: {
+      type: String,
+      default: '#999999'
+    },
+    fontSize: {
+      type: [Number, String],
+      default: 14
+    }
+  },
+  computed: {
+    isShowA() {
+      // #ifdef H5
+      this._isH5 = true;
+      // #endif
+      if ((this.isMail() || this.isTel()) && this._isH5 === true) {
+        return true;
+      }
+      return false;
+    }
+  },
+  created() {
+    this._isH5 = null;
+  },
+  methods: {
+    isMail() {
+      return this.href.startsWith('mailto:');
+    },
+    isTel() {
+      return this.href.startsWith('tel:');
+    },
+    openURL() {
+      // #ifdef APP-PLUS
+      if (this.isTel()) {
+        this.makePhoneCall(this.href.replace('tel:', ''));
+      } else {
+        plus.runtime.openURL(this.href);
+      }
+      // #endif
+      // #ifdef H5
+      window.open(this.href);
+      // #endif
+      // #ifdef MP
+      uni.setClipboardData({
+        data: this.href
+      });
+      uni.showModal({
+        content: this.copyTips,
+        showCancel: false
+      });
+      // #endif
+    },
+    makePhoneCall(phoneNumber) {
+      uni.makePhoneCall({
+        phoneNumber
+      });
+    }
+  }
+};
+</script>
+
+<style scoped>
+/* #ifndef APP-NVUE */
+.uni-link {
+  cursor: pointer;
+}
+
+/* #endif */
+.uni-link--withline {
+  text-decoration: underline;
+}
+</style>

package/ui-cv/cv-load-more/config.json

@@ -1,10 +1,10 @@
 {
-	"id": "29",
-	"name": "LoadMore",
-	"desc": "加载更多",
-	"url": "load-more",
-	"type": "功能组件",
-	"edition": "1.1.5",
-	"path": "https://ext.dcloud.net.cn/plugin?id=29",
-	"update_log": "- 新增 颜色大小等配置项"
-}
+  "id": "29",
+  "name": "LoadMore",
+  "desc": "加载更多",
+  "url": "load-more",
+  "type": "功能组件",
+  "edition": "1.1.5",
+  "path": "https://ext.dcloud.net.cn/plugin?id=29",
+  "update_log": "- 新增 颜色大小等配置项"
+}

package/ui-cv/cv-load-more/cv-load-more.vue

@@ -66,10 +66,32 @@
 </template>
 
 <script>
-const platform = uni.getSystemInfoSync().platform;
-
+let platform;
+setTimeout(() => {
+  platform = uni.getSystemInfoSync().platform;
+}, 16);
+
+/**
+ * LoadMore 加载更多
+ * @description 用于列表中，做滚动加载使用，展示 loading 的各种状态
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=29
+ * @property {String} status = [more|loading|noMore] loading 的状态
+ * 	@value more loading前
+ * 	@value loading loading中
+ * 	@value noMore 没有更多了
+ * @property {Number} iconSize 指定图标大小
+ * @property {Boolean} iconSize = [true|false] 是否显示 loading 图标
+ * @property {String} iconType = [snow|circle|auto] 指定图标样式
+ * 	@value snow ios雪花加载样式
+ * 	@value circle 安卓唤醒加载样式
+ * 	@value auto 根据平台自动选择加载样式
+ * @property {String} color 图标和文字颜色
+ * @property {Object} contentText 各状态文字说明，值为：{contentdown: "上拉显示更多",contentrefresh: "正在加载...",contentnomore: "没有更多数据了"}
+ * @event {Function} clickLoadMore 点击加载更多时触发
+ */
 export default {
   name: 'cvLoadMore',
+  emits: ['clickLoadMore'],
   props: {
     status: {
       // 上拉的状态：more-loading前；loading-loading中；noMore-没有更多了
@@ -141,7 +163,7 @@ export default {
 };
 </script>
 
-<style>
+<style scoped>
 .cv-load-more {
   /* #ifndef APP-NVUE */
   display: flex;
@@ -256,7 +278,6 @@ export default {
 }
 
 /* #endif */
-
 /* #ifdef H5 */
 .cv-load-more__img--android-H5 {
   animation: loading-android-H5-rotate 2s linear infinite;
@@ -298,7 +319,6 @@ export default {
 }
 
 /* #endif */
-
 /* #ifndef APP-NVUE || H5 */
 .cv-load-more__img--android-MP {
   position: relative;
@@ -345,34 +365,43 @@ export default {
   0% {
     transform: rotate(0deg);
   }
+
   50% {
     transform: rotate(90deg);
   }
+
   100% {
     transform: rotate(360deg);
   }
 }
+
 @keyframes loading-android-MP-2 {
   0% {
     transform: rotate(0deg);
   }
+
   50% {
     transform: rotate(180deg);
   }
+
   100% {
     transform: rotate(360deg);
   }
 }
+
 @keyframes loading-android-MP-3 {
   0% {
     transform: rotate(0deg);
   }
+
   50% {
     transform: rotate(270deg);
   }
+
   100% {
     transform: rotate(360deg);
   }
 }
+
 /* #endif */
 </style>

package/ui-cv/cv-message/cv-message.vue

@@ -22,7 +22,7 @@ export default {
       loaclStyle: {}
     };
   },
-  created: function () {
+  created() {
     this.loaclStyle = { color: this.color };
   }
 };

package/ui-cv/cv-nav-col/cv-nav-col.vue

@@ -80,7 +80,7 @@ export default {
       isViewPla: true
     };
   },
-  created: function () {
+  created() {
     this._dealStyle();
     this._changeIsViewPla();
   },

package/ui-cv/cv-nav-row/cv-nav-row.vue

@@ -96,7 +96,7 @@ export default {
   data() {
     return {};
   },
-  created: function () {
+  created() {
     // console.log(this.$slots);
   },
   methods: {