@tplc/wot 1.0.7 → 1.0.8

package/components/wd-sort-button/index.scss

@@ -7,6 +7,7 @@
       color: $-dark-color;
     }
   }
+
 }
 
 @include b(sort-button) {
@@ -18,16 +19,16 @@
     .wd-sort-button__left {
       &::after {
         position: absolute;
-        bottom: 6px;
-        left: 50%;
+        content: '';
         width: 19px;
         height: 3px;
-        content: '';
+        bottom: 6px;
+        left: 50%;
+        transform: translate(-50%, 0);
         background: $-sort-button-line-color;
         border-radius: calc($-sort-button-line-height / 2);
+        transition: opacity .15s;
         opacity: 0;
-        transition: opacity 0.15s;
-        transform: translate(-50%, 0);
       }
 
       &.is-active::after {
@@ -54,6 +55,7 @@
       .wd-sort-button__right {
         justify-content: center;
       }
+
     }
   }
 
@@ -61,10 +63,11 @@
     display: inline-block;
     min-width: 14px;
     margin-left: 2px;
-    line-height: 1.1;
     vertical-align: middle;
+    line-height: 1.1;
 
     @include when(active) {
+
       :deep(.wd-sort-button__icon-up),
       :deep(.wd-sort-button__icon-down) {
         transform: scale(calc((10 / 14)));
@@ -83,4 +86,4 @@
     line-height: 1.1;
     transform: scale(calc((10 / 14))) translate(0, -7px);
   }
-}
+}

package/components/wd-sort-button/types.ts

@@ -37,7 +37,7 @@ export const sortButtonProps = {
    * 类型: boolean
    * 默认值: true
    */
-  line: makeBooleanProp(true),
+  line: makeBooleanProp(true)
 }
 
 export type SortButtonProps = ExtractPropTypes<typeof sortButtonProps>

package/components/wd-sort-button/wd-sort-button.vue

@@ -1,20 +1,12 @@
 <template>
-  <view
-    :class="`wd-sort-button ${line ? 'wd-sort-button--line' : ''} ${customClass}`"
-    :style="customStyle"
-    @click="handleClick"
-  >
+  <view :class="`wd-sort-button ${line ? 'wd-sort-button--line' : ''} ${customClass}`" :style="customStyle" @click="handleClick">
     <view class="wd-sort-button__wrapper">
       <view :class="`wd-sort-button__left ${modelValue !== 0 ? 'is-active' : ''}`">
         {{ title }}
       </view>
       <view :class="`wd-sort-button__right ${modelValue !== 0 ? 'is-active' : ''}`">
         <wd-icon v-if="modelValue !== 1" name="arrow-up" custom-class="wd-sort-button__icon-up" />
-        <wd-icon
-          v-if="modelValue !== -1"
-          name="arrow-down"
-          custom-class="wd-sort-button__icon-down"
-        />
+        <wd-icon v-if="modelValue !== -1" name="arrow-down" custom-class="wd-sort-button__icon-down" />
       </view>
     </view>
   </view>
@@ -26,12 +18,13 @@ export default {
   options: {
     addGlobalClass: true,
     virtualHost: true,
-    styleIsolation: 'shared',
-  },
+    styleIsolation: 'shared'
+  }
 }
 </script>
 
 <script lang="ts" setup>
+import wdIcon from '../wd-icon/wd-icon.vue'
 import { sortButtonProps } from './types'
 
 const props = defineProps(sortButtonProps)
@@ -67,10 +60,10 @@ function handleClick() {
   }
   emit('update:modelValue', value)
   emit('change', {
-    value,
+    value
   })
 }
 </script>
 <style lang="scss" scoped>
-@import './index';
+@import './index.scss';
 </style>

package/components/wd-status-tip/index.scss

@@ -11,20 +11,20 @@
 }
 
 @include b(status-tip) {
+  padding: $-statustip-padding;
+  width: 100%;
+  margin: 0 auto;
+  color: $-statustip-color;
+  font-size: $-statustip-fs;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   align-items: center;
-  width: 100%;
-  padding: $-statustip-padding;
-  margin: 0 auto;
-  font-size: $-statustip-fs;
-  color: $-statustip-color;
 
   @include edeep(image) {
+    margin: 0 auto;
     width: 160px;
     height: 160px;
-    margin: 0 auto;
   }
   @include e(text) {
     margin: 20px auto 0;
@@ -32,6 +32,6 @@
     line-height: $-statustip-line-height;
     color: $-statustip-color;
     text-align: center;
-    word-break: break-all;
+    overflow-wrap: break-word;
   }
-}
+}

