vhall-mini-sdk 0.4.0 → 0.4.3

package/dist/components/product/product-order/product-order.js

@@ -0,0 +1,394 @@
+import { appendParamsToPath } from '../../../shared/utils.js';
+Component({
+  properties: {
+    // 商品数据
+    product: {
+      type: Object,
+      value: {}
+    },
+    // 是否显示
+    show: {
+      type: Boolean,
+      value: false
+    },
+    // SDK实例
+    sdkInstance: {
+      type: Object,
+      value: null
+    }
+  },
+  data: {
+    // 购买数量
+    quantity: 1,
+    // 小计金额
+    subtotal: 0,
+    // 总计金额
+    total: 0,
+    // 格式化后的金额显示
+    subtotalText: '0.00',
+    totalText: '0.00',
+    // 直播间ID
+    webinarId: '',
+    // 微信商户AppID
+    mchAppId: '',
+    // 配置信息
+    enablePhone: 0,
+    enableRemark: 0,
+    enableUsername: 0,
+    // 用户输入信息
+    phone: '',
+    remark: '',
+    username: ''
+  },
+  lifetimes: {
+    attached() {
+      // 组件挂载时初始化配置
+      this.getWebinarSetting();
+    }
+  },
+  observers: {
+    // 监听显示状态变化（兼容旧用法）
+    show: function(show) {
+      if (show) {
+        // 重置数量
+        this.setData({
+          quantity: 1,
+          phone: '',
+          remark: '',
+          username: ''
+        });
+        this.updateAmount();
+        this.getWebinarSetting();
+      }
+    },
+    // 监听数量变化
+    quantity: function(val) {
+      this.updateAmount();
+    },
+    // 监听商品变化
+    product: function(newVal) {
+      if (newVal) {
+        this.updateAmount();
+      }
+    }
+  },
+  methods: {
+    // 获取商户号
+    getMchAppId() {
+      // 可以在这里调用接口获取商户号
+      // 目前使用默认值
+    },
+    // 获取直播间配置信息
+    async getWebinarSetting() {
+      if (!this.properties.sdkInstance) {
+        return;
+      }
+
+      const wxApi = this.properties.sdkInstance.wxApi;
+      const webinarId = this.properties.sdkInstance.webinarId;
+
+      try {
+        const res = await wxApi.sendGet(`/v3/goods/webinar-setting/get-info?webinar_id=${webinarId}`);
+        
+        if (res && res.code === 200 && res.data) {
+          this.setData({
+            enablePhone: res.data.enable_phone || 0,
+            enableRemark: res.data.enable_remark || 0,
+            enableUsername: res.data.enable_username || 0,
+            phone: res.data.phone || '',
+            username: res.data.username || ''
+          });
+        }
+      } catch (error) {
+        console.error('获取直播间配置失败:', error);
+      }
+    },
+    // 输入手机号
+    onPhoneInput(e) {
+      this.setData({
+        phone: e.detail.value
+      });
+    },
+    // 输入备注
+    onRemarkInput(e) {
+      this.setData({
+        remark: e.detail.value
+      });
+    },
+    // 输入昵称
+    onUsernameInput(e) {
+      this.setData({
+        username: e.detail.value
+      });
+    },
+    // 更新金额
+    updateAmount() {
+      const product = this.properties.product;
+      const quantity = this.data.quantity;
+      const price = parseFloat(product.discount_price || product.price || 0);
+      
+      // 确保价格是有效数字
+      const validPrice = isNaN(price) ? 0 : price;
+      const subtotal = validPrice * quantity;
+      const total = subtotal; // 暂不考虑运费
+
+      this.setData({
+        subtotal: subtotal,
+        total: total,
+        subtotalText: subtotal.toFixed(2),
+        totalText: total.toFixed(2)
+      });
+    },
+    // 减少数量
+    decreaseQty() {
+      if (this.data.quantity > 1) {
+        this.setData({
+          quantity: this.data.quantity - 1
+        });
+      }
+    },
+    // 增加数量
+    increaseQty() {
+      const stock = parseInt(this.properties.product.stock || 999);
+      if (this.data.quantity < stock) {
+        this.setData({
+          quantity: this.data.quantity + 1
+        });
+      } else {
+        wx.showToast({
+          title: '库存不足',
+          icon: 'none',
+          duration: 2000
+        });
+      }
+    },
+    // 关闭订单页面
+    closeOrder() {
+      this.setData({
+        show: false
+      });
+      this.triggerEvent('close');
+    },
+    // 提交订单
+    async submitOrder() {
+      const product = this.properties.product;
+      const quantity = this.data.quantity;
+
+      // 检查商品状态
+      if (product.sale_status === 0) {
+        wx.showToast({
+          title: '商品已抢光',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+
+      if (product.covered_status === 1) {
+        wx.showToast({
+          title: '商品待开价',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+
+      // 检查 buy_type
+      if (product.buy_type === 4 && product?.mini_program_config?.mini_program_path) {
+        // 跳转到小程序路径
+        const webinarId = this.properties.sdkInstance.store.get('webinarId');
+        wx.navigateTo({
+          url: appendParamsToPath(product?.mini_program_config?.mini_program_path, { webinarId })
+        });
+        this.closeOrder();
+        return;
+      }
+
+      // 只有 buy_type === 1 时才调用创建订单接口
+      if (product.buy_type !== 1) {
+        wx.showToast({
+          title: '无法购买，请联系主办方',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+
+      // 验证必填字段
+      if (this.data.enableUsername && !this.data.username.trim()) {
+        wx.showToast({
+          title: '请输入昵称',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+
+      if (this.data.enablePhone) {
+        const phone = this.data.phone.trim();
+        if (!phone) {
+          wx.showToast({
+            title: '请输入手机号',
+            icon: 'none',
+            duration: 2000
+          });
+          return;
+        }
+        // 校验手机号格式（11位数字，以1开头）
+        const phoneReg = /^1[0-9]\d{9}$/;
+        if (!phoneReg.test(phone)) {
+          wx.showToast({
+            title: '请输入正确的手机号',
+            icon: 'none',
+            duration: 2000
+          });
+          return;
+        }
+      }
+
+      // 调用创建订单接口
+      await this.createOrder(product, quantity);
+    },
+
+    // 创建订单
+    async createOrder(product, quantity) {
+      if (!this.properties.sdkInstance) {
+        console.error('sdkInstance 不存在');
+        return;
+      }
+
+      const wxApi = this.properties.sdkInstance.wxApi;
+      const webinarId = this.properties.sdkInstance.webinarId;
+      const wxAppId = this.properties.sdkInstance.wxAppId;
+      const userInfo = this.properties.sdkInstance.store.get('user') || {};
+
+      // 构建请求参数
+      const params = {
+        channel_source: 'main',
+        coupon_user_ids: [],
+        ext: {
+          watch_url: `https://test-live.vhall.com/v3/lives/watch/${webinarId}`
+        },
+        goods: [
+          {
+            goods_id: product.goods_id,
+            quantity: quantity,
+            goods_sku_id: '',
+            buy_type: product.buy_type
+          }
+        ],
+        mch_app_id: wxAppId,
+        nickname: userInfo.nickname || '',
+        open_id: userInfo.openId || userInfo.open_id || '',
+        pay_amount: this.data.total.toFixed(2),
+        pay_channel: 'WEIXIN',
+        phone: this.data.phone || userInfo.phone || '',
+        remark: this.data.remark || '',
+        service_code: 'JSAPI',
+        show_url: `https://test-live.vhall.com/v3/lives/watch/${webinarId}`,
+        third_user_id: null,
+        username: this.data.username || userInfo.username || userInfo.nickname || ''
+      };
+
+      try {
+        wx.showLoading({ title: '提交中...' });
+        
+        const res = await wxApi.sendPost('/v3/goods/order/create', params);
+
+        wx.hideLoading();
+
+        if (res && res.code == 200) {
+          // 订单创建成功，调用支付
+          await this.requestPayment(res.data);
+        } else {
+          // 订单创建失败
+          wx.showToast({
+            title: res.msg || '订单创建失败',
+            icon: 'none',
+            duration: 2000
+          });
+        }
+      } catch (error) {
+        wx.hideLoading();
+        console.error('创建订单失败:', error);
+        wx.showToast({
+          title: '创建订单失败',
+          icon: 'none',
+          duration: 2000
+        });
+      }
+    },
+
+    // 调用微信支付
+    async requestPayment(orderInfo) {
+      if (!orderInfo || !orderInfo.ext) {
+        console.error('支付参数错误');
+        wx.showToast({
+          title: '支付参数错误',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+      
+      let payParams;
+      try {
+        payParams = JSON.parse(orderInfo.ext);
+      } catch (e) {
+        console.error('解析支付参数失败:', e);
+        wx.showToast({
+          title: '支付参数解析失败',
+          icon: 'none',
+          duration: 2000
+        });
+        return;
+      }
+
+      try {
+        wx.showLoading({ title: '支付中...' });
+        
+        // 使用 await 方式，不使用 success/fail 回调
+        const result = await wx.requestPayment(payParams);
+
+        wx.hideLoading();
+        
+        if (result && result.errMsg === 'requestPayment:ok') {
+          // 支付成功
+          wx.showToast({
+            title: '支付成功',
+            icon: 'success',
+            duration: 2000
+          });
+          
+          // 关闭订单页面
+          this.closeOrder();
+          
+          // 触发支付成功事件
+          this.triggerEvent('paySuccess', {
+            product: this.properties.product,
+            quantity: this.data.quantity,
+            total: this.data.total,
+            orderInfo: orderInfo
+          });
+        }
+      } catch (error) {
+        wx.hideLoading();
+        console.error('支付失败:', error);
+        
+        if (error && error.errMsg && error.errMsg.includes('cancel')) {
+          wx.showToast({
+            title: '已取消支付',
+            icon: 'none',
+            duration: 2000
+          });
+        } else {
+          wx.showToast({
+            title: '支付失败',
+            icon: 'none',
+            duration: 2000
+          });
+        }
+      }
+    }
+  }
+});

package/dist/components/product/product-order/product-order.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

package/dist/components/product/product-order/product-order.wxml

@@ -0,0 +1,75 @@
+<view class="order-container" catchtap="">
+  <view class="order-header">
+    <text class="order-title">确认订单</text>
+  </view>
+  <scroll-view class="order-content" scroll-y>
+    <view class="product-section">
+      <view class="product-card">
+        <image class="product-img" src="{{product.cover_img || 'https://cnstatic01.e.vhall.com/common-static/images/default_avatar.png'}}" mode="aspectFill"></image>
+        <view class="product-detail">
+          <text class="product-name">{{product.name || '商品名称'}}</text>
+          <text class="product-desc">{{product.description || '商品描述'}}</text>
+          <!-- 价格显示逻辑 -->
+          <block wx:if="{{product.covered_status === 1}}">
+            <text class="covered-price">¥？待开价</text>
+          </block>
+          <block wx:else>
+            <view wx:if="{{product.discount_price && product.price && product.discount_price !== product.price}}" class="product-price-row">
+              <text class="product-discount-price">¥{{product.discount_price}}</text>
+              <text class="product-original-price">¥{{product.price}}</text>
+            </view>
+            <text wx:else class="product-price">¥{{product.discount_price || product.price || 0}}</text>
+          </block>
+        </view>
+      </view>
+    </view>
+    
+    <view class="quantity-section">
+      <text class="section-title">购买数量</text>
+      <view class="quantity-control">
+        <view class="qty-btn" bindtap="decreaseQty">
+          <text class="qty-btn-text">-</text>
+        </view>
+        <text class="qty-value">{{quantity}}</text>
+        <view class="qty-btn" bindtap="increaseQty">
+          <text class="qty-btn-text">+</text>
+        </view>
+      </view>
+    </view>
+    
+    <view class="amount-section">
+      <view class="amount-row">
+        <text class="amount-label">商品小计</text>
+        <text class="amount-value">¥{{subtotalText}}</text>
+      </view>
+      <view class="amount-row total">
+        <text class="amount-label">实付金额</text>
+        <text class="amount-value">¥{{totalText}}</text>
+      </view>
+    </view>
+    
+    <!-- 用户信息输入区域 -->
+    <view class="user-info-section" wx:if="{{enableUsername || enablePhone || enableRemark}}">
+      <view class="input-item" wx:if="{{enableUsername}}">
+        <text class="input-label"><text class="required-mark">*</text>用户信息</text>
+        <input class="input-value" placeholder="请输入姓名" value="{{username}}" bindinput="onUsernameInput" />
+      </view>
+      <view class="input-item" wx:if="{{enablePhone}}">
+        <text class="input-label"><text class="required-mark">*</text>联系电话</text>
+        <input class="input-value" type="number" placeholder="请输入手机号" value="{{phone}}" bindinput="onPhoneInput" />
+      </view>
+      <view class="input-item input-item-top" wx:if="{{enableRemark}}">
+        <text class="input-label">留言备注</text>
+        <textarea class="textarea-value" maxlength="50" placeholder="请输入备注" value="{{remark}}" bindinput="onRemarkInput" />
+      </view>
+    </view>
+  </scroll-view>
+  
+  <view class="order-footer">
+    <view class="footer-left">
+      <text class="footer-label">合计：</text>
+      <text class="footer-total">¥{{totalText}}</text>
+    </view>
+    <view class="submit-btn" bindtap="submitOrder">提交订单</view>
+  </view>
+</view>

package/dist/components/product/product-order/product-order.wxss

@@ -0,0 +1 @@
+.order-mask{align-items:flex-end;background-color:rgba(0,0,0,.5);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:1000}.order-container{background-color:#fff;border-radius:24rpx 24rpx 0 0;display:flex;flex-direction:column;max-height:80vh;width:100%}.order-header{align-items:center;border-bottom:1rpx solid #f5f5f5;display:flex;justify-content:space-between}.order-title{color:#333;font-size:1.29rem;font-weight:700}.order-close{align-items:center;display:flex;height:60rpx;justify-content:center;width:60rpx}.close-icon{color:#999;font-size:1.71rem;line-height:1}.order-content{box-sizing:border-box;flex:1;overflow-y:auto;padding:30rpx 40rpx}.product-section{margin-bottom:30rpx}.product-card{background-color:#fafafa;border-radius:16rpx;display:flex;padding:20rpx}.product-img{border-radius:12rpx;height:160rpx;margin-right:20rpx;width:160rpx}.product-detail{display:flex;flex:1;flex-direction:column;justify-content:space-between}.product-name{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#333;display:-webkit-box;font-size:1.14rem;font-weight:500;line-height:1.43rem;overflow:hidden}.product-desc{color:#999;font-size:.93rem;margin-top:8rpx}.product-price-row{align-items:baseline;display:flex;margin-top:12rpx}.product-price{color:#fb2626;font-size:1.29rem;font-weight:700}.product-discount-price{color:#fb2626;font-size:1.14rem}.product-original-price{color:#999;font-size:.86rem;margin-left:12rpx;text-decoration:line-through}.covered-price{color:#999;font-size:1rem}.quantity-section{align-items:center;border-bottom:1rpx solid #f5f5f5;display:flex;justify-content:space-between;padding:20rpx 0}.section-title{color:#333;font-size:1.07rem}.qty-btn,.quantity-control{align-items:center;display:flex}.qty-btn{background-color:#f5f5f5;border-radius:50%;height:56rpx;justify-content:center;width:56rpx}.qty-btn .qty-btn-text{color:#333;font-size:1.29rem;line-height:1}.qty-value{color:#333;font-size:1.14rem;margin:0 20rpx;min-width:60rpx;text-align:center}.amount-section{margin-top:20rpx}.amount-row{align-items:center;display:flex;justify-content:space-between;padding:16rpx 0}.amount-row.total{border-top:1rpx dashed #e0e0e0;margin-top:10rpx;padding-top:26rpx}.amount-label{color:#666;font-size:1rem}.amount-row.total .amount-label{color:#333;font-size:1.07rem}.amount-value{color:#333;font-size:1rem}.amount-row.total .amount-value{color:#fb2626;font-size:1.29rem;font-weight:700}.order-footer{align-items:center;background-color:#fff;border-top:1rpx solid #f5f5f5;display:flex;justify-content:space-between;padding:24rpx 40rpx}.footer-left{align-items:baseline;display:flex}.footer-label{color:#666;font-size:1rem}.footer-total{color:#fb2626;font-size:1.43rem;font-weight:700;margin-left:8rpx}.submit-btn{background:linear-gradient(135deg,#fb2626,#ff6b6b);border-radius:48rpx;color:#fff;font-size:1.14rem;font-weight:500;padding:24rpx 80rpx}.submit-btn:active{opacity:.8}.user-info-section{border-top:1rpx solid #f5f5f5;margin-top:30rpx;padding-top:30rpx}.input-item{align-items:center;border-bottom:1rpx solid #f5f5f5;display:flex;padding:20rpx 0}.input-item:last-child{border-bottom:none}.input-item-top{align-items:flex-start}.input-label{color:#333;font-size:1.07rem;margin-right:20rpx;text-align:right;width:138rpx}.input-value,.textarea-value{color:#333;flex:1;font-size:1.07rem}.textarea-value{min-height:100rpx}.required-mark{color:#fb2626;margin-left:4rpx}

package/dist/pubComponents/popup/popup.wxss

@@ -0,0 +1 @@
+.popup-container{pointer-events:none;position:fixed;z-index:1000}.popup-container,.popup-mask{bottom:0;left:0;right:0;top:0}.popup-mask{animation:maskFadeIn .25s ease;background-color:rgba(0,0,0,.5);pointer-events:auto;position:absolute}@keyframes maskFadeIn{0%{opacity:0}to{opacity:1}}.popup-content{background-color:#fff;border-radius:16rpx;box-sizing:border-box;pointer-events:auto;position:absolute;width:100%}.popup-content.bottom{animation:slideUp .3s ease;border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:24rpx;border-top-right-radius:24rpx;bottom:0}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.popup-content.center{left:50%;max-width:100%;top:50%;transform:translate(-50%,-50%) scale(.9);width:auto}.popup-content.bottom-right{bottom:0;right:0;width:auto}.popup-header{align-items:center;border-bottom:1rpx solid #eee;color:#333;display:flex;font-size:1.21rem;font-weight:700;justify-content:center;padding:30rpx 32rpx;position:relative}.popup-close{height:40rpx;position:absolute;right:32rpx;top:20rpx;width:40rpx;z-index:6500}.close-icon{height:40rpx;position:relative;width:40rpx}.close-icon:after,.close-icon:before{background-color:#999;content:"";height:2rpx;left:0;position:absolute;top:20rpx;width:40rpx}.close-icon:before{transform:rotate(45deg)}.close-icon:after{transform:rotate(-45deg)}.popup-body{color:#666;font-size:1.07rem;line-height:1.6;padding:0}.popup-body.has-gap{padding:40rpx 32rpx}

package/dist/sdk/config/index.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.config=e():t.config=e()}(self,(function(){return function(){"use strict";var t={d:function(e,n){for(var o in n)t.o(n,o)&&!t.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:n[o]})},o:function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r:function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{_PLATFORM:function(){return o},envConfig:function(){return n}});const n={production:{BASE_URL:"https://open-api.vhall.com",VHALLYUN_API_BASE:"https://api.vhallyun.com",LOG_REPORT_BASE_URL:"https://dc.e.vhall.com/login",PUBLIC_KEY:"-----BEGIN PUBLIC KEY-----\nMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA0eUJFtW3vryA2NXx4M4f\n1w7dg3PHwOCA6Kx7JVfD/9eBGfqLhqsp+pg4AXG4PhuQx8EsV+sncQIiQO5J2//T\n3pO8LftDtCQztLnxnhq+BjhbFeswgfez2CwV2YKLTX2zyZ69T1Vu/M4H4gWSLeiV\n1FcH6xycA2+jG+EvOxSSItCKYT9EkB9BZSKf5RU7gM+qPtzdPtJP5vlsMCa0WnpY\nI6Qrmu/w9CZkL0397gUek9nBpPHkyPYg7ZijF3Gj8EqCMCVVTYpX96k4dd/Rz1em\ns4OSPF5jDsYZi58p+LmTcc3g7W9bD3QWWxzn47ie/Dh9LbnWfCqpGjUaHd3d42vR\ncQIDAQAB\n-----END PUBLIC KEY-----"},test:{BASE_URL:"https://test01-open-api.vhou.tv",VHALLYUN_API_BASE:"https://test01-api.vhallyun.com",LOG_REPORT_BASE_URL:"https://t-dc.e.vhall.com/login",PUBLIC_KEY:"-----BEGIN PUBLIC KEY-----\nMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxWGCgHz2NLdVNa91CsNX\nFfCsxfgkTx738t3yMpuPYLL/5wwuWRrX7hBfNsfC+R5BW5b13ISzD001NNt+BWGK\np3V5fdWO18j9M/AhaTV2Ao/IpdP5huvVoNFVWPUQvX70FHu0sPVTev8ycAZHUpKx\n+mm83wxOpWBN5vAMJYx75pRCQfidb73XbOm6JXLJlxN91TUTrTiblxBhRwH0AQyr\ns9dUr+IJUZ1ea2uU3fkB4uYh7V/cHuNDMsJowfLtEU2+9IqEuJY4OwqX0qdfPF72\nsGMjCgghgL0z/7kv7Qe1+tOkJTBQTzODXBheGTVbF7hH2+5XuZsK2TfgBIew0I4k\n1wIDAQAB\n-----END PUBLIC KEY-----"}},o=19;return e}()}));

package/dist/sdk/plugins/InteractServer.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["plugins/InteractServer"]=e():t["plugins/InteractServer"]=e()}(self,(function(){return function(){"use strict";var t={d:function(e,n){for(var s in n)t.o(n,s)&&!t.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:n[s]})},o:function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r:function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{InteractServer:function(){return s},default:function(){return i}});class n{constructor(){this.handlers=Object.create(null)}on=(t,e)=>{const n=[];if("object"==typeof t&&null!==t)Object.entries(t).forEach((([t,e])=>{this._validateParams(t,e),this._addHandler(t,e),n.push({type:t,handler:e})}));else{if("string"!=typeof t||"function"!=typeof e)throw new Error("参数格式错误，支持：$on(事件名, 处理函数) 或 $on({事件名: 处理函数, ...})");this._validateParams(t,e),this._addHandler(t,e),n.push({type:t,handler:e})}return()=>{n.forEach((({type:t,handler:e})=>{if(!this.handlers[t])return;const n=this.handlers[t].findIndex((t=>t===e));-1!==n&&(this.handlers[t].splice(n,1),0===this.handlers[t].length&&delete this.handlers[t])}))}};emit=(t,...e)=>{this.handlers[t]&&[...this.handlers[t]].forEach((t=>{t(...e)}))};off=(t,e)=>{if(!this.handlers[t])throw new Error(`不存在事件: ${t}`);if(e){const n=this.handlers[t].findIndex((t=>t===e));this.handlers[t].splice(n,1),0===this.handlers[t].length&&delete this.handlers[t]}else delete this.handlers[t]};_validateParams(t,e){if("string"!=typeof t)throw new Error("事件名必须为字符串");if("function"!=typeof e)throw new Error("事件处理函数必须为函数")}_addHandler(t,e){this.handlers[t]||(this.handlers[t]=[]),this.handlers[t].includes(e)||this.handlers[t].push(e)}}class s extends n{static name="InteractServer";constructor(t){super(),this.sdkInstance=t,this.wxApi=t.wxApi,this.likeCount=0,this.likeTimer=null,this.isClicking=!1,this.listenerEvent()}like(){const t=this.sdkInstance.store.get("likeCount")||0;this.sdkInstance.store.set("likeCount",t+1),this.likeCount++,this.likeTimer&&clearTimeout(this.likeTimer),this.likeTimer=setTimeout((()=>{this.isClicking=!1,this.sendLikeRequest()}),2e3)}async sendLikeRequest(){const{interact:t}=this.sdkInstance.store.get("")||{};try{const e="/v3/interacts/like/create-user-like",n={room_id:t.room_id,num:this.likeCount};200==(await this.wxApi.sendPost(e,n)).code&&(this.likeCount=0)}catch(t){console.error("点赞失败:",t)}finally{this.likeTimer=null}}async getGiftList(){const{interact:t}=this.sdkInstance.store.get("")||{};try{const e="/v3/interacts/gift/get-webinar-using-gift-list",n={room_id:t?.room_id},s=await this.wxApi.sendGet(e,n);return s&&s.data&&Array.isArray(s.data.list)?s.data.list.map((t=>({id:t.id,name:t.name,price:t.price,icon:t.image_url}))):[]}catch(t){return console.error("获取礼物列表失败:",t),[]}}async sendGift(t){const{interact:e}=this.sdkInstance.store.get("")||{},n=this.sdkInstance.store?.get("user"),s={room_id:e?.room_id,gift_id:t.id,channel:"WEIXIN",service_code:"H5_PAY",nickname:n?.nickname||""};return await this.wxApi.sendPost("/v3/interacts/gift/send-gift",s)}listenerEvent(){this.sdkInstance.on(this.sdkInstance.EVENT.LIKE_MSG,function(t,e){let n=null,s=0;return function(...i){const r=Date.now(),o=r-s;o>=e?(t.apply(this,i),s=r):n||(n=setTimeout((()=>{t.apply(this,i),s=Date.now(),n=null}),e-o))}}((t=>{if(!this.isClicking){const e=t.data.num;e>this.sdkInstance.store.get("likeCount")&&this.sdkInstance.store.set("likeCount",e)}}),2e3)),this.sdkInstance.on(this.sdkInstance.EVENT.ROOM_MSG,(t=>{"gift_send_success"===t.data.type&&this.sdkInstance.emit(this.sdkInstance.EVENT.GIFT_MSG,t.data)}))}}var i=s;return e}()}));

package/dist/sdk/plugins/LotteryServer.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["plugins/LotteryServer"]=e():t["plugins/LotteryServer"]=e()}(self,(function(){return function(){"use strict";var t={d:function(e,s){for(var n in s)t.o(s,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:s[n]})},o:function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r:function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{LotteryServer:function(){return n},default:function(){return r}});class s{constructor(){this.handlers=Object.create(null)}on=(t,e)=>{const s=[];if("object"==typeof t&&null!==t)Object.entries(t).forEach((([t,e])=>{this._validateParams(t,e),this._addHandler(t,e),s.push({type:t,handler:e})}));else{if("string"!=typeof t||"function"!=typeof e)throw new Error("参数格式错误，支持：$on(事件名, 处理函数) 或 $on({事件名: 处理函数, ...})");this._validateParams(t,e),this._addHandler(t,e),s.push({type:t,handler:e})}return()=>{s.forEach((({type:t,handler:e})=>{if(!this.handlers[t])return;const s=this.handlers[t].findIndex((t=>t===e));-1!==s&&(this.handlers[t].splice(s,1),0===this.handlers[t].length&&delete this.handlers[t])}))}};emit=(t,...e)=>{this.handlers[t]&&[...this.handlers[t]].forEach((t=>{t(...e)}))};off=(t,e)=>{if(!this.handlers[t])throw new Error(`不存在事件: ${t}`);if(e){const s=this.handlers[t].findIndex((t=>t===e));this.handlers[t].splice(s,1),0===this.handlers[t].length&&delete this.handlers[t]}else delete this.handlers[t]};_validateParams(t,e){if("string"!=typeof t)throw new Error("事件名必须为字符串");if("function"!=typeof e)throw new Error("事件处理函数必须为函数")}_addHandler(t,e){this.handlers[t]||(this.handlers[t]=[]),this.handlers[t].includes(e)||this.handlers[t].push(e)}}class n extends s{static name="LotteryServer";constructor(t){super(),this.sdkInstance=t,this.sdkInstance.EVENT=Object.assign({LOTTERY_START:"lottery_push",LOTTERY_END:"lottery_result_notice",LOTTERY_WIN:"lottery_win",LOTTERY_MISS:"lottery_miss"},this.sdkInstance.EVENT),this.wxApi=t.wxApi,this.lotteryList=[],this.lastMsgTime="",this.listenerEvent()}async getLotteryList(t){return this.wxApi.sendGet("/v3/vss/lottery/check-list",{show_all:1,...t}).then((t=>(200==t.code&&(this.lotteryList=t.data||[],this.sdkInstance.store.set("lotteryList",t.data)),t)))}async getLotteryDetail(t){return this.wxApi.sendGet("/v3/lottery/webinar/get-lottery-info",{...t}).then((t=>(200==t.code&&this.sdkInstance.store.set("currentLottery",t.data),t)))}listenerEvent(){const{LOTTERY_START:t,LOTTERY_END:e}=this.sdkInstance.EVENT;this.sdkInstance.on(this.sdkInstance.EVENT.ROOM_MSG,(s=>{[t,e].includes(s.data.type)&&s.date_time>this.lastMsgTime&&(this._handleLotteryMsg(s.data),this.lastMsgTime=s.date_time)}))}async _handleLotteryMsg(t){const{LOTTERY_START:e,LOTTERY_END:s}=this.sdkInstance.EVENT,n=this.sdkInstance.store.get("user");switch(t.type){case e:this.sdkInstance.emit(e,t),this.updateLotteryList({id:t.lottery_id,lottery_status:0,can_look_award_pool:t.can_look_award_pool,win:0});break;case s:const{lottery_winners_award:r,receive_award_way:i}=t,o=r.find((t=>n.user_id==t.uid));o&&(o.receive_award_way=i),this.sdkInstance.emit(s,o,t),this.updateLotteryList({id:t.lottery_id,lottery_status:1,receive_award_way:i,win:o?1:0,title:t.title,publish_winner:t.publish_winner})}}updateLotteryList(t){const e=this.sdkInstance.store.get("lotteryList")||[],s=e.findIndex((e=>e.lottery_id===t.lottery_id));s>=0?e[s]={...e[s],...t}:e.unshift(t),this.sdkInstance.store.set("lotteryList",[...e]),this.lotteryList=e}async joinLottery(t){return this.wxApi.sendPost("/v3/lottery/webinar/join-lottery",{...t})}async getLotteryWinners(t){return this.wxApi.sendGet("/v3/lottery/webinar/get-lottery-winners",{...t})}async getReceiveAwardSetting(t){return this.wxApi.sendPost("/v3/vss/lottery/get-receive-award-setting",t,{headers:{"Content-Type":"application/x-www-form-urlencoded"}}).then((t=>t))}async submitLotteryAward(t){return this.wxApi.sendPost("/v3/vss/lottery/award",t,{headers:{"Content-Type":"application/x-www-form-urlencoded"}}).then((t=>t))}async getLotteryUserInfo(t){const{interact:e}=this.sdkInstance.store.get("");return this.wxApi.sendPost("/v3/vss/lottery/user-info",Object.assign({room_id:e.room_id},t),{headers:{"Content-Type":"application/x-www-form-urlencoded"}}).then((t=>t))}async getAwardList(t){return this.wxApi.sendPost("/v3/vss/lottery/award/list",Object.assign({pos:0,limit:20},t),{headers:{"Content-Type":"application/x-www-form-urlencoded"}}).then((t=>t))}async getWinnerList(t){const{interact:e}=this.sdkInstance.store.get("");return this.wxApi.sendPost("/v3/vss/lottery/users-get",Object.assign({room_id:e.room_id},t),{headers:{"Content-Type":"application/x-www-form-urlencoded"}}).then((t=>t))}}var r=n;return e}()}));

package/dist/sdk/plugins/MallRewardServer.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["plugins/MallRewardServer"]=t():e["plugins/MallRewardServer"]=t()}(self,(function(){return function(){"use strict";var e={d:function(t,n){for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{MallRewardServer:function(){return a},default:function(){return o}});class n{constructor(){this.handlers=Object.create(null)}on=(e,t)=>{const n=[];if("object"==typeof e&&null!==e)Object.entries(e).forEach((([e,t])=>{this._validateParams(e,t),this._addHandler(e,t),n.push({type:e,handler:t})}));else{if("string"!=typeof e||"function"!=typeof t)throw new Error("参数格式错误，支持：$on(事件名, 处理函数) 或 $on({事件名: 处理函数, ...})");this._validateParams(e,t),this._addHandler(e,t),n.push({type:e,handler:t})}return()=>{n.forEach((({type:e,handler:t})=>{if(!this.handlers[e])return;const n=this.handlers[e].findIndex((e=>e===t));-1!==n&&(this.handlers[e].splice(n,1),0===this.handlers[e].length&&delete this.handlers[e])}))}};emit=(e,...t)=>{this.handlers[e]&&[...this.handlers[e]].forEach((e=>{e(...t)}))};off=(e,t)=>{if(!this.handlers[e])throw new Error(`不存在事件: ${e}`);if(t){const n=this.handlers[e].findIndex((e=>e===t));this.handlers[e].splice(n,1),0===this.handlers[e].length&&delete this.handlers[e]}else delete this.handlers[e]};_validateParams(e,t){if("string"!=typeof e)throw new Error("事件名必须为字符串");if("function"!=typeof t)throw new Error("事件处理函数必须为函数")}_addHandler(e,t){this.handlers[e]||(this.handlers[e]=[]),this.handlers[e].includes(t)||this.handlers[e].push(t)}}const r={trace:0,debug:1,info:2,log:2,warn:3,error:4,silent:5};let s=r.info;const i=function(e=""){const t=e?`[${e}]`:"",n="[vhall-mp]",i=e=>e>=s;return{trace:function(...e){i(r.trace)&&console.trace(`${n}${t}`,...e)},debug:function(...e){i(r.debug)&&console.debug(`${n}${t}`,...e)},info:function(...e){i(r.info)&&console.info(`${n}${t}`,...e)},log:function(...e){i(r.log)&&console.log(`${n}${t}`,...e)},warn:function(...e){i(r.warn)&&console.warn(`${n}${t}`,...e)},error:function(...e){i(r.error)&&console.error(`${n}${t}`,...e)}}}("MallRewardServer");class a extends n{static name="MallRewardServer";constructor(e){super(),this.sdkInstance=e,this.wxApi=e.wxApi}async getValidList(){console.log("mall-reward 获取商城奖励列表");const e=this.sdkInstance.store.get("watchInitData"),t={webinar_id:this.sdkInstance.webinarId,sence_type:5==e?.webinar?.type?1:0,switch_id:e?.switch?.switch_id};try{const e=await this.wxApi.sendPost("/v3/vss/mall-reward/get-valid-list",t,{headers:{"Content-Type":"application/x-www-form-urlencoded"}});return e&&200===e.code&&e.data&&(Array.isArray(e.data.list)&&e.data.list.forEach((e=>{e.tip_setting=function(e){const t=Object.prototype.toString.call(e);if(["[object Array]","[object Object]","[object Null]"].includes(t))return e;try{return JSON.parse(e)}catch(e){return null}}(e.tip_setting)})),this.sdkInstance.store.set("mallRewardInfo",e?.data||null),this.updateActiveMallReward()),e?.data||null}catch(e){return i.error("获取商城奖励列表出现异常，error:",e),null}}updateActiveMallReward(){const e=this.sdkInstance.store.get("mallRewardInfo");if(!e||!e.list||0===e.list.length)return null;let t,n=-1;for(let r=0;r<e.list.length;r++){let s=e.list[r];if(0===s.claim_status&&0===s.viewing_minutes&&1===s.status&&s.remaining_quota>0){n=r;break}0===s.claim_status&&s.viewing_minutes>0&&0===s.status&&s.remaining_quota>0&&(void 0===t||s.watch_minute<t)&&(t=s.viewing_minutes,n=r)}return n>-1?e.list[n]:null}async claimMallReward(e){const t=this.sdkInstance.store.get("watchInitData"),n={reward_id:e,webinar_id:this.sdkInstance.webinarId,sence_type:5==t?.webinar?.type?1:0,switch_id:t?.switch?.switch_id};try{return await this.wxApi.sendPost("/v3/vss/mall-reward/receive",n,{headers:{"Content-Type":"application/x-www-form-urlencoded"}})}catch(e){return i.error("领取商城奖励出现异常，error:",e),e}}}var o=a;return t}()}));

package/dist/sdk/plugins/ProductServer.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["plugins/ProductServer"]=e():t["plugins/ProductServer"]=e()}(self,(function(){return function(){"use strict";var t={d:function(e,s){for(var r in s)t.o(s,r)&&!t.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:s[r]})},o:function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r:function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{ProductServer:function(){return r},default:function(){return n}});class s{constructor(){this.handlers=Object.create(null)}on=(t,e)=>{const s=[];if("object"==typeof t&&null!==t)Object.entries(t).forEach((([t,e])=>{this._validateParams(t,e),this._addHandler(t,e),s.push({type:t,handler:e})}));else{if("string"!=typeof t||"function"!=typeof e)throw new Error("参数格式错误，支持：$on(事件名, 处理函数) 或 $on({事件名: 处理函数, ...})");this._validateParams(t,e),this._addHandler(t,e),s.push({type:t,handler:e})}return()=>{s.forEach((({type:t,handler:e})=>{if(!this.handlers[t])return;const s=this.handlers[t].findIndex((t=>t===e));-1!==s&&(this.handlers[t].splice(s,1),0===this.handlers[t].length&&delete this.handlers[t])}))}};emit=(t,...e)=>{this.handlers[t]&&[...this.handlers[t]].forEach((t=>{t(...e)}))};off=(t,e)=>{if(!this.handlers[t])throw new Error(`不存在事件: ${t}`);if(e){const s=this.handlers[t].findIndex((t=>t===e));this.handlers[t].splice(s,1),0===this.handlers[t].length&&delete this.handlers[t]}else delete this.handlers[t]};_validateParams(t,e){if("string"!=typeof t)throw new Error("事件名必须为字符串");if("function"!=typeof e)throw new Error("事件处理函数必须为函数")}_addHandler(t,e){this.handlers[t]||(this.handlers[t]=[]),this.handlers[t].includes(e)||this.handlers[t].push(e)}}class r extends s{static name="ProductServer";constructor(t){super(),this.sdkInstance=t,this.wxApi=t.wxApi,this.productList=[],this.lastMsgTime="",this.listenerEvent(),this.sdkInstance.on(this.sdkInstance.EVENT.FOREGROUND_REFRESH,this.onForeground)}async getProductList(t){return this.wxApi.sendGet("/v3/goods/webinar/get-online-goods",{...t}).then((t=>(200==t.code&&(t.data=t.data.filter((t=>1==t.status)).map((t=>this._getCurClientBuyTypeInfo(t))),this.productList=t.data,this.sdkInstance.store.set("productList",t.data)),t)))}onForeground=({gap:t})=>{this.getProductList({}).catch((t=>console.error("ProductServer.onForeground refresh failed:",t)))};listenerEvent(){this.sdkInstance.on(this.sdkInstance.EVENT.CUSTOM_MSG,(t=>{["goods_update_info","push_goods_change"].includes(t.data.type)&&t.date_time>this.lastMsgTime&&(this._getProductListByCdn(t.data),this.sdkInstance.BRSAgent?.customLog("product:update"),this.lastMsgTime=t.date_time)}))}async _getProductListByCdn(t){try{const e=await this.wxApi.sendGet(t.cdn_url,{},{timeout:5e3});return this.productList=e.filter((t=>1==t.status)).map((t=>this._getCurClientBuyTypeInfo(t))),this.sdkInstance.store.set("productList",this.productList),e}catch(e){if(console.error("请求 cdn_url 失败:",e),!t.access_url)throw e;try{const e=await this.wxApi.sendGet(t.access_url);return this.productList=e.filter((t=>1==t.status)).map((t=>this._getCurClientBuyTypeInfo(t))),this.sdkInstance.store.set("productList",this.productList),e}catch(t){throw console.error("请求 access_url 也失败:",t),t}}}_getCurClientBuyTypeInfo(t){if(0==t.enable_multi_config)return t;{let e,s,r,n;t.sku.forEach((t=>{const i=Object(t,t.sku_conf);1==i.buy_type?e=i:2==i.buy_type?s=i:3==i.buy_type?r=i:4==i.buy_type&&(n=i)}));const i=e||n||s||r;return Object.assign(t,i,{mini_program_config:n})}}}var n=r;return e}()}));

package/lib/components/announcement/announ-banner/index.wxml

@@ -9,5 +9,5 @@
   <view class="announ-banner-text-wrap">
     <view class="announ-banner-text" style="animation-duration:{{duration}}s">{{text}}</view>
   </view>
-  <view class="announ-banner-close" catchtap="onClose">&#10005;</view>
+  <view class="announ-banner-close" catchtap="onClose">✕</view>
 </view>

package/lib/components/chat-recommend/index.wxml

@@ -6,5 +6,5 @@
       <text class="chat-recommend-content">{{content}}</text>
     </view>
   </view>
-  <view class="chat-recommend-close" catchtap="handleClose">&#10005;</view>
+  <view class="chat-recommend-close" catchtap="handleClose">✕</view>
 </view>

package/lib/components/player/components/controls/controls.wxml

@@ -10,7 +10,11 @@
 </view>
 <view wx:if="{{playStatus=='paused'}}" class='center'>
   <!-- <mp-icon icon='play' color='#fff' size='{{60}}' bind:tap='handlePlayPause'></mp-icon> -->
-  <image class="center-image" mode="aspectFit" src="../../assets/image/play.png" bind:tap='handlePlayPause' />
+  <image class="center-image play" mode="aspectFit" src="../../assets/image/play.png" bind:tap='handlePlayPause' />
+</view>
+<view wx:if="{{playStatus=='playing'&&!hiddenFlag}}" class='center'>
+  <!-- <mp-icon icon='play' color='#fff' size='{{60}}' bind:tap='handlePlayPause'></mp-icon> -->
+  <image class="center-image pause" mode="aspectFit" src="../../assets/image/pause_1.png" bind:tap='handlePlayPause' />
 </view>
 <view class="control {{fullscreen?'fullscreen':''}}" wx:if='{{!verticalMode}}' hidden="{{hiddenFlag}}">
   <view class="control-left">
@@ -56,5 +60,4 @@
 </view>
 <picker wx:if='{{verticalMode}}' class="quality-picker vertical" bindchange="handleQualityPickerChange" value="{{qualityIndex}}" range="{{qualityArray}}" range-key="alias">
   <view class="picker-text">{{qualityArray[qualityIndex]['alias']}}</view>
-</picker>
-
+</picker>

package/lib/components/player/components/controls/controls.wxss

@@ -1 +1 @@
-.wrap{display:flex;flex-direction:column;overflow:hidden}.image,.wrap{height:100vh;width:100vw}.image{left:0;object-fit:cover;top:0}.back,.image{position:absolute}.back{left:20px;top:20px;z-index:10}.back-image{height:20px;object-fit:contain;opacity:.9;transition:opacity .2s;width:20px}.center{align-items:center;background-color:rgba(0,0,0,.2);border-radius:50%;display:flex;height:80px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:80px;z-index:10}.center-image{height:40px;object-fit:contain;padding-left:8px;width:40px}.control{align-items:center;background-color:rgba(0,0,0,.4);bottom:0;display:flex;justify-content:space-between;left:0;padding:16rpx 24rpx;position:absolute;right:0;z-index:10}.control.fullscreen{padding:10rpx 40rpx}.control.fullscreen .quality-picker{font-size:.71rem}.control.fullscreen .fullscreen-btn,.control.fullscreen .play-pause-btn,.control.fullscreen .refresh-btn,.control.fullscreen .volume-btn{height:20rpx;width:20rpx}.control-left{align-items:center;display:flex;gap:24rpx}.play-pause-btn{height:28rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:28rpx}.play-pause-btn:active{opacity:.6}.refresh-btn{height:28rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:28rpx}.refresh-btn:active{opacity:.6}.control-right{gap:24rpx}.control-right,.quality-picker{align-items:center;display:flex}.quality-picker{color:#fff;font-size:1rem;justify-content:center}.quality-picker.vertical{position:fixed;right:40rpx;top:40rpx}.picker-text{align-items:center;display:flex;height:100%;opacity:.9}.fullscreen-btn,.volume-btn{height:28rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:28rpx}
+.wrap{display:flex;flex-direction:column;overflow:hidden}.image,.wrap{height:100vh;width:100vw}.image{left:0;object-fit:cover;top:0}.back,.image{position:absolute}.back{left:20px;top:20px;z-index:10}.back-image{height:20px;object-fit:contain;opacity:.9;transition:opacity .2s;width:20px}.center{align-items:center;background-color:rgba(0,0,0,.2);border-radius:50%;display:flex;height:80px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:80px;z-index:10}.center-image{height:40px;object-fit:contain;width:40px}.center-image.play{padding-left:8px}.control{align-items:center;background-color:rgba(0,0,0,.4);bottom:0;display:flex;justify-content:space-between;left:0;padding:16rpx 24rpx;position:absolute;right:0;z-index:10}.control.fullscreen{padding:10rpx 40rpx}.control.fullscreen .quality-picker{font-size:.71rem}.control.fullscreen .fullscreen-btn,.control.fullscreen .play-pause-btn,.control.fullscreen .refresh-btn,.control.fullscreen .volume-btn{height:20rpx;width:20rpx}.control-left{align-items:center;display:flex;gap:24rpx}.play-pause-btn{height:32rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:32rpx}.play-pause-btn:active{opacity:.6}.refresh-btn{height:32rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:32rpx}.refresh-btn:active{opacity:.6}.control-right{gap:24rpx}.control-right,.quality-picker{align-items:center;display:flex}.quality-picker{color:#fff;font-size:1rem;justify-content:center}.quality-picker.vertical{position:fixed;right:40rpx;top:40rpx}.picker-text{align-items:center;display:flex;height:100%;opacity:.9}.fullscreen-btn,.volume-btn{height:32rpx;object-fit:contain;opacity:.9;transition:opacity .2s;width:32rpx}