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

package/uview-ui/components/u-row-notice/style.css

@@ -1,59 +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-notice {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-}
-.u-notice__left-icon {
-  align-items: center;
-  margin-right: 5px;
-}
-.u-notice__right-icon {
-  margin-left: 5px;
-  align-items: center;
-}
-.u-notice__content {
-  text-align: right;
-  flex: 1;
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  flex-wrap: nowrap;
-  overflow: hidden;
-}
-.u-notice__content__text {
-  font-size: 14px;
-  color: var(--u-warning);
-  /* #ifndef APP-NVUE */
-  padding-left: 100%;
-  word-break: keep-all;
-  white-space: nowrap;
-  animation: u-loop-animation 10s linear infinite both;
-  /* #endif */
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-}
-@keyframes u-loop-animation {
-  0% {
-    transform: translate3d(0, 0, 0);
-  }
-  100% {
-    transform: translate3d(-100%, 0, 0);
-  }
-}

package/uview-ui/components/u-row-notice/style.scss

@@ -1,48 +0,0 @@
-@import '../../libs/css/components.scss';
-
-.u-notice {
-  @include flex;
-  align-items: center;
-  justify-content: space-between;
-
-  &__left-icon {
-    align-items: center;
-    margin-right: 5px;
-  }
-
-  &__right-icon {
-    margin-left: 5px;
-    align-items: center;
-  }
-
-  &__content {
-    text-align: right;
-    flex: 1;
-    @include flex;
-    flex-wrap: nowrap;
-    overflow: hidden;
-
-    &__text {
-      font-size: 14px;
-      color: $u-warning;
-      /* #ifndef APP-NVUE */
-      // 这一句很重要，为了能让滚动左右连接起来
-      padding-left: 100%;
-      word-break: keep-all;
-      white-space: nowrap;
-      animation: u-loop-animation 10s linear infinite both;
-      /* #endif */
-      @include flex(row);
-    }
-  }
-}
-
-@keyframes u-loop-animation {
-  0% {
-    transform: translate3d(0, 0, 0);
-  }
-
-  100% {
-    transform: translate3d(-100%, 0, 0);
-  }
-}

package/uview-ui/components/u-row-notice/u-row-notice.vue

