@10yun/cv-mobile-ui 0.5.43 → 0.5.45

package/uview-ui/components/u-icon/u-icon.vue

@@ -1,132 +0,0 @@
-<template>
-  <view class="u-icon" @tap="clickHandler" :class="['u-icon--' + labelPos]">
-    <image class="u-icon__img" v-if="isImg" :src="name" :mode="imgMode" :style="[imgStyle, $u.addStyle(customStyle)]"></image>
-    <text v-else class="u-icon__icon" :class="uClasses" :style="[iconStyle, $u.addStyle(customStyle)]" :hover-class="hoverClass">
-      {{ icon }}
-    </text>
-    <!-- 这里进行空字符串判断，如果仅仅是v-if="label"，可能会出现传递0的时候，结果也无法显示 -->
-    <text
-      v-if="label !== ''"
-      class="u-icon__label"
-      :style="{
-        color: labelColor,
-        fontSize: $u.addUnit(labelSize),
-        marginLeft: labelPos == 'right' ? $u.addUnit(space) : 0,
-        marginTop: labelPos == 'bottom' ? $u.addUnit(space) : 0,
-        marginRight: labelPos == 'left' ? $u.addUnit(space) : 0,
-        marginBottom: labelPos == 'top' ? $u.addUnit(space) : 0
-      }"
-    >
-      {{ label }}
-    </text>
-  </view>
-</template>
-<script>
-// #ifdef APP-NVUE
-// nvue通过weex的dom模块引入字体，相关文档地址如下：
-// https://weex.apache.org/zh/docs/modules/dom.html#addrule
-const fontUrl = 'https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf';
-const domModule = weex.requireModule('dom');
-domModule.addRule('fontFace', {
-  fontFamily: 'uicon-iconfont',
-  src: `url('${fontUrl}')`
-});
-// #endif
-// 引入图标名称，已经对应的unicode
-import icons from './icons';
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
-/**
- * icon 图标
- * @description 基于字体的图标集，包含了大多数常见场景的图标。
- * @tutorial https://ijry.github.io/uview-plus/components/icon.html
- * @property {String}			name			图标名称，见示例图标集
- * @property {String}			color			图标颜色,可接受主题色 （默认 color['u-content-color'] ）
- * @property {String | Number}	size			图标字体大小，单位px （默认 '16px' ）
- * @property {Boolean}			bold			是否显示粗体 （默认 false ）
- * @property {String | Number}	index			点击图标的时候传递事件出去的index（用于区分点击了哪一个）
- * @property {String}			hoverClass		图标按下去的样式类，用法同uni的view组件的hoverClass参数，详情见官网
- * @property {String}			customPrefix	自定义扩展前缀，方便用户扩展自己的图标库 （默认 'uicon' ）
- * @property {String | Number}	label			图标右侧的label文字
- * @property {String}			labelPos		label相对于图标的位置，只能right或bottom （默认 'right' ）
- * @property {String | Number}	labelSize		label字体大小，单位px （默认 '15px' ）
- * @property {String}			labelColor		图标右侧的label文字颜色 （ 默认 color['u-content-color'] ）
- * @property {String | Number}	space			label与图标的距离，单位px （默认 '3px' ）
- * @property {String}			imgMode			图片的mode
- * @property {String | Number}	width			显示图片小图标时的宽度
- * @property {String | Number}	height			显示图片小图标时的高度
- * @property {String | Number}	top				图标在垂直方向上的定位 用于解决某些情况下，让图标垂直居中的用途  （默认 0 ）
- * @property {Boolean}			stop			是否阻止事件传播 （默认 false ）
- * @property {Object}			customStyle		icon的样式，对象形式
- * @event {Function} click 点击图标时触发
- * @event {Function} touchstart 事件触摸时触发
- * @example <u-icon name="photo" color="#2979ff" size="28"></u-icon>
- */
-export default {
-  name: 'u-icon',
-  data() {
-    return {};
-  },
-  mixins: [mpMixin, mixin, props],
-  computed: {
-    uClasses() {
-      let classes = [];
-      classes.push(this.customPrefix + '-' + this.name);
-      // // uView的自定义图标类名为u-iconfont
-      // if (this.customPrefix == 'uicon') {
-      // 	classes.push('u-iconfont')
-      // } else {
-      // 	classes.push(this.customPrefix)
-      // }
-      // 主题色，通过类配置
-      if (this.color && uni.$u.config.type.includes(this.color)) classes.push('u-icon__icon--' + this.color);
-      // 阿里，头条，百度小程序通过数组绑定类名时，无法直接使用[a, b, c]的形式，否则无法识别
-      // 故需将其拆成一个字符串的形式，通过空格隔开各个类名
-      //#ifdef MP-ALIPAY || MP-TOUTIAO || MP-BAIDU
-      classes = classes.join(' ');
-      //#endif
-      return classes;
-    },
-    iconStyle() {
-      let style = {};
-      style = {
-        fontSize: uni.$u.addUnit(this.size),
-        lineHeight: uni.$u.addUnit(this.size),
-        fontWeight: this.bold ? 'bold' : 'normal',
-        // 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
-        top: uni.$u.addUnit(this.top)
-      };
-      // 非主题色值时，才当作颜色值
-      if (this.color && !uni.$u.config.type.includes(this.color)) style.color = this.color;
-      return style;
-    },
-    // 判断传入的name属性，是否图片路径，只要带有"/"均认为是图片形式
-    isImg() {
-      return this.name.indexOf('/') !== -1;
-    },
-    imgStyle() {
-      let style = {};
-      // 如果设置width和height属性，则优先使用，否则使用size属性
-      style.width = this.width ? uni.$u.addUnit(this.width) : uni.$u.addUnit(this.size);
-      style.height = this.height ? uni.$u.addUnit(this.height) : uni.$u.addUnit(this.size);
-      return style;
-    },
-    // 通过图标名，查找对应的图标
-    icon() {
-      // 如果内置的图标中找不到对应的图标，就直接返回name值，因为用户可能传入的是unicode代码
-      return icons['uicon-' + this.name] || this.name;
-    }
-  },
-  methods: {
-    clickHandler(e) {
-      this.$emit('click', this.index);
-      // 是否阻止事件冒泡
-      this.stop && this.preventEvent(e);
-    }
-  }
-};
-</script>
-<style scoped>
-@import './style.css';
-</style>

