@10yun/cv-mobile-ui 0.5.27 → 0.5.30

package/uview-plus/components/u-search/u-search.vue

@@ -1,12 +1,13 @@
 <template>
   <view
     class="u-search"
+    :class="[iconPosition === 'right' && 'u-search__reverse']"
     @tap="clickHandler"
     :style="[
       {
         margin: margin
       },
-      $u.addStyle(customStyle)
+      addStyle(customStyle)
     ]"
   >
     <view
@@ -40,6 +41,8 @@
         @focus="getFocus"
         :focus="focus"
         :maxlength="maxlength"
+        :adjust-position="adjustPosition"
+        :auto-blur="autoBlur"
         placeholder-class="u-search__content__input--placeholder"
         :placeholder="placeholder"
         :placeholder-style="`color: ${placeholderColor}`"
@@ -47,15 +50,16 @@
         type="text"
         :style="[
           {
+            pointerEvents: disabled ? 'none' : 'auto',
             textAlign: inputAlign,
             color: color,
             backgroundColor: bgColor,
-            height: $u.addUnit(height)
+            height: addUnit(height)
           },
           inputStyle
         ]"
       />
-      <view class="u-search__content__icon u-search__content__close" v-if="keyword && clearabled && focused" @tap="clear">
+      <view class="u-search__content__icon u-search__content__close" v-if="keyword && clearabled && focused" @click="clear">
         <u-icon name="close" size="11" color="#ffffff" customStyle="line-height: 12px"></u-icon>
       </view>
     </view>
@@ -70,9 +74,10 @@
   </view>
 </template>
 <script>
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
+import { props } from './props';
+import { mpMixin } from '../../libs/mixin/mpMixin';
+import { mixin } from '../../libs/mixin/mixin';
+import { addUnit, addStyle } from '../../libs/function/index';
 /**
  * search 搜索框
  * @description 搜索组件，集成了常见搜索框所需功能，用户可以一键引入，开箱即用。
@@ -94,12 +99,15 @@ import mixin from '../../libs/mixin/mixin.js';
  * @property {String}			color				输入框字体颜色（默认 '#606266' ）
  * @property {String}			placeholderColor	placeholder的颜色（默认 '#909399' ）
  * @property {String}			searchIcon			输入框左边的图标，可以为uView图标名称或图片路径  (默认 'search' )
+ * @property {String}			iconPosition		输入框图标位置，left-左边, right-右边  (默认 'left' )
  * @property {String}			margin				组件与其他上下左右元素之间的距离，带单位的字符串形式，如"30px"   (默认 '0' )
  * @property {Boolean} 			animation			是否开启动画，见上方说明（默认 false ）
  * @property {String}			value				输入框初始值
  * @property {String | Number}	maxlength			输入框最大能输入的长度，-1为不限制长度  (默认 '-1' )
  * @property {String | Number}	height				输入框高度，单位px（默认 64 ）
  * @property {String | Number}	label				搜索框左边显示内容
+ * @property {Boolean}	        adjustPosition	    键盘弹起时，是否自动上推页面
+ * @property {Boolean}	        autoBlur	        键盘收起时，是否自动失去焦点
  * @property {Object}			customStyle			定义需要用到的外部样式
  *
  * @event {Function} change 输入框内容发生变化时触发
@@ -158,6 +166,8 @@ export default {
   },
   emits: ['clear', 'search', 'custom', 'focus', 'blur', 'click', 'clickIcon', 'update:modelValue', 'change'],
   methods: {
+    addStyle,
+    addUnit,
     // 目前HX2.6.9 v-model双向绑定无效，故监听input事件获取输入框内容的变化
     inputChange(e) {
       this.keyword = e.detail.value;
@@ -209,8 +219,12 @@ export default {
       if (this.disabled) this.$emit('click');
     },
     // 点击左边图标
-    clickIcon() {
-      this.$emit('clickIcon');
+    clickIcon(e) {
+      this.$emit('clickIcon', this.keyword);
+      try {
+        // 收起键盘
+        uni.hideKeyboard();
+      } catch (e) {}
     }
   }
 };

package/uview-plus/components/u-select/style.css

@@ -0,0 +1,45 @@
+.u-select__content {
+  position: relative;
+}
+.u-select__content .u-select__label {
+  display: flex;
+  justify-content: space-between;
+  /* #ifdef H5 */
+  /* #endif */
+}
+.u-select__content .u-select__label:hover {
+  cursor: pointer;
+}
+.u-select__content .u-select__text {
+  margin-right: 2px;
+}
+.u-select__content .u-select__options__wrap {
+  margin-bottom: 46px;
+  position: absolute;
+  top: 20px;
+  left: 0;
+}
+.u-select__content .u-select__options {
+  min-width: 100px;
+  box-sizing: border-box;
+  border-radius: 4px;
+  border: 1px solid #f1f1f1;
+  background-color: #fff;
+}
+.u-select__content .u-select__options .u-select__options_item {
+  padding: 10px 12px;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  /* #ifdef H5 */
+  /* #endif */
+}
+.u-select__content .u-select__options .u-select__options_item:hover {
+  background-color: #f7f7f7;
+}
+.u-select__content .u-select__options .u-select__options_item:hover {
+  cursor: pointer;
+}
+.u-select__content .u-select__options .u-select__options_item .u-select__item_text:hover {
+  cursor: pointer;
+}

