vhall-mini-sdk 0.3.0 → 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.
Files changed (60) hide show
  1. package/CHANGELOG.md +37 -0
  2. package/lib/components/announcement/announ-banner/index.js +5 -0
  3. package/lib/components/announcement/announ-banner/index.wxml +1 -1
  4. package/lib/components/announcement/announ-banner/index.wxss +1 -1
  5. package/lib/components/announcement/index.js +8 -6
  6. package/lib/components/announcement/index.wxml +1 -1
  7. package/lib/components/chat/chat-item/chat-item.js +6 -0
  8. package/lib/components/chat/chat-item/chat-item.wxml +38 -0
  9. package/lib/components/chat/chat-item/chat-item.wxss +1 -1
  10. package/lib/components/chat/chat-list/chat-list.js +40 -2
  11. package/lib/components/chat/chat-list/chat-list.wxml +1 -1
  12. package/lib/components/chat/chat.js +4 -0
  13. package/lib/components/chat/chat.wxml +2 -3
  14. package/lib/components/chat/chat.wxss +1 -1
  15. package/lib/components/chat-recommend/index.js +113 -0
  16. package/lib/components/chat-recommend/index.json +4 -0
  17. package/lib/components/chat-recommend/index.wxml +10 -0
  18. package/lib/components/chat-recommend/index.wxss +1 -0
  19. package/lib/components/live-landscape/live-landscape.js +15 -0
  20. package/lib/components/live-landscape/live-landscape.json +2 -0
  21. package/lib/components/live-landscape/live-landscape.wxml +3 -1
  22. package/lib/components/live-portrait/live-portrait.js +14 -0
  23. package/lib/components/live-portrait/live-portrait.json +3 -1
  24. package/lib/components/live-portrait/live-portrait.wxml +4 -2
  25. package/lib/components/live-portrait/live-portrait.wxss +1 -1
  26. package/lib/components/lottery/lottery-shake/lottery-shake.js +6 -5
  27. package/lib/components/lottery/lottery-shake/lottery-shake.wxml +6 -1
  28. package/lib/components/lottery/lottery-slot/lottery-slot.js +9 -5
  29. package/lib/components/lottery/lottery-slot/lottery-slot.wxml +6 -1
  30. package/lib/components/lottery/lottery-wheel/lottery-wheel.js +16 -16
  31. package/lib/components/lottery/lottery-wheel/lottery-wheel.wxml +10 -4
  32. package/lib/components/lottery/lottery-wheel/lottery-wheel.wxss +1 -1
  33. package/lib/components/lottery/lottery.js +36 -16
  34. package/lib/components/lottery/lottery.wxml +5 -4
  35. package/lib/components/lottery/lottery.wxss +1 -1
  36. package/lib/components/player/components/main/index.wxml +2 -2
  37. package/lib/components/player/components/poster/poster.wxml +1 -1
  38. package/lib/components/player/components/poster/poster.wxss +1 -1
  39. package/lib/components/player/extensions/data.js +11 -1
  40. package/lib/components/player/extensions/methods.js +104 -3
  41. package/lib/components/player/extensions/observers.js +13 -8
  42. package/lib/components/player/player.wxml +16 -5
  43. package/lib/components/player/player.wxss +1 -1
  44. package/lib/components/product/product-card/product-card.js +9 -1
  45. package/lib/components/product/product-card/product-card.wxml +9 -16
  46. package/lib/components/product/product-card/product-card.wxss +1 -1
  47. package/lib/components/product/product-detail/product-detail.js +9 -1
  48. package/lib/components/product/product-item/product-item.js +14 -1
  49. package/lib/components/product/product-item/product-item.wxss +1 -1
  50. package/lib/components/product/product-list/product-list.wxml +1 -1
  51. package/lib/components/product/product-order/product-order.js +20 -13
  52. package/lib/components/product/product-order/product-order.wxss +1 -1
  53. package/lib/pubComponents/countdown/countdown.wxss +1 -1
  54. package/lib/pubComponents/popup/popup.js +1 -0
  55. package/lib/sdk/main/index.js +2 -2
  56. package/lib/sdk/player/index.js +1 -1
  57. package/lib/sdk/plugins/LotteryServer.js +1 -1
  58. package/lib/sdk/plugins/ProductServer.js +1 -1
  59. package/lib/shared/utils.js +1 -1
  60. package/package.json +3 -2