package/uview-ui/components/u-image/props.js

@@ -1,85 +0,0 @@
-import defprops from '../../libs/config/props';
-export default {
-  props: {
-    // 图片地址
-    src: {
-      type: String,
-      default: defprops.image.src
-    },
-    // 裁剪模式
-    mode: {
-      type: String,
-      default: defprops.image.mode
-    },
-    // 宽度，单位任意
-    width: {
-      type: [String, Number],
-      default: defprops.image.width
-    },
-    // 高度，单位任意
-    height: {
-      type: [String, Number],
-      default: defprops.image.height
-    },
-    // 图片形状，circle-圆形，square-方形
-    shape: {
-      type: String,
-      default: defprops.image.shape
-    },
-    // 圆角，单位任意
-    radius: {
-      type: [String, Number],
-      default: defprops.image.radius
-    },
-    // 是否懒加载，微信小程序、App、百度小程序、字节跳动小程序
-    lazyLoad: {
-      type: Boolean,
-      default: defprops.image.lazyLoad
-    },
-    // 开启长按图片显示识别微信小程序码菜单
-    showMenuByLongpress: {
-      type: Boolean,
-      default: defprops.image.showMenuByLongpress
-    },
-    // 加载中的图标，或者小图片
-    loadingIcon: {
-      type: String,
-      default: defprops.image.loadingIcon
-    },
-    // 加载失败的图标，或者小图片
-    errorIcon: {
-      type: String,
-      default: defprops.image.errorIcon
-    },
-    // 是否显示加载中的图标或者自定义的slot
-    showLoading: {
-      type: Boolean,
-      default: defprops.image.showLoading
-    },
-    // 是否显示加载错误的图标或者自定义的slot
-    showError: {
-      type: Boolean,
-      default: defprops.image.showError
-    },
-    // 是否需要淡入效果
-    fade: {
-      type: Boolean,
-      default: defprops.image.fade
-    },
-    // 只支持网络资源，只对微信小程序有效
-    webp: {
-      type: Boolean,
-      default: defprops.image.webp
-    },
-    // 过渡时间，单位ms
-    duration: {
-      type: [String, Number],
-      default: defprops.image.duration
-    },
-    // 背景颜色，用于深色页面加载图片时，为了和背景色融合
-    bgColor: {
-      type: String,
-      default: defprops.image.bgColor
-    }
-  }
-};