package/uview-plus/components/u-select/style.scss

@@ -0,0 +1,47 @@
+.u-select__content {
+  position: relative;
+  .u-select__label {
+    display: flex;
+    justify-content: space-between;
+    /* #ifdef H5 */
+    &:hover {
+      cursor: pointer;
+    }
+    /* #endif */
+  }
+  .u-select__text {
+    margin-right: 2px;
+  }
+  .u-select__options__wrap {
+    margin-bottom: 46px;
+    position: absolute;
+    top: 20px;
+    left: 0;
+  }
+  .u-select__options {
+    min-width: 100px;
+    box-sizing: border-box;
+    border-radius: 4px;
+    border: 1px solid #f1f1f1;
+    background-color: #fff;
+    .u-select__options_item {
+      padding: 10px 12px;
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      &:hover {
+        background-color: #f7f7f7;
+      }
+      /* #ifdef H5 */
+      &:hover {
+        cursor: pointer;
+      }
+      .u-select__item_text {
+        &:hover {
+          cursor: pointer;
+        }
+      }
+      /* #endif */
+    }
+  }
+}

package/uview-plus/components/u-select/u-select.vue

@@ -0,0 +1,3 @@
+<template>
  <view class="u-select">
    <view class="u-select__content">
      <view class="u-select__label" @click="openSelect">
        <slot name="text" :currentLabel="currentLabel">
          <text class="u-select__text" v-if="showOptionsLabel">
            {{ currentLabel }}
          </text>
          <text class="u-select__text" v-else>
            {{ label }}
          </text>
        </slot>
        <slot name="icon">
          <u-icon name="arrow-down" :size="iconSize" :color="iconColor"></u-icon>
        </slot>
      </view>
      <u-overlay
        :show="isOpen"
        @click="overlayClick"
        v-if="overlay"
        :zIndex="zIndex"
        :duration="duration + 50"
        :customStyle="overlayStyle"
        :opacity="overlayOpacity"
        @touchmove.stop.prevent="noop"
      ></u-overlay>
      <view
        class="u-select__options__wrap"
        :style="{ overflowY: 'auto', zIndex: zIndex + 1, left: optionsWrapLeft, right: optionsWrapRight, maxHeight: maxHeight }"
      >
        <view class="u-select__options" v-if="isOpen">
          <slot name="options">
            <view
              class="u-select__options_item"
              :class="current == item[keyName] ? 'active' : ''"
              :key="index"
              v-for="(item, index) in options"
              @click="selectItem(item)"
            >
              <slot name="optionItem" :item="item">
                <text class="u-select__item_text" :style="{ color: itemColor }">
                  {{ item[labelName] }}
                </text>
              </slot>
            </view>
          </slot>
        </view>
      </view>
    </view>
  </view>
  name: 'up-select',
  emits: ['update:current', 'select'],
  props: {
    maxHeight: {
      type: String,
      default: '90vh'
    },
    overlay: {
      type: Boolean,
      default: true
    },
    overlayOpacity: {
      type: Number,
      default: 0.01
    },
    overlayStyle: {
      type: Object,
      default: () => {
        return {};
      }
    },
    duration: {
      type: Number,
      default: 300
    },
    label: {
      type: String,
      default: '选项'
    },
    options: {
      type: Array,
      default: () => {
        return [];
      }
    },
    keyName: {
      type: String,
      default: 'id'
    },
    labelName: {
      type: String,
      default: 'name'
    },
    showOptionsLabel: {
      type: Boolean,
      default: false
    },
    current: {
      type: [String, Number],
      default: ''
    },
    zIndex: {
      type: Number,
      default: 11000
    },
    itemColor: {
      type: String,
      default: '#333333'
    },
    iconColor: {
      type: String,
      default: ''
    },
    iconSize: {
      type: [String],
      default: '13px'
    }
  },
  data() {
    return {
      isOpen: false,
      optionsWrapLeft: 'auto',
      optionsWrapRight: 'auto'
    };
  },
  computed: {
    currentLabel() {
      let name = '';
      this.options.forEach((ele) => {
        if (ele[this.keyName] === this.current) {
          name = ele[this.labelName];
        }
      });
      return name;
    }
  },
  methods: {
    openSelect() {
      this.isOpen = true;
      this.$nextTick(() => {
        if (this.isOpen) {
          this.adjustOptionsWrapPosition();
        }
      });
    },
    overlayClick() {
      this.isOpen = false;
    },
    selectItem(item) {
      this.isOpen = false;
      this.$emit('update:current', item[this.keyName]);
      this.$emit('select', item);
    },
    adjustOptionsWrapPosition() {
      let wi = getWindowInfo();
      let windowWidth = wi.windowWidth;
      this.$uGetRect('.u-select__options__wrap').then((rect) => {
        console.log(rect);
        if (rect.left + rect.width > windowWidth) {
          // 如果右侧被遮挡，则调整到左侧
          this.optionsWrapLeft = 'auto';
          this.optionsWrapRight = `0px`;
        }
      });
    }
  }
