Explorar o código

优化用户状态管理,新增计算属性以判断用户登录和会员状态,更新视频播放器和主页逻辑以支持动态显示购买选项和提示,提升用户体验。同时,更新service worker缓存版本以确保最新内容加载。

wuyi hai 2 meses
pai
achega
2eb2ee5b4b
Modificáronse 4 ficheiros con 441 adicións e 568 borrados
  1. 21 22
      dev-dist/sw.js
  2. 36 2
      src/store/user.ts
  3. 8 39
      src/views/Home.vue
  4. 376 505
      src/views/VideoPlayer.vue

+ 21 - 22
dev-dist/sw.js

@@ -22,27 +22,27 @@ if (!self.define) {
   const singleRequire = (uri, parentUri) => {
     uri = new URL(uri + ".js", parentUri).href;
     return registry[uri] || (
-
-      new Promise(resolve => {
-        if ("document" in self) {
-          const script = document.createElement("script");
-          script.src = uri;
-          script.onload = resolve;
-          document.head.appendChild(script);
-        } else {
-          nextDefineUri = uri;
-          importScripts(uri);
-          resolve();
-        }
-      })
-
-        .then(() => {
-          let promise = registry[uri];
-          if (!promise) {
-            throw new Error(`Module ${uri} didn’t register its module`);
+      
+        new Promise(resolve => {
+          if ("document" in self) {
+            const script = document.createElement("script");
+            script.src = uri;
+            script.onload = resolve;
+            document.head.appendChild(script);
+          } else {
+            nextDefineUri = uri;
+            importScripts(uri);
+            resolve();
           }
-          return promise;
         })
+      
+      .then(() => {
+        let promise = registry[uri];
+        if (!promise) {
+          throw new Error(`Module ${uri} didn’t register its module`);
+        }
+        return promise;
+      })
     );
   };
 
@@ -67,8 +67,7 @@ if (!self.define) {
     });
   };
 }
-define(['./workbox-f2cb1a81'], (function (workbox) {
-  'use strict';
+define(['./workbox-f2cb1a81'], (function (workbox) { 'use strict';
 
   self.skipWaiting();
   workbox.clientsClaim();
@@ -80,7 +79,7 @@ define(['./workbox-f2cb1a81'], (function (workbox) {
    */
   workbox.precacheAndRoute([{
     "url": "index.html",
-    "revision": "0.80ucr7e7akg"
+    "revision": "0.m2sppaumj5g"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

+ 36 - 2
src/store/user.ts

@@ -1,5 +1,5 @@
 import { defineStore } from "pinia";
-import { ref } from "vue";
+import { ref, computed } from "vue";
 import {
   login as apiLogin,
   register as apiRegister,
@@ -28,7 +28,7 @@ export const useUserStore = defineStore("user", () => {
   const userManuallyLoggedOut = useStorage("userManuallyLoggedOut", false);
 
   // 添加主页浏览状态存储
-  const homePageState = ref<HomePageState>({
+  const homePageState = useStorage<HomePageState>("homePageState", {
     selectedMenu: "",
     currentPage: 1,
     selectedSort: "time",
@@ -60,6 +60,35 @@ export const useUserStore = defineStore("user", () => {
     return userInfo.value?.vipLevel || VipLevel.GUEST;
   };
 
+  // 用户状态判断 - computed 属性
+  const isLoginUser = computed(() => {
+    return (
+      token.value !== "" && token.value !== null && token.value !== undefined
+    );
+  });
+
+  const isGuestUser = computed(() => {
+    return userInfo.value?.vipLevel === "guest";
+  });
+
+  const isFreeUser = computed(() => {
+    return userInfo.value?.vipLevel === "free";
+  });
+
+  const isGuestOrFreeUser = computed(() => {
+    return isGuestUser.value || isFreeUser.value;
+  });
+
+  const isVipUser = computed(() => {
+    return (
+      userInfo.value?.vipLevel !== "guest" &&
+      userInfo.value?.vipLevel !== "free" &&
+      userInfo.value?.vipLevel !== undefined &&
+      userInfo.value?.vipLevel !== null &&
+      userInfo.value?.vipLevel !== ""
+    );
+  });
+
   const login = async (username: string, password: string) => {
     const response = await apiLogin(username, password);
     setToken(response.token);
@@ -112,6 +141,11 @@ export const useUserStore = defineStore("user", () => {
     userManuallyLoggedOut,
     setUserInfo,
     getVipLevel,
+    isLoginUser,
+    isGuestUser,
+    isFreeUser,
+    isGuestOrFreeUser,
+    isVipUser,
     login,
     register,
     logout,

+ 8 - 39
src/views/Home.vue

@@ -369,25 +369,17 @@
     </div>
 
     <!-- 登录弹窗 -->
-    <LoginDialog v-model="showLoginDialog" @login-success="onLoginSuccess" />
+    <!-- <LoginDialog v-model="showLoginDialog" @login-success="onLoginSuccess" /> -->
   </section>
 </template>
 
 <script setup lang="ts">
-import {
-  ref,
-  computed,
-  onMounted,
-  onBeforeUnmount,
-  watch,
-  nextTick,
-} from "vue";
+import { ref, computed, onMounted, onBeforeUnmount, watch } from "vue";
 import { useRouter, useRoute } from "vue-router";
 import { searchVideoByTags, searchVideoByKeyword } from "@/services/api";
 import { videoMenus as fixedVideoMenus } from "@/data/videoMenus";
 import { freeVideos } from "@/data/freeVideo";
 import VideoJSPlayer from "@/components/VideoJSPlayer.vue";
-import LoginDialog from "@/components/LoginDialog.vue";
 import { useUserStore } from "@/store/user";
 import { VipLevel } from "@/types/vip";
 
@@ -397,6 +389,7 @@ const route = useRoute();
 
 // 用户状态
 const userStore = useUserStore();
+const { isVipUser, isGuestOrFreeUser } = userStore;
 
 // 是否从视频播放页返回
 const isReturnFromVideo = ref(false);
@@ -431,17 +424,14 @@ const jumpToPage = ref<number | string>("");
 
 // 排序选项 - 根据用户会员状态动态显示
 const sortOptions = computed(() => {
-  const vipLevel = userStore.getVipLevel();
-  const isVip = vipLevel !== VipLevel.GUEST && vipLevel !== VipLevel.FREE;
-
   const options = [
     { value: "time", label: "最新" },
     { value: "view", label: "热门" },
     { value: "like", label: "点赞" },
   ];
 
-  // 只有非会员用户才显示试看选项
-  if (!isVip) {
+  console.log("isVipUser", isVipUser);
+  if (!isVipUser) {
     options.push({ value: "free", label: "试看" });
   }
 
@@ -469,16 +459,6 @@ const showAllTags = ref(false);
 const isSearchMode = ref(false);
 const currentSearchKeyword = ref("");
 
-// 登录弹窗
-const showLoginDialog = ref(false);
-
-// 处理登录成功
-const onLoginSuccess = async () => {
-  // 登录成功后刷新用户信息
-  await userStore.sync();
-  console.log("登录成功,用户信息已更新");
-};
-
 // 格式化时长
 const formatDuration = (duration: string | number): string => {
   const seconds = parseInt(String(duration));
@@ -496,8 +476,6 @@ const formatNumber = (num: string | number): string => {
   return n.toString();
 };
 
-// 图片加载错误处理已移至 VideoJSPlayer 组件
-
 // 跳转到指定页面
 const jumpToPageHandler = () => {
   const inputValue = String(jumpToPage.value).trim();
@@ -649,17 +627,8 @@ const playVideo = (video: any) => {
   // 保存当前浏览状态,以便返回时恢复
   saveCurrentState();
 
-  const vipLevel = userStore.getVipLevel();
-
-  // 如果是试看视频,检查登录状态
   if (selectedSort.value === "free" || video.id?.startsWith("free-")) {
-    // 检查用户是否已登录
-    if (!userStore.token) {
-      // 未登录,显示登录弹窗
-      showLoginDialog.value = true;
-      return;
-    }
-    // 已登录,跳转到试看视频播放页
+    // 试看视频通过URL参数传递
     router.push({
       name: "VideoPlayer",
       params: { id: video.id },
@@ -670,7 +639,7 @@ const playVideo = (video: any) => {
         isFree: "true",
       },
     });
-  } else if (vipLevel === VipLevel.GUEST || vipLevel === VipLevel.FREE) {
+  } else if (!isVipUser) {
     // guest和free用户通过URL参数传递cover和m3u8,同时包含视频ID
     router.push({
       name: "VideoPlayer",
@@ -684,7 +653,7 @@ const playVideo = (video: any) => {
         like: video.like,
       },
     });
-  } else {
+  } else if (isVipUser) {
     // 其他VIP用户正常调用详情接口
     router.push({
       name: "VideoPlayer",

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 376 - 505
src/views/VideoPlayer.vue


Algúns arquivos non se mostraron porque demasiados arquivos cambiaron neste cambio