@10yun/cv-mobile-ui 0.5.62 → 0.5.63

package/ui-fireui/components/u-image-group/u-image-group.vue

@@ -0,0 +1,164 @@
+<template>
+  <view
+    class="up-image-container"
+    :style="{ marginBottom: multiLine ? `-${distance}rpx` : 0 }"
+    :class="{ 'up-image-direction': direction == 'column', 'up-image__warp': multiLine }"
+  >
+    <view
+      v-for="(item, index) in imageList"
+      :key="index"
+      class="up-image__itembox"
+      :style="{
+        width: width,
+        height: height,
+        borderRadius: radius,
+        marginLeft: direction == 'column' || multiLine ? 0 : (index && distance) + 'rpx',
+        marginRight: multiLine ? distance + 'rpx' : 0,
+        marginBottom: multiLine ? distance + 'rpx' : 0,
+        marginTop: direction == 'row' ? 0 : (index && distance) + 'rpx'
+      }"
+      @tap="bindClick(index, item.id)"
+    >
+      <image
+        class="up-image-item"
+        :mode="mode"
+        :lazy-load="lazyLoad"
+        fade-show="fadeShow"
+        :webp="webp"
+        :show-menu-by-longpress="longpress"
+        @error="error"
+        @load="load"
+        :style="{ width: width, height: height, borderRadius: radius, borderWidth: borderWidth, borderColor: borderColor }"
+        :src="item.src"
+      ></image>
+      <slot></slot>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'tuiImageGroup',
+  emits: ['errorEvent', 'loaded', 'click'],
+  props: {
+    //图片集合
+    /*
+		  [{id:1,src:"1.png"}]
+		*/
+    imageList: {
+      type: Array,
+      default: () => {
+        return [];
+      }
+    },
+    //图片宽度
+    width: {
+      type: String,
+      default: '120rpx'
+    },
+    //图片高度
+    height: {
+      type: String,
+      default: '120rpx'
+    },
+    //图片边框宽度 rpx
+    borderWidth: {
+      type: String,
+      default: '0'
+    },
+    //图片边框颜色 可传rgba
+    borderColor: {
+      type: String,
+      default: '#fff'
+    },
+    //图片圆角
+    radius: {
+      type: String,
+      default: '50%'
+    },
+    //图片裁剪、缩放的模式
+    mode: {
+      type: String,
+      default: 'scaleToFill'
+    },
+    //图片懒加载。只针对page与scroll-view下的image有效
+    lazyLoad: {
+      type: Boolean,
+      default: true
+    },
+    //图片显示动画效果 | 仅App-nvue 2.3.4+ Android有效
+    fadeShow: {
+      type: Boolean,
+      default: true
+    },
+    //默认不解析 webP 格式，只支持网络资源 | 微信小程序2.9.0
+    webp: {
+      type: Boolean,
+      default: false
+    },
+    //开启长按图片显示识别小程序码菜单 | 微信小程序2.7.0
+    longpress: {
+      type: Boolean,
+      default: false
+    },
+    //是否组合排列
+    isGroup: {
+      type: Boolean,
+      default: false
+    },
+    //排列方向 row ，column
+    direction: {
+      type: String,
+      default: 'row'
+    },
+    //偏移距离 rpx
+    distance: {
+      type: [Number, String],
+      default: -16
+    },
+    //是否可多行展示，排列方向 row时生效，distance需设置为大于0的数
+    multiLine: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    error(e) {
+      this.$emit('errorEvent', e);
+    },
+    load(e) {
+      this.$emit('loaded', e);
+    },
+    bindClick(index, id) {
+      this.$emit('click', {
+        index: index,
+        id: id || ''
+      });
+    }
+  }
+};
+</script>
+
+<style scoped>
+.up-image-container {
+  display: inline-flex;
+  align-items: center;
+}
+.up-image-direction {
+  flex-direction: column;
+}
+.up-image__warp {
+  flex-wrap: wrap;
+}
+.up-image__itembox {
+  position: relative;
+}
+.up-image-item {
+  border-style: solid;
+  flex-shrink: 0;
+  display: block;
+}
+</style>

