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

package/uview-ui/components/u-car-keyboard/u-car-keyboard.vue

@@ -1 +0,0 @@
-<template>
  <view class="u-keyboard" @touchmove.stop.prevent="noop">
    <view
      v-for="(group, i) in abc ? engKeyBoardList : areaList"
      :key="i"
      class="u-keyboard__button"
      :index="i"
      :class="[i + 1 === 4 && 'u-keyboard__button--center']"
    >
      <view v-if="i === 3" class="u-keyboard__button__inner-wrapper">
        <view
          class="u-keyboard__button__inner-wrapper__left"
          hover-class="u-hover-class"
          :hover-stay-time="200"
          @tap="changeCarInputMode"
        >
          <text
            class="u-keyboard__button__inner-wrapper__left__lang"
            :class="[!abc && 'u-keyboard__button__inner-wrapper__left__lang--active']"
          >
            中
          </text>
          <text class="u-keyboard__button__inner-wrapper__left__line">/</text>
          <text
            class="u-keyboard__button__inner-wrapper__left__lang"
            :class="[abc && 'u-keyboard__button__inner-wrapper__left__lang--active']"
          >
            英
          </text>
        </view>
      </view>
      <view class="u-keyboard__button__inner-wrapper" v-for="(item, j) in group" :key="j">
        <view
          class="u-keyboard__button__inner-wrapper__inner"
          :hover-stay-time="200"
          @tap="carInputClick(i, j)"
          hover-class="u-hover-class"
        >
          <text class="u-keyboard__button__inner-wrapper__inner__text">{{ item }}</text>
        </view>
      </view>
      <view v-if="i === 3" @touchstart="backspaceClick" @touchend="clearTimer" class="u-keyboard__button__inner-wrapper">
        <view class="u-keyboard__button__inner-wrapper__right" hover-class="u-hover-class" :hover-stay-time="200">
          <u-icon size="28" name="backspace" color="#303133"></u-icon>
        </view>
      </view>
    </view>
  </view>
 * keyboard 键盘组件
 * @description 此为uView自定义的键盘面板，内含了数字键盘，车牌号键，身份证号键盘3种模式，都有可以打乱按键顺序的选项。
 * @tutorial https://uviewui.com/components/keyboard.html
 * @property {Boolean} random 是否打乱键盘的顺序
 * @event {Function} change 点击键盘触发
 * @event {Function} backspace 点击退格键触发
 * @example <u-keyboard ref="uKeyboard" mode="car" v-model="show"></u-keyboard>
 */
  name: 'u-keyboard',
  mixins: [mpMixin, mixin, props],
  data() {
    return {
      // 车牌输入时，abc=true为输入车牌号码，bac=false为输入省份中文简称
      abc: false
    };
  },
  computed: {
    areaList() {
      let data = [
        '京',
        '沪',
        '粤',
        '津',
        '冀',
        '豫',
        '云',
        '辽',
        '黑',
        '湘',
        '皖',
        '鲁',
        '苏',
        '浙',
        '赣',
        '鄂',
        '桂',
        '甘',
        '晋',
        '陕',
        '蒙',
        '吉',
        '闽',
        '贵',
        '渝',
        '川',
        '青',
        '琼',
        '宁',
        '挂',
        '藏',
        '港',
        '澳',
        '新',
        '使',
        '学'
      ];
      let tmp = [];
      // 打乱顺序
      if (this.random) data = uni.$u.randomArray(data);
      // 切割成二维数组
      tmp[0] = data.slice(0, 10);
      tmp[1] = data.slice(10, 20);
      tmp[2] = data.slice(20, 30);
      tmp[3] = data.slice(30, 36);
      return tmp;
    },
    engKeyBoardList() {
      let data = [
        1,
        2,
        3,
        4,
        5,
        6,
        7,
        8,
        9,
        0,
        'Q',
        'W',
        'E',
        'R',
        'T',
        'Y',
        'U',
        'I',
        'O',
        'P',
        'A',
        'S',
        'D',
        'F',
        'G',
        'H',
        'J',
        'K',
        'L',
        'Z',
        'X',
        'C',
        'V',
        'B',
        'N',
        'M'
      ];
      let tmp = [];
      if (this.random) data = uni.$u.randomArray(data);
      tmp[0] = data.slice(0, 10);
      tmp[1] = data.slice(10, 20);
      tmp[2] = data.slice(20, 30);
      tmp[3] = data.slice(30, 36);
      return tmp;
    }
  },
  methods: {
    // 点击键盘按钮
    carInputClick(i, j) {
      let value = '';
      // 不同模式，获取不同数组的值
      if (this.abc) value = this.engKeyBoardList[i][j];
      else value = this.areaList[i][j];
      // 如果允许自动切换，则将中文状态切换为英文
      if (!this.abc && this.autoChange) uni.$u.sleep(200).then(() => (this.abc = true));
      this.$emit('change', value);
    },
    // 修改汽车牌键盘的输入模式，中文|英文
    changeCarInputMode() {
      this.abc = !this.abc;
    },
    // 点击退格键
    backspaceClick() {
      this.$emit('backspace');
      clearInterval(this.timer); //再次清空定时器，防止重复注册定时器
      this.timer = null;
      this.timer = setInterval(() => {
        this.$emit('backspace');
      }, 250);
    },
    clearTimer() {
      clearInterval(this.timer);
      this.timer = null;
    }
  }

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