@@ -1,256 +0,0 @@
-<template>
-  <view class="u-notice" @tap="clickHandler">
-    <slot name="icon">
-      <view class="u-notice__left-icon" v-if="icon">
-        <u-icon :name="icon" :color="color" size="19"></u-icon>
-      </view>
-    </slot>
-    <view class="u-notice__content" ref="u-notice__content">
-      <view ref="u-notice__content__text" class="u-notice__content__text" :style="[animationStyle]">
-        <text v-for="(item, index) in innerText" :key="index" :style="[textStyle]">{{ item }}</text>
-      </view>
-    </view>
-    <view class="u-notice__right-icon" v-if="['link', 'closable'].includes(mode)">
-      <u-icon v-if="mode === 'link'" name="arrow-right" :size="17" :color="color"></u-icon>
-      <u-icon v-if="mode === 'closable'" @click="close" name="close" :size="16" :color="color"></u-icon>
-    </view>
-  </view>
-</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 animation = uni.requireNativePlugin('animation');
-const dom = uni.requireNativePlugin('dom');
-// #endif
-/**
- * RowNotice 滚动通知中的水平滚动模式
- * @description 水平滚动
- * @tutorial https://ijry.github.io/uview-plus/components/noticeBar.html
- * @property {String | Number}	text			显示的内容，字符串
- * @property {String}			icon			是否显示左侧的音量图标 (默认 'volume' )
- * @property {String}			mode			通告模式，link-显示右箭头，closable-显示右侧关闭图标
- * @property {String}			color			文字颜色，各图标也会使用文字颜色 (默认 '#f9ae3d' )
- * @property {String}			bgColor			背景颜色 (默认 ''#fdf6ec' )
- * @property {String | Number}	fontSize		字体大小，单位px (默认 14 )
- * @property {String | Number}	speed			水平滚动时的滚动速度，即每秒滚动多少px(rpx)，这有利于控制文字无论多少时，都能有一个恒定的速度  (默认 80 )
- *
- * @event {Function} click 点击通告文字触发
- * @event {Function} close 点击右侧关闭图标触发
- * @example
- */
-export default {
-  name: 'u-row-notice',
-  mixins: [mpMixin, mixin, props],
-  data() {
-    return {
-      animationDuration: '0', // 动画执行时间
-      animationPlayState: 'paused', // 动画的开始和结束执行
-      // nvue下，内容发生变化，导致滚动宽度也变化，需要标志为是否需要重新计算宽度
-      // 不能在内容变化时直接重新计算，因为nvue的animation模块上一次的滚动不是刚好结束，会有影响
-      nvueInit: true,
-      show: true
-    };
-  },
-  watch: {
-    text: {
-      immediate: true,
-      handler(newValue, oldValue) {
-        // #ifdef APP-NVUE
-        this.nvueInit = true;
-        // #endif
-        // #ifndef APP-NVUE
-        this.vue();
-        // #endif
-        if (!uni.$u.test.string(newValue)) {
-          uni.$u.error('noticebar组件direction为row时，要求text参数为字符串形式');
-        }
-      }
-    },
-    fontSize() {
-      // #ifdef APP-NVUE
-      this.nvueInit = true;
-      // #endif
-      // #ifndef APP-NVUE
-      this.vue();
-      // #endif
-    },
-    speed() {
-      // #ifdef APP-NVUE
-      this.nvueInit = true;
-      // #endif
-      // #ifndef APP-NVUE
-      this.vue();
-      // #endif
-    }
-  },
-  computed: {
-    // 文字内容的样式
-    textStyle() {
-      let style = {};
-      style.color = this.color;
-      style.fontSize = uni.$u.addUnit(this.fontSize);
-      return style;
-    },
-    animationStyle() {
-      let style = {};
-      style.animationDuration = this.animationDuration;
-      style.animationPlayState = this.animationPlayState;
-      return style;
-    },
-    // 内部对用户传入的数据进一步分割，放到多个text标签循环，否则如果用户传入的字符串很长（100个字符以上）
-    // 放在一个text标签中进行滚动，在低端安卓机上，动画可能会出现抖动现象，需要分割到多个text中可解决此问题
-    innerText() {
-      let result = [],
-        // 每组text标签的字符长度
-        len = 20;
-      const textArr = this.text.split('');
-      for (let i = 0; i < textArr.length; i += len) {
-        // 对拆分的后的text进行slice分割，得到的为数组再进行join拼接为字符串
-        result.push(textArr.slice(i, i + len).join(''));
-      }
-      return result;
-    }
-  },
-  mounted() {
-    // #ifdef APP-PLUS
-    // 在APP上(含nvue)，监听当前webview是否处于隐藏状态(进入下一页时即为hide状态)
-    // 如果webivew隐藏了，为了节省性能的损耗，应停止动画的执行，同时也是为了保持进入下一页返回后，滚动位置保持不变
-    var pages = getCurrentPages();
-    var page = pages[pages.length - 1];
-    var currentWebview = page.$getAppWebview();
-    currentWebview.addEventListener('hide', () => {
-      this.webviewHide = true;
-    });
-    currentWebview.addEventListener('show', () => {
-      this.webviewHide = false;
-    });
-    // #endif
-    this.init();
-  },
-  methods: {
-    init() {
-      // #ifdef APP-NVUE
-      this.nvue();
-      // #endif
-      // #ifndef APP-NVUE
-      this.vue();
-      // #endif
-      if (!uni.$u.test.string(this.text)) {
-        uni.$u.error('noticebar组件direction为row时，要求text参数为字符串形式');
-      }
-    },
-    // vue版处理
-    async vue() {
-      // #ifndef APP-NVUE
-      let boxWidth = 0,
-        textWidth = 0;
-      // 进行一定的延时
-      await uni.$u.sleep();
-      // 查询盒子和文字的宽度
-      textWidth = (await this.$uGetRect('.u-notice__content__text')).width;
-      boxWidth = (await this.$uGetRect('.u-notice__content')).width;
-      // 根据t=s/v(时间=路程/速度)，这里为何不需要加上#u-notice-box的宽度，因为中设置了.u-notice-content样式中设置了padding-left: 100%
-      // 恰巧计算出来的结果中已经包含了#u-notice-box的宽度
-      this.animationDuration = `${textWidth / uni.$u.getPx(this.speed)}s`;
-      // 这里必须这样开始动画，否则在APP上动画速度不会改变
-      this.animationPlayState = 'paused';
-      setTimeout(() => {
-        this.animationPlayState = 'running';
-      }, 10);
-      // #endif
-    },
-    // nvue版处理
-    async nvue() {
-      // #ifdef APP-NVUE
-      this.nvueInit = false;
-      let boxWidth = 0,
-        textWidth = 0;
-      // 进行一定的延时
-      await uni.$u.sleep();
-      // 查询盒子和文字的宽度
-      textWidth = (await this.getNvueRect('u-notice__content__text')).width;
-      boxWidth = (await this.getNvueRect('u-notice__content')).width;
-      // 将文字移动到盒子的右边沿，之所以需要这么做，是因为nvue不支持100%单位，否则可以通过css设置
-      animation.transition(
-        this.$refs['u-notice__content__text'],
-        {
-          styles: {
-            transform: `translateX(${boxWidth}px)`
-          }
-        },
-        () => {
-          // 如果非禁止动画，则开始滚动
-          !this.stopAnimation && this.loopAnimation(textWidth, boxWidth);
-        }
-      );
-      // #endif
-    },
-    loopAnimation(textWidth, boxWidth) {
-      // #ifdef APP-NVUE
-      animation.transition(
-        this.$refs['u-notice__content__text'],
-        {
-          styles: {
-            // 目标移动终点为-textWidth，也即当文字的最右边贴到盒子的左边框的位置
-            transform: `translateX(-${textWidth}px)`
-          },
-          // 滚动时间的计算为，时间 = 路程(boxWidth + textWidth) / 速度，最后转为毫秒
-          duration: ((boxWidth + textWidth) / uni.$u.getPx(this.speed)) * 1000,
-          delay: 10
-        },
-        () => {
-          animation.transition(
-            this.$refs['u-notice__content__text'],
-            {
-              styles: {
-                // 重新将文字移动到盒子的右边沿
-                transform: `translateX(${this.stopAnimation ? 0 : boxWidth}px)`
-              }
-            },
-            () => {
-              // 如果非禁止动画，则继续下一轮滚动
-              if (!this.stopAnimation) {
-                // 判断是否需要初始化计算尺寸
-                if (this.nvueInit) {
-                  this.nvue();
-                } else {
-                  this.loopAnimation(textWidth, boxWidth);
-                }
-              }
-            }
-          );
-        }
-      );
-      // #endif
-    },
-    getNvueRect(el) {
-      // #ifdef APP-NVUE
-      // 返回一个promise
-      return new Promise((resolve) => {
-        dom.getComponentRect(this.$refs[el], (res) => {
-          resolve(res.size);
-        });
-      });
-      // #endif
-    },
-    // 点击通告栏
-    clickHandler(index) {
-      this.$emit('click');
-    },
-    // 点击右侧按钮，需要判断点击的是关闭图标还是箭头图标
-    close() {
-      this.$emit('close');
-    }
-  },
-  // #ifdef APP-NVUE
-  beforeDestroy() {
-    this.stopAnimation = true;
-  }
-  // #endif
-};
-</script>
-<style scoped>
-@import './style.css';
-</style>