+@import './style.css';
+</style>

package/uview-plus/components/u-skeleton/props.js

@@ -1,60 +1,61 @@
-import defprops from '../../libs/config/props';
-export default {
+import { defineMixin } from '../../libs/vue';
+import defProps from '../../libs/config/props.js';
+export const props = defineMixin({
   props: {
     // 是否展示骨架组件
     loading: {
       type: Boolean,
-      default: defprops.skeleton.loading
+      default: () => defProps.skeleton.loading
     },
     // 是否开启动画效果
     animate: {
       type: Boolean,
-      default: defprops.skeleton.animate
+      default: () => defProps.skeleton.animate
     },
     // 段落占位图行数
     rows: {
       type: [String, Number],
-      default: defprops.skeleton.rows
+      default: () => defProps.skeleton.rows
     },
     // 段落占位图的宽度
     rowsWidth: {
       type: [String, Number, Array],
-      default: defprops.skeleton.rowsWidth
+      default: () => defProps.skeleton.rowsWidth
     },
     // 段落占位图的高度
     rowsHeight: {
       type: [String, Number, Array],
-      default: defprops.skeleton.rowsHeight
+      default: () => defProps.skeleton.rowsHeight
     },
     // 是否展示标题占位图
     title: {
       type: Boolean,
-      default: defprops.skeleton.title
+      default: () => defProps.skeleton.title
     },
     // 段落标题的宽度
     titleWidth: {
       type: [String, Number],
-      default: defprops.skeleton.titleWidth
+      default: () => defProps.skeleton.titleWidth
     },
     // 段落标题的高度
     titleHeight: {
       type: [String, Number],
-      default: defprops.skeleton.titleHeight
+      default: () => defProps.skeleton.titleHeight
     },
     // 是否展示头像占位图
     avatar: {
       type: Boolean,
-      default: defprops.skeleton.avatar
+      default: () => defProps.skeleton.avatar
     },
     // 头像占位图大小
     avatarSize: {
       type: [String, Number],
-      default: defprops.skeleton.avatarSize
+      default: () => defProps.skeleton.avatarSize
     },
     // 头像占位图的形状，circle-圆形，square-方形
     avatarShape: {
       type: String,
-      default: defprops.skeleton.avatarShape
+      default: () => defProps.skeleton.avatarShape
     }
   }
-};
+});