package/components/wd-status-tip/types.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: weisheng
  * @Date: 2024-03-15 13:49:00
- * @LastEditTime: 2024-04-07 13:32:22
+ * @LastEditTime: 2024-09-19 14:45:29
  * @LastEditors: weisheng
  * @Description:
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-status-tip\types.ts
@@ -40,7 +40,7 @@ export const statusTipProps = {
    */
   imageSize: {
     type: [String, Number, Object] as PropType<string | number | ImageSize>,
-    default: '',
+    default: ''
   },
   /**
    * 提示文案。
@@ -54,6 +54,12 @@ export const statusTipProps = {
    * 默认值：'aspectFill'
    */
   imageMode: makeStringProp<ImageMode>('aspectFill'),
+  /**
+   * 图片路径前缀，指向图片所在目录，用于拼接图片 URL。推荐将图片放到自己的服务器上，并设置此属性。
+   * 类型: string
+   * 默认值: https://registry.npmmirror.com/wot-design-uni-assets/*\/files/
+   */
+  urlPrefix: makeStringProp('https://registry.npmmirror.com/wot-design-uni-assets/*/files/')
 }
 
 export type StatusTipProps = ExtractPropTypes<typeof statusTipProps>

package/components/wd-status-tip/wd-status-tip.vue

@@ -1,22 +1,18 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-06-12 10:04:19
- * @LastEditTime: 2024-04-07 14:01:12
+ * @LastEditTime: 2025-11-08 15:19:55
  * @LastEditors: weisheng
  * @Description: 
- * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-status-tip\wd-status-tip.vue
+ * @FilePath: /wot-design-uni/src/uni_modules/wot-design-uni/components/wd-status-tip/wd-status-tip.vue
  * 记得注释
 -->
 <template>
   <view :class="`wd-status-tip  ${customClass}`" :style="customStyle">
-    <wd-img
-      v-if="imgUrl"
-      :mode="imageMode"
-      :src="imgUrl"
-      custom-class="wd-status-tip__image"
-      :custom-style="imgStyle"
-    ></wd-img>
+    <slot name="image" v-if="$slots.image"></slot>
+    <wd-img v-else-if="imgUrl" :mode="imageMode" :src="imgUrl" custom-class="wd-status-tip__image" :custom-style="imgStyle"></wd-img>
     <view v-if="tip" class="wd-status-tip__text">{{ tip }}</view>
+    <slot name="bottom" />
   </view>
 </template>
 
@@ -26,12 +22,13 @@ export default {
   options: {
     addGlobalClass: true,
     virtualHost: true,
-    styleIsolation: 'shared',
-  },
+    styleIsolation: 'shared'
+  }
 }
 </script>
 
 <script lang="ts" setup>
+import wdImg from '../wd-img/wd-img.vue'
 import { computed, type CSSProperties } from 'vue'
 import { addUnit, isDef, isObj, objToStyle } from '../common/util'
 import { statusTipProps } from './types'
@@ -42,30 +39,10 @@ const props = defineProps(statusTipProps)
 const imgUrl = computed(() => {
   // 改用网络地址，避免小程序打包的时候统一打包进去导致包过大问题
   let img: string = ''
-  switch (props.image) {
-    case 'collect':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/collect.png'
-      break
-    case 'comment':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/comment.png'
-      break
-    case 'content':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/content.png'
-      break
-    case 'halo':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/halo.png'
-      break
-    case 'message':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/message.png'
-      break
-    case 'network':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/network.png'
-      break
-    case 'search':
-      img = 'https://qdll-lycs.oss-cn-nanjing.aliyuncs.com/staticSaas/basis/search.png'
-      break
-    default:
-      img = props.image
+  if (['search', 'network', 'content', 'collect', 'comment', 'halo', 'message'].includes(props.image)) {
+    img = `${props.urlPrefix}${props.image}.png`
+  } else {
+    img = props.image
   }
   return img
 })
@@ -82,7 +59,7 @@ const imgStyle = computed(() => {
     } else {
       style = {
         height: addUnit(props.imageSize),
-        width: addUnit(props.imageSize),
+        width: addUnit(props.imageSize)
       }
     }
   }
@@ -90,5 +67,5 @@ const imgStyle = computed(() => {
 })
 </script>
 <style lang="scss" scoped>
-@import './index';
+@import './index.scss';
 </style>

package/components/wd-step/index.scss

@@ -7,7 +7,7 @@
       background: $-dark-background2;
     }
 