package/uview-ui/components/u-safe-bottom/props.js

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

package/uview-ui/components/u-safe-bottom/style.css

@@ -1,5 +0,0 @@
-.u-safe-bottom {
-  /* #ifndef APP-NVUE */
-  width: 100%;
-  /* #endif */
-}

package/uview-ui/components/u-safe-bottom/style.scss

@@ -1,5 +0,0 @@
-.u-safe-bottom {
-  /* #ifndef APP-NVUE */
-  width: 100%;
-  /* #endif */
-}

package/uview-ui/components/u-safe-bottom/u-safe-bottom.vue

@@ -1 +0,0 @@
-<template>
  <view class="u-safe-bottom" :style="[style]" :class="[!isNvue && 'u-safe-area-inset-bottom']"></view>
 * SafeBottom 底部安全区
 * @description 这个适配，主要是针对IPhone X等一些底部带指示条的机型，指示条的操作区域与页面底部存在重合，容易导致用户误操作，因此我们需要针对这些机型进行底部安全区适配。
 * @tutorial https://ijry.github.io/uview-plus/components/safeAreaInset.html
 * @property {type}		prop_name
 * @property {Object}	customStyle	定义需要用到的外部样式
 *
 * @event {Function()}
 * @example <u-status-bar></u-status-bar>
 */
  name: 'u-safe-bottom',
  mixins: [mpMixin, mixin, props],
  data() {
    return {
      safeAreaBottomHeight: 0,
      isNvue: false
    };
  },
  computed: {
    style() {
      const style = {};
      // #ifdef APP-NVUE
      // nvue下，高度使用js计算填充
      style.height = uni.$u.addUnit(uni.$u.sys().safeAreaInsets.bottom, 'px');
      // #endif
      return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle));
    }
  },
  mounted() {
    // #ifdef APP-NVUE
    // 标识为是否nvue
    this.isNvue = true;
    // #endif
  }