package/uview-plus/components/u-skeleton/style.css

@@ -1,5 +1,20 @@
 /* #ifndef APP-NVUE */
-view, scroll-view, swiper-item {
+.u-empty,
+.u-empty__wrap,
+.u-tabs,
+.u-tabs__wrapper,
+.u-tabs__wrapper__scroll-view-wrapper,
+.u-tabs__wrapper__scroll-view,
+.u-tabs__wrapper__nav,
+.u-tabs__wrapper__nav__line,
+.up-empty,
+.up-empty__wrap,
+.up-tabs,
+.up-tabs__wrapper,
+.up-tabs__wrapper__scroll-view-wrapper,
+.up-tabs__wrapper__scroll-view,
+.up-tabs__wrapper__nav,
+.up-tabs__wrapper__nav__line {
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
@@ -59,4 +74,4 @@ view, scroll-view, swiper-item {
     background-position: 0 50%;
   }
 }
-/* #endif */
+/* #endif */

package/uview-plus/components/u-skeleton/u-skeleton.vue

@@ -6,8 +6,8 @@
         v-if="avatar"
         :class="[`u-skeleton__wrapper__avatar--${avatarShape}`, animate && 'animate']"
         :style="{
-          height: $u.addUnit(avatarSize),
-          width: $u.addUnit(avatarSize)
+          height: addUnit(avatarSize),
+          width: addUnit(avatarSize)
         }"
       ></view>
       <view class="u-skeleton__wrapper__content" ref="u-skeleton__wrapper__content" style="flex: 1">
@@ -16,7 +16,7 @@
           v-if="title"
           :style="{
             width: uTitleWidth,
-            height: $u.addUnit(titleHeight)
+            height: addUnit(titleHeight)
           }"
           :class="[animate && 'animate']"
         ></view>
@@ -37,9 +37,11 @@
   </view>
 </template>
 <script>
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
+import { props } from './props';
+import { mpMixin } from '../../libs/mixin/mpMixin';
+import { mixin } from '../../libs/mixin/mixin';
+import { addUnit, sleep, error } from '../../libs/function/index';
+import test from '../../libs/function/test';
 // #ifdef APP-NVUE
 // 由于weex为阿里的KPI业绩考核的产物，所以不支持百分比单位，这里需要通过dom查询组件的宽度
 const dom = uni.requireNativePlugin('dom');