package/uview-ui/components/u-image/style.css

@@ -1,35 +0,0 @@
-/* #ifndef APP-NVUE */
-view, scroll-view, swiper-item {
-  display: flex;
-  flex-direction: column;
-  flex-shrink: 0;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */
-.u-image {
-  position: relative;
-  transition: opacity 0.5s ease-in-out;
-}
-.u-image__image {
-  width: 100%;
-  height: 100%;
-}
-.u-image__loading, .u-image__error {
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  width: 100%;
-  height: 100%;
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  background-color: var(--u-bg-color);
-  color: var(--u-tips-color);
-  font-size: 46rpx;
-}

package/uview-ui/components/u-image/style.scss

@@ -1,34 +0,0 @@
-@import '../../libs/css/components.scss';
-
-$u-image-error-top: 0px !default;
-$u-image-error-left: 0px !default;
-$u-image-error-width: 100% !default;
-$u-image-error-hight: 100% !default;
-$u-image-error-background-color: $u-bg-color !default;
-$u-image-error-color: $u-tips-color !default;
-$u-image-error-font-size: 46rpx !default;
-
-.u-image {
-  position: relative;
-  transition: opacity 0.5s ease-in-out;
-
-  &__image {
-    width: 100%;
-    height: 100%;
-  }
-
-  &__loading,
-  &__error {
-    position: absolute;
-    top: $u-image-error-top;
-    left: $u-image-error-left;
-    width: $u-image-error-width;
-    height: $u-image-error-hight;
-    @include flex;
-    align-items: center;
-    justify-content: center;
-    background-color: $u-image-error-background-color;
-    color: $u-image-error-color;
-    font-size: $u-image-error-font-size;
-  }
-}

package/uview-ui/components/u-image/u-image.vue

@@ -1,182 +0,0 @@
-<template>
-  <u-transition mode="fade" :show="show" :duration="fade ? 1000 : 0">
-    <view class="u-image" @tap="onClick" :style="[wrapStyle, backgroundStyle]">
-      <image
-        v-if="!isError"
-        :src="src"
-        :mode="mode"
-        @error="onErrorHandler"
-        @load="onLoadHandler"
-        :show-menu-by-longpress="showMenuByLongpress"
-        :lazy-load="lazyLoad"
-        class="u-image__image"
-        :style="{
-          borderRadius: shape == 'circle' ? '10000px' : $u.addUnit(radius),
-          width: $u.addUnit(width),
-          height: $u.addUnit(height)
-        }"
-      ></image>
-      <view
-        v-if="showLoading && loading"
-        class="u-image__loading"
-        :style="{
-          borderRadius: shape == 'circle' ? '50%' : $u.addUnit(radius),
-          backgroundColor: bgColor,
-          width: $u.addUnit(width),
-          height: $u.addUnit(height)
-        }"
-      >
-        <slot name="loading">
-          <u-icon :name="loadingIcon" :width="width" :height="height"></u-icon>
-        </slot>
-      </view>
-      <view
-        v-if="showError && isError && !loading"
-        class="u-image__error"
-        :style="{
-          borderRadius: shape == 'circle' ? '50%' : $u.addUnit(radius),
-          width: $u.addUnit(width),
-          height: $u.addUnit(height)
-        }"
-      >
-        <slot name="error">
-          <u-icon :name="errorIcon" :width="width" :height="height"></u-icon>
-        </slot>
-      </view>
-    </view>
-  </u-transition>
-</template>
-<script>
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
-/**
- * Image 图片
- * @description 此组件为uni-app的image组件的加强版，在继承了原有功能外，还支持淡入动画、加载中、加载失败提示、圆角值和形状等。
- * @tutorial https://uviewui.com/components/image.html
- * @property {String}			src 				图片地址
- * @property {String}			mode 				裁剪模式，见官网说明 （默认 'aspectFill' ）
- * @property {String | Number}	width 				宽度，单位任意，如果为数值，则为px单位 （默认 '300' ）
- * @property {String | Number}	height 				高度，单位任意，如果为数值，则为px单位 （默认 '225' ）
- * @property {String}			shape 				图片形状，circle-圆形，square-方形 （默认 'square' ）
- * @property {String | Number}	radius		 		圆角值，单位任意，如果为数值，则为px单位 （默认 0 ）
- * @property {Boolean}			lazyLoad			是否懒加载，仅微信小程序、App、百度小程序、字节跳动小程序有效 （默认 true ）
- * @property {Boolean}			showMenuByLongpress	是否开启长按图片显示识别小程序码菜单，仅微信小程序有效 （默认 true ）
- * @property {String}			loadingIcon 		加载中的图标，或者小图片 （默认 'photo' ）
- * @property {String}			errorIcon 			加载失败的图标，或者小图片 （默认 'error-circle' ）
- * @property {Boolean}			showLoading 		是否显示加载中的图标或者自定义的slot （默认 true ）
- * @property {Boolean}			showError 			是否显示加载错误的图标或者自定义的slot （默认 true ）
- * @property {Boolean}			fade 				是否需要淡入效果 （默认 true ）
- * @property {Boolean}			webp 				只支持网络资源，只对微信小程序有效 （默认 false ）
- * @property {String | Number}	duration 			搭配fade参数的过渡时间，单位ms （默认 500 ）
- * @property {String}			bgColor 			背景颜色，用于深色页面加载图片时，为了和背景色融合  (默认 '#f3f4f6' )
- * @property {Object}			customStyle  		定义需要用到的外部样式
- * @event {Function}	click	点击图片时触发
- * @event {Function}	error	图片加载失败时触发
- * @event {Function} load 图片加载成功时触发
- * @example <u-image width="100%" height="300px" :src="src"></u-image>
- */
-export default {
-  name: 'u-image',
-  mixins: [mpMixin, mixin, props],
-  data() {
-    return {
-      // 图片是否加载错误，如果是，则显示错误占位图
-      isError: false,
-      // 初始化组件时，默认为加载中状态
-      loading: true,
-      // 不透明度，为了实现淡入淡出的效果
-      opacity: 1,
-      // 过渡时间，因为props的值无法修改，故需要一个中间值
-      durationTime: this.duration,
-      // 图片加载完成时，去掉背景颜色，因为如果是png图片，就会显示灰色的背景
-      backgroundStyle: {},
-      // 用于fade模式的控制组件显示与否
-      show: false
-    };
-  },
-  watch: {
-    src: {
-      immediate: true,
-      handler(n) {
-        if (!n) {
-          // 如果传入null或者''，或者false，或者undefined，标记为错误状态
-          this.isError = true;
-          this.loading = false;
-        } else {
-          this.isError = false;
-          this.loading = true;
-        }
-      }
-    }
-  },
-  computed: {
-    wrapStyle() {
-      let style = {};
-      // 通过调用addUnit()方法，如果有单位，如百分比，px单位等，直接返回，如果是纯粹的数值，则加上rpx单位
-      style.width = this.$u.addUnit(this.width);
-      style.height = this.$u.addUnit(this.height);
-      // 如果是显示圆形，设置一个很多的半径值即可
-      style.borderRadius = this.shape == 'circle' ? '10000px' : uni.$u.addUnit(this.radius);
-      // 如果设置圆角，必须要有hidden，否则可能圆角无效
-      style.overflow = +this.radius > 0 ? 'hidden' : 'visible';
-      // if (this.fade) {
-      // 	style.opacity = this.opacity
-      // 	// nvue下，这几个属性必须要分开写
-      // 	style.transitionDuration = `${this.durationTime}ms`
-      // 	style.transitionTimingFunction = 'ease-in-out'
-      // 	style.transitionProperty = 'opacity'
-      // }
-      return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle));
-    }
-  },
-  mounted() {
-    this.show = true;
-  },
-  methods: {
-    // 点击图片
-    onClick() {
-      this.$emit('click');
-    },
-    // 图片加载失败
-    onErrorHandler(err) {
-      this.loading = false;
-      this.isError = true;
-      this.$emit('error', err);
-    },
-    // 图片加载完成，标记loading结束
-    onLoadHandler(event) {
-      this.loading = false;
-      this.isError = false;
-      this.$emit('load', event);
-      this.removeBgColor();
-      // 如果不需要动画效果，就不执行下方代码，同时移除加载时的背景颜色
-      // 否则无需fade效果时，png图片依然能看到下方的背景色
-      // if (!this.fade) return this.removeBgColor();
-      // // 原来opacity为1(不透明，是为了显示占位图)，改成0(透明，意味着该元素显示的是背景颜色，默认的灰色)，再改成1，是为了获得过渡效果
-      // this.opacity = 0;
-      // // 这里设置为0，是为了图片展示到背景全透明这个过程时间为0，延时之后延时之后重新设置为duration，是为了获得背景透明(灰色)
-      // // 到图片展示的过程中的淡入效果
-      // this.durationTime = 0;
-      // // 延时50ms，否则在浏览器H5，过渡效果无效
-      // setTimeout(() => {
-      // 	this.durationTime = this.duration;
-      // 	this.opacity = 1;
-      // 	setTimeout(() => {
-      // 		this.removeBgColor();
-      // 	}, this.durationTime);
-      // }, 50);
-    },
-    // 移除图片的背景色
-    removeBgColor() {
-      // 淡入动画过渡完成后，将背景设置为透明色，否则png图片会看到灰色的背景
-      this.backgroundStyle = {
-        backgroundColor: 'transparent'
-      };
-    }
-  }
-};
-</script>
-<style scoped>
-@import './style.css';
-</style>

