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

package/uview-plus/components/u-column-notice/style.css

@@ -1,29 +1,3 @@
-/* #ifndef APP-NVUE */
-.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;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */
 .u-notice {
   /* #ifndef APP-NVUE */
   display: flex;

package/uview-plus/components/u-column-notice/style.scss

@@ -1,5 +1,3 @@
-@import '../../libs/css/components.scss';
-
 .u-notice {
   @include flex;
   align-items: center;

package/uview-plus/components/u-column-notice/u-column-notice.vue

@@ -38,7 +38,7 @@ import test from '../../libs/function/test';
 /**
  * ColumnNotice 滚动通知中的垂直滚动 内部组件
  * @description 该组件用于滚动通告场景，是其中的垂直滚动方式
- * @tutorial https://ijry.github.io/uview-plus/components/noticeBar.html
+ * @tutorial https://uview-plus.jiangruyi.com/components/noticeBar.html
  * @property {Array}			text 			显示的内容，字符串
  * @property {String}			icon 			是否显示左侧的音量图标 （ 默认 'volume' ）
  * @property {String}			mode 			通告模式，link-显示右箭头，closable-显示右侧关闭图标

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

@@ -1,9 +1,10 @@
 <template>
   <view @click="handleClick">
-    <slot>复制</slot>
+    <slot>{{ t('up.common.copy') }}</slot>
   </view>
 </template>
 <script>
+import { t } from '../../libs/i18n';
 export default {
   name: 'up-copy',
   props: {
@@ -17,16 +18,17 @@ export default {
     },
     notice: {
       type: String,
-      default: '复制成功'
+      default: t('up.common.copy') + t('up.common.success')
     }
   },
   emits: ['success'],
   methods: {
+    t,
     handleClick() {
       let content = this.content;
       if (!content) {
         uni.showToast({
-          title: '暂无',
+          title: t('up.common.none'),
           icon: 'none',
           duration: 2000
         });
@@ -42,7 +44,7 @@ export default {
         success: function () {
           if (that.alertStyle == 'modal') {
             uni.showModal({
-              title: '提示',
+              title: 'up.common.tip',
               content: that.notice
             });
           } else {
@@ -55,7 +57,7 @@ export default {
         },
         fail: function () {
           uni.showToast({
-            title: '复制失败',
+            title: t('up.common.copy') + t('up.common.fail'),
             icon: 'none',
             duration: 3000
           });

package/uview-plus/components/u-count-down/style.css

@@ -1,29 +1,3 @@
-/* #ifndef APP-NVUE */
-.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;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */
 .u-count-down__text {
   color: var(--u-content-color);
   font-size: 15px;

package/uview-plus/components/u-count-down/style.scss

@@ -1,4 +1,3 @@
-@import '../../libs/css/components.scss';
 $u-count-down-text-color: $u-content-color !default;
 $u-count-down-text-font-size: 15px !default;
 $u-count-down-text-line-height: 22px !default;

package/uview-plus/components/u-count-down/u-count-down.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="u-count-down">
-    <slot>
+    <slot :days="timeData.days" :hours="timeData.hours" :minutes="timeData.minutes" :seconds="timeData.seconds">
       <text class="u-count-down__text">{{ formattedTime }}</text>
     </slot>
   </view>
@@ -107,6 +107,7 @@ export default {
       this.remainTime = remain;
       // 根据剩余的毫秒时间，得出该有天，小时，分钟等的值，返回一个对象
       const timeData = parseTimeData(remain);
+      this.timeData = timeData;
       this.$emit('change', timeData);
       // 得出格式化后的时间
       this.formattedTime = parseFormat(this.format, timeData);

package/uview-plus/components/u-count-to/style.css

@@ -1,29 +1,3 @@
-/* #ifndef APP-NVUE */
-.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;
-  flex-grow: 0;
-  flex-basis: auto;
-  align-items: stretch;
-  align-content: flex-start;
-}
-/* #endif */
 .u-count-num {
   /* #ifndef APP-NVUE */
   display: inline-flex;

package/uview-plus/components/u-count-to/style.scss

@@ -1,5 +1,3 @@
-@import '../../libs/css/components.scss';
-
 .u-count-num {
   /* #ifndef APP-NVUE */
   display: inline-flex;

package/uview-plus/components/u-count-to/u-count-to.vue

@@ -18,7 +18,7 @@ import { addUnit } from '../../libs/function/index';
 /**
  * countTo 数字滚动
  * @description 该组件一般用于需要滚动数字到某一个值的场景，目标要求是一个递增的值。
- * @tutorial https://ijry.github.io/uview-plus/components/countTo.html
+ * @tutorial https://uview-plus.jiangruyi.com/components/countTo.html
  * @property {String | Number}	startVal	开始的数值，默认从0增长到某一个数（默认 0 ）
  * @property {String | Number}	endVal		要滚动的目标数值，必须 （默认 0 ）
  * @property {String | Number}	duration	滚动到目标数值的动画持续时间，单位为毫秒（ms） （默认 2000 ）

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

@@ -0,0 +1,214 @@
+.up-coupon {
+  position: relative;
+  overflow: hidden;
+  border-radius: 8rpx;
+  background: #ffebf0;
+  color: var(--u-main-color);
+}
+.up-coupon--coupon {
+  border-radius: 16rpx;
+  overflow: hidden;
+}
+.up-coupon--coupon::before {
+  content: "";
+  position: absolute;
+  left: -24rpx;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 48rpx;
+  height: 48rpx;
+  background-color: #fff;
+  border-radius: 50%;
+}
+.up-coupon--coupon::after {
+  content: "";
+  position: absolute;
+  right: -24rpx;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 48rpx;
+  height: 48rpx;
+  background-color: #fff;
+  border-radius: 50%;
+}
+.up-coupon--envelope {
+  border-radius: 16rpx;
+}
+.up-coupon--envelope::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  height: 20rpx;
+  background: repeating-linear-gradient(-45deg, #ffd000, #ffd000 10rpx, #ffa000 10rpx, #ffa000 20rpx);
+}
+.up-coupon--card {
+  border-radius: 16rpx;
+}
+.up-coupon {
+  width: 100%;
+}
+.up-coupon--small {
+  height: 160rpx;
+}
+.up-coupon--medium {
+  height: 180rpx;
+}
+.up-coupon--large {
+  height: 220rpx;
+}
+.up-coupon--disabled {
+  opacity: 0.5;
+}
+.up-coupon__content {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  height: 100%;
+  padding: 0 30rpx;
+  position: relative;
+  z-index: 2;
+}
+.up-coupon__amount {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  padding-left: 10rpx;
+  padding-right: 30rpx;
+  border-right: 1px dashed #ccc;
+}
+.up-coupon__amount-unit {
+  font-size: 24rpx;
+  font-weight: normal;
+}
+.up-coupon__amount-value {
+  font-size: 56rpx;
+  font-weight: bold;
+  color: red;
+  line-height: 1;
+  margin: 10rpx 0;
+}
+.up-coupon__amount-limit {
+  font-size: 24rpx;
+  opacity: 0.9;
+}
+.up-coupon__info {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  padding-left: 30rpx;
+}
+.up-coupon__info-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-bottom: 10rpx;
+}
+.up-coupon__info-desc {
+  font-size: 24rpx;
+  opacity: 0.9;
+  margin-bottom: 10rpx;
+}
+.up-coupon__info-time {
+  font-size: 20rpx;
+  opacity: 0.8;
+}
+.up-coupon__action {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+}
+.up-coupon__dots {
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 30rpx 0;
+  z-index: 1;
+}
+.up-coupon__dot {
+  width: 32rpx;
+  height: 32rpx;
+  background-color: #fff;
+  border-radius: 50%;
+  margin: 0 -16rpx;
+  z-index: 3;
+}
+.up-coupon__rope {
+  position: absolute;
+  top: -40rpx;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 80rpx;
+  height: 80rpx;
+  background: linear-gradient(to right, #ffd000, #ffa000);
+  border-radius: 40rpx 40rpx 0 0;
+  z-index: 1;
+}
+.up-coupon__rope::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: -20rpx;
+  width: 20rpx;
+  height: 40rpx;
+  background: linear-gradient(to bottom, #ffd000, #ffa000);
+  border-radius: 10rpx 0 0 10rpx;
+}
+.up-coupon__rope::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  right: -20rpx;
+  width: 20rpx;
+  height: 40rpx;
+  background: linear-gradient(to bottom, #ffd000, #ffa000);
+  border-radius: 0 10rpx 10rpx 0;
+}
+.up-coupon--primary {
+  background: linear-gradient(90deg, #43afff, #3b8cff);
+  color: #fff;
+}
+.up-coupon--primary .up-coupon__amount {
+  border-right: 1px dashed #eee;
+}
+.up-coupon--primary .up-coupon__amount-value {
+  color: #fff;
+}
+.up-coupon--success {
+  background: linear-gradient(90deg, #67dda9, #19be6b);
+  color: #fff !important;
+}
+.up-coupon--success .up-coupon__amount {
+  border-right: 1px dashed #eee;
+}
+.up-coupon--success .up-coupon__amount-value {
+  color: #fff;
+}
+.up-coupon--warning {
+  background: linear-gradient(90deg, #ff9739, #ff6a39);
+  color: #fff;
+}
+.up-coupon--warning .up-coupon__amount {
+  border-right: 1px dashed #eee;
+}
+.up-coupon--warning .up-coupon__amount-value {
+  color: #fff;
+}
+.up-coupon--error {
+  background: linear-gradient(90deg, #ff7070, #ff4747);
+  color: #fff;
+}
+.up-coupon--error .up-coupon__amount {
+  border-right: 1px dashed #eee;
+}
+.up-coupon--error .up-coupon__amount-value {
+  color: #fff;
+}

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

@@ -0,0 +1,246 @@
+.up-coupon {
+  position: relative;
+  overflow: hidden;
+  border-radius: 8rpx;
+  background: #ffebf0;
+  color: $u-main-color;
+
+  &--coupon {
+    border-radius: 16rpx;
+    overflow: hidden;
+
+    &::before {
+      content: '';
+      position: absolute;
+      left: -24rpx;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 48rpx;
+      height: 48rpx;
+      background-color: #fff;
+      border-radius: 50%;
+    }
+
+    &::after {
+      content: '';
+      position: absolute;
+      right: -24rpx;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 48rpx;
+      height: 48rpx;
+      background-color: #fff;
+      border-radius: 50%;
+    }
+  }
+
+  &--envelope {
+    border-radius: 16rpx;
+
+    &::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 0;
+      right: 0;
+      height: 20rpx;
+      background: repeating-linear-gradient(-45deg, #ffd000, #ffd000 10rpx, #ffa000 10rpx, #ffa000 20rpx);
+    }
+  }
+
+  &--card {
+    border-radius: 16rpx;
+  }
+
+  width: 100%;
+
+  &--small {
+    // width: 520rpx;
+    height: 160rpx;
+  }
+
+  &--medium {
+    // width: 600rpx;
+    height: 180rpx;
+  }
+
+  &--large {
+    // width: 700rpx;
+    height: 220rpx;
+  }
+
+  &--disabled {
+    opacity: 0.5;
+  }
+
+  &__content {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    height: 100%;
+    padding: 0 30rpx;
+    position: relative;
+    z-index: 2;
+  }
+
+  &__amount {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding-left: 10rpx;
+    padding-right: 30rpx;
+    border-right: 1px dashed #ccc;
+
+    &-unit {
+      font-size: 24rpx;
+      font-weight: normal;
+    }
+
+    &-value {
+      font-size: 56rpx;
+      font-weight: bold;
+      color: red;
+      line-height: 1;
+      margin: 10rpx 0;
+    }
+
+    &-limit {
+      font-size: 24rpx;
+      opacity: 0.9;
+    }
+  }
+
+  &__info {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding-left: 30rpx;
+
+    &-title {
+      font-size: 32rpx;
+      font-weight: bold;
+      margin-bottom: 10rpx;
+    }
+
+    &-desc {
+      font-size: 24rpx;
+      opacity: 0.9;
+      margin-bottom: 10rpx;
+    }
+
+    &-time {
+      font-size: 20rpx;
+      opacity: 0.8;
+    }
+  }
+
+  &__action {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &__dots {
+    position: absolute;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    padding: 30rpx 0;
+    z-index: 1;
+  }
+
+  &__dot {
+    width: 32rpx;
+    height: 32rpx;
+    background-color: #fff;
+    border-radius: 50%;
+    margin: 0 -16rpx;
+    z-index: 3;
+  }
+
+  &__rope {
+    position: absolute;
+    top: -40rpx;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80rpx;
+    height: 80rpx;
+    background: linear-gradient(to right, #ffd000, #ffa000);
+    border-radius: 40rpx 40rpx 0 0;
+    z-index: 1;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: -20rpx;
+      width: 20rpx;
+      height: 40rpx;
+      background: linear-gradient(to bottom, #ffd000, #ffa000);
+      border-radius: 10rpx 0 0 10rpx;
+    }
+
+    &::after {
+      content: '';
+      position: absolute;
+      top: 0;
+      right: -20rpx;
+      width: 20rpx;
+      height: 40rpx;
+      background: linear-gradient(to bottom, #ffd000, #ffa000);
+      border-radius: 0 10rpx 10rpx 0;
+    }
+  }
+
+  // 不同主题样式
+  &--primary {
+    background: linear-gradient(90deg, #43afff, #3b8cff);
+    color: #fff;
+    .up-coupon__amount {
+      border-right: 1px dashed #eee;
+    }
+    .up-coupon__amount-value {
+      color: #fff;
+    }
+  }
+
+  &--success {
+    background: linear-gradient(90deg, #67dda9, #19be6b);
+    color: #fff !important;
+    .up-coupon__amount {
+      border-right: 1px dashed #eee;
+    }
+    .up-coupon__amount-value {
+      color: #fff;
+    }
+  }
+
+  &--warning {
+    background: linear-gradient(90deg, #ff9739, #ff6a39);
+    color: #fff;
+    .up-coupon__amount {
+      border-right: 1px dashed #eee;
+    }
+    .up-coupon__amount-value {
+      color: #fff;
+    }
+  }
+
+  &--error {
+    background: linear-gradient(90deg, #ff7070, #ff4747);
+    color: #fff;
+    .up-coupon__amount {
+      border-right: 1px dashed #eee;
+    }
+    .up-coupon__amount-value {
+      color: #fff;
+    }
+  }
+}