-    @include e(content) {
+    @include e(content){
       color: $-dark-color3;
     }
 
@@ -29,14 +29,14 @@
       }
     }
 
-    :deep(.wd-step__icon-outer),
-    :deep(.wd-step__icon-inner) {
-      color: $-dark-color3;
+    :deep(.wd-step__icon-outer),:deep(.wd-step__icon-inner){
+      color: $-dark-color3; 
       border-color: $-dark-color-gray;
     }
   }
 }
 
+
 @include b(step) {
   position: relative;
   display: inline-block;
@@ -53,12 +53,12 @@
     }
   }
   @include e(icon) {
-    position: relative;
-    z-index: 1;
     display: inline-block;
+    position: relative;
     width: $-steps-icon-size;
     height: $-steps-icon-size;
     background: #fff;
+    z-index: 1;
 
     @include when(icon) {
       width: $-steps-is-icon-width;
@@ -67,10 +67,10 @@
     @include when(dot) {
       width: $-steps-dot-size;
       height: $-steps-dot-size;
-      margin-left: -1px;
-      background: transparent;
       border: 1px solid transparent;
+      margin-left: -1px;
       border-radius: 50%;
+      background: transparent;
     }
   }
   @include edeep(icon-inner) {
@@ -80,34 +80,34 @@
   @include e(icon-outer) {
     width: calc($-steps-icon-size - 2px);
     height: calc($-steps-icon-size - 2px);
-    font-size: $-steps-icon-text-fs;
-    line-height: calc($-steps-icon-size - 2px);
+    border: 1px solid $-steps-inactive-color;
     color: $-steps-inactive-color;
     text-align: center;
-    border: 1px solid $-steps-inactive-color;
+    line-height: calc($-steps-icon-size - 2px);
     border-radius: 50%;
+    font-size: $-steps-icon-text-fs;
   }
   @include e(line) {
     position: absolute;
-    top: 50%;
-    left: 0;
     width: 100%;
     height: 1px;
     background: $-steps-line-color;
     transform: scaleY(0.5);
+    top: 50%;
+    left: 0;
   }
   @include e(dot) {
     position: relative;
     display: block;
     width: 100%;
     height: 100%;
-    background: $-steps-line-color;
     border-radius: 50%;
+    background: $-steps-line-color;
   }
-  @include e(content) {
+  @include e(content){
     margin-top: 7px;
-    font-size: $-steps-label-fs;
     color: $-steps-inactive-color;
+    font-size: $-steps-label-fs;
   }
   @include e(title) {
     font-weight: $-steps-title-fw;
@@ -118,8 +118,8 @@
     }
   }
   @include e(description) {
-    padding: 0 2px;
     margin-top: 5px;
+    padding: 0 2px;
     color: $-steps-description-color;
   }
   @include when(wait) {
@@ -162,13 +162,13 @@
       &.is-dot {
         &::after {
           position: absolute;
-          top: -5px;
-          left: -5px;
+          content: '';
           width: $-steps-dot-size + 10px;
           height: $-steps-dot-size + 10px;
-          content: '';
-          background: $-steps-finished-color;
+          left: -5px;
+          top: -5px;
           border-radius: 50%;
+          background: $-steps-finished-color;
           opacity: 0.2;
         }
       }
@@ -178,8 +178,7 @@
     }
   }
   @include when(error) {
-    :deep(.wd-step__icon-inner),
-    .wd-step__title {
+    :deep(.wd-step__icon-inner), .wd-step__title {
       color: $-steps-error-color;
     }
     .wd-step__icon-outer {
@@ -194,8 +193,8 @@
     text-align: center;
 
     .wd-step__line {
-      right: -50%;
       left: 50%;
+      right: -50%;
     }
   }
   @include when(vertical) {
@@ -203,23 +202,23 @@
 
     .wd-step__header {
       position: absolute;
-      top: 0;
       left: 0;
+      top: 0;
       height: 100%;
 
       &.is-dot {
         top: 6px;
 
         .wd-step__line {
-          margin-top: 0;
           margin-left: -1px;
+          margin-top: 0;
         }
       }
     }
     .wd-step__content {
-      padding-bottom: 20px;
-      margin-top: 0;
       margin-left: 30px;
+      margin-top: 0;
+      padding-bottom: 20px;
     }
     .wd-step__line {
       top: 0;
@@ -229,8 +228,8 @@
       transform: scaleX(0.5);
     }
     .wd-step__icon.is-dot {
-      margin-top: -1px;
       margin-left: 0;
+      margin-top: -1px;
     }
   }
-}
+}

package/components/wd-step/types.ts

@@ -29,5 +29,5 @@ export const stepProps = {
    * 步骤状态，可选值为 'finished'（已完成）、'process'（进行中）、'error'（出错）。
    * 类型: string
    */
-  status: String as PropType<StepStatus>,
+  status: String as PropType<StepStatus>
 }

package/components/wd-step/wd-step.vue

@@ -7,9 +7,7 @@
     :style="rootStyle"
   >
     <view :class="`wd-step__header  ${dot ? 'is-dot' : ''}`">
-      <view
-        :class="`wd-step__icon  ${dot ? 'is-dot' : !!icon || $slots.icon ? 'is-icon' : 'is-text'}`"
-      >
+      <view :class="`wd-step__icon  ${dot ? 'is-dot' : !!icon || $slots.icon ? 'is-icon' : 'is-text'}`">
         <view v-if="dot" class="wd-step__dot"></view>
         <slot v-else-if="$slots.icon" name="icon" />
         <wd-icon v-else-if="icon" custom-class="wd-step__icon-inner" :name="icon" />
@@ -39,11 +37,12 @@ export default {
   options: {
     addGlobalClass: true,
     virtualHost: true,
-    styleIsolation: 'shared',
-  },
+    styleIsolation: 'shared'
+  }
 }
 </script>
 <script lang="ts" setup>