@@ -78,29 +80,29 @@ export default {
   computed: {
     rowsArray() {
       if (/%$/.test(this.rowsHeight)) {
-        uni.$u.error('rowsHeight参数不支持百分比单位');
+        error('rowsHeight参数不支持百分比单位');
       }
       const rows = [];
       for (let i = 0; i < this.rows; i++) {
         let item = {},
           // 需要预防超出数组边界的情况
-          rowWidth = uni.$u.test.array(this.rowsWidth)
+          rowWidth = test.array(this.rowsWidth)
             ? this.rowsWidth[i] || (i === this.rows - 1 ? '70%' : '100%')
             : i === this.rows - 1
-            ? '70%'
-            : this.rowsWidth,
-          rowHeight = uni.$u.test.array(this.rowsHeight) ? this.rowsHeight[i] || '18px' : this.rowsHeight;
+              ? '70%'
+              : this.rowsWidth,
+          rowHeight = test.array(this.rowsHeight) ? this.rowsHeight[i] || '18px' : this.rowsHeight;
         // 如果有title占位图，第一个段落占位图的外边距需要大一些，如果没有title占位图，第一个段落占位图则无需外边距
         // 之所以需要这么做，是因为weex的无能，以提升性能为借口不支持css的一些伪类
         item.marginTop = !this.title && i === 0 ? 0 : this.title && i === 0 ? '20px' : '12px';
         // 如果设置的为百分比的宽度，转换为px值，因为nvue不支持百分比单位
         if (/%$/.test(rowWidth)) {
           // 通过parseInt提取出百分比单位中的数值部分，除以100得到百分比的小数值
-          item.width = uni.$u.addUnit((this.width * parseInt(rowWidth)) / 100);
+          item.width = addUnit((this.width * parseInt(rowWidth)) / 100);
         } else {
-          item.width = uni.$u.addUnit(rowWidth);
+          item.width = addUnit(rowWidth);
         }
-        item.height = uni.$u.addUnit(rowHeight);
+        item.height = addUnit(rowHeight);
         rows.push(item);
       }
       // console.log(rows);
@@ -110,17 +112,18 @@ export default {
       let tWidth = 0;
       if (/%$/.test(this.titleWidth)) {
         // 通过parseInt提取出百分比单位中的数值部分，除以100得到百分比的小数值
-        tWidth = uni.$u.addUnit((this.width * parseInt(this.titleWidth)) / 100);
+        tWidth = addUnit((this.width * parseInt(this.titleWidth)) / 100);
       } else {
-        tWidth = uni.$u.addUnit(this.titleWidth);
+        tWidth = addUnit(this.titleWidth);
       }
-      return uni.$u.addUnit(tWidth);
+      return addUnit(tWidth);
     }
   },
   mounted() {
     this.init();
   },
   methods: {
+    addUnit,
     init() {
       this.getComponentWidth();
       // #ifdef APP-NVUE
@@ -130,7 +133,7 @@ export default {
     async setNvueAnimation() {
       // #ifdef APP-NVUE
       // 为了让opacity:1的状态保持一定时间，这里做一个延时
-      await uni.$u.sleep(500);
+      await sleep(500);
       const skeleton = this.$refs['u-skeleton__wrapper'];
       skeleton &&
         this.loading &&
@@ -166,7 +169,7 @@ export default {
     // 获取组件的宽度
     async getComponentWidth() {
       // 延时一定时间，以获取dom尺寸
-      await uni.$u.sleep(20);
+      await sleep(20);
       // #ifndef APP-NVUE
       this.$uGetRect('.u-skeleton__wrapper__content').then((size) => {
         this.width = size.width;

package/uview-plus/components/u-sku-wu/_doc/changelog.md

@@ -0,0 +1,27 @@
+## 1.1.0（2024-11-14）
+修复nvue警告
+## 1.0.9（2024-06-11）
+1. 修复某些安卓手机点击加减无反应
+2. 修复点击关闭图标无法关闭的bug
+## 1.0.8（2024-05-08）
+更新域名
+## 1.0.7（2023-12-08）
+修复隐式转换的错误
+## 1.0.6（2023-08-23）
+去除0库存禁用，新增sku不相关是否禁用属性
+## 1.0.5（2023-08-21）
+更新文档说明
+## 1.0.4（2023-08-12）
+修复数据变动无法检测变化的bug
+## 1.0.3（2023-08-11）
+将使用说明迁至 u-ui sku 组件文档中
+## 1.0.2（2023-08-11）
+发布新版教程
+## 1.0.1（2023-08-11）
+1. 优化源geek-sku组件，原组件不在维护
+2. 新增全端兼容，nvue、vue2、vue3、小程序等
+3. 修复 vue2 icon图标消失的bug
+## 1.0.0（2023-08-11）
+1. 优化源geek-sku组件，原组件不在维护
+2. 新增全端兼容，nvue、vue2、vue3、小程序等
+3. 修复 vue2 icon图标消失的bug