package/uview-ui/components/u-scroll-list/nvue.js

@@ -1,3 +0,0 @@
-// 引入bindingx，此库类似于微信小程序wxs，目的是让js运行在视图层，减少视图层和逻辑层的通信折损
    methods: {
        // 此处不写注释，请自行体会
        nvueScrollHandler(e) {
            const anchor = this.$refs['u-scroll-list__scroll-view'].ref
            const element = this.$refs['u-scroll-list__indicator__line__bar'].ref
            const scrollLeft = e.contentOffset.x
            const contentSize = e.contentSize.width
            const { scrollWidth } = this
            const barAllMoveWidth = this.indicatorWidth - this.indicatorBarWidth
-            // 在安卓和iOS上，需要除的倍数不一样，iOS需要除以2
-            const actionNum = uni.$u.os() === 'ios' ? 2 : 1
            const expression = `(x / ${actionNum}) / ${contentSize - scrollWidth} * ${barAllMoveWidth}`
            BindingX.bind({
                anchor,
                eventType: 'scroll',
                props: [{
                    element,
                    property: 'transform.translateX',
                    expression
                }]
            })
        }
    }

package/uview-ui/components/u-scroll-list/props.js

@@ -1,35 +0,0 @@
-import defprops from '../../libs/config/props';
-export default {
-  props: {
-    // 指示器的整体宽度
-    indicatorWidth: {
-      type: [String, Number],
-      default: defprops.scrollList.indicatorWidth
-    },
-    // 滑块的宽度
-    indicatorBarWidth: {
-      type: [String, Number],
-      default: defprops.scrollList.indicatorBarWidth
-    },
-    // 是否显示面板指示器
-    indicator: {
-      type: Boolean,
-      default: defprops.scrollList.indicator
-    },
-    // 指示器非激活颜色
-    indicatorColor: {
-      type: String,
-      default: defprops.scrollList.indicatorColor
-    },
-    // 指示器的激活颜色
-    indicatorActiveColor: {
-      type: String,
-      default: defprops.scrollList.indicatorActiveColor
-    },
-    // 指示器样式，可通过bottom，left，right进行定位
-    indicatorStyle: {
-      type: [String, Object],
-      default: defprops.scrollList.indicatorStyle
-    }
-  }
-};

package/uview-ui/components/u-scroll-list/scrollWxs.wxs

