vhall-mini-sdk 0.3.1 → 0.4.0
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 +15 -22
- package/lib/components/announcement/announ-banner/index.js +5 -0
- package/lib/components/announcement/announ-banner/index.wxml +1 -1
- package/lib/components/announcement/announ-banner/index.wxss +1 -1
- package/lib/components/announcement/announ-icon/index.wxml +2 -2
- package/lib/components/announcement/index.js +7 -0
- package/lib/components/announcement/index.wxml +1 -1
- package/lib/components/chat/chat-item/chat-item.js +11 -5
- package/lib/components/chat/chat-item/chat-item.wxml +38 -0
- package/lib/components/chat/chat-item/chat-item.wxss +1 -1
- package/lib/components/chat/chat-list/chat-list.js +40 -2
- package/lib/components/chat/chat-list/chat-list.wxml +1 -1
- package/lib/components/chat/chat.js +4 -0
- package/lib/components/chat/chat.wxml +2 -3
- package/lib/components/chat/chat.wxss +1 -1
- package/lib/components/chat-recommend/index.js +113 -0
- package/lib/components/chat-recommend/index.json +4 -0
- package/lib/components/chat-recommend/index.wxml +10 -0
- package/lib/components/chat-recommend/index.wxss +1 -0
- package/lib/components/live-landscape/live-landscape.js +15 -0
- package/lib/components/live-landscape/live-landscape.json +2 -0
- package/lib/components/live-landscape/live-landscape.wxml +3 -1
- package/lib/components/live-portrait/live-portrait.js +14 -0
- package/lib/components/live-portrait/live-portrait.json +3 -1
- package/lib/components/live-portrait/live-portrait.wxml +4 -2
- package/lib/components/live-portrait/live-portrait.wxss +1 -1
- package/lib/components/lottery/lottery-shake/lottery-shake.js +6 -5
- package/lib/components/lottery/lottery-shake/lottery-shake.wxml +6 -1
- package/lib/components/lottery/lottery-slot/lottery-slot.js +9 -5
- package/lib/components/lottery/lottery-slot/lottery-slot.wxml +6 -1
- package/lib/components/lottery/lottery-wheel/lottery-wheel.js +16 -16
- package/lib/components/lottery/lottery-wheel/lottery-wheel.wxml +10 -4
- package/lib/components/lottery/lottery-wheel/lottery-wheel.wxss +1 -1
- package/lib/components/lottery/lottery.js +36 -16
- package/lib/components/lottery/lottery.wxml +5 -4
- package/lib/components/lottery/lottery.wxss +1 -1
- package/lib/components/player/components/main/index.wxml +2 -2
- package/lib/components/player/components/poster/poster.wxml +1 -1
- package/lib/components/player/components/poster/poster.wxss +1 -1
- package/lib/components/player/extensions/data.js +11 -1
- package/lib/components/player/extensions/methods.js +104 -3
- package/lib/components/player/extensions/observers.js +13 -8
- package/lib/components/player/player.wxml +16 -5
- package/lib/components/player/player.wxss +1 -1
- package/lib/components/product/product-card/product-card.js +9 -1
- package/lib/components/product/product-card/product-card.wxml +9 -16
- package/lib/components/product/product-card/product-card.wxss +1 -1
- package/lib/components/product/product-detail/product-detail.js +9 -1
- package/lib/components/product/product-item/product-item.js +14 -1
- package/lib/components/product/product-item/product-item.wxss +1 -1
- package/lib/components/product/product-list/product-list.wxml +1 -1
- package/lib/components/product/product-order/product-order.js +20 -13
- package/lib/components/product/product-order/product-order.wxss +1 -1
- package/lib/pubComponents/countdown/countdown.wxss +1 -1
- package/lib/pubComponents/popup/popup.js +1 -0
- package/lib/sdk/main/index.js +2 -2
- package/lib/sdk/player/index.js +1 -1
- package/lib/sdk/plugins/LotteryServer.js +1 -1
- package/lib/sdk/plugins/ProductServer.js +1 -1
- package/lib/shared/utils.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.live_portrait{display:flex;flex-direction:column;height:100%;overflow:hidden}.live_portrait .live_portrait_player{display:block;height:100%;width:100vw;z-index:0}.live_portrait .live_portrait_chat{bottom:0;height:32vh;left:0;position:absolute;right:0;z-index:100}.live_portrait .live_portrait_chat.live_back{bottom:80rpx}.live_portrait .live_portrait_chat.live_back .chat-edit{padding-bottom:0}.live_portrait .nochat-bar{bottom:constant(safe-area-inset-bottom);bottom:env(safe-area-inset-bottom);display:flex;flex-direction:row;height:32px;padding-bottom:10px;padding-right:16px;position:absolute;right:0;z-index:100}.live_portrait .live-portrait-tab{box-sizing:border-box;display:flex;flex:1;height:calc(100vh - 56.25vw);padding-bottom:env(safe-area-inset-bottom);width:100vw}.live_portrait .live-portrait-tab .tab-action{color:#fff!important}.live_portrait .live-portrait-tab .tab-content{height:100%;overflow:auto;width:100%}.live_portrait .live-portrait-tab .tab-chat{display:block;height:100%;width:100%}.live_portrait .live-portrait-tab .tab-introduction{display:block;padding:20rpx}.live_portrait .count_down{color:#fff;
|
|
1
|
+
.live_portrait{display:flex;flex-direction:column;height:100%;overflow:hidden}.live_portrait .live_portrait_player{display:block;height:100%;width:100vw;z-index:0}.live_portrait .live_portrait_chat{bottom:0;height:32vh;left:0;position:absolute;right:0;z-index:100}.live_portrait .live_portrait_chat.live_back{bottom:80rpx}.live_portrait .live_portrait_chat.live_back .chat-edit{padding-bottom:0}.live_portrait .nochat-bar{bottom:constant(safe-area-inset-bottom);bottom:env(safe-area-inset-bottom);display:flex;flex-direction:row;height:32px;padding-bottom:10px;padding-right:16px;position:absolute;right:0;z-index:100}.live_portrait .live-portrait-tab{box-sizing:border-box;display:flex;flex:1;height:calc(100vh - 56.25vw);padding-bottom:env(safe-area-inset-bottom);width:100vw}.live_portrait .live-portrait-tab .tab-action{color:#fff!important}.live_portrait .live-portrait-tab .tab-content{height:100%;overflow:auto;width:100%}.live_portrait .live-portrait-tab .tab-chat{display:block;height:100%;width:100%}.live_portrait .live-portrait-tab .tab-introduction{display:block;padding:20rpx}.live_portrait .count_down{align-items:center;background:rgba(0,0,0,.35);border-radius:60rpx;bottom:calc(100rpx + constant(safe-area-inset-bottom));bottom:calc(100rpx + env(safe-area-inset-bottom));color:#fff;display:inline-flex;left:50%;padding:0 32rpx;pointer-events:none;position:fixed;transform:translateX(-50%);white-space:nowrap;z-index:100}.live_portrait .menu_icon{align-items:center;background-color:rgba(0,0,0,.14);border-radius:50%;display:flex;height:2rem;justify-content:center;margin-right:16rpx;width:2rem}.live_portrait .menu_icon .menu_icon_image{height:100%;width:100%}.live_portrait .start_live_img{margin-bottom:20rpx;width:150rpx}.live_portrait .gift-display{left:0;position:fixed;top:60vh}.menu-dialog{box-sizing:border-box;height:70%;padding:20rpx}.menu-dialog .weui-half-screen-dialog__ft,.menu-dialog .weui-half-screen-dialog__hd{display:none}.menu-dialog .content-box{display:flex;height:100%}.menu-dialog .content-box .live-protrait-tab{flex:1}.menu-dialog .content-box .live-protrait-tab .tab-content{box-sizing:border-box;height:100%;overflow:auto}.count_down_cover{height:100vh;left:0;pointer-events:none;position:fixed;top:0;width:100vw;z-index:100}.start-dialog{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;padding-top:24rpx;width:520rpx}.start-dialog .light-button{border:none;color:#fb2626}.start-dialog .start-dialog-footer{margin-top:24rpx}.weui-dialog__btn{color:#fb2626!important}.dialog-content--expire{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;padding-top:24rpx;width:520rpx}.dialog-content--expire .dialog-image{margin-bottom:24rpx}.dialog-content--expire .dialog-image .image-item{width:200rpx}.dialog-content--expire .dialog-footer{margin-top:36rpx}.gift-button{align-items:center;background:rgba(6,6,6,.25);border-radius:50%;display:flex;justify-content:center;margin-right:16rpx;position:relative}.cart-button,.gift-button,.gift-icon{height:2rem;width:2rem}.cart-button{align-items:center;background:rgba(6,6,6,.25);border-radius:50%;display:flex;justify-content:center;margin-right:16rpx;position:relative}.cart-button .cart-icon{height:2rem;margin-top:-.8rem;width:2rem}.cart-button .cart-badge{align-items:center;background-color:#ff4757;border-radius:16rpx;color:#fff;display:flex;font-size:.79rem;font-weight:700;height:32rpx;justify-content:center;min-width:32rpx;padding:0 8rpx;position:absolute;right:-8rpx;top:-8rpx}.product-list-popup{display:flex;flex-direction:column;max-height:70vh;width:100%}.product-list-popup .popup-header{align-items:center;border-bottom:1rpx solid #f0f0f0;display:flex;justify-content:space-between;padding:24rpx 32rpx}.product-list-popup .popup-header .popup-title{color:#333;font-size:1.14rem;font-weight:700}.product-list-popup .popup-header .popup-count{color:#999;font-size:.93rem}.product-list-popup .product-scroll{flex:1;max-height:calc(70vh - 80rpx)}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
Component({
|
|
2
2
|
properties: {
|
|
3
3
|
remark: { type: String, value: '' },
|
|
4
|
-
// 抽奖 ID:用于区分不同抽奖的缓存 key
|
|
5
4
|
lotteryId: { type: String, value: '' },
|
|
5
|
+
lotteryType: { type: Number, value: 0 },
|
|
6
6
|
autoplay: { type: Boolean, value: false },
|
|
7
7
|
loop: { type: Boolean, value: false },
|
|
8
|
-
// 外部控制:true 开始摇晃,false 平滑停止(与转盘/老虎机一致)
|
|
9
8
|
running: {
|
|
10
9
|
type: Boolean,
|
|
11
10
|
value: false,
|
|
@@ -85,7 +84,7 @@ Component({
|
|
|
85
84
|
},
|
|
86
85
|
|
|
87
86
|
// 开始摇晃动画
|
|
88
|
-
spin() {
|
|
87
|
+
spin(triggerDraw = false) {
|
|
89
88
|
// 进行中或减速停止阶段,忽略重复点击,避免动画重复执行 / 重复上报抽奖
|
|
90
89
|
if (this.data.spinning || this.data.stopping) return;
|
|
91
90
|
this._clearTimers();
|
|
@@ -107,7 +106,9 @@ Component({
|
|
|
107
106
|
this._applyShake();
|
|
108
107
|
// 物理弹跳模拟
|
|
109
108
|
this._animFrame();
|
|
110
|
-
|
|
109
|
+
if (triggerDraw) {
|
|
110
|
+
this.triggerEvent('draw');
|
|
111
|
+
}
|
|
111
112
|
},
|
|
112
113
|
|
|
113
114
|
// 每帧更新球位置(物理碰撞 + 持续滚动 / 停止落定)
|
|
@@ -322,7 +323,7 @@ Component({
|
|
|
322
323
|
|
|
323
324
|
onDrawBtnTap() {
|
|
324
325
|
if (this.data.spinning) return;
|
|
325
|
-
this.spin();
|
|
326
|
+
this.spin(true);
|
|
326
327
|
},
|
|
327
328
|
},
|
|
328
329
|
});
|
|
@@ -41,7 +41,12 @@
|
|
|
41
41
|
<!-- 抽奖按钮 -->
|
|
42
42
|
<view class="shake-btn-wrap">
|
|
43
43
|
<view class="shake-draw-btn {{spinning?'shaking':''}} {{stopped?'btn-done':''}}" bindtap="onDrawBtnTap">
|
|
44
|
-
<
|
|
44
|
+
<block wx:if="{{lotteryType === 8}}">
|
|
45
|
+
<text class="draw-btn-text">发送口令</text>
|
|
46
|
+
</block>
|
|
47
|
+
<block wx:else>
|
|
48
|
+
<text class="draw-btn-text">{{stopped ? '开奖完成' : (spinning ? '摇奖中...' : '点我抽奖')}}</text>
|
|
49
|
+
</block>
|
|
45
50
|
</view>
|
|
46
51
|
</view>
|
|
47
52
|
</view>
|
|
@@ -4,11 +4,14 @@ Component({
|
|
|
4
4
|
type: String,
|
|
5
5
|
value: '2',
|
|
6
6
|
},
|
|
7
|
-
// 抽奖 ID:用于区分不同抽奖的缓存 key
|
|
8
7
|
lotteryId: {
|
|
9
8
|
type: String,
|
|
10
9
|
value: '',
|
|
11
10
|
},
|
|
11
|
+
lotteryType: {
|
|
12
|
+
type: Number,
|
|
13
|
+
value: 0,
|
|
14
|
+
},
|
|
12
15
|
remark: {
|
|
13
16
|
type: String,
|
|
14
17
|
value: '抽奖进行中...',
|
|
@@ -21,7 +24,6 @@ Component({
|
|
|
21
24
|
type: Boolean,
|
|
22
25
|
value: false,
|
|
23
26
|
},
|
|
24
|
-
// 外部控制:true 开始转,false 停止
|
|
25
27
|
running: {
|
|
26
28
|
type: Boolean,
|
|
27
29
|
value: false,
|
|
@@ -122,7 +124,7 @@ Component({
|
|
|
122
124
|
},
|
|
123
125
|
|
|
124
126
|
// 开始连续滚动:位移持续递减,显示值对周期取模(内容已重复,取模无缝)
|
|
125
|
-
spin() {
|
|
127
|
+
spin(triggerDraw = false) {
|
|
126
128
|
// 进行中或减速停止阶段,忽略重复点击,避免动画重复执行 / 重复上报抽奖
|
|
127
129
|
if (this.data.spinning || this.data.stopping) return;
|
|
128
130
|
this._clearTimers();
|
|
@@ -154,7 +156,9 @@ Component({
|
|
|
154
156
|
this.setData(next);
|
|
155
157
|
}, 30);
|
|
156
158
|
|
|
157
|
-
|
|
159
|
+
if (triggerDraw) {
|
|
160
|
+
this.triggerEvent('draw');
|
|
161
|
+
}
|
|
158
162
|
},
|
|
159
163
|
|
|
160
164
|
// 把某轴平滑停止到目标项 T(0~5),加减速过渡;返回最终位移
|
|
@@ -224,7 +228,7 @@ Component({
|
|
|
224
228
|
},
|
|
225
229
|
|
|
226
230
|
onDrawTap() {
|
|
227
|
-
this.spin();
|
|
231
|
+
this.spin(true);
|
|
228
232
|
},
|
|
229
233
|
},
|
|
230
234
|
});
|
|
@@ -55,7 +55,12 @@
|
|
|
55
55
|
</view>
|
|
56
56
|
<!-- 抽奖按钮 -->
|
|
57
57
|
<view class="slot-draw-btn" bindtap="onDrawTap">
|
|
58
|
-
<
|
|
58
|
+
<block wx:if="{{lotteryType === 8}}">
|
|
59
|
+
<text class="slot-btn-text">发送口令</text>
|
|
60
|
+
</block>
|
|
61
|
+
<block wx:else>
|
|
62
|
+
<text class="slot-btn-text">点我抽奖</text>
|
|
63
|
+
</block>
|
|
59
64
|
</view>
|
|
60
65
|
</view>
|
|
61
66
|
</view>
|
|
@@ -4,11 +4,14 @@ Component({
|
|
|
4
4
|
type: String,
|
|
5
5
|
value: 1,
|
|
6
6
|
},
|
|
7
|
-
// 抽奖 ID:用于区分不同抽奖的缓存 key
|
|
8
7
|
lotteryId: {
|
|
9
8
|
type: String,
|
|
10
9
|
value: '',
|
|
11
10
|
},
|
|
11
|
+
lotteryType: {
|
|
12
|
+
type: Number,
|
|
13
|
+
value: 0,
|
|
14
|
+
},
|
|
12
15
|
width: {
|
|
13
16
|
type: String,
|
|
14
17
|
value: '100%',
|
|
@@ -21,7 +24,6 @@ Component({
|
|
|
21
24
|
type: String,
|
|
22
25
|
value: '抽奖进行中...',
|
|
23
26
|
},
|
|
24
|
-
// 兼容原 lottie 版的属性透传,避免未知属性告警
|
|
25
27
|
autoplay: {
|
|
26
28
|
type: Boolean,
|
|
27
29
|
value: false,
|
|
@@ -30,7 +32,6 @@ Component({
|
|
|
30
32
|
type: Boolean,
|
|
31
33
|
value: false,
|
|
32
34
|
},
|
|
33
|
-
// 外部"消息"控制:true 开始无限转,false 平滑停止
|
|
34
35
|
running: {
|
|
35
36
|
type: Boolean,
|
|
36
37
|
value: false,
|
|
@@ -45,23 +46,20 @@ Component({
|
|
|
45
46
|
},
|
|
46
47
|
|
|
47
48
|
data: {
|
|
48
|
-
spinning: false,
|
|
49
|
-
stopping: false,
|
|
50
|
-
angle: 0,
|
|
49
|
+
spinning: false,
|
|
50
|
+
stopping: false,
|
|
51
|
+
angle: 0,
|
|
51
52
|
},
|
|
52
53
|
|
|
53
54
|
lifetimes: {
|
|
54
55
|
attached() {
|
|
55
56
|
if (this.data.running) {
|
|
56
|
-
// running 初始为 true 时直接开始
|
|
57
57
|
this.playSegment();
|
|
58
58
|
} else if (this._hasSpinCache()) {
|
|
59
|
-
// 刷新前抽奖仍在进行(有缓存),进入页面后自动恢复旋转动画
|
|
60
59
|
this.playSegment();
|
|
61
60
|
}
|
|
62
61
|
},
|
|
63
62
|
detached() {
|
|
64
|
-
// 注意:不在此清除缓存,保证刷新后仍能恢复动画
|
|
65
63
|
this._clearTimer();
|
|
66
64
|
},
|
|
67
65
|
},
|
|
@@ -92,21 +90,23 @@ Component({
|
|
|
92
90
|
wx.removeStorageSync(this._cacheKey());
|
|
93
91
|
},
|
|
94
92
|
|
|
95
|
-
|
|
96
|
-
playSegment() {
|
|
97
|
-
// 进行中或减速过渡阶段,忽略重复点击,避免动画重复执行 / 重复上报抽奖
|
|
93
|
+
playSegment(triggerDraw = false) {
|
|
98
94
|
if (this.data.spinning || this.data.stopping) return;
|
|
99
95
|
this._clearTimer();
|
|
100
96
|
this.setData({ spinning: true, stopping: false });
|
|
101
|
-
// 记录缓存:抽奖进行中,刷新后可据此恢复动画
|
|
102
97
|
this._setSpinCache();
|
|
103
|
-
// 每帧递增角度,约 360deg/s,纯 CSS 旋转由 transform 驱动
|
|
104
98
|
this._timer = setInterval(() => {
|
|
105
99
|
this.data.angle += 6;
|
|
106
100
|
this.setData({ angle: this.data.angle });
|
|
107
101
|
}, 16);
|
|
108
|
-
|
|
109
|
-
|
|
102
|
+
if (triggerDraw) {
|
|
103
|
+
this.triggerEvent('draw');
|
|
104
|
+
}
|
|
105
|
+
},
|
|
106
|
+
|
|
107
|
+
// 手动点击开始旋转(会触发 draw 事件)
|
|
108
|
+
onPlaySegment() {
|
|
109
|
+
this.playSegment(true);
|
|
110
110
|
},
|
|
111
111
|
|
|
112
112
|
// 兼容旧接口:开始旋转
|
|
@@ -77,10 +77,16 @@
|
|
|
77
77
|
<view class="lottery-pointer-inner"></view>
|
|
78
78
|
</view>
|
|
79
79
|
|
|
80
|
-
<!--
|
|
81
|
-
<view class="lottery-center-btn" bindtap="
|
|
82
|
-
<
|
|
83
|
-
|
|
80
|
+
<!-- 中心按钮 -->
|
|
81
|
+
<view class="lottery-center-btn" bindtap="onPlaySegment">
|
|
82
|
+
<block wx:if="{{lotteryType === 8}}">
|
|
83
|
+
<text class="lottery-center-btn-text">发送</text>
|
|
84
|
+
<text class="lottery-center-btn-text">口令</text>
|
|
85
|
+
</block>
|
|
86
|
+
<block wx:else>
|
|
87
|
+
<text class="lottery-center-btn-text">点我</text>
|
|
88
|
+
<text class="lottery-center-btn-text">抽奖</text>
|
|
89
|
+
</block>
|
|
84
90
|
</view>
|
|
85
91
|
|
|
86
92
|
<!-- 状态文案:常显 -->
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.lottery-wheel-container{align-items:center;display:flex;flex-direction:column;justify-content:center}.lottery-wheel-wrapper{height:720rpx;position:relative;width:750rpx}.lottery-base{background:linear-gradient(180deg,#e63e30,#c41a0d);border-radius:20rpx 20rpx 60rpx 60rpx;bottom:0;box-shadow:0 10rpx 30rpx rgba(198,26,13,.5),inset 0 4rpx 0 hsla(0,0%,100%,.2);height:120rpx;width:360rpx;z-index:16}.lottery-base,.lottery-base:after{left:50%;position:absolute;transform:translateX(-50%)}.lottery-base:after{background:rgba(0,0,0,.15);border-radius:20rpx;content:"";height:40rpx;top:20rpx;width:320rpx}.lottery-wheel-disc{background:transparent;border-radius:50%;box-shadow:0 8rpx 30rpx rgba(0,0,0,.25);height:440rpx;left:50%;margin-left:-220rpx;margin-top:-200rpx;overflow:hidden;position:absolute;top:50%;width:440rpx;z-index:10}.lottery-wheel-disc:after{border:8rpx solid rgba(230,62,48,.7);border-radius:50%;z-index:6}.lottery-wheel-disc:after,.lottery-wheel-disc:before{content:"";inset:0;pointer-events:none;position:absolute}.lottery-wheel-disc:before{background:repeating-conic-gradient(from 22.5deg,transparent 0deg 44deg,rgba(200,60,40,.45) 44deg 45deg);border-radius:50%;z-index:5}.lottery-wheel-disc.stopping{transition:transform 4s cubic-bezier(.17,.67,.12,.99)}.lottery-segment{height:100%;left:0;position:absolute;top:0;transform:rotate(calc(var(--rot)));transform-origin:center center;width:100%}.lottery-segment .lottery-segment-content{align-items:center;display:flex;flex-direction:column;justify-content:center;left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%) translateY(-145rpx);width:150rpx}.lottery-segment .lottery-segment-text{font-size:24rpx;font-weight:700;white-space:nowrap}.lottery-segment .lottery-segment-emoji{font-size:36rpx;line-height:1.2}.lottery-segment-even{background:conic-gradient(from -22.5deg,#ff8c42 0deg 45deg,transparent 45deg 1turn)}.lottery-segment-even .lottery-segment-text{color:#fff;text-shadow:0 2rpx 4rpx rgba(0,0,0,.25)}.lottery-segment-odd{background:conic-gradient(from -22.5deg,#fff1d6 0deg 45deg,transparent 45deg 1turn)}.lottery-segment-odd .lottery-segment-text{color:#c41a0d}.lottery-lights{border-radius:50%;height:440rpx;left:50%;margin-left:-220rpx;margin-top:-200rpx;pointer-events:none;position:absolute;top:50%;width:440rpx;z-index:15}.lottery-lights.stopping{transition:transform 4s cubic-bezier(.17,.67,.12,.99)}.lottery-lights .lottery-light{animation:lottery-light-blink .8s ease-in-out infinite alternate;background:radial-gradient(circle at 35% 35%,#fff 0,#ffd93d 50%,#fa0 100%);border-radius:50%;box-shadow:0 0 12rpx 4rpx rgba(255,217,61,.8);height:20rpx;left:50%;margin-left:-10rpx;margin-top:-10rpx;position:absolute;top:50%;transform-origin:center;width:20rpx}.lottery-lights .lottery-light:first-child{transform:rotate(0deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(2){transform:rotate(30deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(3){transform:rotate(60deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(4){transform:rotate(90deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(5){transform:rotate(120deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(6){transform:rotate(150deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(7){transform:rotate(180deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(8){transform:rotate(210deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(9){transform:rotate(240deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(10){transform:rotate(270deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(11){transform:rotate(300deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(12){transform:rotate(330deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(2n){animation-delay:.4s}@keyframes lottery-light-blink{0%{box-shadow:0 0 12rpx 4rpx rgba(255,217,61,.9);opacity:1}to{box-shadow:0 0 6rpx 2rpx rgba(255,217,61,.4);opacity:.5}}.lottery-center-btn{align-items:center;animation:lottery-btn-zoom .8s ease-in-out infinite alternate;background:linear-gradient(145deg,#ff6b5b,#e63e30);border:3rpx solid #ffd93d;border-radius:50%;box-shadow:0 4rpx 16rpx rgba(198,26,13,.5),inset 0 2rpx 4rpx hsla(0,0%,100%,.3);color:#fff;display:flex;flex-direction:column;height:100rpx;justify-content:center;left:50%;margin-left:-50rpx;margin-top:-30rpx;position:absolute;top:50%;width:100rpx;z-index:20}.lottery-center-btn:active{opacity:.85}.lottery-center-btn .lottery-center-btn-text{font-size:
|
|
1
|
+
.lottery-wheel-container{align-items:center;display:flex;flex-direction:column;justify-content:center}.lottery-wheel-wrapper{height:720rpx;position:relative;width:750rpx}.lottery-base{background:linear-gradient(180deg,#e63e30,#c41a0d);border-radius:20rpx 20rpx 60rpx 60rpx;bottom:0;box-shadow:0 10rpx 30rpx rgba(198,26,13,.5),inset 0 4rpx 0 hsla(0,0%,100%,.2);height:120rpx;width:360rpx;z-index:16}.lottery-base,.lottery-base:after{left:50%;position:absolute;transform:translateX(-50%)}.lottery-base:after{background:rgba(0,0,0,.15);border-radius:20rpx;content:"";height:40rpx;top:20rpx;width:320rpx}.lottery-wheel-disc{background:transparent;border-radius:50%;box-shadow:0 8rpx 30rpx rgba(0,0,0,.25);height:440rpx;left:50%;margin-left:-220rpx;margin-top:-200rpx;overflow:hidden;position:absolute;top:50%;width:440rpx;z-index:10}.lottery-wheel-disc:after{border:8rpx solid rgba(230,62,48,.7);border-radius:50%;z-index:6}.lottery-wheel-disc:after,.lottery-wheel-disc:before{content:"";inset:0;pointer-events:none;position:absolute}.lottery-wheel-disc:before{background:repeating-conic-gradient(from 22.5deg,transparent 0deg 44deg,rgba(200,60,40,.45) 44deg 45deg);border-radius:50%;z-index:5}.lottery-wheel-disc.stopping{transition:transform 4s cubic-bezier(.17,.67,.12,.99)}.lottery-segment{height:100%;left:0;position:absolute;top:0;transform:rotate(calc(var(--rot)));transform-origin:center center;width:100%}.lottery-segment .lottery-segment-content{align-items:center;display:flex;flex-direction:column;justify-content:center;left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%) translateY(-145rpx);width:150rpx}.lottery-segment .lottery-segment-text{font-size:24rpx;font-weight:700;white-space:nowrap}.lottery-segment .lottery-segment-emoji{font-size:36rpx;line-height:1.2}.lottery-segment-even{background:conic-gradient(from -22.5deg,#ff8c42 0deg 45deg,transparent 45deg 1turn)}.lottery-segment-even .lottery-segment-text{color:#fff;text-shadow:0 2rpx 4rpx rgba(0,0,0,.25)}.lottery-segment-odd{background:conic-gradient(from -22.5deg,#fff1d6 0deg 45deg,transparent 45deg 1turn)}.lottery-segment-odd .lottery-segment-text{color:#c41a0d}.lottery-lights{border-radius:50%;height:440rpx;left:50%;margin-left:-220rpx;margin-top:-200rpx;pointer-events:none;position:absolute;top:50%;width:440rpx;z-index:15}.lottery-lights.stopping{transition:transform 4s cubic-bezier(.17,.67,.12,.99)}.lottery-lights .lottery-light{animation:lottery-light-blink .8s ease-in-out infinite alternate;background:radial-gradient(circle at 35% 35%,#fff 0,#ffd93d 50%,#fa0 100%);border-radius:50%;box-shadow:0 0 12rpx 4rpx rgba(255,217,61,.8);height:20rpx;left:50%;margin-left:-10rpx;margin-top:-10rpx;position:absolute;top:50%;transform-origin:center;width:20rpx}.lottery-lights .lottery-light:first-child{transform:rotate(0deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(2){transform:rotate(30deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(3){transform:rotate(60deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(4){transform:rotate(90deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(5){transform:rotate(120deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(6){transform:rotate(150deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(7){transform:rotate(180deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(8){transform:rotate(210deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(9){transform:rotate(240deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(10){transform:rotate(270deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(11){transform:rotate(300deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(12){transform:rotate(330deg) translateX(235rpx)}.lottery-lights .lottery-light:nth-child(2n){animation-delay:.4s}@keyframes lottery-light-blink{0%{box-shadow:0 0 12rpx 4rpx rgba(255,217,61,.9);opacity:1}to{box-shadow:0 0 6rpx 2rpx rgba(255,217,61,.4);opacity:.5}}.lottery-center-btn{align-items:center;animation:lottery-btn-zoom .8s ease-in-out infinite alternate;background:linear-gradient(145deg,#ff6b5b,#e63e30);border:3rpx solid #ffd93d;border-radius:50%;box-shadow:0 4rpx 16rpx rgba(198,26,13,.5),inset 0 2rpx 4rpx hsla(0,0%,100%,.3);color:#fff;display:flex;flex-direction:column;height:100rpx;justify-content:center;left:50%;margin-left:-50rpx;margin-top:-30rpx;position:absolute;top:50%;width:100rpx;z-index:20}.lottery-center-btn:active{opacity:.85}.lottery-center-btn .lottery-center-btn-text{font-size:24rpx;font-weight:700;line-height:1.2;text-shadow:0 2rpx 4rpx rgba(0,0,0,.2)}.lottery-pointer{background:#ffd93d;-webkit-filter:drop-shadow(0 3rpx 6rpx rgba(0,0,0,.25));filter:drop-shadow(0 3rpx 6rpx rgba(0,0,0,.25));height:40rpx;left:50%;top:290rpx;transform:translateX(-50%);width:44rpx;z-index:18}.lottery-pointer,.lottery-pointer-inner{-webkit-clip-path:polygon(50% 0,0 100%,100% 100%);clip-path:polygon(50% 0,0 100%,100% 100%);position:absolute}.lottery-pointer-inner{background:linear-gradient(90deg,#ff7a6a,#ff7a6a 50%,#d62f23 0,#d62f23);bottom:0;left:4rpx;right:4rpx;top:4rpx}@keyframes lottery-btn-zoom{0%{transform:scale(1)}to{transform:scale(1.12)}}.lotterying{bottom:60rpx;color:#fff;font-size:28rpx;left:50%;margin-left:-150rpx;overflow:hidden;position:absolute;width:300rpx;z-index:999}.lotterying .lotterying-text{animation:marquee 3s linear infinite;display:inline-block;padding-left:100%;white-space:nowrap}@keyframes marquee{0%{transform:translateX(0)}to{transform:translateX(-100%)}}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { debounce } from '../../shared/utils';
|
|
2
|
+
|
|
1
3
|
Component({
|
|
2
4
|
properties: {
|
|
3
5
|
sdkInstance: {
|
|
@@ -203,26 +205,44 @@ Component({
|
|
|
203
205
|
});
|
|
204
206
|
},
|
|
205
207
|
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
// 转盘减速停止完成回调(结果已在 LOTTERY_END 中延时展示,这里可做兜底)
|
|
213
|
-
onWheelStopped() {},
|
|
208
|
+
onDraw: debounce(function () {
|
|
209
|
+
const currentLottery = this.data.currentLottery;
|
|
210
|
+
if (currentLottery && currentLottery.lottery_type === 8) {
|
|
211
|
+
this._handleCommandLottery();
|
|
212
|
+
}
|
|
213
|
+
}, 5000),
|
|
214
214
|
|
|
215
|
-
|
|
216
|
-
|
|
215
|
+
async _handleCommandLottery() {
|
|
216
|
+
const lotteryServer = this.sdkInstance.get('lotteryServer');
|
|
217
|
+
if (!lotteryServer) return;
|
|
218
|
+
const user = this.sdkInstance.store.get('user') || {};
|
|
219
|
+
const { interact } = this.sdkInstance.store.get('') || {};
|
|
220
|
+
const currentLottery = this.data.currentLottery;
|
|
221
|
+
const lotteryId = currentLottery.lottery_id || currentLottery.id;
|
|
217
222
|
|
|
218
|
-
|
|
219
|
-
|
|
223
|
+
if (!this._participatedLotteryIds) {
|
|
224
|
+
this._participatedLotteryIds = new Set();
|
|
225
|
+
}
|
|
226
|
+
if (this._participatedLotteryIds.has(lotteryId)) return;
|
|
227
|
+
|
|
228
|
+
try {
|
|
229
|
+
const res = await lotteryServer.participateLottery({
|
|
230
|
+
nickname: user.nickname || '',
|
|
231
|
+
avatar: user.avatar || '',
|
|
232
|
+
lottery_id: lotteryId,
|
|
233
|
+
room_id: interact?.room_id || '',
|
|
234
|
+
});
|
|
220
235
|
|
|
221
|
-
|
|
222
|
-
|
|
236
|
+
if (res.code == 200 && currentLottery.command) {
|
|
237
|
+
this._participatedLotteryIds.add(lotteryId);
|
|
238
|
+
this.sdkInstance.sendChat({ data: currentLottery.command });
|
|
239
|
+
}
|
|
240
|
+
} catch (err) {
|
|
241
|
+
console.error('口令抽奖参与失败:', err);
|
|
242
|
+
}
|
|
243
|
+
},
|
|
223
244
|
|
|
224
|
-
|
|
225
|
-
onShakeStopped() {},
|
|
245
|
+
onStopped() {},
|
|
226
246
|
|
|
227
247
|
onClose() {
|
|
228
248
|
this.closeAllModals();
|
|
@@ -3,13 +3,14 @@
|
|
|
3
3
|
<view class="lottery-modal">
|
|
4
4
|
<!-- 抽奖进行中 -->
|
|
5
5
|
<view wx:if="{{lotteryStatus==0}}" class="lottery-content">
|
|
6
|
+
<view class="lottery-command" wx:if="{{!!currentLottery.command}}">发送口令"{{currentLottery.command}}"参与抽奖吧</view>
|
|
6
7
|
<!-- 抽奖形式由 img_order 决定:1=转盘,2=老虎机,3=摇奖机 -->
|
|
7
8
|
<!-- 摇奖机模式 (img_order == 3) -->
|
|
8
|
-
<lottery-shake wx:if="{{currentLottery.img_order == 3}}" id="lotteryShake" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" remark="{{currentLottery.remark}}" autoplay loop bind:draw="
|
|
9
|
+
<lottery-shake wx:if="{{currentLottery.img_order == 3}}" id="lotteryShake" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" lotteryType="{{currentLottery.lottery_type}}" remark="{{currentLottery.remark}}" autoplay loop bind:draw="onDraw" bind:stopped="onStopped" />
|
|
9
10
|
<!-- 老虎机模式 (img_order == 2) -->
|
|
10
|
-
<lottery-slot wx:elif="{{currentLottery.img_order == 2}}" id="lotterySlot" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" remark="{{currentLottery.remark}}" autoplay loop bind:draw="
|
|
11
|
-
<!--
|
|
12
|
-
<lottery-wheel wx:else id="lotteryWheel" type="{{currentLottery.img_order || 1}}" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" autoplay loop remark="{{currentLottery.remark}}" bind:draw="
|
|
11
|
+
<lottery-slot wx:elif="{{currentLottery.img_order == 2}}" id="lotterySlot" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" lotteryType="{{currentLottery.lottery_type}}" remark="{{currentLottery.remark}}" autoplay loop bind:draw="onDraw" bind:stopped="onStopped" />
|
|
12
|
+
<!-- 转盘模式 (img_order == 1 或其他) -->
|
|
13
|
+
<lottery-wheel wx:else id="lotteryWheel" type="{{currentLottery.img_order || 1}}" lotteryId="{{currentLottery.lottery_id || currentLottery.id}}" lotteryType="{{currentLottery.lottery_type}}" autoplay loop remark="{{currentLottery.remark}}" bind:draw="onDraw" bind:stopped="onStopped" />
|
|
13
14
|
<!-- 新增形式:在对应位置插入 wx:elif="{{currentLottery.img_order == N}}" 分支即可 -->
|
|
14
15
|
<view wx:if="{{currentLottery && currentLottery.can_look_award_pool == 1}}" class="lottery-award-pool-btn" bindtap="showAwardPool">
|
|
15
16
|
<text class="lottery-award-pool-text">查看奖池 ></text>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.lottery-container{align-items:center;background:rgba(0,0,0,.7);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:10000}.lottery-container.display-1{background:url(https://s1.e.vhall.com/common-static/saas-wap/static/img/popupBg.35704976.png) no-repeat top;background-size:100% 100%;bottom:0;height:auto;top:56.25vw}.lottery-container.display-1 .lottery-close-btn{border-radius:50%;height:60rpx;position:absolute;right:20rpx;top:20rpx;width:60rpx}.lottery-overlay{background:rgba(0,0,0,.7);height:100%;left:0;position:absolute;top:0;width:100%}.lottery-modal{border-radius:24rpx;box-sizing:border-box;flex-direction:column;height:100%;position:relative;width:100%}.lottery-close,.lottery-modal{display:flex;justify-content:center}.lottery-close{align-items:center;height:50rpx;position:absolute;right:20rpx;top:20rpx;width:50rpx}.lottery-close .lottery-close-icon{height:40rpx;width:40rpx}.lottery-header{margin-bottom:30rpx;text-align:center}.lottery-title{color:#fff;font-size:36rpx;font-weight:700;text-shadow:0 2rpx 4rpx rgba(0,0,0,.3)}.lottery-content{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:30rpx}.svga-canvas{height:400rpx;width:400rpx}.lottery-footer{margin-bottom:20rpx;text-align:center}.lottery-join-btn{animation:bounce .6s ease-in-out infinite;background:linear-gradient(135deg,#ffd32a,#ff9f1a);border:none;border-radius:50rpx;box-shadow:0 6rpx 20rpx rgba(255,159,26,.5);color:#d63031;display:inline-block;font-size:32rpx;font-weight:700;padding:20rpx 60rpx}.lottery-join-btn:after{border:none}.lottery-hint{animation:pulse 1s ease-in-out infinite;color:#fff;display:block;font-size:28rpx}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.lottery-winners{background:hsla(0,0%,100%,.95);border-radius:16rpx;max-height:200rpx;padding:20rpx}.lottery-winners-title{color:#d63031;font-size:26rpx;font-weight:700;margin-bottom:15rpx;text-align:center}.lottery-winners-list{max-height:150rpx}.lottery-winner-item{align-items:center;display:flex;padding:10rpx 0}.lottery-winner-item:not(:last-child){border-bottom:1rpx solid #f0f0f0}.lottery-winner-avatar{border-radius:50%;height:50rpx;margin-right:15rpx;width:50rpx}.lottery-winner-name{color:#333;font-size:24rpx}.lottery-close-btn{border-radius:50%;height:80rpx;margin:0rpx auto;width:80rpx}.lottery-close-btn,.lottery-result{align-items:center;display:flex;justify-content:center}.lottery-result{flex-direction:column;padding:40rpx;text-align:center}.lottery-win-title{margin-bottom:20rpx}.stroked-text{color:#fff;font-size:48rpx;font-weight:700;letter-spacing:5px;transform:matrix(.99,0,-.15,1,0,0)}.stroked-text:after,.stroked-text:before{content:attr(data-text);left:0;position:absolute;top:0}.stroked-text:before{-webkit-text-stroke:5px #fb2626;z-index:-1}.stroked-text:after{-webkit-text-stroke:8px #ffecb7;z-index:-2}.lottery-win-nickname{background:linear-gradient(270deg,rgba(255,107,38,0) 5.07%,#ff6b26 25.41%,#f52c03);border-radius:50rpx 0 0 50rpx;color:#fff;display:inline-block;margin-bottom:20rpx;max-width:340rpx;padding:6rpx 40rpx 6rpx 20rpx}.lottery-prize{background:linear-gradient(135deg,#ffd32a,#ff9f1a);border-radius:40rpx;color:#fff;font-size:36rpx;font-weight:700;padding:20rpx 40rpx}.lottery-lose-content{align-items:center;background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-miss.5a1292bf.png) no-repeat 50%;background-size:contain;display:flex;flex-direction:row;height:420rpx;justify-content:center;width:420rpx}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.lottery-animation{padding:40rpx}.lottery-animation,.lottery-spinner{align-items:center;display:flex;justify-content:center}.lottery-spinner{animation:spin 2s linear infinite;background:linear-gradient(135deg,#ffd32a,#ff9f1a);border-radius:50%;box-shadow:0 10rpx 30rpx rgba(255,159,26,.5);height:200rpx;width:200rpx}.lottery-ball{animation:bounce .6s ease-in-out infinite;background:#fff;border-radius:50%;height:60rpx;width:60rpx}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.lottery-result{background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-win-gold-coin.1bcfdf22.png) no-repeat 50%;background-size:contain}.lottery-win{align-items:center;display:flex;flex-direction:column;padding:40rpx}.win-icon{animation:bounce .5s ease;font-size:100rpx;margin-bottom:20rpx}.prize-card{align-items:center;background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-win-annulus.ec2c80bd.png) no-repeat 50%;background-size:contain;display:flex;flex-direction:column;margin-top:-100rpx;padding:160rpx}.prize-image{border-radius:140rpx;height:280rpx;width:280rpx}.prize-name{background:linear-gradient(270deg,rgba(255,226,73,0) 2.54%,#ffeb32 32.61%,#ffeb32 59.83%,rgba(255,215,73,0) 94.2%);color:#d63031;display:block;font-size:32rpx;line-height:60rpx;margin-top:-140rpx;width:100%}.lottery-win-hint{color:hsla(0,0%,100%,.8);font-size:26rpx;margin-top:10rpx}.lottery-success-btn,.receive-btn{background:#fb2626;border-radius:50rpx;color:#fff;margin-top:30rpx;padding:20rpx 60rpx}.lottery-success-btn .receive-btn-text,.receive-btn .receive-btn-text{color:#fff;font-size:32rpx}.lottery-history-icon{align-items:center;border-radius:50%;bottom:200rpx;display:flex;justify-content:center;position:fixed;right:40rpx;z-index:500}.lottery-history-icon .history-icon-img{height:70rpx;width:70rpx}.lottery-history-icon .history-badge{background-color:#fb2626;border:4rpx solid #fff;border-radius:50%;height:24rpx;position:absolute;right:-4rpx;top:-4rpx;width:24rpx}.lottery-award-pool-btn .lottery-award-pool-text{color:#fce09e;font-size:32rpx}.award-pool-modal{bottom:0;display:flex;flex-direction:column;justify-content:flex-end;left:0;position:fixed;right:0;top:0;z-index:10001}.award-pool-mask{background:rgba(0,0,0,.5);bottom:0;left:0;position:absolute;right:0;top:0}.award-pool-content{background:linear-gradient(37.94deg,#fffbe8 3.86%,#fbf0e6 84.36%);border-radius:32rpx 32rpx 0 0;max-height:70vh;overflow:hidden;padding:0 40rpx 80rpx;position:relative}.award-pool-title{border-bottom:2rpx solid #f0f0f0;color:#333;font-size:38rpx;font-weight:600;height:100rpx;line-height:100rpx;text-align:center}.award-pool-wrap-container{padding-right:4rpx}.award-pool-wrap{max-height:432rpx;min-height:128rpx}.award-pool-item-wrapper{margin-bottom:24rpx}.award-pool-item{align-items:center;background:#fff;border-radius:24rpx;display:flex;flex-direction:row;padding:28rpx 32rpx}.award-pool-item__img{border:2rpx solid #d9d9d9;border-radius:24rpx;flex-shrink:0;height:160rpx;width:160rpx}.award-pool-item__content{display:flex;flex:1;flex-direction:column;height:100%;justify-content:center;margin-left:30rpx;width:0}.award-pool-item-name{color:#262626;font-size:32rpx;font-weight:500;line-height:48rpx;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.award-pool-item-desc{color:#8c8c8c;font-size:28rpx;line-height:36rpx;margin-top:8rpx}
|
|
1
|
+
.lottery-container{align-items:center;background:rgba(0,0,0,.7);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:10000}.lottery-container.display-1{background:url(https://s1.e.vhall.com/common-static/saas-wap/static/img/popupBg.35704976.png) no-repeat top;background-size:100% 100%;bottom:0;height:auto;top:56.25vw}.lottery-container.display-1 .lottery-close-btn{border-radius:50%;height:60rpx;position:absolute;right:20rpx;top:20rpx;width:60rpx}.lottery-overlay{background:rgba(0,0,0,.7);height:100%;left:0;position:absolute;top:0;width:100%}.lottery-modal{border-radius:24rpx;box-sizing:border-box;flex-direction:column;height:100%;position:relative;width:100%}.lottery-close,.lottery-modal{display:flex;justify-content:center}.lottery-close{align-items:center;height:50rpx;position:absolute;right:20rpx;top:20rpx;width:50rpx}.lottery-close .lottery-close-icon{height:40rpx;width:40rpx}.lottery-header{margin-bottom:30rpx;text-align:center}.lottery-title{color:#fff;font-size:36rpx;font-weight:700;text-shadow:0 2rpx 4rpx rgba(0,0,0,.3)}.lottery-content{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:30rpx}.svga-canvas{height:400rpx;width:400rpx}.lottery-footer{margin-bottom:20rpx;text-align:center}.lottery-join-btn{animation:bounce .6s ease-in-out infinite;background:linear-gradient(135deg,#ffd32a,#ff9f1a);border:none;border-radius:50rpx;box-shadow:0 6rpx 20rpx rgba(255,159,26,.5);color:#d63031;display:inline-block;font-size:32rpx;font-weight:700;padding:20rpx 60rpx}.lottery-join-btn:after{border:none}.lottery-hint{animation:pulse 1s ease-in-out infinite;color:#fff;display:block;font-size:28rpx}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.lottery-winners{background:hsla(0,0%,100%,.95);border-radius:16rpx;max-height:200rpx;padding:20rpx}.lottery-winners-title{color:#d63031;font-size:26rpx;font-weight:700;margin-bottom:15rpx;text-align:center}.lottery-winners-list{max-height:150rpx}.lottery-winner-item{align-items:center;display:flex;padding:10rpx 0}.lottery-winner-item:not(:last-child){border-bottom:1rpx solid #f0f0f0}.lottery-winner-avatar{border-radius:50%;height:50rpx;margin-right:15rpx;width:50rpx}.lottery-winner-name{color:#333;font-size:24rpx}.lottery-close-btn{border-radius:50%;height:80rpx;margin:0rpx auto;width:80rpx}.lottery-close-btn,.lottery-result{align-items:center;display:flex;justify-content:center}.lottery-result{flex-direction:column;padding:40rpx;text-align:center}.lottery-win-title{margin-bottom:20rpx}.stroked-text{color:#fff;font-size:48rpx;font-weight:700;letter-spacing:5px;transform:matrix(.99,0,-.15,1,0,0)}.stroked-text:after,.stroked-text:before{content:attr(data-text);left:0;position:absolute;top:0}.stroked-text:before{-webkit-text-stroke:5px #fb2626;z-index:-1}.stroked-text:after{-webkit-text-stroke:8px #ffecb7;z-index:-2}.lottery-win-nickname{background:linear-gradient(270deg,rgba(255,107,38,0) 5.07%,#ff6b26 25.41%,#f52c03);border-radius:50rpx 0 0 50rpx;color:#fff;display:inline-block;margin-bottom:20rpx;max-width:340rpx;padding:6rpx 40rpx 6rpx 20rpx}.lottery-prize{background:linear-gradient(135deg,#ffd32a,#ff9f1a);border-radius:40rpx;color:#fff;font-size:36rpx;font-weight:700;padding:20rpx 40rpx}.lottery-lose-content{align-items:center;background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-miss.5a1292bf.png) no-repeat 50%;background-size:contain;display:flex;flex-direction:row;height:420rpx;justify-content:center;width:420rpx}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.lottery-animation{padding:40rpx}.lottery-animation,.lottery-spinner{align-items:center;display:flex;justify-content:center}.lottery-spinner{animation:spin 2s linear infinite;background:linear-gradient(135deg,#ffd32a,#ff9f1a);border-radius:50%;box-shadow:0 10rpx 30rpx rgba(255,159,26,.5);height:200rpx;width:200rpx}.lottery-ball{animation:bounce .6s ease-in-out infinite;background:#fff;border-radius:50%;height:60rpx;width:60rpx}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.lottery-result{background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-win-gold-coin.1bcfdf22.png) no-repeat 50%;background-size:contain}.lottery-win{align-items:center;display:flex;flex-direction:column;padding:40rpx}.win-icon{animation:bounce .5s ease;font-size:100rpx;margin-bottom:20rpx}.prize-card{align-items:center;background:url(https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/lottery-win-annulus.ec2c80bd.png) no-repeat 50%;background-size:contain;display:flex;flex-direction:column;margin-top:-100rpx;padding:160rpx}.prize-image{border-radius:140rpx;height:280rpx;width:280rpx}.prize-name{background:linear-gradient(270deg,rgba(255,226,73,0) 2.54%,#ffeb32 32.61%,#ffeb32 59.83%,rgba(255,215,73,0) 94.2%);color:#d63031;display:block;font-size:32rpx;line-height:60rpx;margin-top:-140rpx;width:100%}.lottery-win-hint{color:hsla(0,0%,100%,.8);font-size:26rpx;margin-top:10rpx}.lottery-success-btn,.receive-btn{background:#fb2626;border-radius:50rpx;color:#fff;margin-top:30rpx;padding:20rpx 60rpx}.lottery-success-btn .receive-btn-text,.receive-btn .receive-btn-text{color:#fff;font-size:32rpx}.lottery-history-icon{align-items:center;border-radius:50%;bottom:200rpx;display:flex;justify-content:center;position:fixed;right:40rpx;z-index:500}.lottery-history-icon .history-icon-img{height:70rpx;width:70rpx}.lottery-history-icon .history-badge{background-color:#fb2626;border:4rpx solid #fff;border-radius:50%;height:24rpx;position:absolute;right:-4rpx;top:-4rpx;width:24rpx}.lottery-award-pool-btn .lottery-award-pool-text{color:#fce09e;font-size:32rpx}.award-pool-modal{bottom:0;display:flex;flex-direction:column;justify-content:flex-end;left:0;position:fixed;right:0;top:0;z-index:10001}.award-pool-mask{background:rgba(0,0,0,.5);bottom:0;left:0;position:absolute;right:0;top:0}.award-pool-content{background:linear-gradient(37.94deg,#fffbe8 3.86%,#fbf0e6 84.36%);border-radius:32rpx 32rpx 0 0;max-height:70vh;overflow:hidden;padding:0 40rpx 80rpx;position:relative}.award-pool-title{border-bottom:2rpx solid #f0f0f0;color:#333;font-size:38rpx;font-weight:600;height:100rpx;line-height:100rpx;text-align:center}.award-pool-wrap-container{padding-right:4rpx}.award-pool-wrap{max-height:432rpx;min-height:128rpx}.award-pool-item-wrapper{margin-bottom:24rpx}.award-pool-item{align-items:center;background:#fff;border-radius:24rpx;display:flex;flex-direction:row;padding:28rpx 32rpx}.award-pool-item__img{border:2rpx solid #d9d9d9;border-radius:24rpx;flex-shrink:0;height:160rpx;width:160rpx}.award-pool-item__content{display:flex;flex:1;flex-direction:column;height:100%;justify-content:center;margin-left:30rpx;width:0}.award-pool-item-name{color:#262626;font-size:32rpx;font-weight:500;line-height:48rpx;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.award-pool-item-desc{color:#8c8c8c;font-size:28rpx;line-height:36rpx;margin-top:8rpx}.lottery-command{background:linear-gradient(270deg,rgba(255,237,144,0),rgba(254,238,89,.8) 21.42%,#ffd600);border-radius:36rpx 0 0 36rpx;color:#fb2626;margin-bottom:-80rpx;padding:4rpx 40rpx 4rpx 20rpx}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<live-player wx:if="{{type=='live'}}" id='{{id}}' class='vhall-player' src='{{src}}' mode='{{mode}}' autoplay='{{
|
|
1
|
+
<live-player wx:if="{{type=='live'}}" id='{{id}}' class='vhall-player' src='{{src}}' mode='{{mode}}' autoplay='{{autoplay}}' muted='{{muted}}' orientation='{{orientation}}' object-fit='{{livePlayerObjectFit}}' min-cache='{{minCache}}' max-cache='{{maxCache}}' sound-mode='{{soundMode}}' auto-pause-if-navigate='{{autoPauseIfNavigate}}' auto-pause-if-open-native='{{autoPauseIfOpenNative}}' picture-in-picture-mode='{{pictureInPictureMode}}' picture-in-picture-init-position='{{pictureInPictureInitPosition}}' enable-auto-rotation='{{enableAutoRotation}}' referrer-policy='{{referrerPolicy}}' enable-casting='{{enableCasting}}' enable-recv-message bindstatechange='onStateChange' bindfullscreenchange='onFullScreenChange' bindnetstatus='onNetStatus' bindaudiovolumenotify='onAudioVolumeNotify' bindenterpictureinpicture='onEnterPictureInPicture' bindleavepictureinpicture='onLeavePictureInPicture'>
|
|
2
2
|
<slot />
|
|
3
3
|
</live-player>
|
|
4
|
-
<video wx:elif="{{type=='vod'}}" id='{{id}}' class='vhall-player' src='{{src}}' duration='{{duration}}' controls='{{controls}}' danmu-list='{{danmuList}}' danmu-btn='{{danmuBtn}}' enable-danmu='{{enableDanmu}}' autoplay='{{
|
|
4
|
+
<video wx:elif="{{type=='vod'}}" id='{{id}}' class='vhall-player' src='{{src}}' duration='{{duration}}' controls='{{controls}}' danmu-list='{{danmuList}}' danmu-btn='{{danmuBtn}}' enable-danmu='{{enableDanmu}}' autoplay='{{autoplay}}' loop='{{loop}}' muted='{{muted}}' initial-time='{{initialSeekTime}}' page-gesture='{{pageGesture}}' direction='{{direction}}' show-progress='{{showProgress}}' show-fullscreen-btn='{{showFullscreenBtn}}' show-play-btn='{{showPlayBtn}}' show-center-play-btn='{{showCenterPlayBtn}}' enable-progress-gesture='{{enableProgressGesture}}' object-fit='{{videoObjectFit}}' poster='{{poster}}' show-mute-btn='{{showMuteBtn}}' title='{{title}}' play-btn-position='{{playBtnPosition}}' enable-play-gesture='{{enablePlayGesture}}' auto-pause-if-navigate='{{autoPauseIfNavigate}}' auto-pause-if-open-native='{{autoPauseIfOpenNative}}' vslide-gesture='{{vslideGesture}}' vslide-gesture-in-fullscreen='{{vslideGestureInFullscreen}}' show-bottom-progress='{{showBottomProgress}}' show-casting-button='{{showCastingButton}}' show-background-playback-button="{{true}}" picture-in-picture-mode='{{[]}}' picture-in-picture-init-position='{{pictureInPictureInitPosition}}' picture-in-picture-show-progress='{{pictureInPictureShowProgress}}' enable-auto-rotation='{{enableAutoRotation}}' show-screen-lock-button='{{showScreenLockButton}}' show-snapshot-button='{{showSnapshotButton}}' bindplay="onPlay" bindpause="onPause" bindended="onEnded" bindloadedmetadata="onLoadedMetadata" binderror="onError" bindtimeupdate="onTimeupdate" bindfullscreenchange="onFullScreenChange" bindwaiting="onWaiting" bindprogress="onProgress" bindcontrolstoggle="onControlsToggle" bindenterpictureinpicture="onEnterPictureInPicture" bindleavepictureinpicture="onLeavePictureInPicture" bindseekcomplete="onSeekComplete">
|
|
5
5
|
<slot />
|
|
6
6
|
</video>
|
|
7
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.vhall-player-poster{height:100%;left:0;position:absolute;top:0;width:100
|
|
1
|
+
.vhall-player-poster{height:100%;left:0;position:absolute;top:0;width:100%;z-index:2}
|
|
@@ -10,6 +10,7 @@ export function createData() {
|
|
|
10
10
|
prefix,
|
|
11
11
|
showAudioCover: false,
|
|
12
12
|
showPoster: false,
|
|
13
|
+
showBigPlay: false, // 是否显示中间自定义的大播放按钮
|
|
13
14
|
posterUrl: '',
|
|
14
15
|
showLoading: false,
|
|
15
16
|
showError: false,
|
|
@@ -49,6 +50,7 @@ export function createData() {
|
|
|
49
50
|
webinarType: undefined,
|
|
50
51
|
webinarTypeStr: undefined,
|
|
51
52
|
webinarSubject: undefined,
|
|
53
|
+
webinarStatus: undefined,
|
|
52
54
|
webinarStatusMap: {
|
|
53
55
|
1: '直播中',
|
|
54
56
|
2: '预约',
|
|
@@ -58,6 +60,14 @@ export function createData() {
|
|
|
58
60
|
},
|
|
59
61
|
recordWatchExpireObj: {},
|
|
60
62
|
|
|
61
|
-
|
|
63
|
+
// 暖场视频连续播放
|
|
64
|
+
// isWarmVideo 由 packages/sdk/player/index.js 计算(webinar_type==2 且配置了 warmup_paas_record_id),
|
|
65
|
+
// 经 initVhallPlayer 的 setData 注入;此处默认值仅作首次渲染兜底,避免 undefined
|
|
66
|
+
isWarmVideo: false, // 是否暖场视频
|
|
67
|
+
warmVideoIds: [], // 暖场视频 id 列表
|
|
68
|
+
warmVideoIndex: 0, // 当前播放索引
|
|
69
|
+
warmupPlayerType: 0, // 1-单次播放,2-循环播放
|
|
70
|
+
advancePlayTime: 0, // 提前观看限制(秒):0-开播前随时可看;>0-开播前 N 秒才可观看
|
|
71
|
+
webinarStartTime: '', // 活动开播时间(用于计算可观看时间)
|
|
62
72
|
};
|
|
63
73
|
}
|
|
@@ -38,6 +38,10 @@ export function createMethods() {
|
|
|
38
38
|
currentQuality: vodPlayInfo.currentQuality,
|
|
39
39
|
});
|
|
40
40
|
this.triggerEvent('ready', null);
|
|
41
|
+
// 暖场视频:自动播放由我们手动控制(受 advancePlayTime 时间限制约束),不直接依赖 video 的 autoplay
|
|
42
|
+
if (this.data.warmVideoIds.length > 0 && this.data.autoplay && this.canPlayWarmup()) {
|
|
43
|
+
this.play();
|
|
44
|
+
}
|
|
41
45
|
} catch (e) {
|
|
42
46
|
console.error(e);
|
|
43
47
|
}
|
|
@@ -176,6 +180,7 @@ export function createMethods() {
|
|
|
176
180
|
showLoading: false,
|
|
177
181
|
showError: false,
|
|
178
182
|
showPoster: false,
|
|
183
|
+
showBigPlay: false,
|
|
179
184
|
});
|
|
180
185
|
},
|
|
181
186
|
/**
|
|
@@ -185,10 +190,15 @@ export function createMethods() {
|
|
|
185
190
|
onpause(e) {
|
|
186
191
|
console.log(`暂停pause事件:`, e.detail);
|
|
187
192
|
this.triggerEvent('pause', e.detail);
|
|
188
|
-
|
|
193
|
+
const data = {
|
|
189
194
|
playStatus: 'paused',
|
|
190
195
|
pausedFlag: true,
|
|
191
|
-
}
|
|
196
|
+
};
|
|
197
|
+
// 暖场视频暂停时,只显示大播放按钮(不显示封面)
|
|
198
|
+
if (this.data.warmVideoIds.length > 0) {
|
|
199
|
+
data.showBigPlay = true;
|
|
200
|
+
}
|
|
201
|
+
this.setData(data);
|
|
192
202
|
},
|
|
193
203
|
/**
|
|
194
204
|
* 结束事件(仅点播)
|
|
@@ -197,13 +207,69 @@ export function createMethods() {
|
|
|
197
207
|
onended(e) {
|
|
198
208
|
console.log(`播放ended事件:`, e.detail);
|
|
199
209
|
this.triggerEvent('ended', e.detail);
|
|
210
|
+
// 暖场视频连续播放/循环播放处理
|
|
211
|
+
const { warmVideoIds, warmVideoIndex, warmupPlayerType } = this.data;
|
|
212
|
+
if (warmVideoIds.length === 0) return;
|
|
213
|
+
const isLast = warmVideoIndex >= warmVideoIds.length - 1;
|
|
214
|
+
if (!isLast) {
|
|
215
|
+
// 还有下一个,直接续播
|
|
216
|
+
this.playNextWarmVideo(warmVideoIndex + 1);
|
|
217
|
+
} else if (warmupPlayerType === 2) {
|
|
218
|
+
// 循环播放:回到第一个继续(单视频时即重播当前视频)
|
|
219
|
+
this.playNextWarmVideo(0);
|
|
220
|
+
} else {
|
|
221
|
+
// 单次播放(warmupPlayerType===1)播完最后一个,回到封面+大播放按钮
|
|
222
|
+
// 重置回第一个视频(仅更新地址,不自动播放,等用户点击大播放按钮)
|
|
223
|
+
this.setData({
|
|
224
|
+
showPoster: true,
|
|
225
|
+
showBigPlay: true,
|
|
226
|
+
playStatus: 'paused',
|
|
227
|
+
pausedFlag: true,
|
|
228
|
+
currentVodPlayTime: 0,
|
|
229
|
+
});
|
|
230
|
+
this.playNextWarmVideo(0, false);
|
|
231
|
+
}
|
|
232
|
+
},
|
|
233
|
+
/**
|
|
234
|
+
* 播放指定索引的暖场视频(连续/循环播放)
|
|
235
|
+
* @param {number} nextIndex 下一个视频索引
|
|
236
|
+
*/
|
|
237
|
+
async playNextWarmVideo(nextIndex, autoPlay = true) {
|
|
238
|
+
const nextId = this.data.warmVideoIds[nextIndex];
|
|
239
|
+
// 更新调度实例中的点播 id
|
|
240
|
+
if (this.vhallPlayerCore && this.vhallPlayerCore.scheduler) {
|
|
241
|
+
this.vhallPlayerCore.scheduler.option.paasVodId = nextId;
|
|
242
|
+
}
|
|
243
|
+
// 切换视频前先隐藏自定义大播放按钮,避免切换间隙(尤其横屏全屏)
|
|
244
|
+
// video 原生居中播放按钮闪现时与自定义按钮重叠。
|
|
245
|
+
// 仅 autoPlay(续播/循环)时隐藏;autoPlay=false(单次播完重置地址)时保留外层设置的 showBigPlay
|
|
246
|
+
this.setData({ warmVideoIndex: nextIndex });
|
|
247
|
+
if (autoPlay) {
|
|
248
|
+
this.setData({ showBigPlay: false });
|
|
249
|
+
}
|
|
250
|
+
// 重新拉取播放地址并播放
|
|
251
|
+
if (this.data.type == 'vod') {
|
|
252
|
+
try {
|
|
253
|
+
const vodPlayInfo = await this.vhallPlayerCore.initVhallyunVod();
|
|
254
|
+
this.setData({
|
|
255
|
+
videoSrc: vodPlayInfo.videoSrc,
|
|
256
|
+
qualitys: vodPlayInfo.qualitys,
|
|
257
|
+
currentQuality: vodPlayInfo.currentQuality,
|
|
258
|
+
}, () => {
|
|
259
|
+
if (autoPlay) {
|
|
260
|
+
this.play();
|
|
261
|
+
}
|
|
262
|
+
});
|
|
263
|
+
} catch (err) {
|
|
264
|
+
console.error('播放下一个暖场视频失败', err);
|
|
265
|
+
}
|
|
266
|
+
}
|
|
200
267
|
},
|
|
201
268
|
/**
|
|
202
269
|
* loadedmetadata事件(仅点播)
|
|
203
270
|
* @param {*} e
|
|
204
271
|
*/
|
|
205
272
|
onloadedmetadata(e) {
|
|
206
|
-
console.log(`播放loadedmetadata事件:`, e.detail);
|
|
207
273
|
this.triggerEvent('loadedmetadata', e.detail);
|
|
208
274
|
const { duration, width, height } = e.detail;
|
|
209
275
|
this.setData({
|
|
@@ -249,6 +315,41 @@ export function createMethods() {
|
|
|
249
315
|
onreconnecting(e) {
|
|
250
316
|
this.triggerEvent('reconnecting', e.detail);
|
|
251
317
|
},
|
|
318
|
+
/**
|
|
319
|
+
* 判断暖场视频当前是否到达可观看时间
|
|
320
|
+
* advancePlayTime===0:开播前随时可看(默认)
|
|
321
|
+
* advancePlayTime>0:开播前 advancePlayTime 秒才可观看
|
|
322
|
+
* @returns {boolean}
|
|
323
|
+
*/
|
|
324
|
+
canPlayWarmup() {
|
|
325
|
+
const { advancePlayTime, webinarStartTime } = this.data;
|
|
326
|
+
if (advancePlayTime <= 0) return true; // 0 表示开播前随时可看
|
|
327
|
+
if (!webinarStartTime) return true; // 无开播时间则放行
|
|
328
|
+
const startTs = new Date(String(webinarStartTime).replace(/-/g, '/')).getTime();
|
|
329
|
+
if (isNaN(startTs)) return true;
|
|
330
|
+
const nowTs = Date.now();
|
|
331
|
+
// 距离开播还有多少秒
|
|
332
|
+
const remainSec = (startTs - nowTs) / 1000;
|
|
333
|
+
// remainSec <= 0 表示已开播;remainSec <= advancePlayTime 表示已进入可观看窗口
|
|
334
|
+
return remainSec <= advancePlayTime;
|
|
335
|
+
},
|
|
336
|
+
/**
|
|
337
|
+
* 点播封面上的播放按钮点击
|
|
338
|
+
*/
|
|
339
|
+
handlePosterPlay() {
|
|
340
|
+
// 暖场视频:点击播放前校验可观看时间
|
|
341
|
+
if (this.data.warmVideoIds.length > 0 && !this.canPlayWarmup()) {
|
|
342
|
+
wx.showToast({
|
|
343
|
+
title: '尚未到暖场视频播放时间',
|
|
344
|
+
icon: 'none',
|
|
345
|
+
});
|
|
346
|
+
return;
|
|
347
|
+
}
|
|
348
|
+
this.play();
|
|
349
|
+
if (this.data.type == 'live') {
|
|
350
|
+
this.resume();
|
|
351
|
+
}
|
|
352
|
+
},
|
|
252
353
|
startWatchExpire(info) {
|
|
253
354
|
if (!info) return;
|
|
254
355
|
const webinar = this.sdkInstance.store.get('watchInitData.webinar');
|