stellar-ui-plus 1.23.2 → 1.23.3

package/components/ste-message-box/ATTRIBUTES.md

@@ -1,6 +1,18 @@
 #### Props
 | 属性名 | 说明  | 类型 | 默认值  | 可选值 | 支持版本 |
 | ----- | ----- | --- | ------- | ------ | -------- |
-| `selector` | 用于自定义插槽时的选择器 | `String` | `` | - | - |
+| `title` | 提示的标题 | `String` | `` | - | - |
+| `content` | 提示的内容 | `String` | `` | - | - |
+| `icon` | 提示区域显示图标，此时content会失效 | `String` | `` | - | - |
+| `showCancel` | 是否显示取消按钮 | `Boolean` | `true` | - | - |
+| `cancelText` | 提示的内容 | `String` | `取消` | - | - |
+| `cancelColor` | 取消按钮的文字颜色 | `String` | `#333333` | - | - |
+| `confirmText` | 确认按钮的文字，最多4个字符 | `String` | `确认` | - | - |
+| `confirmColor` | 确认按钮的文字颜色 | `String` | `#0090FF` | - | - |
+| `editable` | 是否显示输入框 | `Boolean` | `false` | - | - |
+| `placeholderText` | 显示输入框时的提示文本 | `String` | `` | - | - |
+| `confirm` | 点击确认的回调函数 | `Function` | `null` | - | - |
+| `cancel` | 点击取消的回调函数 | `Function` | `null` | - | - |
+| `complete` | 弹框关闭的回调函数（无论是确认关闭还是取消关闭） | `Function` | `null` | - | - |
 
 

package/components/ste-table-column/props.ts

@@ -11,6 +11,10 @@ const tableColumnProps = {
     minWidth: { type: [String, Number], default: '' },
     align: { type: String as PropType<AlignType>, default: 'left' },
     headerAlign: { type: String as PropType<AlignType>, default: 'left' },
+    /** 是否显示 popover（列级别配置，优先级高于表格级别的 isPopover） */
+    showPopover: { type: Boolean, default: undefined },
+    /** popover 显示行数（列级别配置，优先级高于表格级别的 popoverLine） */
+    popoverLine: { type: Number, default: undefined },
 };
 
 export type TableColumnProps = ExtractPropTypes<typeof tableColumnProps>;

package/components/ste-table-column/ste-table-column.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { computed, ref, watch, type CSSProperties, type Ref } from 'vue';
+import { computed, ref, watch, h, type CSSProperties, type Ref } from 'vue';
 import type { Obj } from '../../types';
 import propsData from './props';
 import utils from '../../utils/utils';
@@ -153,6 +153,16 @@ function cellClick(event: any) {
         changeCheck();
     }
 }
+
+// 计算最终是否使用 popover（列级别优先于表格级别）
+const finalShowPopover = computed(() => {
+    return props.showPopover !== undefined ? props.showPopover : parentProps.isPopover;
+});
+
+// 计算最终 popover 行数
+const finalPopoverLine = computed(() => {
+    return props.popoverLine !== undefined ? props.popoverLine : parentProps.popoverLine;
+});
 </script>
 
 <template>
@@ -169,15 +179,31 @@ function cellClick(event: any) {
             </view>
         </template>
         <template v-else>
-            <slot v-if="row[prop] || !$slots.empty">
+            <!-- 优先级1：text 插槽 - 纯文本内容，自动应用 popover -->
+            <template v-if="$slots.text">
+                <view class="cell-box">
+                    <template v-if="!finalShowPopover">
+                        <slot name="text" :row="row.row" :column="props"></slot>
+                    </template>
+                    <table-popover v-else :line="finalPopoverLine">
+                        <slot name="text" :row="row.row" :column="props"></slot>
+                    </table-popover>
+                </view>
+            </template>
+
+            <!-- 优先级2：default 插槽 - 完全自定义，不应用 popover -->
+            <slot v-else-if="row[prop] || !$slots.empty" :row="row.row" :column="props">
+                <!-- 优先级3：默认渲染 -->
                 <sub-table :rows="row[prop]" v-if="rowSpan" :border="cmpBorder" />
                 <view class="cell-box" v-else>
-                    <template v-if="!parentProps.isPopover">
+                    <template v-if="!finalShowPopover">
                         {{ cellText() }}
                     </template>
-                    <table-popover v-else :text="cellText()" :line="parentProps.popoverLine"></table-popover>
+                    <table-popover v-else :text="cellText()" :line="finalPopoverLine"></table-popover>
                 </view>
             </slot>
+
+            <!-- 空状态 -->
             <view class="cell-box" v-else>
                 <slot name="empty"><text>暂无数据</text></slot>
             </view>

package/components/ste-table-column/table-popover.vue

@@ -42,7 +42,7 @@ const checkTextOverflow = async () => {
     let textData = await utils.querySelector<false>('.measure-text', instance);
 
     if (containerData && textData && textData.width && containerData.width) {
-        isTextOverflow.value = textData.width > containerData.width * Number(props.line);
+        isTextOverflow.value = textData.width > containerData.width * Number(props.line) - 4;
     }
 };
 
@@ -125,14 +125,16 @@ const doHide = () => {
 <template>
     <view class="wrapper">
         <view class="ellipsis-box" @touchstart="handleTouchStart" @touchend="handleTouchEnd" @mousedown="handleTouchStart">
-            {{ text }}
+            <slot>{{ text }}</slot>
         </view>
         <!-- 不做展示，正常显示文字长度，用于判断是否超过长度 -->
-        <text class="measure-text">{{ text }}</text>
+        <text class="measure-text">
+            <slot>{{ text }}</slot>
+        </text>
 
         <view class="popover" :class="showPopover ? 'show' : 'hidden'" :style="{ left: popoverLeft + 'px', top: popoverTop + 'px' }" :animation="animationData">
             <view class="popover-content">
-                {{ text }}
+                <slot>{{ text }}</slot>
             </view>
             <view class="popover-arrow" :style="{ left: arrowLeft + '%' }"></view>
         </view>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "stellar-ui-plus",
-    "version": "1.23.2",
+    "version": "1.23.3",
     "description": "",
     "author": "",
     "license": "MIT",