uview-plus 3.4.103 → 3.4.105
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/changelog.md
CHANGED
|
@@ -27,6 +27,11 @@ export const props = defineMixin({
|
|
|
27
27
|
type: String,
|
|
28
28
|
default: () => defProps.tooltip.bgColor
|
|
29
29
|
},
|
|
30
|
+
// 弹出提示框的背景色
|
|
31
|
+
popupBgColor: {
|
|
32
|
+
type: String,
|
|
33
|
+
default: () => defProps.tooltip.popupBgColor
|
|
34
|
+
},
|
|
30
35
|
// 弹出提示的方向,top-上方,bottom-下方
|
|
31
36
|
direction: {
|
|
32
37
|
type: String,
|
|
@@ -56,6 +61,11 @@ export const props = defineMixin({
|
|
|
56
61
|
showToast: {
|
|
57
62
|
type: Boolean,
|
|
58
63
|
default: () => defProps.tooltip.showToast
|
|
59
|
-
}
|
|
64
|
+
},
|
|
65
|
+
// 触发方式,可选值:longpress/click
|
|
66
|
+
triggerMode: {
|
|
67
|
+
type: String,
|
|
68
|
+
default: () => defProps.tooltip.triggerMode
|
|
69
|
+
},
|
|
60
70
|
}
|
|
61
71
|
})
|
|
@@ -9,18 +9,21 @@
|
|
|
9
9
|
@click="overlayClickHandler"
|
|
10
10
|
></u-overlay>
|
|
11
11
|
<view class="u-tooltip__wrapper">
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
12
|
+
<view class="u-tooltip__trigger" @click.stop="clickHander"
|
|
13
|
+
@longpress.stop="longpressHandler">
|
|
14
|
+
<slot name="trigger"></slot>
|
|
15
|
+
<text v-if="!$slots['trigger']"
|
|
16
|
+
class="u-tooltip__wrapper__text"
|
|
17
|
+
:id="textId"
|
|
18
|
+
:ref="textId"
|
|
19
|
+
:userSelect="false"
|
|
20
|
+
:selectable="false"
|
|
21
|
+
:style="{
|
|
22
|
+
color: color,
|
|
23
|
+
backgroundColor: bgColor && showTooltip && tooltipTop !== -10000 ? bgColor : 'transparent'
|
|
24
|
+
}"
|
|
25
|
+
>{{ text }}</text>
|
|
26
|
+
</view>
|
|
24
27
|
<u-transition
|
|
25
28
|
mode="fade"
|
|
26
29
|
:show="showTooltip"
|
|
@@ -44,44 +47,52 @@
|
|
|
44
47
|
:style="[indicatorStyle, {
|
|
45
48
|
width: addUnit(indicatorWidth),
|
|
46
49
|
height: addUnit(indicatorWidth),
|
|
50
|
+
backgroundColor: popupBgColor
|
|
47
51
|
}]"
|
|
48
52
|
>
|
|
49
53
|
<!-- 由于nvue不支持三角形绘制,这里就做一个四方形,再旋转45deg,得到露出的一个三角 -->
|
|
50
54
|
</view>
|
|
51
|
-
<view class="u-tooltip__wrapper__popup__list"
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
>
|
|
58
|
-
<text
|
|
59
|
-
class="u-tooltip__wrapper__popup__list__btn__text"
|
|
60
|
-
>复制</text>
|
|
61
|
-
</view>
|
|
62
|
-
<u-line
|
|
63
|
-
direction="column"
|
|
64
|
-
color="#8d8e90"
|
|
65
|
-
v-if="showCopy && buttons.length > 0"
|
|
66
|
-
length="18"
|
|
67
|
-
></u-line>
|
|
68
|
-
<block v-for="(item , index) in buttons" :key="index">
|
|
55
|
+
<view class="u-tooltip__wrapper__popup__list" :style="{
|
|
56
|
+
backgroundColor: popupBgColor,
|
|
57
|
+
color: color
|
|
58
|
+
}">
|
|
59
|
+
<slot name="content"></slot>
|
|
60
|
+
<template v-if="!$slots['content']">
|
|
69
61
|
<view
|
|
62
|
+
v-if="showCopy"
|
|
70
63
|
class="u-tooltip__wrapper__popup__list__btn"
|
|
71
64
|
hover-class="u-tooltip__wrapper__popup__list__btn--hover"
|
|
65
|
+
:style="{backgroundColor: popupBgColor}"
|
|
66
|
+
@tap="setClipboardData"
|
|
72
67
|
>
|
|
73
68
|
<text
|
|
74
69
|
class="u-tooltip__wrapper__popup__list__btn__text"
|
|
75
|
-
|
|
76
|
-
>{{ item }}</text>
|
|
70
|
+
>复制</text>
|
|
77
71
|
</view>
|
|
78
72
|
<u-line
|
|
79
73
|
direction="column"
|
|
80
74
|
color="#8d8e90"
|
|
81
|
-
v-if="
|
|
75
|
+
v-if="showCopy && buttons.length > 0"
|
|
82
76
|
length="18"
|
|
83
77
|
></u-line>
|
|
84
|
-
|
|
78
|
+
<block v-for="(item , index) in buttons" :key="index">
|
|
79
|
+
<view
|
|
80
|
+
class="u-tooltip__wrapper__popup__list__btn"
|
|
81
|
+
hover-class="u-tooltip__wrapper__popup__list__btn--hover"
|
|
82
|
+
>
|
|
83
|
+
<text
|
|
84
|
+
class="u-tooltip__wrapper__popup__list__btn__text"
|
|
85
|
+
@tap="btnClickHandler(index)"
|
|
86
|
+
>{{ item }}</text>
|
|
87
|
+
</view>
|
|
88
|
+
<u-line
|
|
89
|
+
direction="column"
|
|
90
|
+
color="#8d8e90"
|
|
91
|
+
v-if="index < buttons.length - 1"
|
|
92
|
+
length="18"
|
|
93
|
+
></u-line>
|
|
94
|
+
</block>
|
|
95
|
+
</template>
|
|
85
96
|
</view>
|
|
86
97
|
</view>
|
|
87
98
|
</u-transition>
|
|
@@ -101,17 +112,18 @@
|
|
|
101
112
|
* Tooltip
|
|
102
113
|
* @description
|
|
103
114
|
* @tutorial https://ijry.github.io/uview-plus/components/tooltip.html
|
|
104
|
-
* @property {String | Number} text
|
|
105
|
-
* @property {String | Number} copyText
|
|
106
|
-
* @property {String | Number} size
|
|
107
|
-
* @property {String} color
|
|
108
|
-
* @property {String} bgColor
|
|
109
|
-
* @property {String}
|
|
110
|
-
* @property {String
|
|
111
|
-
* @property {
|
|
112
|
-
* @property {
|
|
113
|
-
* @property {
|
|
114
|
-
* @property {
|
|
115
|
+
* @property {String | Number} text 需要显示的提示文字
|
|
116
|
+
* @property {String | Number} copyText 点击复制按钮时,复制的文本,为空则使用text值
|
|
117
|
+
* @property {String | Number} size 文本大小(默认 14 )
|
|
118
|
+
* @property {String} color 字体颜色(默认 '#606266' )
|
|
119
|
+
* @property {String} bgColor 弹出提示框时,文本的背景色(默认 'transparent' )
|
|
120
|
+
* @property {String} popupBgColor 弹出提示框的背景色
|
|
121
|
+
* @property {String} direction 弹出提示的方向,top-上方,bottom-下方(默认 'top' )
|
|
122
|
+
* @property {String | Number} zIndex 弹出提示的z-index,nvue无效(默认 10071 )
|
|
123
|
+
* @property {Boolean} showCopy 是否显示复制按钮(默认 true )
|
|
124
|
+
* @property {Array} buttons 扩展的按钮组
|
|
125
|
+
* @property {Boolean} overlay 是否显示透明遮罩以防止触摸穿透(默认 true )
|
|
126
|
+
* @property {Object} customStyle 定义需要用到的外部样式
|
|
115
127
|
*
|
|
116
128
|
* @event {Function}
|
|
117
129
|
* @example
|
|
@@ -199,10 +211,19 @@
|
|
|
199
211
|
init() {
|
|
200
212
|
this.getElRect()
|
|
201
213
|
},
|
|
214
|
+
// 点击触发事件
|
|
215
|
+
clickHander() {
|
|
216
|
+
if (this.triggerMode == 'click') {
|
|
217
|
+
this.tooltipTop = 0
|
|
218
|
+
this.showTooltip = true
|
|
219
|
+
}
|
|
220
|
+
},
|
|
202
221
|
// 长按触发事件
|
|
203
222
|
async longpressHandler() {
|
|
204
|
-
this.
|
|
205
|
-
|
|
223
|
+
if (this.triggerMode == 'longpress') {
|
|
224
|
+
this.tooltipTop = 0
|
|
225
|
+
this.showTooltip = true
|
|
226
|
+
}
|
|
206
227
|
},
|
|
207
228
|
// 点击透明遮罩
|
|
208
229
|
overlayClickHandler() {
|
|
@@ -298,6 +319,7 @@
|
|
|
298
319
|
|
|
299
320
|
&__list {
|
|
300
321
|
background-color: #060607;
|
|
322
|
+
color: #FFFFFF;
|
|
301
323
|
position: relative;
|
|
302
324
|
flex: 1;
|
|
303
325
|
border-radius: 5px;
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"id": "uview-plus",
|
|
3
3
|
"name": "uview-plus",
|
|
4
4
|
"displayName": "零云®uview-plus3.0重磅发布,全面的Vue3鸿蒙跨端移动组件库,组件丰富维护更新稳定。",
|
|
5
|
-
"version": "3.4.
|
|
5
|
+
"version": "3.4.105",
|
|
6
6
|
"description": "零云®uview-plus已兼容vue3,100+全面的组件和便捷的工具会让您信手拈来。近期新增拖动排序、条码、图片裁剪、下拉刷新、虚拟列表、签名等。",
|
|
7
7
|
"keywords": [
|
|
8
8
|
"uview",
|