+import wdIcon from '../wd-icon/wd-icon.vue'
 import { computed } from 'vue'
 import { useParent } from '../composables/useParent'
 import { STEPS_KEY } from '../wd-steps/types'
@@ -71,13 +70,13 @@ const rootStyle = computed(() => {
     const { vertical, space } = steps.props
     if (vertical) {
       if (isDef(space)) {
-        style.height = space
+        style['height'] = space
       }
     } else {
-      style.width = space || 100 / steps.children.length + '%'
+      style['width'] = space || 100 / steps.children.length + '%'
     }
   }
-  return `${objToStyle(style)};${props.customStyle}`
+  return `${objToStyle(style)}${props.customStyle}`
 })
 
 const canAlignCenter = computed(() => {
@@ -147,5 +146,5 @@ function getCurrentTitle(currentStatus: string) {
 }
 </script>
 <style lang="scss" scoped>
-@import './index';
+@import './index.scss';
 </style>

package/components/wd-steps/index.scss

@@ -7,4 +7,4 @@
   @include when(vertical) {
     display: block;
   }
-}
+}

package/components/wd-steps/types.ts

@@ -47,7 +47,7 @@ export const stepsProps = {
    * 类型: boolean
    * 默认值: false
    */
-  alignCenter: makeBooleanProp(false),
+  alignCenter: makeBooleanProp(false)
 }
 
 export type StepsProps = ExtractPropTypes<typeof stepsProps>

package/components/wd-steps/wd-steps.vue

@@ -3,12 +3,12 @@
  * @Date: 2023-06-12 18:40:58
  * @LastEditTime: 2024-03-15 13:42:55
  * @LastEditors: weisheng
- * @Description: 
+ * @Description:
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-steps\wd-steps.vue
  * 记得注释
 -->
 <template>
-  <view :class="`wd-steps ${customClass} ${vertical ? 'is-vertical' : ''}`">
+  <view :class="`wd-steps ${customClass} ${vertical ? 'is-vertical' : ''}`" :style="customStyle">
     <slot />
   </view>
 </template>
@@ -18,8 +18,8 @@ export default {
   options: {
     addGlobalClass: true,
     virtualHost: true,
-    styleIsolation: 'shared',
-  },
+    styleIsolation: 'shared'
+  }
 }
 </script>
 <script lang="ts" setup>
@@ -33,5 +33,5 @@ const { linkChildren } = useChildren(STEPS_KEY)
 linkChildren({ props })
 </script>
 <style lang="scss" scoped>
-@import './index';
+@import './index.scss';
 </style>

package/components/wd-sticky/index.scss

@@ -6,4 +6,4 @@
   @include e(container) {
     display: inline-block;
   }
-}
+}

package/components/wd-sticky/types.ts

@@ -9,5 +9,5 @@ export const stickyProps = {
   /**
    * 吸顶距离
    */
-  offsetTop: makeNumberProp(0),
+  offsetTop: makeNumberProp(0)
 }