Parcourir la source

在视频播放器中添加登录弹窗功能,未登录时显示弹窗以便用户登录,确保购买流程顺畅。

wuyi il y a 2 mois
Parent
commit
5bbf8a9e49
1 fichiers modifiés avec 49 ajouts et 0 suppressions
  1. 49 0
      src/views/VideoPlayer.vue

+ 49 - 0
src/views/VideoPlayer.vue

@@ -573,6 +573,9 @@
         </div>
       </div>
     </div>
+
+    <!-- 登录弹窗 -->
+    <LoginDialog v-model="showLoginDialog" @login-success="onLoginSuccess" />
   </section>
 </template>
 
@@ -588,6 +591,7 @@ import {
   checkSinglePurchase,
 } from "@/services/api";
 import VideoProcessor from "@/components/VideoProcessor.vue";
+import LoginDialog from "@/components/LoginDialog.vue";
 import { useUserStore } from "@/store/user";
 import { usePriceStore } from "@/store/price";
 import { VipLevel, canWatchFullVideo, getTrialDuration } from "@/types/vip";
@@ -624,6 +628,7 @@ const relatedVideos = ref<any[]>([]);
 const showTrialEndModal = ref(false);
 const showMembershipPurchaseModal = ref(false);
 const showSinglePurchaseModal = ref(false);
+const showLoginDialog = ref(false);
 const isTrialMode = ref(false);
 
 // 单片购买状态
@@ -747,6 +752,17 @@ const onVideoProcessorRetry = () => {
   // VideoProcessor 重试
 };
 
+// 处理登录成功
+const onLoginSuccess = async () => {
+  // 登录成功后刷新用户信息
+  await userStore.sync();
+
+  // 检查购买状态
+  if (videoInfo.value.id && videoInfo.value.id !== "unknown") {
+    await checkVideoPurchaseStatus();
+  }
+};
+
 const onVideoPlay = () => {
   // 如果是guest或free用户且还没有开始试看,且未购买当前视频,则开始试看
   if (isGuestOrFree.value && !isTrialMode.value && !isSinglePurchased.value) {
@@ -847,6 +863,14 @@ const startTrial = () => {
 
 // 处理顶部会员购买按钮点击
 const handleMembershipClick = () => {
+  // 检查用户是否已登录
+  if (!userStore.token) {
+    // 未登录,显示登录弹窗
+    showLoginDialog.value = true;
+    return;
+  }
+
+  // 已登录,显示购买弹窗
   showMembershipPurchaseModal.value = true;
 
   // 夸克浏览器自动滚动到底部
@@ -862,6 +886,14 @@ const handleMembershipClick = () => {
 
 // 处理顶部单片购买按钮点击
 const handleSinglePurchaseClick = () => {
+  // 检查用户是否已登录
+  if (!userStore.token) {
+    // 未登录,显示登录弹窗
+    showLoginDialog.value = true;
+    return;
+  }
+
+  // 已登录,显示购买弹窗
   showSinglePurchaseModal.value = true;
 
   // 夸克浏览器自动滚动到底部
@@ -877,6 +909,14 @@ const handleSinglePurchaseClick = () => {
 
 // 购买会员
 const purchaseMembership = () => {
+  // 检查用户是否已登录
+  if (!userStore.token) {
+    // 未登录,显示登录弹窗
+    showTrialEndModal.value = false;
+    showLoginDialog.value = true;
+    return;
+  }
+
   // 关闭试看结束弹窗
   showTrialEndModal.value = false;
   // 打开会员购买弹窗
@@ -992,6 +1032,15 @@ const handleSingleQueryOrder = async () => {
 
 // 单独购买本片
 const purchaseVideo = async () => {
+  // 检查用户是否已登录
+  if (!userStore.token) {
+    // 未登录,显示登录弹窗
+    showTrialEndModal.value = false;
+    showSinglePurchaseModal.value = false;
+    showLoginDialog.value = true;
+    return;
+  }
+
   // 夸克浏览器自动滚动到底部
   if (isQuarkBrowser()) {
     setTimeout(() => {