package/uview-ui/components/u-index-anchor/props.js

@@ -1,30 +0,0 @@
-import defprops from '../../libs/config/props';
-export default {
-  props: {
-    // 列表锚点文本内容
-    text: {
-      type: [String, Number],
-      default: defprops.indexAnchor.text
-    },
-    // 列表锚点文字颜色
-    color: {
-      type: String,
-      default: defprops.indexAnchor.color
-    },
-    // 列表锚点文字大小，单位默认px
-    size: {
-      type: [String, Number],
-      default: defprops.indexAnchor.size
-    },
-    // 列表锚点背景颜色
-    bgColor: {
-      type: String,
-      default: defprops.indexAnchor.bgColor
-    },
-    // 列表锚点高度，单位默认px
-    height: {
-      type: [String, Number],
-      default: defprops.indexAnchor.height
-    }
-  }
-};

package/uview-ui/components/u-index-anchor/style.css

@@ -1,29 +0,0 @@
-/* #ifndef APP-NVUE */
-view, scroll-view, swiper-item {
-  display: flex;
-  flex-direction: column;
-  flex-shrink: 0;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */
-.u-index-anchor {
-  position: sticky;
-  top: 0;
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-  padding-left: 15px;
-  z-index: 1;
-}
-.u-index-anchor__text {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-}

package/uview-ui/components/u-index-anchor/style.scss

@@ -1,15 +0,0 @@
-@import '../../libs/css/components.scss';
-
-.u-index-anchor {
-  position: sticky;
-  top: 0;
-  @include flex;
-  align-items: center;
-  padding-left: 15px;
-  z-index: 1;
-
-  &__text {
-    @include flex;
-    align-items: center;
-  }
-}

package/uview-ui/components/u-index-anchor/u-index-anchor.vue

@@ -1,78 +0,0 @@
-<template>
-  <!-- #ifdef APP-NVUE -->
-  <header>
-    <!-- #endif -->
-    <view
-      class="u-index-anchor u-border-bottom"
-      :ref="`u-index-anchor-${text}`"
-      :style="{
-        height: $u.addUnit(height),
-        backgroundColor: bgColor
-      }"
-    >
-      <text
-        class="u-index-anchor__text"
-        :style="{
-          fontSize: $u.addUnit(size),
-          color: color
-        }"
-      >
-        {{ text }}
-      </text>
-    </view>
-    <!-- #ifdef APP-NVUE -->
-  </header>
-  <!-- #endif -->
-</template>
-<script>
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
-// #ifdef APP-NVUE
-const dom = uni.requireNativePlugin('dom');
-// #endif
-/**
- * IndexAnchor 列表锚点
- * @description
- * @tutorial https://uviewui.com/components/indexList.html
- * @property {String | Number}	text	列表锚点文本内容
- * @property {String}			color	列表锚点文字颜色 ( 默认 '#606266' )
- * @property {String | Number}	size	列表锚点文字大小，单位默认px ( 默认 14 )
- * @property {String}			bgColor	列表锚点背景颜色 ( 默认 '#dedede' )
- * @property {String | Number}	height	列表锚点高度，单位默认px ( 默认 32 )
- * @example <u-index-anchor :text="indexList[index]"></u-index-anchor>
- */
-export default {
-  name: 'u-index-anchor',
-  mixins: [mpMixin, mixin, props],
-  data() {
-    return {};
-  },
-  mounted() {
-    this.init();
-  },
-  methods: {
-    init() {
-      // 此处会活动父组件实例，并赋值给实例的parent属性
-      const indexList = uni.$u.$parent.call(this, 'u-index-list');
-      if (!indexList) {
-        return uni.$u.error('u-index-anchor必须要搭配u-index-list组件使用');
-      }
-      // 将当前实例放入到u-index-list中
-      indexList.anchors.push(this);
-      const indexListItem = uni.$u.$parent.call(this, 'u-index-item');
-      // #ifndef APP-NVUE
-      // 只有在非nvue下，u-index-anchor才是嵌套在u-index-item中的
-      if (!indexListItem) {
-        return uni.$u.error('u-index-anchor必须要搭配u-index-item组件使用');
-      }
-      // 设置u-index-item的id为anchor的text标识符，因为非nvue下滚动列表需要依赖scroll-view滚动到元素的特性
-      indexListItem.id = this.text.charCodeAt(0);
-      // #endif
-    }
-  }
-};
-</script>
-<style scoped>
-@import './style.css';
-</style>

package/uview-ui/components/u-index-item/props.js

@@ -1,3 +0,0 @@
-export default {
-  props: {}
-};

package/uview-ui/components/u-index-item/style.css

@@ -1,11 +0,0 @@
-/* #ifndef APP-NVUE */
-view, scroll-view, swiper-item {
-  display: flex;
-  flex-direction: column;
-  flex-shrink: 0;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */

package/uview-ui/components/u-index-item/style.scss

@@ -1 +0,0 @@
-@import '../../libs/css/components.scss';