uview-plus 3.3.41 → 3.3.42
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
|
@@ -271,7 +271,7 @@ export default {
|
|
|
271
271
|
'error', 'opensetting', 'launchapp', 'agreeprivacyauthorization'],
|
|
272
272
|
methods: {
|
|
273
273
|
addStyle,
|
|
274
|
-
clickHandler() {
|
|
274
|
+
clickHandler(e: any) {
|
|
275
275
|
// 非禁止并且非加载中，才能点击
|
|
276
276
|
if (!this.disabled && !this.loading) {
|
|
277
277
|
// 进行节流控制，每this.throttle毫秒内，只在开始处执行
|
|
@@ -279,6 +279,8 @@ export default {
|
|
|
279
279
|
this.$emit("click");
|
|
280
280
|
}, this.throttleTime);
|
|
281
281
|
}
|
|
282
|
+
// 是否阻止事件传播
|
|
283
|
+
this.stop && this.preventEvent(e)
|
|
282
284
|
},
|
|
283
285
|
// 下面为对接uniapp官方按钮开放能力事件回调的对接
|
|
284
286
|
getphonenumber(res: any) {
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<view
|
|
3
|
+
class="u-float-button" :class="class">
|
|
4
|
+
<view class="u-float-button__main" @click.stop="clickHandler" :style="{
|
|
5
|
+
backgroundColor: backgroundColor,
|
|
6
|
+
color: color,
|
|
7
|
+
flexDirection: 'row',
|
|
8
|
+
justifyContent: 'center',
|
|
9
|
+
alignItems: 'center',
|
|
10
|
+
width: width,
|
|
11
|
+
height: height,
|
|
12
|
+
position: 'absolute',
|
|
13
|
+
bottom: bottom,
|
|
14
|
+
right: right,
|
|
15
|
+
borderRadius: '50%',
|
|
16
|
+
borderColor: borderColor,
|
|
17
|
+
}">
|
|
18
|
+
<slot :showList="showList">
|
|
19
|
+
<up-icon :class="{'show-list': showList}" name="plus" :color="color"></up-icon>
|
|
20
|
+
</slot>
|
|
21
|
+
<slot name="list">
|
|
22
|
+
<view class="u-float-button__list" :style="{
|
|
23
|
+
bottom: bottom,
|
|
24
|
+
right: right
|
|
25
|
+
}">
|
|
26
|
+
<template v-for="item in list">
|
|
27
|
+
<view class="u-float-button__item" :style="{
|
|
28
|
+
backgroundColor: item?.bgColor || bgColor,
|
|
29
|
+
color: item?.color || color,
|
|
30
|
+
flexDirection: 'row',
|
|
31
|
+
justifyContent: 'center',
|
|
32
|
+
alignItems: 'center',
|
|
33
|
+
width: width,
|
|
34
|
+
height: height,
|
|
35
|
+
borderRadius: '50%',
|
|
36
|
+
borderColor: item?.borderColor || borderColor,
|
|
37
|
+
}" @click="itemClick(item, index)">
|
|
38
|
+
<up-icon :name="item.name" :color="item?.color || color"></up-icon>
|
|
39
|
+
</view>
|
|
40
|
+
</template>
|
|
41
|
+
</view>
|
|
42
|
+
</slot>
|
|
43
|
+
</view>
|
|
44
|
+
</view>
|
|
45
|
+
</template>
|
|
46
|
+
|
|
47
|
+
<script>
|
|
48
|
+
import { mpMixin } from '../../libs/mixin/mpMixin';
|
|
49
|
+
import { mixin } from '../../libs/mixin/mixin';
|
|
50
|
+
import { addStyle, addUnit, deepMerge } from '../../libs/function/index';
|
|
51
|
+
/**
|
|
52
|
+
* FloatButton 悬浮按钮
|
|
53
|
+
* @description 悬浮按钮常用于屏幕右下角点击展开的操作菜单
|
|
54
|
+
* @tutorial https://ijry.github.io/uview-plus/components/floatButton.html
|
|
55
|
+
* @property {String} bgColor 背景颜色
|
|
56
|
+
* @event {Function} click 点击触发事件
|
|
57
|
+
* @example <up-view></up-view>
|
|
58
|
+
*/
|
|
59
|
+
export default {
|
|
60
|
+
name: 'u-float-button',
|
|
61
|
+
// #ifdef MP
|
|
62
|
+
mixins: [mpMixin, mixin],
|
|
63
|
+
// #endif
|
|
64
|
+
// #ifndef MP
|
|
65
|
+
mixins: [mpMixin, mixin],
|
|
66
|
+
// #endif
|
|
67
|
+
emits: ['click', 'item-click'],
|
|
68
|
+
computed: {
|
|
69
|
+
valueStyle() {}
|
|
70
|
+
},
|
|
71
|
+
props: {
|
|
72
|
+
bgColor: '#2979ff',
|
|
73
|
+
color: '#fff',
|
|
74
|
+
width: '50px',
|
|
75
|
+
height: '50px',
|
|
76
|
+
borderColor: '',
|
|
77
|
+
right: '80px',
|
|
78
|
+
bottom: '100px',
|
|
79
|
+
isMenu: false
|
|
80
|
+
},
|
|
81
|
+
data() {
|
|
82
|
+
return {
|
|
83
|
+
showList: false
|
|
84
|
+
}
|
|
85
|
+
},
|
|
86
|
+
methods: {
|
|
87
|
+
addStyle,
|
|
88
|
+
clickHandler(e) {
|
|
89
|
+
if (this.isMenu) {
|
|
90
|
+
this.showList = !this.showList
|
|
91
|
+
} else {
|
|
92
|
+
this.$emit('click', e)
|
|
93
|
+
}
|
|
94
|
+
},
|
|
95
|
+
itemClick(item, index) {
|
|
96
|
+
this.$emit('item-click', {
|
|
97
|
+
...item,
|
|
98
|
+
index
|
|
99
|
+
})
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
</script>
|
|
104
|
+
|
|
105
|
+
<style lang="scss" scoped>
|
|
106
|
+
@import '../../libs/css/components.scss';
|
|
107
|
+
|
|
108
|
+
.u-float-button {
|
|
109
|
+
.show-list {
|
|
110
|
+
transform: rotate(45deg);
|
|
111
|
+
}
|
|
112
|
+
&__list {
|
|
113
|
+
position: absolute;
|
|
114
|
+
bottom: 0px;
|
|
115
|
+
display: flex;
|
|
116
|
+
flex-direction: column;
|
|
117
|
+
>view {
|
|
118
|
+
margin: 5px 0px;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
</style>
|
|
@@ -274,7 +274,7 @@
|
|
|
274
274
|
// 触摸后第一次移动已经将status设置为moving状态，故触摸第二次移动不会触发本事件
|
|
275
275
|
if (this.status == 'start') this.$emit('start');
|
|
276
276
|
let touches = event.touches[0];
|
|
277
|
-
console.log('touchs', touches)
|
|
277
|
+
// console.log('touchs', touches)
|
|
278
278
|
// 滑块的左边不一定跟屏幕左边接壤，所以需要减去最外层父元素的左边值
|
|
279
279
|
let clientX = 0;
|
|
280
280
|
// #ifndef APP-NVUE
|