hy-app 0.6.8 → 0.7.0

package/components/hy-tabs/index.scss

@@ -62,17 +62,17 @@
         width: 30px;
         position: absolute;
         bottom: 2px;
-        border-radius: $hy-border-radius-semicircle;
+        border-radius: $hy-radius-semicircle;
         transition-property: transform;
         transition-duration: 300ms;
       }
     }
   }
+}
 
-  .swiper-item {
-    width: 100%;
-    height: 100%;
-    @include flex(column);
-    box-sizing: border-box;
-  }
+.swiper-item {
+  width: 100%;
+  height: 100%;
+  @include flex(column);
+  box-sizing: border-box;
 }

package/components/hy-tabs/typing.d.ts

@@ -1,33 +1,41 @@
-import BadgeProps from '../hy-badge/typing'
-export interface TabsItemVo extends AnyObject {
-    /**
-     * @description tab名称
-     * */
-    name: string
-    /**
-     * @description 徽标接收的props
-     * */
-    badge?: BadgeProps
-    /**
-     * @description 是否禁用
-     * */
-    disabled?: boolean
-    /**
-     * @description swiper内容值
-     * */
-    content?: any
-}
-
-export interface TabsParamsVo extends TabsParamsVo {
-    index: number
-}
-export interface ITabsEmits {
-    /** 点击标签时触发 */
-    (e: 'click', params: TabsParamsVo): void
-    /** 标签索引改变时触发 */
-    (e: 'change', item: TabsItemVo, index: number): void
-    /** 长按标签时触发 */
-    (e: 'longPress', params: TabsParamsVo): void
-    /** 标签索引改变时触发 */
-    (e: 'update:current', index: number): void
-}
+import type { HyBadgeProps } from '../../index'
+export interface TabsItemVo {
+    /**
+     * tab名称
+     * */
+    name: string
+    /**
+     * 徽标接收的props
+     * */
+    badge?: HyBadgeProps
+    /**
+     * 是否禁用
+     * */
+    disabled?: boolean
+    /**
+     * swiper内容值
+     * */
+    content?: any
+    [key: string]: any
+}
+
+export interface ITabsExpose {
+    /**
+     * 计算滑块距离左边距离
+     * */
+    resize: () => void
+}
+
+export interface TabsParamsVo extends TabsParamsVo {
+    index: number
+}
+export interface ITabsEmits {
+    /** 点击标签时触发 */
+    (e: 'click', params: TabsParamsVo): void
+    /** 标签索引改变时触发 */
+    (e: 'change', item: TabsItemVo, index: number): void
+    /** 长按标签时触发 */
+    (e: 'longPress', params: TabsParamsVo): void
+    /** 标签索引改变时触发 */
+    (e: 'update:current', index: number): void
+}

package/components/hy-tag/index.scss