package/CHANGELOG.md ADDED
@@ -0,0 +1,37 @@
1
+ # Changelog
2
+
3
+ 本项目所有重要变更均记录于此文件。
4
+
5
+ 格式遵循 [Keep a Changelog](https://keepachangelog.com/),版本号遵循 [语义化版本](https://semver.org/lang/zh-CN/)。
6
+
7
+ ## [0.4.0] - 2026-08-20
8
+
9
+ - [A]  新增 **口令抽奖** 功能。
10
+ - [A]  新增 **聊天精选** 功能。
11
+ - [A]  新增 **商品消息在聊天区展示** 功能。
12
+ - [A]  新增 **暖场视频** 功能。
13
+ - [F]  修复了一些已知的缺陷。
14
+
15
+ ## [0.3.1] - 2026-08-13
16
+
17
+ - [F]  修复公告关闭事件定义重复问题。
18
+
19
+ ## [0.3.0] - 2026-08-13
20
+
21
+ - [A]  新增直播和回放场景下 **公告** 能力。
22
+ - [A]  VhallMiniSdk增加 **VERSION** 属性,实例增加 **version** 属性, 方便获取当前SDK版本号。
23
+ - [C]  SDK 错误页支持直播模式(mode,0:竖屏,1:横屏)初始0或1,不用空值,业务侧无需额外调用 setData 即可正常展示。
24
+ - [F]  修复某些场景下商城奖励计时不动以及计时不准确的问题。
25
+
26
+ ## [0.2.1] - 2026-08-06
27
+
28
+ - [C]  SDK和几个插件都去掉了具名导出,避免默认导出和具名导出混用带来的问题。
29
+
30
+ ```js
31
+ // 旧
32
+ import { MallRewardServer } from ...
33
+ // 新
34
+ import MallRewardServer from ...
35
+ ```
36
+
37
+ - [F]  修复某些场景下收不到消息的问题。
@@ -17,6 +17,11 @@ Component({
17
17
  type: Number,
18
18
  value: 0,
19
19
  },
20
+ // 横屏下与聊天精选重叠时的层级
21
+ zIndex: {
22
+ type: Number,
23
+ value: 99,
24
+ },
20
25
  },
21
26
 
22
27
  data: {
@@ -1,4 +1,4 @@
1
- <view wx:if="{{show }}" class="announ-banner {{static ? 'announ-banner--static' : ''}} mode-{{mode}}">
1
+ <view wx:if="{{show }}" class="announ-banner {{static ? 'announ-banner--static' : ''}} mode-{{mode}}" style="z-index:{{zIndex}};">
2
2
  <view class="announ-banner-icon">
3
3
  <view class="announ-banner-icon__box"></view>
4
4
  <view class="announ-banner-icon__body"></view>
@@ -1 +1 @@
1
- .announ-banner{align-items:center;background:rgba(0,0,0,.5);border-radius:40rpx;box-sizing:border-box;color:#fff;display:flex;font-size:24rpx;left:12rpx;padding:0 12rpx;position:fixed;right:12rpx;top:180rpx;z-index:99}.announ-banner-icon{color:#fff;flex-shrink:0;height:32rpx;margin-right:16rpx;position:relative;width:34rpx}.mode-1 .announ-banner-icon{color:#fb3a32}.announ-banner-icon__box{background:currentColor;border-bottom-left-radius:4rpx;border-top-left-radius:4rpx;height:14rpx;left:3rpx;position:absolute;top:9rpx;width:7rpx;z-index:2}.announ-banner-icon__body{background:currentColor;border-radius:4rpx 6rpx 6rpx 4rpx;-webkit-clip-path:polygon(0 20%,0 80%,78% 100%,78% 0);clip-path:polygon(0 20%,0 80%,78% 100%,78% 0);height:28rpx;left:8rpx;position:absolute;top:2rpx;width:15rpx}.announ-banner-icon__wave{background:currentColor;border-radius:4rpx;position:absolute}.announ-banner-icon__wave--top{height:4rpx;right:4rpx;top:5rpx;transform:rotate(-32deg);width:9rpx}.announ-banner-icon__wave--mid{height:4rpx;right:1rpx;top:14rpx;width:11rpx}.announ-banner-icon__wave--bottom{bottom:5rpx;height:4rpx;right:4rpx;transform:rotate(32deg);width:9rpx}.announ-banner-text-wrap{align-items:center;display:flex;flex:1;height:100%;overflow:hidden;padding:6rpx 0}.announ-banner-text{animation:announ-banner-scroll linear infinite;display:inline-block;padding-left:100%;white-space:nowrap}.announ-banner--static .announ-banner-text{animation:none;padding-left:0}.announ-banner-close{flex-shrink:0;font-size:32rpx;margin-left:16rpx}.announ-banner.mode-1{background:linear-gradient(59.32deg,#ffebe9,#edecff 107.06%);border-radius:0;color:#262626;left:0;max-width:none;padding:16rpx 12rpx;right:0;top:calc(56.25vw + 85rpx);transform:none;width:100%}@keyframes announ-banner-scroll{0%{transform:translateX(0)}to{transform:translateX(-100%)}}
1
+ .announ-banner{align-items:center;background:rgba(0,0,0,.5);border-radius:40rpx;box-sizing:border-box;color:#fff;display:flex;font-size:24rpx;left:12rpx;padding:0 12rpx;position:fixed;right:12rpx;top:180rpx;z-index:99}.announ-banner-icon{color:#fff;flex-shrink:0;height:32rpx;margin-right:16rpx;position:relative;width:34rpx}.mode-1 .announ-banner-icon{color:#fb3a32}.announ-banner-icon__box{background:currentColor;border-bottom-left-radius:4rpx;border-top-left-radius:4rpx;height:14rpx;left:3rpx;position:absolute;top:9rpx;width:7rpx;z-index:2}.announ-banner-icon__body{background:currentColor;border-radius:4rpx 6rpx 6rpx 4rpx;-webkit-clip-path:polygon(0 20%,0 80%,78% 100%,78% 0);clip-path:polygon(0 20%,0 80%,78% 100%,78% 0);height:28rpx;left:8rpx;position:absolute;top:2rpx;width:15rpx}.announ-banner-icon__wave{background:currentColor;border-radius:4rpx;position:absolute}.announ-banner-icon__wave--top{height:4rpx;right:4rpx;top:5rpx;transform:rotate(-32deg);width:9rpx}.announ-banner-icon__wave--mid{height:4rpx;right:1rpx;top:14rpx;width:11rpx}.announ-banner-icon__wave--bottom{bottom:5rpx;height:4rpx;right:4rpx;transform:rotate(32deg);width:9rpx}.announ-banner-text-wrap{align-items:center;display:flex;flex:1;height:100%;overflow:hidden;padding:6rpx 0}.announ-banner-text{animation:announ-banner-scroll linear infinite;display:inline-block;padding-left:100%;white-space:nowrap}.announ-banner--static .announ-banner-text{animation:none;padding-left:0}.announ-banner-close{flex-shrink:0;font-size:32rpx;margin-left:16rpx}.announ-banner.mode-1{background:linear-gradient(59.32deg,#ffebe9,#edecff 107.06%);border-radius:0;color:#262626;font-size:28rpx;left:0;max-width:none;padding:16rpx 24rpx;right:0;top:calc(56.25vw + 85rpx);transform:none;width:100%}@keyframes announ-banner-scroll{0%{transform:translateX(0)}to{transform:translateX(-100%)}}
@@ -20,6 +20,7 @@ Component({
20
20
  isStatic: false, // 公告banner内容是否静止不滚动(display_type==1)
21
21
  curNoticeId: '', // 当前展示的公告 id
22
22
  badge: 0, // 公告未读角标数字(收到推送 +1,打开弹窗清零)
23
+ bannerZIndex: 99, // 横屏下与聊天精选重叠时的层级(来自 store.zIndex.announBanner)
23
24
  },
24
25
 
25
26
  observers: {
@@ -37,6 +38,9 @@ Component({
37
38
 
38
39
  this.applyAnnouncement(val);
39
40
  },
41
+ 'zIndex.announBanner': (val) => {
42
+ this.setData({ bannerZIndex: val });
43
+ },
40
44
  });
41
45
 
42
46
  this.initEventListener();
@@ -85,7 +89,10 @@ Component({
85
89
  const list = (prev.list || []).filter((it) => it.id !== item.id);
86
90
  list.unshift(item);
87
91
 
92
+ // 设置公告内容
88
93
  this.sdkInstance.store.set('announcement', { list, total: list.length });
94
+ // 公告置顶(层级最高)
95
+ this.sdkInstance.store.setZIndex('announBanner');
89
96
  // 收到推送公告,未读角标 +1
90
97
  this.setData({ badge: this.data.badge + 1 });
91
98
  };
@@ -204,7 +211,7 @@ Component({
204
211
  this.setData({ showBanner: false });
205
212
  },
206
213
 
207
- // 用户手动关闭当前 banner:记录该公告 id,同一条不再自动弹(新公告仍展示)
214
+ // 用户手动关闭当前 banner
208
215
  handleBannerClose() {
209
216
  this.clearTimer();
210
217
  this.setData({ showBanner: false });
@@ -219,10 +226,5 @@ Component({
219
226
  handlePopupClose() {
220
227
  this.setData({ showPopup: false });
221
228
  },
222
-
223
- // 关闭顶部滚动条(用户手动关闭)
224
- handleBannerClose() {
225
- this.closeAnnouncement();
226
- },
227
229
  },
228
230
  });
@@ -1,5 +1,5 @@
1
1
  <!-- 公告顶部滚动条 -->
2
- <announ-banner show="{{showBanner}}" text="{{bannerText}}" static="{{isStatic}}" mode="{{mode}}" bind:close="handleBannerClose" />
2
+ <announ-banner show="{{showBanner}}" text="{{bannerText}}" static="{{isStatic}}" mode="{{mode}}" zIndex="{{bannerZIndex}}" bind:close="handleBannerClose" />
3
3
  <!-- 公告浮动小图标 -->
4
4
  <announ-icon wx:if="{{showIcon}}" showIcon="{{showIcon}}" badge="{{badge}}" mode="{{mode}}" bind:onTapIcon="handleIconClick" />
5
5
  <!-- 公告弹窗 -->
@@ -130,6 +130,12 @@ Component({
130
130
  },
131
131
  },
132
132
  methods: {
133
+ // 点击商品推送消息,向上抛出事件由父组件弹出商品详情
134
+ onTapGoods() {
135
+ if (this.data.chatItem?.type === 'push_goods_change') {
136
+ this.triggerEvent('tapgoods', this.data.chatItem);
137
+ }
138
+ },
133
139
  _updateContent() {
134
140
  if (!['text', 'image'].includes(this.data.chatItem?.type || this.data.chatItem?.data?.type))
135
141
  return;
@@ -8,6 +8,25 @@
8
8
  <image class="gift-img" src="{{chatItem.gift_image_url}}" />
9
9
  </view>
10
10
  </block>
11
+ <!-- 商品推送 -->
12
+ <block wx:elif="{{chatItem.type=='push_goods_change'}}">
13
+ <view class="chat-item-goods" bindtap="onTapGoods">
14
+ <view wx:if="{{chatItem.roleTag}}" class="role-tag">{{chatItem.roleTag}}</view>
15
+ <text class="chat-item-goods-user">{{chatItem.nickname}}</text>
16
+ <text class="chat-item-goods-text">推送了 商品</text>
17
+ <text class="chat-item-goods-text" style="color:#0a7ff5">点击查看</text>
18
+ <text class="chat-item-goods-name">{{chatItem.goods_name}}</text>
19
+ </view>
20
+ </block>
21
+ <!-- 商品购买中 -->
22
+ <block wx:elif="{{chatItem.type=='popup_buy'|| chatItem.type=='popup_click'}}">
23
+ <view class="chat-item-goods">
24
+ <image class="icon-img" src="https://t-alistatic01.e.vhall.com/common-static/images/mp/cart.png" />
25
+ <text class="chat-item-goods-user">{{chatItem.nickname}}</text>
26
+ <text class="text-buying">正在买</text>
27
+ <text class="chat-item-goods-name">{{chatItem.goods_name}}</text>
28
+ </view>
29
+ </block>
11
30
  <block wx:else>
12
31
  <view class="chat-item_left">
13
32
  <image class="chat-item_left_avatar" src="{{chatItem.context.avatar ||'https://cnstatic01.e.vhall.com/common-static/images/default_avatar.png'}}"></image>
@@ -57,6 +76,25 @@
57
76
  <image class="gift-img" src="{{chatItem.gift_image_url}}" />
58
77
  </view>
59
78
  </block>
79
+ <!-- 商品推送 -->
80
+ <block wx:elif="{{chatItem.type=='push_goods_change'}}">
81
+ <view class="chat-item-goods" bindtap="onTapGoods">
82
+ <view wx:if="{{chatItem.roleTag}}" class="role-tag">{{chatItem.roleTag}}</view>
83
+ <text class="chat-item-goods-user">{{chatItem.nickname}}</text>
84
+ <text class="chat-item-goods-text">推送了商品</text>
85
+ <text class="chat-item-goods-text" style="color:#0a7ff5">点击查看</text>
86
+ <text class="chat-item-goods-name">{{chatItem.goods_name}}</text>
87
+ </view>
88
+ </block>
89
+ <!-- 商品购买中 -->
90
+ <block wx:elif="{{chatItem.type=='popup_buy'|| chatItem.type=='popup_click'}}">
91
+ <view class="chat-item-goods">
92
+ <image class="icon-img" src="https://t-alistatic01.e.vhall.com/common-static/images/mp/cart.png" />
93
+ <text class="chat-item-goods-user">{{chatItem.nickname}}</text>
94
+ <text class="text-buying">正在买</text>
95
+ <text class="chat-item-goods-name">{{chatItem.goods_name}}</text>
96
+ </view>
97
+ </block>
60
98
  <block wx:else>
61
99
  <view class="chat-item_content_reply" wx:if="{{ chatItem.context.replyMsg.content }}">
62
100
  <view class="chat-item_content_reply_username">
@@ -1 +1 @@
1
- .chat-item{display:flex;margin-bottom:24rpx}.chat-item_left{margin-right:16rpx}.chat-item_left_avatar{border-radius:50%;height:2rem;width:2rem}.chat-item_right{flex:1}.chat-item_right_user{align-items:center;display:flex;line-height:2rem}.chat-item_right_user_level{align-items:center;display:flex;margin-right:8rpx}.chat-item_right_user_level .chat-item_vip-icon{height:1rem;width:auto}.chat-item_right_user_name{align-items:center;color:#8c8c8c;display:flex;font-size:1rem;margin-right:8rpx;max-width:340rpx;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.chat-item_right_user_role{align-items:center;border-radius:.6rem;display:flex;font-size:.8rem;height:1.2rem;line-height:1;padding:0 .3rem}.chat-item_right_user_role.role_1{background-color:rgba(251,38,38,.15);color:#fb2626}.chat-item_right_user_role.role_3,.chat-item_right_user_role.role_4{background-color:rgba(10,127,245,.15);color:#0a7ff5}.chat-item_right_content{background-color:#fff;border-radius:0 16rpx 16rpx 16rpx;font-size:1rem;line-height:1.25rem;margin-top:10rpx;max-width:460rpx;overflow-wrap:break-word;padding:12rpx 16rpx;width:-webkit-fit-content;width:fit-content;word-break:break-word}.chat-item_right_content .chat-item_reply_text{vertical-align:middle}.chat-item_right_content .face_img{height:1.2rem;vertical-align:middle;width:1.2rem}.chat-item_right_content_img{border-radius:12rpx;height:100rpx;margin-right:10rpx;object-fit:contain;width:100rpx}.chat-item_right_content_img:last-child{margin-right:0}.chat-item .chat-item_content_reply{color:#999;font-size:.93rem;padding-left:20rpx;position:relative}.chat-item .chat-item_content_reply:before{background:#bfbfbf;border-radius:3rpx;content:" ";height:100%;left:0;position:absolute;top:0;width:6rpx}.chat-item .chat-item_content_reply_username{color:#8c8c8c;display:inline}.chat-item .relpy_icon{color:#fc9600;margin-right:8rpx}.chat-item.mode0{background:rgba(0,0,0,.35);border-radius:26rpx;color:#fff;display:block;font-size:1rem;margin-bottom:16rpx;max-width:520rpx;padding:8rpx 24rpx;width:-webkit-fit-content;width:fit-content;word-break:break-all}.chat-item.mode0 .chat-item_right_user{align-items:baseline;display:inline-flex;flex-wrap:nowrap;vertical-align:top}.chat-item.mode0 .chat-item_right_user .chat-item_right_user_level{align-items:center;align-self:center;display:flex;flex:none;margin-right:8rpx}.chat-item.mode0 .chat-item_right_user .chat-item_right_user_level .chat-item_vip-icon{height:1.1rem;width:auto}.chat-item.mode0 .chat-item_right_user .chat-item_user_name{color:#8ce7ff;flex:none;font-size:1rem;line-height:1.25rem;margin-right:0;white-space:nowrap}.chat-item.mode0 .chat-item_right_user .chat-item_role{flex:none}.chat-item.mode0 .chat-item_role{border-radius:.5rem;display:inline-block;font-size:.68rem;height:1rem;line-height:1rem;margin-right:12rpx;padding:0 10rpx;vertical-align:middle}.chat-item.mode0 .chat-item_role.role_1{background-color:rgba(251,38,38,.15);color:#fb2626}.chat-item.mode0 .chat-item_role.role_3,.chat-item.mode0 .chat-item_role.role_4{background-color:rgba(10,127,245,.15);color:#0a7ff5}.chat-item.mode0 .chat-item_content{display:inline-block;font-size:1rem;line-height:1.25rem;vertical-align:top}.chat-item.mode0 .gift-msg{background:transparent;color:#fff;height:auto;margin:0}.chat-item .highlight{color:#0a7ff5}.chat-item .gift-msg{background-color:hsla(9,100%,89%,.2);border-radius:24rpx;color:#262626;height:48rpx;margin:0 auto;padding:0 50rpx 0 24rpx;width:-webkit-fit-content;width:fit-content}.chat-item .gift-msg .gift-img{display:inline-block;height:40rpx;transform:scale(1.8);transform-origin:left center;vertical-align:text-bottom;width:40rpx}.face_img{display:inline-block;height:1.25rem;vertical-align:middle;width:1.25rem}
1
+ .chat-item{display:flex;margin-bottom:24rpx}.chat-item_left{margin-right:16rpx}.chat-item_left_avatar{border-radius:50%;height:2rem;width:2rem}.chat-item_right{flex:1}.chat-item_right_user{align-items:center;display:flex;line-height:2rem}.chat-item_right_user_level{align-items:center;display:flex;margin-right:8rpx}.chat-item_right_user_level .chat-item_vip-icon{height:1rem;width:auto}.chat-item_right_user_name{align-items:center;color:#8c8c8c;display:flex;font-size:1rem;margin-right:8rpx;max-width:340rpx;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.chat-item_right_user_role{align-items:center;border-radius:.6rem;display:flex;font-size:.8rem;height:1.2rem;line-height:1;padding:0 .3rem}.chat-item_right_user_role.role_1{background-color:rgba(251,38,38,.15);color:#fb2626}.chat-item_right_user_role.role_3,.chat-item_right_user_role.role_4{background-color:rgba(10,127,245,.15);color:#0a7ff5}.chat-item_right_content{background-color:#fff;border-radius:0 16rpx 16rpx 16rpx;font-size:1rem;line-height:1.25rem;margin-top:10rpx;max-width:460rpx;overflow-wrap:break-word;padding:12rpx 16rpx;width:-webkit-fit-content;width:fit-content;word-break:break-word}.chat-item_right_content .chat-item_reply_text{vertical-align:middle}.chat-item_right_content .face_img{height:1.2rem;vertical-align:middle;width:1.2rem}.chat-item_right_content_img{border-radius:12rpx;height:100rpx;margin-right:10rpx;object-fit:contain;width:100rpx}.chat-item_right_content_img:last-child{margin-right:0}.chat-item .chat-item_content_reply{color:#999;font-size:.93rem;padding-left:20rpx;position:relative}.chat-item .chat-item_content_reply:before{background:#bfbfbf;border-radius:3rpx;content:" ";height:100%;left:0;position:absolute;top:0;width:6rpx}.chat-item .chat-item_content_reply_username{color:#8c8c8c;display:inline}.chat-item .relpy_icon{color:#fc9600;margin-right:8rpx}.chat-item.mode0{background:rgba(0,0,0,.35);border-radius:26rpx;color:#fff;display:block;font-size:1rem;margin-bottom:16rpx;max-width:440rpx;padding:8rpx 24rpx;width:-webkit-fit-content;width:fit-content;word-break:break-all}.chat-item.mode0 .chat-item_right_user{align-items:baseline;display:inline-flex;flex-wrap:nowrap;vertical-align:top}.chat-item.mode0 .chat-item_right_user .chat-item_right_user_level{align-items:center;align-self:center;display:flex;flex:none;margin-right:8rpx}.chat-item.mode0 .chat-item_right_user .chat-item_right_user_level .chat-item_vip-icon{height:1.1rem;width:auto}.chat-item.mode0 .chat-item_right_user .chat-item_user_name{color:#8ce7ff;flex:none;font-size:1rem;line-height:1.25rem;margin-right:0;white-space:nowrap}.chat-item.mode0 .chat-item_right_user .chat-item_role{flex:none}.chat-item.mode0 .chat-item_role{border-radius:.5rem;display:inline-block;font-size:.68rem;height:1rem;line-height:1rem;margin-right:12rpx;padding:0 10rpx;vertical-align:middle}.chat-item.mode0 .chat-item_role.role_1{background-color:rgba(251,38,38,.15);color:#fb2626}.chat-item.mode0 .chat-item_role.role_3,.chat-item.mode0 .chat-item_role.role_4{background-color:rgba(10,127,245,.15);color:#0a7ff5}.chat-item.mode0 .chat-item_content{display:inline-block;font-size:1rem;line-height:1.25rem;vertical-align:top}.chat-item.mode0 .gift-msg{background:transparent;color:#fff;height:auto;margin:0}.chat-item .highlight{color:#0a7ff5}.chat-item .gift-msg{background-color:hsla(9,100%,89%,.2);border-radius:24rpx;color:#262626;height:48rpx;margin:0 auto;padding:0 50rpx 0 24rpx;width:-webkit-fit-content;width:fit-content}.chat-item .gift-msg .gift-img{display:inline-block;height:40rpx;transform:scale(1.8);transform-origin:left center;vertical-align:text-bottom;width:40rpx}.chat-item .chat-item-goods{-webkit-box-orient:vertical;-webkit-line-clamp:2;background:hsla(9,100%,89%,.2);border-radius:24rpx;color:#fff;display:-webkit-box;font-size:30rpx;margin:0 auto;overflow:hidden;overflow-wrap:anywhere;word-break:break-all}.chat-item .chat-item-goods .role-tag{background-color:rgba(251,38,38,.15);border-radius:24rpx;color:#fb2626;display:inline-block;font-size:24rpx;margin-right:12rpx;padding:0 16rpx}.chat-item .chat-item-goods .icon-img{display:inline-block;height:32rpx;margin-right:8rpx;vertical-align:middle;width:32rpx}.chat-item .chat-item-goods .chat-item-goods-user{color:hsla(0,0%,100%,.65);max-width:200rpx}.chat-item .chat-item-goods .text-buying{color:#fb2626;padding:0 8rpx}.chat-item .chat-item-goods .btn-view{color:#0a7ff5;padding:0 8rpx}.chat-item .chat-item-goods .chat-item-goods-text{padding:0 8rpx}.chat-item .chat-item-goods .chat-item-goods-name{color:#f78c0c}.chat-item.mode1 .chat-item-goods{color:#262626;padding:6rpx 48rpx}.chat-item.mode1 .chat-item-goods .chat-item-goods-user{color:#262626}.chat-item.mode0{margin-bottom:0}.chat-item.mode0 .chat-item-goods{background:rgba(0,0,0,.35);padding:6rpx}.face_img{display:inline-block;height:1.25rem;vertical-align:middle;width:1.25rem}
@@ -3,6 +3,13 @@ const MSGQUEUE = []; //消息队列,缓存500ms内的消息, 然后批量加
3
3
  let LastMsgList = []; //最新的50-100条消息,用于查看最新消息
4
4
  let count = 0; //缓存新消息数量
5
5
  let clientMsgId = 0; //消息id,定增,用于前端渲染消息列表,防止消息重复导致key重复
6
+
7
+ const _ROLE_TAG_Map = {
8
+ 1: '主持人',
9
+ 2: '观众',
10
+ 3: '助理',
11
+ 4: '嘉宾'
12
+ }
6
13
  Component({
7
14
  properties: {
8
15
  sdkInstance: {
@@ -74,6 +81,17 @@ Component({
74
81
  },
75
82
  },
76
83
  methods: {
84
+ // 商品推送消息点击:从商品列表中取完整商品数据后向上抛出,由上层弹出商品详情
85
+ onTapGoods(e) {
86
+ const chatItem = e.detail || {};
87
+ const goodsId = chatItem.goods_id || chatItem.goodsId;
88
+ if (!goodsId) return;
89
+ const productList = (this.sdkInstance?.store.get('productList') || []);
90
+ const product = productList.find((item) => item.goods_id === goodsId);
91
+ if (product) {
92
+ this.triggerEvent('tapgoods', product);
93
+ }
94
+ },
77
95
  async listenerMsg() {
78
96
  this.unChatListener && this.unChatListener();
79
97
  const user = this.sdkInstance.store.get('user');
@@ -84,8 +102,8 @@ Component({
84
102
  }
85
103
  this._handleMsg(message);
86
104
  };
87
- eventObj[this.sdkInstance.EVENT.GIFT_MSG] = (message) => {
88
- this._handleMsg(message);
105
+ eventObj[this.sdkInstance.EVENT.GIFT_MSG] = (messageData) => {
106
+ this._handleMsg(messageData);
89
107
  };
90
108
  eventObj[this.sdkInstance.EVENT.DELETE_MSG] = (message) => {
91
109
  const msgIds = message.msg_ids.split(',');
@@ -94,6 +112,26 @@ Component({
94
112
  chatList: this.data.chatList.filter((item) => !msgIds.includes(item.msg_id)),
95
113
  });
96
114
  };
115
+ eventObj[this.sdkInstance.EVENT.CUSTOM_MSG] = (message) => {
116
+ // console.log('CUSTOM_MSG:', message);
117
+ const dataType = message.data?.type || '';
118
+ if (['popup_buy', 'popup_click'].includes(dataType)) {
119
+ // 商品购买
120
+ this._handleMsg({
121
+ nickname: (message.data.user_name || '').substring(0, 1) + '**',
122
+ ...message.data
123
+ });
124
+ } else if (dataType === "push_goods_change") {
125
+ // 商品推送
126
+ if (message.data.push_status == 2) return; //取消推送,不加入聊天列表
127
+ let nn = message.data.pusher_nickname || '';
128
+ this._handleMsg({
129
+ nickname: nn.length > 5 ? nn.substring(0, 5) + '...' : nn,
130
+ roleTag: _ROLE_TAG_Map[message.data.role_name] || '',
131
+ ...message.data
132
+ });
133
+ }
134
+ };
97
135
  this.unChatListener = this.sdkInstance.on(eventObj);
98
136
  },
99
137
  _handleMsg(message) {
@@ -1,6 +1,6 @@
1
1
  <scroll-view id="chat-scrollview" reverse="{{ true }}" enable-flex="{{ true }}" class="chat-scroll-view" scroll-y enhanced scroll-with-animation="{{ animationFlag }}" scroll-into-view="{{ scrollIntoViewId }}" show-scrollbar="{{ false }}" bindscroll="bindscroll" bindscrolltolower="bindscrolltolower" bindscrolltoupper="getHistoryList">
2
2
  <view id="chat-list-list" class="chat-list-list mode{{ mode }}">
3
- <chat-item mode="{{ mode }}" memberLevel="{{ memberLevel }}" id="view{{ item.id }}" wx:for="{{ chatList }}" wx:for-index="index" wx:for-item="item" wx:key="id" chatItem="{{ item }}"></chat-item>
3
+ <chat-item mode="{{ mode }}" memberLevel="{{ memberLevel }}" id="view{{ item.id }}" wx:for="{{ chatList }}" wx:for-index="index" wx:for-item="item" wx:key="id" chatItem="{{ item }}" bind:tapgoods="onTapGoods"></chat-item>
4
4
  </view>
5
5
  <view id="chat-bottom"></view>
6
6
  </scroll-view>
@@ -47,6 +47,10 @@ Component({
47
47
  * 组件的方法列表
48
48
  */
49
49
  methods: {
50
+ // 商品推送消息点击:上抛 productClick 事件,复用直播间 handleProductClick 弹出详情
51
+ onTapGoods(e) {
52
+ this.triggerEvent('productClick', e.detail);
53
+ },
50
54
  // 显示接收到的消息
51
55
  showMessage(type, message) {
52
56
  const newMessage = {
@@ -1,7 +1,6 @@
1
1
  <view class="chat-wrap mode{{mode}}">
2
- <chat-list class="chat-list" mode="{{mode}}" id="chatList" sdkInstance="{{sdkInstance}}" chat-list="{{ chatList }}" />
2
+ <chat-list class="chat-list" mode="{{mode}}" id="chatList" sdkInstance="{{sdkInstance}}" chat-list="{{ chatList }}" bind:tapgoods="onTapGoods" />
3
3
  <chat-edit class="chat-edit" sdkInstance="{{sdkInstance}}">
4
4
  <slot></slot>
5
5
  </chat-edit>
6
- </view>
7
-
6
+ </view>
@@ -1 +1 @@
1
- .chat-wrap{display:flex;flex-direction:column;font-family:PingFang SC,Helvetica Neue,Helvetica,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;height:100%;width:100%}.chat-wrap .chat-edit{height:3.2rem;padding-bottom:env(safe-area-inset-bottom);width:100%}.chat-wrap.mode1 .chat-edit{background-color:#fff}.chat-wrap.mode0 .comment-wrapper .chat-edit-input-box{flex:1;width:auto}.chat-wrap.mode0 .comment-wrapper .chat-edit-input,.chat-wrap.mode0 .comment-wrapper .chat-edit-input-placeholder{color:#fff}.chat-list{flex:1;height:0;position:relative}
1
+ .chat-wrap{display:flex;flex-direction:column;font-family:PingFang SC,Helvetica Neue,Helvetica,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;height:100%;position:relative;width:100%}.chat-wrap .featured-message{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4rpx 12rpx rgba(102,126,234,.3);display:flex;justify-content:space-between;left:0;padding:16rpx 60rpx 16rpx 16rpx;position:absolute;right:0;top:0;z-index:10}.chat-wrap .featured-message-content{flex:1;overflow:hidden}.chat-wrap .featured-message-header{align-items:center;display:flex;margin-bottom:8rpx}.chat-wrap .featured-message-label{background:hsla(0,0%,100%,.3);border-radius:4rpx;color:#fff;font-size:.75rem;margin-right:12rpx;padding:2rpx 12rpx}.chat-wrap .featured-message-nickname{color:hsla(0,0%,100%,.9);font-size:.85rem;font-weight:500}.chat-wrap .featured-message-text{color:#fff;font-size:.95rem;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-wrap .featured-message-close{align-items:center;color:hsla(0,0%,100%,.8);cursor:pointer;display:flex;font-size:1.5rem;height:44rpx;justify-content:center;line-height:1;position:absolute;right:16rpx;top:50%;transform:translateY(-50%);width:44rpx}.chat-wrap .featured-message-close:active{color:#fff}.chat-wrap .chat-edit{height:3.2rem;padding-bottom:env(safe-area-inset-bottom);width:100%}.chat-wrap.mode1 .chat-edit{background-color:#fff}.chat-wrap.mode0 .comment-wrapper .chat-edit-input-box{flex:1;width:auto}.chat-wrap.mode0 .comment-wrapper .chat-edit-input,.chat-wrap.mode0 .comment-wrapper .chat-edit-input-placeholder{color:#fff}.chat-list{flex:1;height:0;position:relative}
@@ -0,0 +1,113 @@
1
+ import { isEmpty } from '../../shared/utils.js'
2
+ Component({
3
+ properties: {
4
+ sdkInstance: {
5
+ type: Object,
6
+ value: null,
7
+ },
8
+ // 直播间模式:0=竖屏,1=横屏(样式区分)
9
+ mode: {
10
+ type: Number,
11
+ value: 0,
12
+ },
13
+ },
14
+
15
+ data: {
16
+ showBanner: false, // 是否展示聊天精选 banner
17
+ nickName: '', // 发送者昵称
18
+ content: '', // 聊天精选内容
19
+ bannerZIndex: 100, // 横屏下与公告重叠时的层级(来自 store.zIndex.chatMsgRecommend)
20
+ },
21
+
22
+ observers: {
23
+ sdkInstance: function sdkInstance(_sdkInstance) {
24
+ if (!_sdkInstance) return;
25
+ this.sdkInstance = _sdkInstance;
26
+ this.unsub = this.sdkInstance.store.get({
27
+ chatMsgRecommend: (val) => {
28
+ this.applyRecommend(val);
29
+ },
30
+ 'zIndex.chatMsgRecommend': (val) => {
31
+ this.setData({ bannerZIndex: val });
32
+ },
33
+ });
34
+
35
+ this.initEventListener();
36
+ },
37
+ },
38
+
39
+ lifetimes: {
40
+ detached() {
41
+ this.unsub && this.unsub();
42
+ this.unlistener?.();
43
+ },
44
+ },
45
+
46
+ methods: {
47
+ initEventListener() {
48
+ this.unlistener?.();
49
+ const EVENT = this.sdkInstance.EVENT;
50
+ const obj = {};
51
+ // 推送聊天精选(单条):直接覆盖 store 中的聊天精选
52
+ obj[EVENT.CHAT_MSG_SET_RECOMMEND] = (msg) => {
53
+ const data = msg?.data || msg;
54
+ if (!data) return;
55
+ const item = {
56
+ id: data.msg_id,
57
+ content: data.msg_content,
58
+ nick_name: data.msg_account_nickname,
59
+ created_at: data.created_at,
60
+ };
61
+ // 设置精选内容
62
+ this.sdkInstance.store.set('chatMsgRecommend', item);
63
+ // 精选置顶
64
+ this.sdkInstance.store.setZIndex('chatMsgRecommend');
65
+ };
66
+
67
+ // 删除聊天精选:清空
68
+ obj[EVENT.CHAT_MSG_DEL_RECOMMEND] = (msg) => {
69
+ this.sdkInstance.store.set('chatMsgRecommend', null);
70
+ };
71
+
72
+ // 直播结束:自动关闭
73
+ obj[EVENT.LIVE_END] = () => {
74
+ this.closeRecommend();
75
+ };
76
+
77
+ this.unlistener = this.sdkInstance.on(obj);
78
+ },
79
+
80
+ // 根据 store 数据统一处理展示逻辑(单条)
81
+ // 兼容两种字段来源:
82
+ // 1) 接口初始值 / 推送原始结构:msg_content / msg_account_nickname / msg_id
83
+ // 2) 推送事件已归一化结构:content / nick_name / id
84
+ applyRecommend(val) {
85
+ if (isEmpty(val)) {
86
+ this.setData({ showBanner: false, nickName: '', content: '' });
87
+ return;
88
+ }
89
+
90
+ const id = val.id ?? val.msg_id;
91
+ const content = val.content ?? val.msg_content ?? '';
92
+ const nickName = val.nick_name ?? val.msg_account_nickname ?? '';
93
+
94
+ this.setData({
95
+ showBanner: true,
96
+ nickName,
97
+ content,
98
+ curMsgId: id,
99
+ });
100
+ },
101
+
102
+ // 被动关闭(删除/直播结束):关闭当前 banner
103
+ closeRecommend() {
104
+ this.sdkInstance?.store.set('chatMsgRecommend', null);
105
+ this.setData({ showBanner: false, nickName: '', content: '' });
106
+ },
107
+
108
+ // 关闭顶部 banner(用户手动关闭)
109
+ handleClose() {
110
+ this.closeRecommend();
111
+ },
112
+ },
113
+ });
@@ -0,0 +1,4 @@
1
+ {
2
+ "component": true,
3
+ "styleIsolation": "shared"
4
+ }
@@ -0,0 +1,10 @@
1
+ <view wx:if="{{showBanner}}" class="chat-recommend mode-{{mode}}" style="z-index:{{bannerZIndex}};">
2
+ <view class="chat-recommend-body">
3
+ <view class="chat-recommend-text">
4
+ <text class="chat-recommend-tag">「精选」</text>
5
+ <text class="chat-recommend-nick" wx:if="{{nickName}}">{{nickName}}:</text>
6
+ <text class="chat-recommend-content">{{content}}</text>
7
+ </view>
8
+ </view>
9
+ <view class="chat-recommend-close" catchtap="handleClose">&#10005;</view>
10
+ </view>
@@ -0,0 +1 @@
1
+ .chat-recommend{align-items:center;background:rgba(0,0,0,.5);border-radius:16rpx;box-sizing:border-box;color:#fff;display:flex;padding:12rpx 12rpx 12rpx 16rpx;position:fixed;z-index:100}.chat-recommend-body{align-items:flex-start;display:flex;flex:1;overflow:hidden}.chat-recommend-tag{color:#fb3a32;flex-shrink:0;font-size:28rpx;margin-right:8rpx}.chat-recommend-text{-webkit-box-orient:vertical;-webkit-line-clamp:2;display:-webkit-box;flex:1;font-size:28rpx;line-height:40rpx;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.chat-recommend-nick{color:hsla(0,0%,100%,.8);flex-shrink:0;font-size:28rpx}.chat-recommend-close{align-items:center;color:inherit;display:flex;font-size:32rpx;justify-content:center;position:absolute;right:12rpx;top:12rpx}.chat-recommend.mode-0{background:hsla(0,0%,100%,.8);border-radius:16rpx;bottom:calc(32vh + 32rpx);box-shadow:0 2rpx 12rpx rgba(0,0,0,.08);color:#262626;left:28rpx;max-width:520rpx;top:auto}.chat-recommend.mode-0 .chat-recommend-body{padding-right:32rpx}.chat-recommend.mode-0 .chat-recommend-nick{color:rgba(38,38,38,.6)}.chat-recommend.mode-1{background:linear-gradient(59.32deg,#ffebe9,#edecff 107.06%);border-radius:0;color:#262626;left:0;padding:16rpx 24rpx;right:0;top:calc(56.25vw + 85rpx)}.chat-recommend.mode-1 .chat-recommend-nick{color:rgba(38,38,38,.6)}.chat-recommend.mode-1 .chat-recommend-close{margin-left:16rpx;position:static}
@@ -178,10 +178,18 @@ Component({
178
178
  },
179
179
  // 处理商品点击
180
180
  handleProductClick(e) {
181
+ console.log('handleProductClick:', e.detail);
181
182
  this.setData({
182
183
  selectedProduct: e.detail,
183
184
  showProductDetail: true,
184
185
  });
186
+
187
+ this.sdkInstance.get('productServer')?.reportGoodsView({
188
+ goods_id: e.detail.goods_id,
189
+ third_goods_id: e.detail.third_goods_id,
190
+ act: 'popup_click',
191
+ notice_type: 'buy'
192
+ });
185
193
  },
186
194
  // 关闭商品详情
187
195
  closeProductDetail() {
@@ -199,6 +207,13 @@ Component({
199
207
  showProductDetail: false,
200
208
  showOrder: true,
201
209
  });
210
+
211
+ this.sdkInstance.get('productServer')?.reportGoodsView({
212
+ goods_id: product.goods_id,
213
+ third_goods_id: product.third_goods_id,
214
+ act: 'popup_buy',
215
+ notice_type: 'buy'
216
+ });
202
217
  },
203
218
  // 关闭下单弹窗
204
219
  closeOrder() {
@@ -14,6 +14,7 @@
14
14
  "vhall-lottery": "../lottery/lottery",
15
15
  "vhall-mall-reward":"../mall-reward/index",
16
16
  "vhall-announcement":"../announcement/index",
17
+ "vhall-chat-recommend":"../chat-recommend/index",
17
18
  "start-countdown": "../../pubComponents/countdown/countdown",
18
19
  "signin-dialog": "../signin/signin-dialog",
19
20
  "my-invite-detail": "../invite-rank/my-invite-detail",
@@ -33,6 +34,7 @@
33
34
  "vhall-lottery": "view",
34
35
  "vhall-mall-reward":"view",
35
36
  "vhall-announcement":"view",
37
+ "vhall-chat-recommend":"view",
36
38
  "vhall-invite-rank": "view"
37
39
  },
38
40
  "permissiion": {
@@ -9,7 +9,7 @@
9
9
  <view class="tab-content" data-set="{{item}}" slot="tab-content-{{index}}-{{id}}" wx:if="{{activeTab==index}}">
10
10
  <!-- 礼物显示组件 -->
11
11
  <vhall-gift-display wx:if="{{item.type == '3'}}" sdkInstance="{{sdkInstance}}" />
12
- <vhall-chat class="tab-chat" wx:if="{{item.type == '3'}}" mode="{{1}}" bind:commentCheck="commentCheck" sdkInstance="{{sdkInstance}}">
12
+ <vhall-chat class="tab-chat" wx:if="{{item.type == '3'}}" mode="{{1}}" bind:commentCheck="commentCheck" bind:productClick="handleProductClick" sdkInstance="{{sdkInstance}}">
13
13
  <view class="gift-button" wx:if="{{giftAuth}}" bindtap="showGiftList">
14
14
  <image class="gift-icon" src="https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/icon_gift.020803f8.png" mode="aspectFit"></image>
15
15
  </view>
@@ -73,4 +73,6 @@
73
73
  <vhall-mall-reward wx:if="{{webinarStatus==1||webinarStatus==5}}" sdkInstance="{{sdkInstance}}" />
74
74
  <!-- 公告组件 -->
75
75
  <vhall-announcement wx:if="{{webinarStatus==1||webinarStatus==5}}" sdkInstance="{{sdkInstance}}" mode="{{1}}" />
76
+ <!-- 聊天精选 -->
77
+ <vhall-chat-recommend wx:if="{{webinarStatus==1||webinarStatus==5}}" sdkInstance="{{sdkInstance}}" mode="{{1}}" />
76
78
  </view>
@@ -232,6 +232,13 @@ Component({
232
232
  showProductDetail: true,
233
233
  showProductList: false // 点击商品时关闭商品列表弹窗
234
234
  });
235
+
236
+ this.sdkInstance.get('productServer')?.reportGoodsView({
237
+ goods_id: e.detail.goods_id,
238
+ third_goods_id: e.detail.third_goods_id,
239
+ act: 'popup_click',
240
+ notice_type: 'buy'
241
+ });
235
242
  },
236
243
 
237
244
  // 关闭商品详情
@@ -270,6 +277,13 @@ Component({
270
277
  showProductDetail: false,
271
278
  showOrder: true,
272
279
  });
280
+
281
+ this.sdkInstance.get('productServer')?.reportGoodsView({
282
+ goods_id: product.goods_id,
283
+ third_goods_id: product.third_goods_id,
284
+ act: 'popup_buy',
285
+ notice_type: 'buy'
286
+ });
273
287
  },
274
288
 
275
289
  // 关闭下单弹窗
@@ -14,6 +14,7 @@
14
14
  "vhall-lottery": "../lottery/lottery",
15
15
  "vhall-mall-reward": "../mall-reward/index",
16
16
  "vhall-announcement": "../announcement/index",
17
+ "vhall-chat-recommend": "../chat-recommend/index",
17
18
  "product-detail": "../product/product-detail/product-detail",
18
19
  "start-countdown": "../../pubComponents/countdown/countdown",
19
20
  "signin-dialog": "../signin/signin-dialog",
@@ -35,6 +36,7 @@
35
36
  "vhall-gift-sender": "view",
36
37
  "vhall-lottery": "view",
37
38
  "vhall-invite-rank": "view",
38
- "vhall-announcement": "view"
39
+ "vhall-announcement": "view",
40
+ "vhall-chat-recommend": "view"
39
41
  }
40
42
  }
@@ -6,8 +6,10 @@
6
6
  <view class="count_down_cover" wx:if="{{webinarStatus==2}}">
7
7
  <start-countdown class="count_down" sdkInstance="{{sdkInstance}}"></start-countdown>
8
8
  </view>
9
+ <!-- 聊天精选 -->
10
+ <vhall-chat-recommend wx:if="{{showChat && (webinarStatus==1||webinarStatus==5)}}" sdkInstance="{{sdkInstance}}" mode="{{0}}" />
9
11
  <!-- 聊天及其它菜单展示处理 -->
10
- <vhall-chat class="live_portrait_chat {{webinarStatus==5?'live_back':''}}" wx:if="{{showChat}}" mode="{{0}}" bind:commentCheck="commentCheck" sdkInstance="{{sdkInstance}}">
12
+ <vhall-chat class="live_portrait_chat {{webinarStatus==5?'live_back':''}}" wx:if="{{showChat}}" mode="{{0}}" bind:commentCheck="commentCheck" bind:productClick="handleProductClick" sdkInstance="{{sdkInstance}}">
11
13
  <view class="gift-button" wx:if="{{giftAuth}}" bindtap="showGiftList">
12
14
  <image class="gift-icon" src="https://cnstatic01.e.vhall.com/common-static/saas-wap/static/img/icon_gift.020803f8.png" mode="aspectFit"></image>
13
15
  </view>
@@ -77,7 +79,7 @@
77
79
  <!-- 签到组件 -->
78
80
  <signin-dialog sdkInstance="{{ sdkInstance }}"></signin-dialog>
79
81
  <!-- 商品卡片 -->
80
- <vhall-product-card sdkInstance="{{sdkInstance}}" bind:cardClick="handleProductClick"></vhall-product-card>
82
+ <vhall-product-card sdkInstance="{{sdkInstance}}" bind:cardClick="handleProductClick" bind:buyClick="showOrderDialog"></vhall-product-card>
81
83
  <!-- 商品详情 -->
82
84
  <vh-popup visible="{{showProductDetail}}" mode="bottom" maskClosable="true" bind:close="closeProductDetail">
83
85
  <vhall-product-detail product="{{selectedProduct}}" show="{{showProductDetail}}" sdkInstance="{{sdkInstance}}" bind:close="closeProductDetail" bind:buy="showOrderDialog" />
@@ -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;height:100vh;left:0;margin-top:-52rpx;position:fixed;top:0;top:50%;width:100vw;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{background-color:rgba(0,0,0,.5);height:100vh;left:0;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
+ .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)}