Browse Source

更新视频播放器逻辑,动态显示购买按钮区域,优化视频加载提示信息,新增对QQ和VIVO浏览器的检测,提升用户体验和交互性。同时,更新service worker缓存版本以确保最新内容加载。

wuyi 2 tháng trước cách đây
mục cha
commit
f27065c0c4
2 tập tin đã thay đổi với 28 bổ sung7 xóa
  1. 1 1
      dev-dist/sw.js
  2. 27 6
      src/views/VideoPlayer.vue

+ 1 - 1
dev-dist/sw.js

@@ -79,7 +79,7 @@ define(['./workbox-f2cb1a81'], (function (workbox) { 'use strict';
    */
   workbox.precacheAndRoute([{
     "url": "index.html",
-    "revision": "0.m2sppaumj5g"
+    "revision": "0.rvasmsdh038"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

+ 27 - 6
src/views/VideoPlayer.vue

@@ -25,7 +25,10 @@
       </div>
 
       <!-- 购买按钮区域 -->
-      <div class="flex items-center gap-1 sm:gap-1.5">
+      <div
+        v-if="showPurchaseButtonArea"
+        class="flex items-center gap-1 sm:gap-1.5"
+      >
         <button
           v-if="!isVipUser"
           @click="handleMembershipClick"
@@ -486,7 +489,7 @@
       <!-- 视频标题和基本信息 -->
       <div class="space-y-3">
         <h1 class="text-xl font-semibold text-white leading-tight">
-          {{ videoInfo.name || "视频标题" }}
+          {{ videoInfo.name || "视频加载中..." }}
         </h1>
         <div
           v-if="!isFreeVideo"
@@ -680,6 +683,8 @@ const videoInfo = ref<any>({
 // 相关视频
 const relatedVideos = ref<any[]>([]);
 
+// 开通会员,购买单片栏
+const showPurchaseButtonArea = ref(true);
 // 购买提示弹窗
 const showPurchasePrompt = ref(true);
 // 会员购买弹窗
@@ -968,7 +973,6 @@ const startSingleQueryTimer = () => {
         showSinglePaymentWaitingDialog.value = false;
         showSuccess("视频购买成功!");
         singleCurrentOrderNo.value = "";
-        // 重新检查购买状态
         await checkVideoPurchaseStatus();
       }
     } catch (error) {
@@ -1028,7 +1032,7 @@ const errorMessage = ref("");
 // 夸克浏览器检测函数
 const isQuarkBrowser = () => {
   const ua = navigator.userAgent.toLowerCase();
-  return ua.includes("quark");
+  return ua.includes("quarkbrowser");
 };
 
 // UC浏览器检测函数
@@ -1037,9 +1041,21 @@ const isUCBrowser = () => {
   return ua.includes("ucbrowser");
 };
 
+// QQ 游览器
+const isQQBrowser = () => {
+  const ua = navigator.userAgent.toLowerCase();
+  return ua.includes("qq");
+};
+
+// VIVO浏览器检测函数
+const isVIVOBrowser = () => {
+  const ua = navigator.userAgent.toLowerCase();
+  return ua.includes("vivo");
+};
+
 // 特殊浏览器检测
 const isSpecialBrowser = () => {
-  return isQuarkBrowser() || isUCBrowser();
+  return isQuarkBrowser() || isUCBrowser() || isQQBrowser() || isVIVOBrowser;
 };
 
 // 特殊游览器页面滚动
@@ -1233,6 +1249,8 @@ const loadVideoInfo = async () => {
   // 试看视频
   if (isFreeVideo.value) {
     console.log("isFreeVideo");
+    showPurchaseButtonArea.value = false;
+
     const { name, cover, m3u8 } = route.query;
     videoInfo.value = {
       id: videoId,
@@ -1250,6 +1268,7 @@ const loadVideoInfo = async () => {
     console.log("isNotLogin");
     if (!isLoginUser) {
       showPurchasePrompt.value = true;
+      showPurchaseButtonArea.value = true;
       const { name, cover, duration, view, like } = route.query;
       videoInfo.value = {
         id: videoId,
@@ -1266,12 +1285,13 @@ const loadVideoInfo = async () => {
       // guest或free用户
       console.log("isNotVipUser");
       const response = await checkSinglePurchase(videoId as string);
-      console.log("checkVideoPurchaseStatus", response);
       const wasPurchased = response.status === 1 || response === true;
       isSinglePurchased.value = wasPurchased;
+      console.log("isSinglePurchased:", response);
       if (response) {
         // 已购买单片
         // 关闭弹窗
+        showPurchaseButtonArea.value = false;
         showPurchasePrompt.value = false;
         const response = await getVideoDetail(device, String(videoId));
         if (response.status === 0 && response.data) {
@@ -1294,6 +1314,7 @@ const loadVideoInfo = async () => {
           };
         }
       } else {
+        showPurchaseButtonArea.value = true;
         showPurchasePrompt.value = true;
         const { name, cover, duration, view, like } = route.query;
         videoInfo.value = {