package/ui-fireui/components/u-keyboard/u-keyboard.vue

@@ -29,7 +29,8 @@
 
 <script>
 export default {
-  name: 'fuiKeyboard',
+  name: 'tuiKeyboard',
+  emits: ['click', 'close'],
   props: {
     //是否需要mask
     mask: {
@@ -58,7 +59,7 @@ export default {
     };
   },
   methods: {
-    getKeyBoard(index, action) {
+    getKeyBoard: function (index, action) {
       var content = index + 1;
       if (index == 9) {
         content = action ? '取消' : '清除';

package/ui-fireui/components/u-keyboard-input/u-keyboard-input.vue

@@ -16,7 +16,7 @@
 
 <script>
 export default {
-  name: 'fuiKeyboardInput',
+  name: 'tuiKeyboardInput',
   props: {
     //背景颜色
     backgroundColor: {

package/ui-fireui/components/u-list-cell/u-list-cell.vue

@@ -1,34 +1,44 @@
 <template>
   <view
     class="up-list-class up-list-cell"
-    :class="[
-      arrow ? 'up-cell-arrow' : '',
-      arrow && arrowRight ? '' : 'up-arrow-right',
-      unlined ? 'up-cell-unlined' : '',
-      lineLeft ? 'up-line-left' : '',
-      lineRight ? 'up-line-right' : '',
-      arrow && arrowColor ? 'up-arrow-' + arrowColor : '',
-      radius ? 'up-radius' : ''
-    ]"
-    :hover-class="hover ? 'up-cell-hover' : ''"
-    :style="{ backgroundColor: backgroundColor, fontSize: size + 'rpx', color: color, padding: padding }"
-    :hover-stay-time="150"
+    :class="[radius && radius != '0' ? 'up-radius' : '', hover ? 'up-cell-hover' : '']"
+    :style="{
+      backgroundColor: backgroundColor,
+      fontSize: getSize + 'rpx',
+      color: getColor,
+      padding: getPadding,
+      borderRadius: radius + 'rpx',
+      marginTop: marginTop + 'rpx',
+      marginBottom: marginBottom + 'rpx'
+    }"
     @tap="handleClick"
   >
     <slot></slot>
+    <view
+      class="up-cell__line"
+      :style="{ borderBottomColor: getLineColor, left: getLineLeft + 'rpx', right: lineRight + 'rpx' }"
+      v-if="!unlined"
+    ></view>
+    <view class="up-cell__arrow" :style="{ borderColor: getArrowColor, right: arrowRight + 'rpx' }" v-if="arrow"></view>
   </view>
 </template>
 
 <script>
 export default {
-  name: 'fuiListCell',
+  name: 'tuiListCell',
+  emits: ['click'],
+  // #ifdef MP-WEIXIN
+  options: {
+    virtualHost: true
+  },
+  // #endif
   props: {
     //是否有箭头
     arrow: {
       type: Boolean,
       default: false
     },
-    //箭头颜色 传值： white，gray,warning,danger
+    //V2.3.0+
     arrowColor: {
       type: String,
       default: ''
@@ -43,19 +53,32 @@ export default {
       type: Boolean,
       default: false
     },
-    //线条是否有左偏移距离
+    //V2.3.0+
+    lineColor: {
+      type: String,
+      default: ''
+    },
+    //线条左偏移距离
     lineLeft: {
-      type: Boolean,
-      default: true
+      type: [Number, String],
+      default: -1
     },
-    //线条是否有右偏移距离
+    //线条右偏移距离
     lineRight: {
-      type: Boolean,
-      default: false
+      type: [Number, String],
+      default: 0
     },
     padding: {
       type: String,
-      default: '26rpx 30rpx'
+      default: ''
+    },
+    marginTop: {
+      type: [Number, String],
+      default: 0
+    },
+    marginBottom: {
+      type: [Number, String],
+      default: 0
     },
     //背景颜色
     backgroundColor: {
@@ -65,28 +88,52 @@ export default {
     //字体大小
     size: {
       type: Number,
-      default: 28
+      default: 0
     },
     //字体颜色
     color: {
       type: String,
-      default: '#333'
+      default: ''
     },
-    //是否加圆角
+    //圆角值
     radius: {
-      type: Boolean,
-      default: false
+      type: [Number, String],
+      default: 0
     },
-    //箭头是否有偏移距离
+    //箭头偏移距离
     arrowRight: {
-      type: Boolean,
-      default: true
+      type: [Number, String],
+      default: 30
     },
     index: {
       type: Number,
       default: 0
     }
   },
+  computed: {
+    getArrowColor() {
+      return this.arrowColor || (uni && uni.$tui && uni.$tui.tuiListCell.arrowColor) || '#c0c0c0';
+    },
+    getLineColor() {
+      return this.lineColor || (uni && uni.$tui && uni.$tui.tuiListCell.lineColor) || '#eaeef1';
+    },
+    getLineLeft() {
+      let left = this.lineLeft;
+      if (left === -1) {
+        left = uni && uni.$tui && uni.$tui.tuiListCell.lineLeft;
+      }
+      return left === undefined || left === null ? 30 : left;
+    },
+    getPadding() {
+      return this.padding || (uni && uni.$tui && uni.$tui.tuiListCell.padding) || '26rpx 30rpx';
+    },
+    getColor() {
+      return this.color || (uni && uni.$tui && uni.$tui.tuiListCell.color) || '#333';
+    },
+    getSize() {
+      return this.size || (uni && uni.$tui && uni.$tui.tuiListCell.size) || 28;
+    }
+  },
   methods: {
     handleClick() {
       this.$emit('click', {
@@ -105,16 +152,14 @@ export default {
 }
 
 .up-radius {
-  border-radius: 6rpx;
   overflow: hidden;
 }
 
-.up-cell-hover {
-  background-color: #f1f1f1 !important;
+.up-cell-hover:active {
+  background-color: rgba(0, 0, 0, 0.1) !important;
 }
 
-.up-list-cell::after {
-  content: '';
+.up-cell__line {
   position: absolute;
   border-bottom: 1px solid #eaeef1;
   -webkit-transform: scaleY(0.5) translateZ(0);
@@ -123,22 +168,11 @@ export default {
   bottom: 0;
   right: 0;
   left: 0;
+  pointer-events: none;
+  z-index: 1;
 }
 
-.up-line-left::after {
-  left: 30rpx !important;
-}
-
-.up-line-right::after {
-  right: 30rpx !important;
-}
-
-.up-cell-unlined::after {
-  border-bottom: 0 !important;
-}
-
-.up-cell-arrow::before {
-  content: ' ';
+.up-cell__arrow {
   height: 10px;
   width: 10px;
   border-width: 2px 2px 0 0;
@@ -151,28 +185,4 @@ export default {
   margin-top: -6px;
   right: 30rpx;
 }
-
-.up-arrow-right::before {
-  right: 0 !important;
-}
-
-.up-arrow-gray::before {
-  border-color: #666666 !important;
-}
-
-.up-arrow-white::before {
-  border-color: #ffffff !important;
-}
-
-.up-arrow-warning::before {
-  border-color: #ff7900 !important;
-}
-
-.up-arrow-success::before {
-  border-color: #19be6b !important;
-}
-
-.up-arrow-danger::before {
-  border-color: #eb0909 !important;
-}
 </style>

package/ui-fireui/components/u-list-view/u-list-view.vue

@@ -1,6 +1,12 @@
 <template>
-  <view class="up-list-view up-view-class" :style="{ backgroundColor: backgroundColor }">
-    <view class="up-list-title" v-if="title">{{ title }}</view>
+  <view
+    class="up-list-view up-view-class"
+    :class="{ 'up-radius': radius && radius != '0' }"
+    :style="{ backgroundColor: backgroundColor, marginTop: marginTop, borderRadius: radius + 'rpx' }"
+  >
+    <view class="up-list-title" :style="{ color: color, fontSize: size + 'rpx', lineHeight: 30 + 'rpx' }" v-if="title">
+      {{ title }}
+    </view>
     <view class="up-list-content" :class="[unlined ? 'up-border-' + unlined : '']">
       <slot></slot>
     </view>
@@ -9,12 +15,21 @@
 
 <script>
 export default {
-  name: 'fuiListView',
+  name: 'tuiListView',
   props: {
     title: {
       type: String,
       default: ''
     },
+    color: {
+      type: String,
+      default: '#666'
+    },
+    //rpx
+    size: {
+      type: Number,
+      default: 30
+    },
     backgroundColor: {
       type: String,
       default: 'transparent'
@@ -22,6 +37,15 @@ export default {
     unlined: {
       type: String,
       default: '' //top,bottom,all
+    },
+    marginTop: {
+      type: String,
+      default: '0'
+    },
+    //圆角值
+    radius: {
+      type: [Number, String],
+      default: 0
     }
   }
 };
@@ -32,9 +56,6 @@ export default {
   width: 100%;
   padding: 30rpx;
   box-sizing: border-box;
-  font-size: 30rpx;
-  line-height: 30rpx;
-  color: #666;
 }
 
 .up-list-content {
@@ -48,7 +69,7 @@ export default {
   top: 0;
   right: 0;
   left: 0;
-  border-top: 1rpx solid #eaeef1;
+  border-top: 1px solid #eaeef1;
   -webkit-transform: scaleY(0.5) translateZ(0);
   transform: scaleY(0.5) translateZ(0);
   transform-origin: 0 0;
@@ -60,7 +81,7 @@ export default {
   content: '';
   width: 100%;
   position: absolute;
-  border-bottom: 1rpx solid #eaeef1;
+  border-bottom: 1px solid #eaeef1;
   -webkit-transform: scaleY(0.5) translateZ(0);
   transform: scaleY(0.5) translateZ(0);
   transform-origin: 0 100%;
@@ -84,4 +105,8 @@ export default {
 .up-border-all::before {
   border-top: 0;
 }
+
+.up-radius {
+  overflow: hidden;
+}
 </style>

package/ui-fireui/components/u-loading/u-loading.vue

@@ -1,59 +1,139 @@
 <template>
-  <view class="up-loading-init">
-    <view class="up-loading-center"></view>
-    <view class="up-loadmore-tips">{{ text }}</view>
+  <view>
+    <view
+      class="up-loading up-loading__box"
+      :class="{ 'up-loading__fixed': fixed }"
+      :style="{ backgroundColor: backgroundColor, color: color, position: fixed ? 'fixed' : 'static' }"
+      v-if="type === 'column'"
+    >
+      <image class="up-loading__ani" :src="src"></image>
+      <view class="up-loading__text">{{ text }}</view>
+    </view>
+    <view
+      v-else
+      class="up-loading up-loading__row"
+      :class="{ 'up-loading__fixed': fixed }"
+      :style="{ position: fixed ? 'fixed' : 'static' }"
+    >
+      <image class="up-loading-row__ani" :src="rowsrc"></image>
+      <view class="up-loading__text">{{ text }}</view>
+    </view>
+    <view class="up-loading__mask" :style="{ background: maskColor }" v-if="isMask && fixed"></view>
   </view>
 </template>
 
 <script>
 export default {
-  name: 'fuiLoading',
+  name: 'tuiLoading',
   props: {
+    //column or row
+    type: {
+      type: String,
+      default: 'column'
+    },
     text: {
       type: String,
-      default: '正在加载...'
+      default: '加载中'
+    },
+    //type=column时生效
+    color: {
+      type: String,
+      default: '#fff'
+    },
+    //type=column时生效
+    backgroundColor: {
+      type: String,
+      default: 'rgba(0, 0, 0, 0.6)'
+    },
+    //type=column时生效
+    src: {
+      type: String,
+      default:
+        'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAMAAAAOusbgAAAARVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////9SnXPCAAAAFnRSTlMA8ECgECCAYDDQ4MCwUL9wkN9vP49fRXb34AAAA1dJREFUaN7tmtmSozAMReXdxuyk+f9PnaW6o06CAdtSumqG8xqSi6QrGwfBxcXFD2OW5cP+pVsWDe9AL7YP6xO9mj1w0t3CmkK0H0yhd0qsBzBoazutZxDKACFSrefpJZmFUfad0vpVtonWOvkHZ62Kzas0QcLnJ0dFuxGOHNqny8QMVfjw6By5c+n4GHnwVOGq7tiDD3G74uq234Idzbmue7hVXZtmYfEncqRDicekKPSo+Z6o/EI7bB6Zfc+hXBl1R13V+0Jm6uL3inCiKGZX6g7ENwXKrrwfEB3uyubszYovXahBx3ve9LkvoG4lcc36pf7zagu16JCzeo4E8aLy+TJL1CXAfJWtP7zHKcsPp+NYh6NEY2posOeSbT4v64CMiLU7dvQIVGAsqzyuSKOBEHvCXwHvjZAGQ94PuAVaJIa8X2EDxMSDkGXh0lG9KCkMmCnkbdNq6oARt7t8Oa6A0dhhx1oREPpe9ukVxgEHBnOdyLQAHkI61wqtxcCQ9rXATDPgk9uef7kjFl+PiRJH4EKlijwmniyp15DEqtYBFz7VyQKXLR5ST9iJLibvZLuZiQh8qO1+kizPHq+hNXpT2AIjrlnX+GIii8J8eJPatyQwcwn/j8ISu5uZwj7+d4QBl8w3I3CT4EOnjjcCeJHJXUsDJ35LeHhDPw0yaesROIkmaesAjJgVtmjZizygd99b5CnunCQVsNGlFsbAnOs+tfkNTMdFzOjuqb0HJlR6J4h4uKHH7CSz47SX2tsIGr6Dm9mNyPGFrHZrqBuuKvuD1dhxGbs/6tOGuJcxoObMM5/QQIoWx8G0HA99IwZ89EZzAEI6PKMc+kt4ykRjix4ne6IrczhjGmzmoAn/dOlyXpgrumPoeLrr6JRd1hOkJVN2mW9mFZGywwbJU+51pa/QWJnKk6/o3xbX/Xxl0ZUPvxXp4nREqyuG31zZnFD5nJHp8ZsVc0I9NkTOFFsw9UN7t5x8W1E9oQSdyJ2p1fP04srKSUUlz0zLiqQlKwbwppvfVZ0DjvkR/bWO2urDbIp2t2n9knWk/+ojorfzsty9v8y2n/DTZgBKZLueInZAjR7CkWoYDLBgXCvSs/uoyoJ3Y3zWjOPg4T14KQf7m0FKqeHi4uJH+QUYYoTOYC/s2wAAAABJRU5ErkJggg=='
+    },
+    //type=row时生效
+    rowsrc: {
+      type: String,
+      default:
+        'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAMAAAAPdrEwAAAAM1BMVEUAAACPj4+IiIiIiIiIiIiIiIiKioqHh4eHh4eHh4eHh4eIiIiIiIiJiYmIiIiJiYmIiIi8awvKAAAAEHRSTlMAEEDw4NAwwKAgYICQULBwL0wVnQAAAmpJREFUWMPtmOmO4yAQhLlvMO//tDuyjfAaCEcj7UqTT5o/iafSVLcLY/TldyHID8fPH94oir2TLD6QyugdxVoeazAnYPUaFtsws+yNVjR+htolcWz/luHyhL7F55XNQ0Narx+L8TY8bSGTXsiYUB5V8A+zHJ4rud+p3GI+PiwqCXv0Ec+T42awf3L8+iMtzwwp36UEPHR1SIYPKueS+xxJe1CZiYkooNmTvjLHUzHDR7TVgnI2UXR9k/OhQHslieKCcb87reRnB5fCzMeTVp5cUbeY8O6arEYknYs60CJXK21zOvot7DSK4lrR51eA7dQ1y1bFF9MT2Chb358DsLHeLJeKhpZdDgkDFp1jQtRGXiEYOtZU1PLdUt7OFT84gnJUHNE5XOCO2PLnCALDzl21HD2Yam4ZRU9kER8Qs/V7IQ7BIWVqp10TTCFN0gdgwvumJmkcwWDFgigsQtv4Sv8baZ2lt5Pn+n+Wfm+CMsUsHFIJQ7VH+l2hSXsaHFUbEb1l2GRt5zFb/FC1nSfskGam+lSP4cqmks10jyOc1fditiGMXD1G4DekTH5sf14gkTeD1QOdbrRLXodGAKb1hC7gh5nmvzvgI0NoHyswA1niP7WKQE4dmtYHDH4MwzxS3T2MmCWje5OL2aK26j9EC7qkrVIk97XtrM+RYzSoHSZmUCTlLoLNvTs+aFLug+XEu2Mt59boRl9+4vk7gbD79fXnii2dsS6Xc4lb3fx5lX1bfKfPD1HJInetS64lJQnxhkrryV2+INbxeCHXN1PtaGxClUYgvGJ1XY82IA7Fn7IyFO7DIDcYfflN/AFNdjdeDj7M+wAAAABJRU5ErkJggg=='
+    },
+    fixed: {
+      type: Boolean,
+      default: true
+    },
+    //v2.9.0+
+    isMask: {
+      type: Boolean,
+      default: false
+    },
+    //v2.9.0+
+    maskColor: {
+      type: String,
+      default: 'rgba(0,0,0,.3)'
     }
   }
 };
 </script>
 
 <style scoped>
-.up-loading-init {
-  min-width: 200rpx;
-  min-height: 200rpx;
-  max-width: 500rpx;
+.up-loading {
   display: flex;
   align-items: center;
   justify-content: center;
-  flex-direction: column;
-  position: fixed;
+}
+
+.up-loading__fixed {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 9999;
-  font-size: 26rpx;
-  color: #fff;
-  background-color: rgba(0, 0, 0, 0.7);
+}
+
+.up-loading__mask {
+  width: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 9900;
+}
+
+.up-loading__box {
+  min-width: 200rpx;
+  min-height: 200rpx;
+  max-width: 500rpx;
+  flex-direction: column;
   border-radius: 10rpx;
 }
 
-.up-loading-center {
-  width: 50rpx;
-  height: 50rpx;
-  border: 3px solid #fff;
-  border-radius: 50%;
+.up-loading__ani {
+  width: 64rpx;
+  height: 64rpx;
   margin: 0 6px;
-  display: inline-block;
-  vertical-align: middle;
-  clip-path: polygon(0% 0%, 100% 0%, 100% 40%, 0% 40%);
-  animation: rotate 1s linear infinite;
-  margin-bottom: 36rpx;
+  animation: rotate 0.9s linear infinite;
+  margin-bottom: 30rpx;
+}
+
+.up-loading__row {
+  width: 100%;
+  height: 36rpx;
+  color: #888;
 }
 
-.up-loadmore-tips {
+.up-loading-row__ani {
+  width: 36rpx;
+  height: 36rpx;
+  display: block;
+  border-radius: 50%;
+  animation: rotate 0.9s linear infinite;
+  margin-right: 20rpx;
+}
+
+.up-loading__text {
+  font-size: 26rpx;
+  line-height: 26rpx;
   text-align: center;
-  padding: 0 20rpx;
-  box-sizing: border-box;
 }
 
 @-webkit-keyframes rotate {