@@ -1,111 +0,0 @@
-import defprops from '../../libs/config/props';
-export default {
-  props: {
-    // 标题
-    title: {
-      type: [String, Number],
-      default: defprops.cell.title
-    },
-    // 标题下方的描述信息
-    label: {
-      type: [String, Number],
-      default: defprops.cell.label
-    },
-    // 右侧的内容
-    value: {
-      type: [String, Number],
-      default: defprops.cell.value
-    },
-    // 左侧图标名称，或者图片链接(本地文件建议使用绝对地址)
-    icon: {
-      type: String,
-      default: defprops.cell.icon
-    },
-    // 是否禁用cell
-    disabled: {
-      type: Boolean,
-      default: defprops.cell.disabled
-    },
-    // 是否显示下边框
-    border: {
-      type: Boolean,
-      default: defprops.cell.border
-    },
-    // 内容是否垂直居中(主要是针对右侧的value部分)
-    center: {
-      type: Boolean,
-      default: defprops.cell.center
-    },
-    // 点击后跳转的URL地址
-    url: {
-      type: String,
-      default: defprops.cell.url
-    },
-    // 链接跳转的方式，内部使用的是uView封装的route方法，可能会进行拦截操作
-    linkType: {
-      type: String,
-      default: defprops.cell.linkType
-    },
-    // 是否开启点击反馈(表现为点击时加上灰色背景)
-    clickable: {
-      type: Boolean,
-      default: defprops.cell.clickable
-    },
-    // 是否展示右侧箭头并开启点击反馈
-    isLink: {
-      type: Boolean,
-      default: defprops.cell.isLink
-    },
-    // 是否显示表单状态下的必填星号(此组件可能会内嵌入input组件)
-    required: {
-      type: Boolean,
-      default: defprops.cell.required
-    },
-    // 右侧的图标箭头
-    rightIcon: {
-      type: String,
-      default: defprops.cell.rightIcon
-    },
-    // 右侧箭头的方向，可选值为：left，up，down
-    arrowDirection: {
-      type: String,
-      default: defprops.cell.arrowDirection
-    },
-    // 左侧图标样式
-    iconStyle: {
-      type: [Object, String],
-      default: () => {
-        return defprops.cell.iconStyle;
-      }
-    },
-    // 右侧箭头图标的样式
-    rightIconStyle: {
-      type: [Object, String],
-      default: () => {
-        return defprops.cell.rightIconStyle;
-      }
-    },
-    // 标题的样式
-    titleStyle: {
-      type: [Object, String],
-      default: () => {
-        return defprops.cell.titleStyle;
-      }
-    },
-    // 单位元的大小，可选值为large
-    size: {
-      type: String,
-      default: defprops.cell.size
-    },
-    // 点击cell是否阻止事件传播
-    stop: {
-      type: Boolean,
-      default: defprops.cell.stop
-    },
-    // 标识符，cell被点击时返回
-    name: {
-      type: [Number, String],
-      default: defprops.cell.name
-    }
-  }
-};

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