@@ -88,7 +88,7 @@ $hy-background--disabled);
 
   /* 关闭按钮 */
   @include e(close) {
-    border-radius: $hy-border-radius-semicircle;
+    border-radius: $hy-radius-semicircle;
     background-color: #C6C7CB;
     margin-left: $hy-border-margin-padding-sm;
     @include flex(row);

package/components/hy-textarea/hy-textarea.vue

@@ -125,7 +125,7 @@ const textareaStyle = computed(() => {
     return Object.assign(style, props.customStyle)
 })
 /**
- * @description 边框颜色
+ * 边框颜色
  * */
 const borderStyle = computed(() => {
     return (isFocus: boolean) => {
@@ -173,7 +173,7 @@ const onInput = (e: any) => {
     })
 }
 /**
- * @description 内容发生变化，进行处理
+ * 内容发生变化，进行处理
  * */
 const valueChange = () => {
     const value = innerValue.value

package/components/hy-textarea/index.scss

@@ -2,7 +2,7 @@
 @use "../../libs/css/mixin" as *;
 
 @include b(textarea) {
-  border-radius: $hy-border-radius-sm;
+  border-radius: $hy-radius-sm;
   position: relative;
   @include flex;
   flex: 1;
@@ -13,11 +13,11 @@
   }
 
   @include e(radius) {
-    border-radius: $hy-border-radius-sm;
+    border-radius: $hy-radius-sm;
   }
 
   @include e(no-radius) {
-    border-radius: $hy-border-radius-no;
+    border-radius: $hy-radius-no;
   }
 
   @include e(disabled) {
@@ -48,6 +48,6 @@
     font-size: 12px;
     background-color: $hy-background--3;
     padding: 1px 4px;
-    border-radius: $hy-border-radius-sm;
+    border-radius: $hy-radius-sm;
   }
 }

package/components/hy-textarea/typing.d.ts

@@ -3,6 +3,10 @@ import type {
     InputOnConfirmEvent,
     InputOnFocusEvent
 } from '@uni-helper/uni-types'
+import type { ExtractPropTypes } from 'vue'
+import type textareaProps from './props'
+
+export interface HyTextareaProps extends ExtractPropTypes<typeof textareaProps> {}
 
 export interface ITextareaEmits {
     /** 输入框失去焦点时触发 */

package/components/hy-toast/hy-toast.vue

@@ -1,8 +1,8 @@
 <template>
     <hy-overlay
         :show="isShow"
-        :zIndex="tmpConfig.overlay ? 10070 : -1"
-        :LockScroll="false"
+        :LockScroll="!tmpConfig.overlay"
+        :opacity="tmpConfig.cover ? 0.5 : 0"
         :custom-style="overlayStyle"
     >
         <view :style="[contentStyle]" :class="contentClass">
@@ -18,7 +18,13 @@
                 v-else-if="iconNameCom"
                 :class="['hy-toast__content--icon', `hy-toast__content--icon__${tmpConfig.type}`]"
             >
-                <hy-icon :name="iconNameCom" size="17" color="#FFFFFF"></hy-icon>
+                <hy-icon
+                    :name="iconNameCom"
+                    :size="(typeof tmpConfig.icon === 'object' && tmpConfig.icon?.size) || 17"
+                    :color="
+                        (typeof tmpConfig.icon === 'object' && tmpConfig.icon?.color) || '#FFFFFF'
+                    "
+                ></hy-icon>
             </view>
             <text
                 :class="[
@@ -85,8 +91,6 @@ const overlayStyle = computed(() => {
         display: 'flex',
         flexDirection: 'column'
     }
-    // 将遮罩设置为100%透明度，避免出现灰色背景
-    style.backgroundColor = 'rgba(0, 0, 0, 0)'
     return style
 })
 
@@ -102,7 +106,11 @@ const iconNameCom = computed(() => {
             return ''
         }
     } else {
-        return tmpConfig.value.icon
+        const icon = tmpConfig.value.icon
+        if (typeof icon === 'string') {
+            return icon
+        }
+        return icon?.name
     }
 })
 

package/components/hy-toast/index.scss