@@ -1,50 +0,0 @@
-function scroll(event, ownerInstance) {
-	// detail中含有scroll-view的信息，比如scroll-view的实际宽度，当前时间点scroll-view的移动距离等
-	var detail = event.detail
-	var scrollWidth = detail.scrollWidth
-	var scrollLeft = detail.scrollLeft
-	// 获取当前组件的dataset，说白了就是祸国殃民的腾xun搞出来的垃ji
-	var dataset = event.currentTarget.dataset
-	// 此为scroll-view外部包裹元素的宽度
-	// 某些HX版本(3.1.18)，发现view元素中大写的data-scrollWidth，在wxs中，变成了全部小写，所以这里需要特别处理
-	var scrollComponentWidth = dataset.scrollWidth || dataset.scrollwidth || 0
-	// 指示器和滑块的宽度
-	var indicatorWidth = dataset.indicatorWidth || dataset.indicatorwidth || 0
-	var barWidth = dataset.barWidth || dataset.barwidth || 0
-	// 此处的计算理由为：scroll-view的滚动距离与目标滚动距离(scroll-view的实际宽度减去包裹元素的宽度)之比，等于滑块当前移动距离与总需
-	// 滑动距离(指示器的总宽度减去滑块宽度)的比值
-	var x = scrollLeft / (scrollWidth - scrollComponentWidth) * (indicatorWidth - barWidth)
-	setBarStyle(ownerInstance, x)
-}
-
-// 由于webview的无能，无法保证scroll-view在滑动过程中，一直触发scroll事件，会导致
-// 无法监听到某些滚动值，当在首尾临界值无法监听到时，这是致命的，因为错失这些值会导致滑块无法回到起点和终点
-// 所以这里需要对临界值做监听并处理
-function scrolltolower(event, ownerInstance) {
-	ownerInstance.callMethod('scrollEvent', 'right')
-	// 获取当前组件的dataset
-	var dataset = event.currentTarget.dataset
-	// 指示器和滑块的宽度
-	var indicatorWidth = dataset.indicatorWidth || dataset.indicatorwidth || 0
-	var barWidth = dataset.barWidth || dataset.barwidth || 0
-	// scroll-view滚动到右边终点时，将滑块也设置为到右边的终点，它所需移动的距离为：指示器宽度 - 滑块宽度
-	setBarStyle(ownerInstance, indicatorWidth - barWidth)
-}
-
-function scrolltoupper(event, ownerInstance) {
-	ownerInstance.callMethod('scrollEvent', 'left')
-	// 滚动到左边时，将滑块设置为0的偏移距离，回到起点
-	setBarStyle(ownerInstance, 0)
-}
-
-function setBarStyle(ownerInstance, x) {
-	ownerInstance.selectComponent('.u-scroll-list__indicator__line__bar') && ownerInstance.selectComponent('.u-scroll-list__indicator__line__bar').setStyle({
-		transform: 'translateX(' + x + 'px)'
-	})
-}
-
-module.exports = {
-	scroll: scroll,
-	scrolltolower: scrolltolower,
-	scrolltoupper: scrolltoupper
-}

package/uview-ui/components/u-scroll-list/style.css

@@ -1,45 +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-scroll-list {
-  padding-bottom: 10px;
-}
-.u-scroll-list__scroll-view {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-}
-.u-scroll-list__scroll-view__content {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-}
-.u-scroll-list__indicator {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  justify-content: center;
-  margin-top: 15px;
-}
-.u-scroll-list__indicator__line {
-  width: 60px;
-  height: 4px;
-  border-radius: 100px;
-  overflow: hidden;
-}
-.u-scroll-list__indicator__line__bar {
-  width: 20px;
-  height: 4px;
-  border-radius: 100px;
-}

package/uview-ui/components/u-scroll-list/style.scss

@@ -1,32 +0,0 @@
-@import '../../libs/css/components.scss';
-
-.u-scroll-list {
-  padding-bottom: 10px;
-
-  &__scroll-view {
-    @include flex;
-
-    &__content {
-      @include flex;
-    }
-  }
-
-  &__indicator {
-    @include flex;
-    justify-content: center;
-    margin-top: 15px;
-
-    &__line {
-      width: 60px;
-      height: 4px;
-      border-radius: 100px;
-      overflow: hidden;
-
-      &__bar {
-        width: 20px;
-        height: 4px;
-        border-radius: 100px;
-      }
-    }
-  }
-}