@@ -1,98 +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-cell__body {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  /* #ifndef APP-NVUE */
-  box-sizing: border-box;
-  /* #endif */
-  padding: 10px 15px;
-  font-size: 15px;
-  color: var(--u-main-color);
-  align-items: center;
-}
-.u-cell__body__content {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-  flex: 1;
-}
-.u-cell__body--large {
-  padding-top: 13px;
-  padding-bottom: 13px;
-}
-.u-cell__left-icon-wrap, .u-cell__right-icon-wrap {
-  /* #ifndef APP-NVUE */
-  display: flex;
-  /* #endif */
-  flex-direction: row;
-  align-items: center;
-  font-size: 16px;
-}
-.u-cell__left-icon-wrap {
-  margin-right: 4px;
-}
-.u-cell__right-icon-wrap {
-  margin-left: 4px;
-  transition: transform 0.3s;
-}
-.u-cell__right-icon-wrap--up {
-  transform: rotate(-90deg);
-}
-.u-cell__right-icon-wrap--down {
-  transform: rotate(90deg);
-}
-.u-cell__title {
-  flex: 1;
-}
-.u-cell__title-text {
-  font-size: 15px;
-  line-height: 22px;
-  color: var(--u-main-color);
-}
-.u-cell__title-text--large {
-  font-size: 16px;
-}
-.u-cell__label {
-  margin-top: 5px;
-  font-size: 12px;
-  color: var(--u-tips-color);
-  line-height: 18px;
-}
-.u-cell__label--large {
-  font-size: 14px;
-}
-.u-cell__value {
-  text-align: right;
-  font-size: 14px;
-  line-height: 24px;
-  color: var(--u-content-color);
-}
-.u-cell__value--large {
-  font-size: 15px;
-}
-.u-cell--clickable {
-  background-color: var(--u-bg-color);
-}
-.u-cell--disabled {
-  color: #c8c9cc;
-  /* #ifndef APP-NVUE */
-  cursor: not-allowed;
-  /* #endif */
-}
-.u-cell--center {
-  align-items: center;
-}

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