@@ -23,7 +23,7 @@
     @include m(icon) {
       width: 60rpx;
       height: 60rpx;
-      border-radius: $hy-border-radius-semicircle;
+      border-radius: $hy-radius-semicircle;
       box-sizing: border-box;
       margin-right: $hy-border-margin-padding-base;
       display: flex;

package/components/hy-toast/typing.d.ts

@@ -1,38 +1,44 @@
+import type { HyIconProps } from '../hy-icon/typing'
+
 export default interface ToastOptions {
-  /**
-   * @description 显示文本
-   * */
-  message?: string;
-  /**
-   * @description 主题类型，primary，success，error，warning，info
-   * */
-  type?: HyApp.ThemeType | "";
-  /**
-   * @description toast出现的位置
-   * */
-  position?: HyApp.ColumnCenterType;
-  /**
-   * @description 显示的图标
-   * */
-  icon?: boolean | string;
-  /**
-   * @description 是否防止触摸穿透
-   * */
-  overlay?: boolean;
-  /**
-   * @description 是否加载中状态
-   * */
-  loading?: boolean;
-  /**
-   * @description 加载状态
-   * */
-  loadMode?: HyApp.LoadingMode;
-  /**
-   * @description 显示的时间，毫秒
-   * */
-  duration?: number;
-  /**
-   * @description 执行完后的回调函数
-   * */
-  complete?: Function | null;
+    /**
+     * 显示文本
+     * */
+    message?: string
+    /**
+     * 主题类型，primary，success，error，warning，info
+     * */
+    type?: HyApp.ThemeType | ''
+    /**
+     * toast出现的位置
+     * */
+    position?: HyApp.ColumnCenterType
+    /**
+     * 显示的图标
+     * */
+    icon?: boolean | string | HyIconProps
+    /**
+     * 是否防止触摸穿透
+     * */
+    overlay?: boolean
+    /**
+     * 是否显示透明遮罩层
+     * */
+    cover?: boolean
+    /**
+     * 是否加载中状态
+     * */
+    loading?: boolean
+    /**
+     * 加载状态
+     * */
+    loadMode?: HyApp.LoadingMode
+    /**
+     * 显示的时间，毫秒
+     * */
+    duration?: number
+    /**
+     * 执行完后的回调函数
+     * */
+    complete?: Function | null
 }

package/components/hy-tooltip/hy-tooltip.vue

@@ -2,7 +2,7 @@
     <view class="hy-tooltip">
         <hy-overlay
             :show="showTooltip && tooltipTop !== -10000 && overlay"
-            :customStyle="{ backgroundColor: 'rgba(0, 0, 0, 0)' }"
+            :opacity="0"
             @click="closeHandler"
         ></hy-overlay>
         <!-- 文本内容区域 -->

package/components/hy-tooltip/index.scss

@@ -8,7 +8,7 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
   position: relative;
   @include flex;
 
-  @include squareArrow(6px, $hy-tooltip--background-color, -1, $hy-box-shadow);
+  @include squareArrow(6px, $hy-tooltip--background-color, -1, $hy-shadow-base);
 
   @include edeep(popup) {
     position: absolute;
@@ -17,8 +17,8 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
     text-align: center;
     min-height: 36px;
     transition: opacity 0.2s;
-    box-shadow: $hy-box-shadow;
-    border-radius: $hy-border-radius-sm;
+    box-shadow: $hy-shadow-base;
+    border-radius: $hy-radius-sm;
   }
 
 
@@ -29,7 +29,7 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
 
   @include e(container) {
     position: relative;
-    border-radius: $hy-border-radius-sm;
+    border-radius: $hy-radius-sm;
   }
 
   @include e(inner) {
@@ -37,7 +37,7 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
     padding: $hy-border-margin-padding-base;
     line-height: 22px;
     z-index: $hy-tooltip--z-index;
-    border-radius: $hy-border-radius-sm;
+    border-radius: $hy-radius-sm;
     box-sizing: content-box;
     width: 200px;
   }
@@ -58,7 +58,7 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
       background-color: $hy-tooltip--background-color;
       position: relative;
       flex: 1;
-      border-radius: $hy-border-radius-sm;
+      border-radius: $hy-radius-sm;
       padding: 0;
       @include flex(row);
       align-items: center;
@@ -76,6 +76,7 @@ $hy-tooltip--background-color: rgb(50, 50, 51);
         @include m(text) {
           font-size: 13px;
           color: #ffffff;
+          white-space: nowrap;
         }
       }
     }

package/components/hy-tooltip/props.ts

@@ -21,7 +21,7 @@ const tooltipProps = {
     },
     /**
      * 指定 popover 的放置位置
-     * @values top,top-start,top-end,bottom,bottom-start,bottom-end,left,left-start,left-end,right,right-start,right-end
+     * @values top,bottom,left,right
      * */
     placement: {
         type: String,

package/components/hy-upload/hy-upload.vue

@@ -68,7 +68,10 @@
                     <!-- 删除图片图标 -->
 
                     <!-- 上传成功图标 -->
-                    <view class="hy-upload__success" v-if="item.status === 'success'">
+                    <view
+                        class="hy-upload__status hy-upload__success"
+                        v-if="item.status === 'success'"
+                    >
                         <view class="hy-upload__success--icon">
                             <hy-icon
                                 :name="IconConfig.CHECK_MASK"
@@ -77,6 +80,18 @@
                             ></hy-icon>
                         </view>
                     </view>
+                    <view
+                        class="hy-upload__status hy-upload__error"
+                        v-if="item.status === 'failed'"
+                    >
+                        <view class="hy-upload__success--icon">
+                            <hy-icon
+                                :name="IconConfig.CLOSE_CIRCLE"
+                                color="#ffffff"
+                                size="12"
+                            ></hy-icon>
+                        </view>
+                    </view>
                     <!-- 上传成功图标 -->
                 </view>
             </template>