@@ -1,127 +0,0 @@
-@import '../../libs/css/components.scss';
-
-$u-cell-padding: 10px 15px !default;
-$u-cell-font-size: 15px !default;
-$u-cell-line-height: 24px !default;
-$u-cell-color: $u-main-color !default;
-$u-cell-icon-size: 16px !default;
-$u-cell-title-font-size: 15px !default;
-$u-cell-title-line-height: 22px !default;
-$u-cell-title-color: $u-main-color !default;
-$u-cell-label-font-size: 12px !default;
-$u-cell-label-color: $u-tips-color !default;
-$u-cell-label-line-height: 18px !default;
-$u-cell-value-font-size: 14px !default;
-$u-cell-value-color: $u-content-color !default;
-$u-cell-clickable-color: $u-bg-color !default;
-$u-cell-disabled-color: #c8c9cc !default;
-$u-cell-padding-top-large: 13px !default;
-$u-cell-padding-bottom-large: 13px !default;
-$u-cell-value-font-size-large: 15px !default;
-$u-cell-label-font-size-large: 14px !default;
-$u-cell-title-font-size-large: 16px !default;
-$u-cell-left-icon-wrap-margin-right: 4px !default;
-$u-cell-right-icon-wrap-margin-left: 4px !default;
-$u-cell-title-flex: 1 !default;
-$u-cell-label-margin-top: 5px !default;
-
-.u-cell {
-  &__body {
-    @include flex();
-    /* #ifndef APP-NVUE */
-    box-sizing: border-box;
-    /* #endif */
-    padding: $u-cell-padding;
-    font-size: $u-cell-font-size;
-    color: $u-cell-color;
-    // line-height: $u-cell-line-height;
-    align-items: center;
-
-    &__content {
-      @include flex(row);
-      align-items: center;
-      flex: 1;
-    }
-
-    &--large {
-      padding-top: $u-cell-padding-top-large;
-      padding-bottom: $u-cell-padding-bottom-large;
-    }
-  }
-
-  &__left-icon-wrap,
-  &__right-icon-wrap {
-    @include flex();
-    align-items: center;
-    // height: $u-cell-line-height;
-    font-size: $u-cell-icon-size;
-  }
-
-  &__left-icon-wrap {
-    margin-right: $u-cell-left-icon-wrap-margin-right;
-  }
-
-  &__right-icon-wrap {
-    margin-left: $u-cell-right-icon-wrap-margin-left;
-    transition: transform 0.3s;
-
-    &--up {
-      transform: rotate(-90deg);
-    }
-
-    &--down {
-      transform: rotate(90deg);
-    }
-  }
-
-  &__title {
-    flex: $u-cell-title-flex;
-
-    &-text {
-      font-size: $u-cell-title-font-size;
-      line-height: $u-cell-title-line-height;
-      color: $u-cell-title-color;
-
-      &--large {
-        font-size: $u-cell-title-font-size-large;
-      }
-    }
-  }
-
-  &__label {
-    margin-top: $u-cell-label-margin-top;
-    font-size: $u-cell-label-font-size;
-    color: $u-cell-label-color;
-    line-height: $u-cell-label-line-height;
-
-    &--large {
-      font-size: $u-cell-label-font-size-large;
-    }
-  }
-
-  &__value {
-    text-align: right;
-    font-size: $u-cell-value-font-size;
-    line-height: $u-cell-line-height;
-    color: $u-cell-value-color;
-
-    &--large {
-      font-size: $u-cell-value-font-size-large;
-    }
-  }
-
-  &--clickable {
-    background-color: $u-cell-clickable-color;
-  }
-
-  &--disabled {
-    color: $u-cell-disabled-color;
-    /* #ifndef APP-NVUE */
-    cursor: not-allowed;
-    /* #endif */
-  }
-
-  &--center {
-    align-items: center;
-  }
-}

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

@@ -1,125 +0,0 @@
-<template>
-  <view
-    class="u-cell"
-    :class="[customClass]"
-    :style="[$u.addStyle(customStyle)]"
-    :hover-class="!disabled && (clickable || isLink) ? 'u-cell--clickable' : ''"
-    :hover-stay-time="250"
-    @tap="clickHandler"
-  >
-    <view class="u-cell__body" :class="[center && 'u-cell--center', size === 'large' && 'u-cell__body--large']">
-      <view class="u-cell__body__content">
-        <view class="u-cell__left-icon-wrap" v-if="$slots.icon || icon">
-          <slot name="icon" v-if="$slots.icon"></slot>
-          <u-icon v-else :name="icon" :custom-style="iconStyle" :size="size === 'large' ? 22 : 18"></u-icon>
-        </view>
-        <view class="u-cell__title">
-          <slot name="title">
-            <text
-              v-if="title"
-              class="u-cell__title-text"
-              :style="[titleTextStyle]"
-              :class="[disabled && 'u-cell--disabled', size === 'large' && 'u-cell__title-text--large']"
-            >
-              {{ title }}
-            </text>
-          </slot>
-          <slot name="label">
-            <text
-              class="u-cell__label"
-              v-if="label"
-              :class="[disabled && 'u-cell--disabled', size === 'large' && 'u-cell__label--large']"
-            >
-              {{ label }}
-            </text>
-          </slot>
-        </view>
-      </view>
-      <slot name="value">
-        <text
-          class="u-cell__value"
-          :class="[disabled && 'u-cell--disabled', size === 'large' && 'u-cell__value--large']"
-          v-if="!$u.test.empty(value)"
-        >
-          {{ value }}
-        </text>
-      </slot>
-      <view
-        class="u-cell__right-icon-wrap"
-        v-if="$slots['right-icon'] || isLink"
-        :class="[`u-cell__right-icon-wrap--${arrowDirection}`]"
-      >
-        <slot name="right-icon" v-if="$slots['right-icon']"></slot>
-        <u-icon
-          v-else
-          :name="rightIcon"
-          :custom-style="rightIconStyle"
-          :color="disabled ? '#c8c9cc' : 'info'"
-          :size="size === 'large' ? 18 : 16"
-        ></u-icon>
-      </view>
-    </view>
-    <u-line v-if="border"></u-line>
-  </view>
-</template>
-<script>
-import props from './props.js';
-import mpMixin from '../../libs/mixin/mpMixin.js';
-import mixin from '../../libs/mixin/mixin.js';
-/**
- * cell  单元格
- * @description cell单元格一般用于一组列表的情况，比如个人中心页，设置页等。
- * @tutorial https://uviewui.com/components/cell.html
- * @property {String | Number}	title			标题
- * @property {String | Number}	label			标题下方的描述信息
- * @property {String | Number}	value			右侧的内容
- * @property {String}			icon			左侧图标名称，或者图片链接(本地文件建议使用绝对地址)
- * @property {Boolean}			disabled		是否禁用cell
- * @property {Boolean}			border			是否显示下边框 (默认 true )
- * @property {Boolean}			center			内容是否垂直居中(主要是针对右侧的value部分) (默认 false )
- * @property {String}			url				点击后跳转的URL地址
- * @property {String}			linkType		链接跳转的方式，内部使用的是uView封装的route方法，可能会进行拦截操作 (默认 'navigateTo' )
- * @property {Boolean}			clickable		是否开启点击反馈(表现为点击时加上灰色背景) （默认 false ）
- * @property {Boolean}			isLink			是否展示右侧箭头并开启点击反馈 （默认 false ）
- * @property {Boolean}			required		是否显示表单状态下的必填星号(此组件可能会内嵌入input组件) （默认 false ）
- * @property {String}			rightIcon		右侧的图标箭头 （默认 'arrow-right'）
- * @property {String}			arrowDirection	右侧箭头的方向，可选值为：left，up，down
- * @property {Object | String}			rightIconStyle	右侧箭头图标的样式
- * @property {Object | String}			titleStyle		标题的样式
- * @property {Object | String}			iconStyle		左侧图标样式
- * @property {String}			size			单位元的大小，可选值为 large，normal，mini
- * @property {Boolean}			stop			点击cell是否阻止事件传播 (默认 true )
- * @property {Object}			customStyle		定义需要用到的外部样式
- *
- * @event {Function}			click			点击cell列表时触发
- * @example 该组件需要搭配cell-group组件使用，见官方文档示例
- */
-export default {
-  name: 'u-cell',
-  data() {
-    return {};
-  },
-  mixins: [mpMixin, mixin, props],
-  computed: {
-    titleTextStyle() {
-      return uni.$u.addStyle(this.titleStyle);
-    }
-  },
-  methods: {
-    // 点击cell
-    clickHandler(e) {
-      if (this.disabled) return;
-      this.$emit('click', {
-        name: this.name
-      });
-      // 如果配置了url(此props参数通过mixin引入)参数，跳转页面
-      this.openPage();
-      // 是否阻止事件传播
-      this.stop && this.preventEvent(e);
-    }
-  }
-};
-</script>
-<style scoped>
-@import './style.css';
-</style>

package/uview-ui/components/u-cell-group/props.js

@@ -1,15 +0,0 @@
-import defprops from '../../libs/config/props';
-export default {
-  props: {
-    // 分组标题
-    title: {
-      type: String,
-      default: defprops.cellGroup.title
-    },
-    // 是否显示外边框
-    border: {
-      type: Boolean,
-      default: defprops.cellGroup.border
-    }
-  }
-};

package/uview-ui/components/u-cell-group/style.css

@@ -1,25 +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-cell-group {
-  flex: 1;
-}
-.u-cell-group__title {
-  padding: 16px 16px 8px;
-}
-.u-cell-group__title__text {
-  font-size: 15px;
-  line-height: 16px;
-  color: var(--u-main-color);
-}
-.u-cell-group__wrapper {
-  position: relative;
-}