Merge remote-tracking branch 'origin/card-flip' into card-flip

# Conflicts: # Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore/Repositories/SqlSugarRepository.cs
2025-11-17 11:22:44 +08:00
parent b492d82442 d7bcad9da7
commit bb894e14a4
36 changed files with 1126 additions and 473 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -265,6 +265,7 @@ src/Acme.BookStore.Blazor.Server.Tiered/Logs/*
 **/wwwroot/libs/*
 public
 dist
+dist - 副本
 .vscode
 /Yi.Abp.Net8/src/Yi.Abp.Web/appsettings.Development.json
 /Yi.Abp.Net8/src/Yi.Abp.Web/appsettings.Production.json
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/CardFlip/CardFlipStatusOutput.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/CardFlip/CardFlipStatusOutput.cs
@@ -39,12 +39,7 @@ public class CardFlipStatusOutput
    /// 本周邀请人数
    /// </summary>
    public int InvitedCount { get; set; }
-
-    /// <summary>
-    /// 是否已被邀请（被邀请后不可再提供邀请码）
-    /// </summary>
-    public bool IsInvited { get; set; }
-
+    
    /// <summary>
    /// 翻牌记录
    /// </summary>
@@ -54,6 +49,11 @@ public class CardFlipStatusOutput
    /// 下次可翻牌提示
    /// </summary>
    public string? NextFlipTip { get; set; }
+
+    /// <summary>
+    /// 当前用户是否已经填写过邀请码
+    /// </summary>
+    public bool IsFilledInviteCode { get; set; }
 }

 /// <summary>
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/CardFlipService.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/CardFlipService.cs
@@ -51,9 +51,8 @@ public class CardFlipService : ApplicationService, ICardFlipService
        // 统计本周邀请人数
        var invitedCount = await _inviteCodeManager.GetWeeklyInvitationCountAsync(userId, weekStart);

-        // 检查用户是否已被邀请
-        var isInvited = await _inviteCodeManager.IsUserInvitedAsync(userId);
-
+        //当前用户是否已填写过邀请码
+        var isFilledInviteCode = await _inviteCodeManager.IsFilledInviteCodeAsync(userId);
        var output = new CardFlipStatusOutput
        {
            TotalFlips = task?.TotalFlips ?? 0,
@@ -63,8 +62,8 @@ public class CardFlipService : ApplicationService, ICardFlipService
            CanFlip = _cardFlipManager.CanFlipCard(task),
            MyInviteCode = inviteCode?.Code,
            InvitedCount = invitedCount,
-            IsInvited = isInvited,
-            FlipRecords = BuildFlipRecords(task)
+            FlipRecords = BuildFlipRecords(task),
+            IsFilledInviteCode = isFilledInviteCode
        };

        // 生成提示信息
@@ -87,7 +86,7 @@ public class CardFlipService : ApplicationService, ICardFlipService
        // 如果中奖,发放奖励
        if (result.IsWin)
        {
-            await GrantRewardAsync(userId, result.RewardAmount, $"翻牌活动第{input.FlipNumber}次中奖");
+            await GrantRewardAsync(userId, result.RewardAmount, $"翻牌活动-序号{input.FlipNumber}中奖");
        }

        // 构建输出
@@ -147,7 +146,6 @@ public class CardFlipService : ApplicationService, ICardFlipService
        {
            MyInviteCode = inviteCode?.Code,
            InvitedCount = invitedCount,
-            IsInvited = inviteCode?.IsUserInvited ?? false,
            InvitationHistory = invitationHistory.Select(x => new InvitationHistoryItem
            {
                InvitedUserName = x.InvitedUserName,
@@ -237,10 +235,10 @@ public class CardFlipService : ApplicationService, ICardFlipService
        {
            if (status.TotalFlips >= 7)
            {
-                return $"本周使用他人邀请码可解锁{status.RemainingInviteFlips}次翻牌,且必中大奖!每次中奖最大额度将翻倍!";
+                return $"本周使用他人邀请码或他人使用你的邀请码，可解锁{status.RemainingInviteFlips}次翻牌，且必中大奖!每次中奖最大额度将翻倍!";
            }

-            return $"本周使用他人邀请码可解锁{status.RemainingInviteFlips}次翻牌,必中大奖!每次中奖最大额度将翻倍!";
+            return $"本周使用他人邀请码或他人使用你的邀请码，可解锁{status.RemainingInviteFlips}次翻牌，必中大奖!每次中奖最大额度将翻倍!";
        }

        return "继续加油!";
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/UsageStatisticsService.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/UsageStatisticsService.cs
@@ -155,8 +155,10 @@ public class UsageStatisticsService : ApplicationService, IUsageStatisticsServic
        // 获取尊享包Token信息
        var entities = await _premiumPackageRepository._DbQueryable
            .Where(x => x.UserId == userId)
-            .WhereIF(input.IsFree == true, x => x.PurchaseAmount > 0)
-            .WhereIF(input.IsFree == false, x => x.PurchaseAmount == 0)
+            .WhereIF(input.IsFree == false, x => x.PurchaseAmount > 0)
+            .WhereIF(input.IsFree == true, x => x.PurchaseAmount == 0)
+            .WhereIF(input.StartTime is not null && input.EndTime is not null,
+                x => x.CreationTime >= input.StartTime && x.CreationTime <= input.EndTime)
            .OrderByDescending(x => x.CreationTime)
            .ToPageListAsync(input.SkipCount, input.MaxResultCount, total);
        return new PagedResultDto<PremiumTokenUsageGetListOutput>(total,
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/InviteCodeAggregateRoot.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/InviteCodeAggregateRoot.cs
@@ -19,7 +19,6 @@ public class InviteCodeAggregateRoot : FullAuditedAggregateRoot<Guid>
    {
        UserId = userId;
        Code = code;
-        IsUserInvited = false;
        UsedCount = 0;
    }

@@ -33,12 +32,7 @@ public class InviteCodeAggregateRoot : FullAuditedAggregateRoot<Guid>
    /// </summary>
    [SugarColumn(Length = 50)]
    public string Code { get; set; } = string.Empty;
-
-    /// <summary>
-    /// 邀请码拥有者是否已被他人邀请（被邀请后不可再提供邀请码）
-    /// </summary>
-    public bool IsUserInvited { get; set; }
-
+    
    /// <summary>
    /// 被使用次数（统计用，一个邀请码可以被多人使用）
    /// </summary>
@@ -49,12 +43,5 @@ public class InviteCodeAggregateRoot : FullAuditedAggregateRoot<Guid>
    /// </summary>
    [SugarColumn(Length = 500, IsNullable = true)]
    public string? Remark { get; set; }
-
-    /// <summary>
-    /// 标记用户已被邀请
-    /// </summary>
-    public void MarkUserAsInvited()
-    {
-        IsUserInvited = true;
-    }
+    
 }
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/InviteCodeManager.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/InviteCodeManager.cs
@@ -63,14 +63,19 @@ public class InviteCodeManager : DomainService
    }

    /// <summary>
-    /// 统计用户本周邀请人数（别人填写我的邀请码的次数）
+    /// 统计用户本周邀请人数（别人填写我的邀请码的次数/或者我填写别人邀请码）
    /// </summary>
    public async Task<int> GetWeeklyInvitationCountAsync(Guid userId, DateTime weekStart)
    {
-        return await _invitationRecordRepository._DbQueryable
+        var inviterCount= await _invitationRecordRepository._DbQueryable
            .Where(x => x.InviterId == userId)
            .Where(x => x.InvitationTime >= weekStart)
            .CountAsync();
+        var invitedUserIdCount= await _invitationRecordRepository._DbQueryable
+            .Where(x => x.InvitedUserId == userId)
+            .Where(x => x.InvitationTime >= weekStart)
+            .CountAsync();
+        return inviterCount + invitedUserIdCount;
    }

    /// <summary>
@@ -118,45 +123,19 @@ public class InviteCodeManager : DomainService
        {
            throw new UserFriendlyException("不能使用自己的邀请码");
        }
-
-        // 验证邀请码拥有者是否已被邀请
-        if (inviteCodeEntity.IsUserInvited)
-        {
-            throw new UserFriendlyException("该用户已被邀请,邀请码无效");
-        }
-
+        
        // 检查当前用户是否已经填写过别人的邀请码（一辈子只能填写一次）
-        var hasUsedOthersCode = await _invitationRecordRepository._DbQueryable
-            .Where(x => x.InvitedUserId == userId)
-            .AnyAsync();
+        var hasUsedOthersCode = await IsFilledInviteCodeAsync(userId);

        if (hasUsedOthersCode)
        {
            throw new UserFriendlyException("您已经填写过别人的邀请码了，每个账号只能填写一次");
        }
-
-        // 检查当前用户的邀请码信息
-        var myInviteCode = await _inviteCodeRepository._DbQueryable
-            .Where(x => x.UserId == userId)
-            .FirstAsync();
-
+        
        // 增加邀请码被使用次数
        inviteCodeEntity.UsedCount++;
        await _inviteCodeRepository.UpdateAsync(inviteCodeEntity);
-
-        // 标记当前用户已被邀请（一辈子只能填写一次）
-        if (myInviteCode == null)
-        {
-            myInviteCode = new InviteCodeAggregateRoot(userId, GenerateUniqueInviteCode());
-            myInviteCode.MarkUserAsInvited();
-            await _inviteCodeRepository.InsertAsync(myInviteCode);
-        }
-        else if (!myInviteCode.IsUserInvited)
-        {
-            myInviteCode.MarkUserAsInvited();
-            await _inviteCodeRepository.UpdateAsync(myInviteCode);
-        }
-
+        
        // 创建邀请记录（双方都会因为这条记录增加一次翻牌机会）
        var invitationRecord = new InvitationRecordAggregateRoot(
            inviteCodeEntity.UserId,
@@ -170,15 +149,14 @@ public class InviteCodeManager : DomainService
    }

    /// <summary>
-    /// 检查用户是否已被邀请
+    /// 检查用户是否已填写过邀请码
    /// </summary>
-    public async Task<bool> IsUserInvitedAsync(Guid userId)
+    public async Task<bool> IsFilledInviteCodeAsync(Guid userId)
    {
-        var inviteCode = await _inviteCodeRepository._DbQueryable
-            .Where(x => x.UserId == userId)
-            .FirstAsync();
-
-        return inviteCode?.IsUserInvited ?? false;
+        // 检查当前用户是否已经填写过别人的邀请码（一辈子只能填写一次）
+        return await _invitationRecordRepository._DbQueryable
+            .Where(x => x.InvitedUserId == userId)
+            .AnyAsync();
    }

    /// <summary>
--- a/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs
+++ b/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs
@@ -355,9 +355,11 @@ namespace Yi.Abp.Web
            var app = context.GetApplicationBuilder();
            app.UseRouting();

-            //app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<AnnouncementAggregateRoot>();
+            // app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<AnnouncementAggregateRoot>();
            // app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<CardFlipTaskAggregateRoot>();
-            
+            // app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<InviteCodeAggregateRoot>();
+            // app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<InvitationRecordAggregateRoot>();
+
            //跨域
            app.UseCors(DefaultCorsPolicyName);

--- a/Yi.Ai.Vue3/.claude/settings.local.json
+++ b/Yi.Ai.Vue3/.claude/settings.local.json
@@ -0,0 +1,9 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npx vue-tsc --noEmit)"
+    ],
+    "deny": [],
+    "ask": []
+  }
+}
--- a/Yi.Ai.Vue3/index.html
+++ b/Yi.Ai.Vue3/index.html
@@ -112,7 +112,7 @@
 <body>
 <!-- 加载动画容器 -->
 <div id="yixinai-loader" class="loader-container">
-  <div class="loader-title">意心Ai 2.2</div>
+  <div class="loader-title">意心Ai 2.3</div>
  <div class="loader-subtitle">海外地址，仅首次访问预计加载约10秒</div>
  <div class="loader-logo">
    <div class="pulse-box"></div>
--- a/Yi.Ai.Vue3/src/App.vue
+++ b/Yi.Ai.Vue3/src/App.vue
@@ -1,67 +1,8 @@
 <script setup lang="ts">
-import type { AnnouncementLogDto } from '@/api';
-import { getSystemAnnouncements } from '@/api';
-import SystemAnnouncementDialog from '@/components/SystemAnnouncementDialog/index.vue';
-import { useAnnouncementStore } from '@/stores';
-
-const announcementStore = useAnnouncementStore();
-
-// 模拟数据（当后端接口未就绪时使用）
-const mockData: AnnouncementLogDto[] = [
-  {
-    title: 'v2.3.0',
-    content: [
-      '重大更新',
-      '1：优化整体',
-      '2: 还有谁',
-    ],
-    imageUrl: 'https://ccnetcore.com/prod-api/wwwroot/logo.png',
-    startTime: '2025-11-10 14:58:58',
-    endTime: null,
-    type: 'System',
-  },
-  {
-    title: 'KFC翻牌活动',
-    content: [
-      '666',
-      '777',
-      '2: 还有谁',
-    ],
-    imageUrl: 'https://ccnetcore.com/prod-api/wwwroot/logo.png',
-    startTime: '2025-11-10 14:58:58',
-    endTime: '2025-11-15 14:59:49',
-    type: 'Activity',
-  },
-];
-
-// 应用加载时检查是否需要显示公告弹窗
-onMounted(async () => {
-  console.log('announcementStore.shouldShowDialog--', announcementStore.shouldShowDialog);
-  // 检查是否应该显示弹窗
-  if (announcementStore.shouldShowDialog) {
-    try {
-      // 获取公告数据
-      const res = await getSystemAnnouncements();
-      if (res && res.data && Array.isArray(res.data) && res.data.length > 0) {
-        announcementStore.setAnnouncementData(res.data);
-        // 显示弹窗
-        announcementStore.openDialog();
-      }
-    }
-    catch (error) {
-      console.error('获取系统公告失败，使用模拟数据:', error);
-      // 使用模拟数据作为降级方案
-      announcementStore.setAnnouncementData(mockData);
-      announcementStore.openDialog();
-    }
-  }
-});
 </script>

 <template>
  <router-view />
-  <!-- 系统公告弹窗 -->
-  <SystemAnnouncementDialog />
 </template>

 <style scoped lang="scss"></style>
--- a/Yi.Ai.Vue3/src/api/cardFlip/types.ts
+++ b/Yi.Ai.Vue3/src/api/cardFlip/types.ts
@@ -7,9 +7,10 @@ export interface CardFlipStatusOutput {
  canFlip: boolean; // 是否可以翻牌
  myInviteCode?: string; // 用户的邀请码
  invitedCount: number; // 本周邀请人数
-  isInvited: boolean; // 是否已被邀请
+  // isInvited: boolean; // 是否已被邀请
  flipRecords: CardFlipRecord[]; // 翻牌记录
  nextFlipTip?: string; // 下次可翻牌提示
+  isFilledInviteCode: boolean;// 当前用户是否已经填写过邀请码
 }

 // 翻牌记录
--- a/Yi.Ai.Vue3/src/api/user/index.ts
+++ b/Yi.Ai.Vue3/src/api/user/index.ts
@@ -22,6 +22,10 @@ export interface PremiumTokenUsageDto {
  purchaseAmount: number;
  /** 备注 */
  remark?: string;
+  /** 创建时间 */
+  creationTime?: string;
+  /** 创建者ID */
+  creatorId?: string;
 }

 // 查询参数接口 - 匹配后端 PagedAllResultRequestDto
@@ -38,6 +42,10 @@ export interface PremiumTokenUsageQueryParams {
  skipCount?: number;
  /** 最大返回数量（分页） */
  maxResultCount?: number;
+  /** 是否免费 */
+  isFree?: boolean;
+  // 是否为升序排序
+  isAscending?: boolean;
 }

 // 分页响应接口
--- a/Yi.Ai.Vue3/src/components/LoginDialog/components/QrCodeLogin/index.vue
+++ b/Yi.Ai.Vue3/src/components/LoginDialog/components/QrCodeLogin/index.vue
@@ -7,6 +7,7 @@ import { getQrCode, getQrCodeResult, getUserInfo } from '@/api';
 import { useUserStore } from '@/stores';
 import { useSessionStore } from '@/stores/modules/session.ts';
 import { WECHAT_QRCODE_TYPE } from '@/utils/user.ts';
+import { useGuideTour } from '@/hooks/useGuideTour';

 const props = defineProps({
  type: {
@@ -29,6 +30,7 @@ const userStore = useUserStore();
 const router = useRouter();
 const sessionStore = useSessionStore();
 const isQrCodeError = ref(false);
+const { startFullTour } = useGuideTour();
 // 二维码倒计时实例
 const { start: qrStart, stop: qrStop } = useCountdown(shallowRef(600), {
  interval: 1000,
@@ -126,6 +128,11 @@ async function handleLoginSuccess(token: string, refreshToken: string) {
  stopPolling();
  userStore.setToken(token, refreshToken);
  const resUserInfo = await getUserInfo();
+
+  // 判断是否为新用户（注册时间小于1小时）
+  const creationTime = resUserInfo.data.user.creationTime; // 格式: "2024-11-01 12:01:34"
+  const isNewUser = checkIsNewUser(creationTime);
+
  userStore.setUserInfo(resUserInfo.data);
  // 提示用户
  ElMessage.success('登录成功');
@@ -133,6 +140,34 @@ async function handleLoginSuccess(token: string, refreshToken: string) {
  await router.replace('/');
  await sessionStore.requestSessionList(1, true);
  userStore.closeLoginDialog();
+
+  // 如果是新用户，延迟500ms后自动触发新手引导
+  if (isNewUser) {
+    setTimeout(() => {
+      startFullTour();
+    }, 500);
+  }
+}
+
+// 判断是否为新用户（注册时间距离当前时间小于1小时）
+function checkIsNewUser(creationTimeStr: string): boolean {
+  try {
+    // 解析注册时间字符串 "2024-11-01 12:01:34"
+    const creationTime = new Date(creationTimeStr.replace(' ', 'T'));
+    const currentTime = new Date();
+
+    // 计算时间差（毫秒）
+    const timeDiff = currentTime.getTime() - creationTime.getTime();
+
+    // 1小时 = 60分钟 * 60秒 * 1000毫秒 = 3600000毫秒
+    const oneHourInMs = 60 * 60 * 1000;
+
+    return timeDiff < oneHourInMs;
+  }
+  catch (error) {
+    console.error('解析注册时间失败:', error);
+    return false;
+  }
 }

 // 处理注册授权
--- a/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
+++ b/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
@@ -2,22 +2,17 @@
 <script setup lang="ts">
 import type { GetSessionListVO } from '@/api/model/types';
 import { Lock } from '@element-plus/icons-vue';
-import { useRouter } from 'vue-router';
 import Popover from '@/components/Popover/index.vue';

 import SvgIcon from '@/components/SvgIcon/index.vue';
-import { useUserStore } from '@/stores';
 import { useModelStore } from '@/stores/modules/model';
 import { showProductPackage } from '@/utils/product-package.ts';
 import { isUserVip } from '@/utils/user';

-const router = useRouter();
-
-const userStore = useUserStore();
 const modelStore = useModelStore();
 // 检查模型是否可用
 function isModelAvailable(item: GetSessionListVO) {
-  return isUserVip() || item.modelId?.includes('DeepSeek-R1-0528') || userStore.userInfo?.user?.userName === 'cc';
+  return isUserVip() || item.modelId?.includes('DeepSeek-R1-0528');
 }

 onMounted(async () => {
@@ -88,11 +83,6 @@ function handleModelClick(item: GetSessionListVO) {
    )
      .then(() => {
        showProductPackage();
-
-        // router.push({
-        //   name: 'products', // 使用命名路由
-        //   query: { from: isUserVip() ? 'vip' : 'user' }, // 可选：添加来源标识
-        // });
      })
      .catch(() => {
        // 点击右上角关闭或“关闭”按钮，不执行任何操作
@@ -159,7 +149,7 @@ function getWrapperClass(item: GetSessionListVO) {
 </script>

 <template>
-  <div class="model-select">
+  <div class="model-select" data-tour="model-select">
    <Popover
      ref="popoverRef"
      placement="top-start"
--- a/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue
+++ b/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
 import type { AnnouncementLogDto } from '@/api';
 import type { CloseType } from '@/stores/modules/announcement';
+import { getSystemAnnouncements } from '@/api';
 import { ElMessage } from 'element-plus';
 import { storeToRefs } from 'pinia';
 import { useAnnouncementStore } from '@/stores';

 const announcementStore = useAnnouncementStore();
+const isLoadingData = ref(false);

 const activeTab = ref('activity');

@@ -52,7 +54,7 @@ function handleClose(type: CloseType) {
  announcementStore.closeDialog(type);

  const messages = {
-    today: '今日内不再显示',
+    today: '一周内不再显示',
    permanent: '公告已关闭',
  };

@@ -73,6 +75,31 @@ function getActivityStatus(activity: AnnouncementLogDto): 'active' | 'expired' {
  const endTime = new Date(activity.endTime);
  return now > endTime ? 'expired' : 'active';
 }
+
+// 监听弹窗显示状态，每次打开时从后端获取最新数据
+watch(isDialogVisible, async (newValue) => {
+  if (newValue) {
+    // 弹窗打开时，从后端获取最新数据
+    isLoadingData.value = true;
+    try {
+      const res = await getSystemAnnouncements();
+      if (res && res.data && Array.isArray(res.data)) {
+        announcementStore.setAnnouncementData(res.data);
+      }
+      else {
+        announcementStore.setAnnouncementData([]);
+      }
+    }
+    catch (error) {
+      console.error('获取系统公告失败:', error);
+      ElMessage.error('获取公告数据失败，请稍后重试');
+      announcementStore.setAnnouncementData([]);
+    }
+    finally {
+      isLoadingData.value = false;
+    }
+  }
+});
 </script>

 <template>
@@ -83,7 +110,7 @@ function getActivityStatus(activity: AnnouncementLogDto): 'active' | 'expired' {
    :close-on-click-modal="true"
    class="announcement-dialog"
  >
-    <div class="announcement-dialog-content">
+    <div v-loading="isLoadingData" class="announcement-dialog-content">
      <el-tabs v-model="activeTab" class="announcement-tabs">
        <!-- 活动Tab -->
        <el-tab-pane label="活动" name="activity">
@@ -199,7 +226,7 @@ function getActivityStatus(activity: AnnouncementLogDto): 'active' | 'expired' {
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose('today')">
-          今日关闭
+          关闭一周
        </el-button>
        <el-button type="primary" @click="handleClose('permanent')">
          关闭公告
--- a/Yi.Ai.Vue3/src/components/userPersonalCenter/NavDialog.vue
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/NavDialog.vue
@@ -98,7 +98,7 @@ function toggleFullscreen() {

    <div class="dialog-container">
      <!-- 左侧导航 -->
-      <div class="nav-side">
+      <div class="nav-side" data-tour="user-nav-menu">
        <el-menu
          :default-active="activeNav"
          class="nav-menu"
@@ -108,6 +108,7 @@ function toggleFullscreen() {
            v-for="item in navItems"
            :key="item.name"
            :index="item.name"
+            :data-tour="`nav-${item.name}`"
          >
            <template #title>
              <el-icon v-if="item.icon">
--- a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/CardFlipActivity.vue
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/CardFlipActivity.vue
@@ -792,7 +792,7 @@ function generateShareContent(): string {
  return `
  🎁 【意心Ai】我来邀请你翻牌抽奖，分享我的限时邀请码~

-使用我的邀请码可为你解锁1次额外翻牌机会，最大可白嫖官方Claude4.5 220RMB额度 Token！💰
+填写我的邀请码，咱们双方各增加1次翻牌机会！最大可白嫖官方Claude4.5 220RMB额度 Token！💰

 👉 点击链接立即参与我的专属邀请码链接：
 ${shareLink}
@@ -948,6 +948,7 @@ function getCardClass(record: CardFlipRecord): string[] {
            type="primary"
            size="small"
            icon="Gift"
+            data-tour="my-invite-code-btn"
            @click="showMyInviteCodeDialog = true"
          >
            我的邀请码
@@ -956,6 +957,7 @@ function getCardClass(record: CardFlipRecord): string[] {
            type="warning"
            size="small"
            icon="Unlock"
+            data-tour="use-invite-code-btn"
            @click="inviteCodeDialog = true"
          >
            使用邀请码
@@ -964,7 +966,7 @@ function getCardClass(record: CardFlipRecord): string[] {
      </div>

      <!-- 翻牌区域 -->
-      <div class="cards-section" :class="{ 'shuffle-mode': isShuffling }">
+      <div class="cards-section" :class="{ 'shuffle-mode': isShuffling }" data-tour="card-flip-area">
        <!-- 洗牌动画遮罩提示 -->
        <div v-if="isShuffling" class="shuffle-overlay">
          <div class="shuffle-tip">
@@ -1094,27 +1096,42 @@ function getCardClass(record: CardFlipRecord): string[] {
        class="invite-dialog"
      >
        <div class="invite-dialog-content">
-          <p class="dialog-tip">
-            输入好友的邀请码，可增加翻牌次数，必定中奖每次奖励最大额度翻倍！（使用其他人邀请码，自己的邀请码将失效）
-          </p>
-          <el-input
-            v-model="inputInviteCode"
-            placeholder="请输入8位邀请码"
-            maxlength="8"
-            clearable
-            size="large"
-            class="code-input"
-          >
-            <template #prefix>
-              <span style="font-size: 20px;">🎫</span>
-            </template>
-          </el-input>
+          <!-- 已填写过邀请码的提示 -->
+          <div v-if="taskData?.isFilledInviteCode" class="already-filled-box">
+            <span class="filled-icon">✅</span>
+            <p class="filled-text">
+              您已填写过邀请码，每人仅能填写一次他人邀请码
+            </p>
+          </div>
+
+          <template v-else>
+            <p class="dialog-tip">
+              输入好友的邀请码，双方各增加1次翻牌机会！必定中奖，每次奖励最大额度翻倍！
+            </p>
+            <el-input
+              v-model="inputInviteCode"
+              placeholder="请输入8位邀请码"
+              maxlength="8"
+              clearable
+              size="large"
+              class="code-input"
+            >
+              <template #prefix>
+                <span style="font-size: 20px;">🎫</span>
+              </template>
+            </el-input>
+          </template>
        </div>
        <template #footer>
          <el-button @click="inviteCodeDialog = false">
            取消
          </el-button>
-          <el-button type="primary" :loading="loading" @click="handleUseInviteCode">
+          <el-button
+            v-if="!taskData?.isFilledInviteCode"
+            type="primary"
+            :loading="loading"
+            @click="handleUseInviteCode"
+          >
            确认使用
          </el-button>
        </template>
@@ -1129,16 +1146,8 @@ function getCardClass(record: CardFlipRecord): string[] {
        class="my-invite-dialog"
      >
        <div class="my-invite-dialog-content">
-          <!-- 已使用过邀请码的提示 -->
-          <div v-if="taskData?.isInvited" class="invite-disabled-box">
-            <span class="disabled-icon">🔒</span>
-            <p class="disabled-text">
-              您已使用过他人的邀请码，无法生成自己的邀请码
-            </p>
-          </div>
-
          <!-- 显示已有的邀请码 -->
-          <div v-else-if="taskData?.myInviteCode" class="my-invite-code-display">
+          <div v-if="taskData?.myInviteCode" class="my-invite-code-display">
            <div class="code-box">
              <span class="code-text">{{ taskData.myInviteCode }}</span>
            </div>
@@ -1158,9 +1167,20 @@ function getCardClass(record: CardFlipRecord): string[] {
                复制分享链接
              </el-button>
            </div>
+            <!-- 显示当前用户是否已填写过邀请码 -->
+            <div v-if="taskData?.isFilledInviteCode" class="filled-status-info">
+              <span class="status-icon">✅</span>
+              <span class="status-text">您已填写过他人邀请码</span>
+            </div>
+            <div v-else class="unfilled-status-info">
+              <span class="status-icon">💡</span>
+              <span class="status-text">您还可以填写他人邀请码获得额外机会</span>
+            </div>
            <p class="invite-tip">
-              💌 分享给好友，好友使用后可解锁最后3次翻牌机会
+              💌 分享给好友，好友填写您的邀请码后<br>
+              <strong>双方各增加1次翻牌机会！</strong>
            </p>
+
            <div class="share-preview">
              <div class="share-preview-title">
                📱 分享预览
@@ -1174,7 +1194,7 @@ function getCardClass(record: CardFlipRecord): string[] {
          <!-- 生成邀请码 -->
          <div v-else class="generate-invite-box">
            <p class="generate-tip">
-              您还没有邀请码，生成后可以分享给好友
+              您还没有邀请码，生成后分享给好友，<strong>双方各增加1次翻牌机会</strong>！
            </p>
            <el-button
              type="primary"
@@ -2050,6 +2070,28 @@ function getCardClass(record: CardFlipRecord): string[] {
      font-size: 16px;
    }
  }
+
+  .already-filled-box {
+    text-align: center;
+    padding: 24px 16px;
+    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
+    border: 1px solid #bae6fd;
+    border-radius: 12px;
+
+    .filled-icon {
+      font-size: 48px;
+      display: block;
+      margin-bottom: 12px;
+    }
+
+    .filled-text {
+      font-size: 15px;
+      color: #0369a1;
+      line-height: 1.6;
+      margin: 0;
+      font-weight: 500;
+    }
+  }
 }

 /* 我的邀请码对话框样式 */
@@ -2109,7 +2151,45 @@ function getCardClass(record: CardFlipRecord): string[] {
      font-size: 13px;
      color: #909399;
      line-height: 1.5;
-      margin: 0 0 16px 0;
+      margin: 0 0 12px 0;
+
+      strong {
+        color: #f56c6c;
+        font-weight: 600;
+      }
+    }
+
+    .filled-status-info,
+    .unfilled-status-info {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 6px;
+      padding: 8px 12px;
+      border-radius: 8px;
+      margin-bottom: 12px;
+      font-size: 13px;
+      font-weight: 500;
+    }
+
+    .filled-status-info {
+      background: #f0fdf4;
+      border: 1px solid #86efac;
+      color: #166534;
+
+      .status-icon {
+        font-size: 16px;
+      }
+    }
+
+    .unfilled-status-info {
+      background: #fefce8;
+      border: 1px solid #fde047;
+      color: #854d0e;
+
+      .status-icon {
+        font-size: 16px;
+      }
    }

    .share-preview {
@@ -2169,6 +2249,11 @@ function getCardClass(record: CardFlipRecord): string[] {
      color: #606266;
      margin-bottom: 20px;
      line-height: 1.6;
+
+      strong {
+        color: #f56c6c;
+        font-weight: 600;
+      }
    }

    .el-button {
--- a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue
@@ -66,14 +66,16 @@ onMounted(() => {
 <template>
  <div class="premium-service">
    <!-- 套餐信息 -->
-    <PremiumPackageInfo
-      :package-data="packageData"
-      :loading="loading"
-      @refresh="refreshData"
-    />
+    <div data-tour="premium-package-info">
+      <PremiumPackageInfo
+        :package-data="packageData"
+        :loading="loading"
+        @refresh="refreshData"
+      />
+    </div>

    <!-- 额度明细列表 -->
-    <div class="usage-list-wrapper">
+    <div class="usage-list-wrapper" data-tour="premium-usage-list">
      <PremiumUsageList ref="usageListRef" />
    </div>
  </div>
--- a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumUsageList.vue
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumUsageList.vue
@@ -1,21 +1,12 @@
 <script lang="ts" setup>
 import type { PremiumTokenUsageDto, PremiumTokenUsageQueryParams } from '@/api/user';
-import { Clock, Refresh, Search } from '@element-plus/icons-vue';
-import { debounce } from 'lodash-es';
+import { Clock, Refresh } from '@element-plus/icons-vue';
 import { getPremiumTokenUsageList } from '@/api/user';

 // 额度明细列表
-const usageList = ref<PremiumTokenUsageDto[]>([]); // 后端返回的原始数据
-const filteredList = ref<PremiumTokenUsageDto[]>([]); // 前端过滤后的数据
-const displayList = ref<PremiumTokenUsageDto[]>([]); // 最终显示的数据（前端分页后）
+const usageList = ref<PremiumTokenUsageDto[]>([]);
 const listLoading = ref(false);
-const totalCount = ref(0); // 后端总数
-const filteredTotalCount = ref(0); // 前端过滤后的总数
-
-// 是否有前端筛选条件
-const hasClientFilter = computed(() => {
-  return !!searchKeyword.value || statusFilter.value !== null;
-});
+const totalCount = ref(0);

 // 查询参数
 const queryParams = ref<PremiumTokenUsageQueryParams>({
@@ -29,8 +20,7 @@ const pageSize = ref(10);

 // 筛选条件
 const dateRange = ref<[Date, Date] | null>(null);
-const searchKeyword = ref('');
-const statusFilter = ref<boolean | null>(null);
+const freeFilter = ref<boolean | null>(null);

 // 快捷时间选择
 const shortcuts = [
@@ -98,23 +88,21 @@ function getUsageColor(used: number, total: number): string {
 async function fetchUsageList(resetPage = false) {
  if (resetPage) {
    currentPage.value = 1;
-    queryParams.value.skipCount = 0;
  }

  listLoading.value = true;
  try {
-    // 如果有前端筛选条件，获取所有数据；否则使用正常分页
    const params: PremiumTokenUsageQueryParams = {
-      skipCount: hasClientFilter.value ? 0 : queryParams.value.skipCount,
-      maxResultCount: hasClientFilter.value ? 1000 : queryParams.value.maxResultCount,
+      skipCount: currentPage.value,
+      maxResultCount: queryParams.value.maxResultCount,
      startTime: queryParams.value.startTime,
      endTime: queryParams.value.endTime,
      orderByColumn: queryParams.value.orderByColumn,
      isAsc: queryParams.value.isAsc,
+      isFree: queryParams.value.isFree,
    };

    console.log('发送到后端的参数:', params);
-    console.log('是否有前端筛选:', hasClientFilter.value);

    const res = await getPremiumTokenUsageList(params);
    console.log('后端返回结果:', res);
@@ -122,87 +110,24 @@ async function fetchUsageList(resetPage = false) {
    if (res.data) {
      usageList.value = res.data.items || [];
      totalCount.value = res.data.totalCount || 0;
-
-      // 应用前端过滤和分页
-      applyClientFilters();
    }
  }
  catch (error) {
    console.error('获取额度明细列表失败:', error);
    ElMessage.error('获取额度明细列表失败');
    usageList.value = [];
-    filteredList.value = [];
-    displayList.value = [];
    totalCount.value = 0;
-    filteredTotalCount.value = 0;
  }
  finally {
    listLoading.value = false;
  }
 }

-// 前端过滤和分页
-function applyClientFilters() {
-  let filtered = [...usageList.value];
-
-  // 包名称搜索
-  if (searchKeyword.value) {
-    const keyword = searchKeyword.value.toLowerCase();
-    filtered = filtered.filter(item =>
-      item.packageName.toLowerCase().includes(keyword),
-    );
-  }
-
-  // 状态筛选
-  if (statusFilter.value !== null) {
-    filtered = filtered.filter(item => item.isActive === statusFilter.value);
-  }
-
-  filteredList.value = filtered;
-  filteredTotalCount.value = filtered.length;
-
-  // 如果有前端筛选，进行前端分页
-  if (hasClientFilter.value) {
-    const start = (currentPage.value - 1) * pageSize.value;
-    const end = start + pageSize.value;
-    displayList.value = filtered.slice(start, end);
-  }
-  else {
-    // 无前端筛选，直接使用过滤后的数据（实际就是原始数据）
-    displayList.value = filtered;
-  }
-
-  console.log('前端过滤和分页:', {
-    原始数量: usageList.value.length,
-    过滤后数量: filtered.length,
-    当前页显示: displayList.value.length,
-    搜索关键字: searchKeyword.value,
-    状态筛选: statusFilter.value,
-    当前页码: currentPage.value,
-    每页大小: pageSize.value,
-  });
-}
-
-// 防抖搜索
-const debouncedSearch = debounce(() => {
-  currentPage.value = 1; // 重置到第一页
-  applyClientFilters(); // 只应用前端过滤，不重新请求接口
-}, 300);
-
 // 处理分页
 function handlePageChange(page: number) {
  console.log('切换页码:', page);
  currentPage.value = page;
-
-  if (hasClientFilter.value) {
-    // 有前端筛选，只需重新分页
-    applyClientFilters();
-  }
-  else {
-    // 无前端筛选，后端分页
-    queryParams.value.skipCount = (page - 1) * pageSize.value;
-    fetchUsageList();
-  }
+  fetchUsageList();
 }

 // 处理每页大小变化
@@ -211,34 +136,21 @@ function handleSizeChange(size: number) {
  pageSize.value = size;
  queryParams.value.maxResultCount = size;
  currentPage.value = 1;
-  queryParams.value.skipCount = 0;
-
-  if (hasClientFilter.value) {
-    // 有前端筛选，只需重新分页
-    applyClientFilters();
-  }
-  else {
-    // 无前端筛选，重新获取数据
-    fetchUsageList();
-  }
+  fetchUsageList();
 }

 // 处理排序（使用 OrderByColumn 和 IsAsc）
 function handleSortChange({ prop, order }: { prop: string; order: string | null }) {
  console.log('排序变化:', { prop, order });
  if (order) {
-    // 后端DTO使用 OrderByColumn 和 IsAsc
    queryParams.value.orderByColumn = prop;
-    // 转换为布尔值：ascending -> true, descending -> false
    queryParams.value.isAsc = order === 'ascending' ? 'ascending' : 'descending';
  }
  else {
    queryParams.value.orderByColumn = undefined;
    queryParams.value.isAsc = undefined;
  }
-  currentPage.value = 1;
-  queryParams.value.skipCount = 0;
-  fetchUsageList();
+  fetchUsageList(true);
 }

 // 处理时间筛选
@@ -270,59 +182,32 @@ function handleDateChange(value: [Date, Date] | null) {
 // 重置筛选
 function resetFilters() {
  console.log('重置所有筛选条件');
-  // 重置所有筛选条件
  dateRange.value = null;
-  searchKeyword.value = '';
-  statusFilter.value = null;
-  currentPage.value = 1;
+  freeFilter.value = null;

  // 重置后端查询参数
  queryParams.value = {
-    skipCount: 0,
    maxResultCount: pageSize.value,
    orderByColumn: undefined,
    isAsc: undefined,
    startTime: undefined,
    endTime: undefined,
+    isFree: undefined,
  };

-  // 重新获取数据
-  fetchUsageList();
+  fetchUsageList(true);
 }

-// 处理搜索
-function handleSearch() {
-  console.log('搜索关键字:', searchKeyword.value);
-
-  // 如果已经有全量数据（之前获取过），直接过滤
-  if (usageList.value.length > 0 && hasClientFilter.value) {
-    debouncedSearch();
-  }
-  else {
-    // 否则需要重新获取数据
-    currentPage.value = 1;
-    fetchUsageList();
-  }
-}
-
-// 处理状态筛选
-function handleStatusChange(value: boolean | null) {
-  console.log('状态筛选:', value);
-
-  // 如果是清除操作（value 为 null），重置筛选
-  if (value === null) {
-    statusFilter.value = null;
-  }
-
-  currentPage.value = 1; // 重置到第一页
-
-  // 状态筛选需要重新获取数据（因为后端不支持状态筛选）
-  fetchUsageList();
+// 处理是否免费筛选
+function handleFreeFilterChange(value: boolean | null) {
+  console.log('是否免费筛选:', value);
+  queryParams.value.isFree = value === null ? undefined : value;
+  fetchUsageList(true);
 }

 // 判断是否有活动的筛选条件
 const hasActiveFilters = computed(() => {
-  return !!dateRange.value || !!searchKeyword.value || statusFilter.value !== null;
+  return !!dateRange.value || freeFilter.value !== null;
 });

 // 对外暴露刷新方法
@@ -348,12 +233,8 @@ onMounted(() => {
            <!--            <span class="header-subtitle">Premium Package Usage Details</span> -->
          </div>
        </div>
-        <div v-if="false" class="header-right">
-          <el-tag v-if="hasClientFilter && filteredTotalCount > 0" type="warning" size="default" class="count-tag">
-            <el-icon><i-ep-filter /></el-icon>
-            筛选后 {{ filteredTotalCount }} 条
-          </el-tag>
-          <el-tag v-else-if="totalCount > 0" type="primary" size="default" class="count-tag" effect="plain">
+        <div class="header-right">
+          <el-tag v-if="totalCount > 0" type="primary" size="default" class="count-tag" effect="plain">
            <el-icon><i-ep-data-line /></el-icon>
            共 {{ totalCount }} 条记录
          </el-tag>
@@ -364,21 +245,6 @@ onMounted(() => {
    <!-- 筛选工具栏 -->
    <div class="filter-toolbar">
      <div class="filter-row">
-        <div class="filter-item">
-          <el-input
-            v-model="searchKeyword"
-            placeholder="搜索包名称"
-            clearable
-            size="default"
-            class="search-input"
-            @input="handleSearch"
-          >
-            <template #prefix>
-              <el-icon><Search /></el-icon>
-            </template>
-          </el-input>
-        </div>
-
        <div class="filter-item">
          <el-date-picker
            v-model="dateRange"
@@ -398,15 +264,15 @@ onMounted(() => {

        <div class="filter-item">
          <el-select
-            v-model="statusFilter"
-            placeholder="全部状态"
+            v-model="freeFilter"
+            placeholder="全部类型"
            clearable
            size="default"
-            class="status-select"
-            @change="handleStatusChange"
+            class="free-select"
+            @change="handleFreeFilterChange"
          >
-            <el-option label="激活" :value="true" />
-            <el-option label="未激活" :value="false" />
+            <el-option label="免费" :value="true" />
+            <el-option label="付费" :value="false" />
          </el-select>
        </div>

@@ -429,25 +295,18 @@ onMounted(() => {
          </el-button>
        </div>
      </div>
-
-      <!-- 筛选提示 -->
-      <!--      <div v-if="searchKeyword || statusFilter !== null" class="filter-tip"> -->
-      <!--        <el-icon color="#409eff"> -->
-      <!--          <i-ep-info-filled /> -->
-      <!--        </el-icon> -->
-      <!--        <span>启用包名称或状态筛选时，将从当前时间范围内获取更多数据进行过滤（最多1000条）</span> -->
-      <!--      </div> -->
    </div>

    <!-- 数据表格 -->
    <el-table
-      :data="displayList"
+      :data="usageList"
      stripe
      class="usage-table"
      empty-text="暂无数据"
+      border
      @sort-change="handleSortChange"
    >
-      <el-table-column prop="packageName" label="包名称" min-width="140" sortable="custom" show-overflow-tooltip>
+      <el-table-column prop="packageName" label="包名称" min-width="200" sortable show-overflow-tooltip align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div class="package-name-cell">
            <el-icon class="package-icon" color="#409eff">
@@ -458,7 +317,7 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="总额度" min-width="130" prop="totalTokens" sortable="custom" align="right">
+      <el-table-column label="总额度" min-width="130" prop="totalTokens" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div class="token-cell">
            <span class="token-value">{{ formatNumber(row.totalTokens) }}</span>
@@ -467,7 +326,7 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="已使用" min-width="130" prop="usedTokens" sortable="custom" align="right">
+      <el-table-column label="已使用" min-width="130" prop="usedTokens" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div class="token-cell used">
            <span class="token-value">{{ formatNumber(row.usedTokens) }}</span>
@@ -476,7 +335,7 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="剩余" min-width="130" prop="remainingTokens" sortable="custom" align="right">
+      <el-table-column label="剩余" min-width="130" prop="remainingTokens" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div class="token-cell remaining">
            <span
@@ -490,7 +349,7 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="使用率" min-width="130" align="center">
+      <el-table-column label="使用率" min-width="130" align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div class="usage-progress-cell">
            <el-progress
@@ -508,13 +367,13 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="购买金额" min-width="110" prop="purchaseAmount" sortable="custom" align="right">
+      <el-table-column label="购买金额" min-width="110" prop="purchaseAmount" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <span class="amount-cell">¥{{ row.purchaseAmount.toFixed(2) }}</span>
        </template>
      </el-table-column>

-      <el-table-column label="状态" min-width="90" prop="isActive" sortable="custom" align="center">
+      <el-table-column label="状态" min-width="90" prop="isActive" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <el-tag :type="row.isActive ? 'success' : 'info'" size="small" effect="dark">
            {{ row.isActive ? '激活' : '未激活' }}
@@ -522,7 +381,19 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column label="到期时间" min-width="170" prop="expireDateTime" sortable="custom">
+      <el-table-column label="创建时间" min-width="170" prop="creationTime" sortable align="center" header-align="center" resizable>
+        <template #default="{ row }">
+          <div v-if="row.creationTime" class="creation-cell">
+            <el-icon class="creation-icon">
+              <Clock />
+            </el-icon>
+            <span>{{ formatDateTime(row.creationTime) }}</span>
+          </div>
+          <span v-else class="no-data">-</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="到期时间" min-width="170" prop="expireDateTime" sortable align="center" header-align="center" resizable>
        <template #default="{ row }">
          <div v-if="row.expireDateTime" class="expire-cell">
            <el-icon class="expire-icon">
@@ -534,7 +405,7 @@ onMounted(() => {
        </template>
      </el-table-column>

-      <el-table-column prop="remark" label="备注" min-width="150" show-overflow-tooltip>
+      <el-table-column prop="remark" label="备注" min-width="150" show-overflow-tooltip align="center" header-align="center" resizable>
        <template #default="{ row }">
          <span class="remark-cell">{{ row.remark || '-' }}</span>
        </template>
@@ -542,7 +413,7 @@ onMounted(() => {
    </el-table>

    <!-- 空状态 -->
-    <div v-if="!displayList.length && !listLoading" class="empty-container">
+    <div v-if="!usageList.length && !listLoading" class="empty-container">
      <el-empty :description="hasActiveFilters ? '当前筛选条件下无数据' : '暂无明细记录'">
        <el-button v-if="hasActiveFilters" type="primary" @click="resetFilters">
          清除筛选
@@ -551,12 +422,12 @@ onMounted(() => {
    </div>

    <!-- 分页 -->
-    <div v-if="(hasClientFilter ? filteredTotalCount : totalCount) > 0" class="pagination-container">
+    <div v-if="totalCount > 0" class="pagination-container">
      <el-pagination
        v-model:current-page="currentPage"
        v-model:page-size="pageSize"
        :page-sizes="[10, 20, 50, 100]"
-        :total="hasClientFilter ? filteredTotalCount : totalCount"
+        :total="totalCount"
        layout="total, sizes, prev, pager, next, jumper"
        prev-text="上一页"
        next-text="下一页"
@@ -677,15 +548,11 @@ onMounted(() => {
  flex: 0 0 auto;
 }

-.search-input {
-  width: 220px;
-}
-
 .date-picker {
  width: 320px;
 }

-.status-select {
+.free-select {
  width: 140px;
 }

@@ -738,7 +605,7 @@ onMounted(() => {
  display: flex;
  align-items: baseline;
  gap: 4px;
-  justify-content: flex-end;
+  justify-content: center;
 }

 .token-value {
@@ -757,6 +624,18 @@ onMounted(() => {
  color: #f56c6c;
 }

+.creation-cell {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: #606266;
+}
+
+.creation-icon {
+  font-size: 14px;
+  color: #67c23a;
+}
+
 .expire-cell {
  display: flex;
  align-items: center;
@@ -890,9 +769,8 @@ onMounted(() => {
    width: 100%;
  }

-  .search-input,
  .date-picker,
-  .status-select {
+  .free-select {
    width: 100%;
  }

--- a/Yi.Ai.Vue3/src/hooks/useGuideTour.ts
+++ b/Yi.Ai.Vue3/src/hooks/useGuideTour.ts
@@ -0,0 +1,334 @@
+import { driver } from 'driver.js';
+import { useGuideTourStore } from '@/stores';
+import 'driver.js/dist/driver.css';
+
+// 引导步骤接口
+interface TourStep {
+  element: string;
+  popover: {
+    title: string;
+    description: string;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    align?: 'start' | 'center' | 'end';
+  };
+  onHighlightStarted?: () => void;
+  onDeselected?: () => void;
+}
+
+export function useGuideTour() {
+  const guideTourStore = useGuideTourStore();
+
+  // 创建 driver 实例
+  const driverInstance = ref<ReturnType<typeof driver> | null>(null);
+
+  // 初始化 driver
+  function initDriver() {
+    driverInstance.value = driver({
+      showProgress: true,
+      animate: true,
+      allowClose: true,
+      overlayClickNext: false,
+      stagePadding: 10,
+      stageRadius: 8,
+      popoverClass: 'guide-tour-popover',
+      nextBtnText: '下一步',
+      prevBtnText: '上一步',
+      doneBtnText: '完成',
+      progressText: '{{current}} / {{total}}',
+      onDestroyed: () => {
+        guideTourStore.setCurrentPhase('idle');
+      },
+    });
+  }
+
+  // Header 区域引导步骤（包含聊天功能）
+  const headerSteps: TourStep[] = [
+    {
+      element: '[data-tour="tutorial-btn"]',
+      popover: {
+        title: '新手教程',
+        description: '欢迎使用意心AI-YiXinAI！点击这里可以随时重新查看新手引导教程，帮助您快速了解系统功能。',
+        side: 'bottom',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="model-select"]',
+      popover: {
+        title: '模型选择',
+        description: '点击这里可以切换不同的AI模型，每个模型有不同的特点和能力。VIP用户可以更多高级模型。',
+        side: 'top',
+        align: 'start',
+      },
+    },
+    {
+      element: '[data-tour="chat-sender"]',
+      popover: {
+        title: '对话输入框',
+        description: '在这里输入您的问题或指令，按回车或点击发送按钮即可与AI对话。支持语音输入',
+        side: 'top',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="announcement-btn"]',
+      popover: {
+        title: '公告/活动',
+        description: '这里会显示系统公告和最新活动信息，请及时查看以获取重要通知和福利活动。',
+        side: 'bottom',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="ai-tutorial-link"]',
+      popover: {
+        title: 'AI使用教程',
+        description: '点击这里可以跳转到YiXinAI玩法指南专栏，学习更多AI使用技巧和最佳实践。',
+        side: 'bottom',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="buy-btn"]',
+      popover: {
+        title: '立即购买',
+        description: '点击这里可以成为VIP会员和升级尊享服务，享受更多专属服务和权益。',
+        side: 'bottom',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="user-avatar"]',
+      popover: {
+        title: '用户中心',
+        description: '点击头像可以进入用户中心，管理您的账户信息、查看使用统计、API密钥等。接下来将为您详细介绍用户中心的各项功能。',
+        side: 'bottom',
+        align: 'end',
+      },
+    },
+  ];
+
+  // 用户中心弹窗引导步骤
+  const userCenterSteps: TourStep[] = [
+    {
+      element: '[data-tour="user-nav-menu"]',
+      popover: {
+        title: '导航菜单',
+        description: '左侧是功能导航菜单，您可以切换不同的功能模块。接下来我们将逐一介绍各个功能。',
+        side: 'right',
+        align: 'start',
+      },
+    },
+    {
+      element: '[data-tour="nav-user"]',
+      popover: {
+        title: '用户信息',
+        description: '查看您的个人信息，包括头像、昵称等。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('user');
+      },
+    },
+    {
+      element: '[data-tour="nav-apiKey"]',
+      popover: {
+        title: 'API密钥',
+        description: '管理您的API密钥，用于第三方接入和开发集成。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('apiKey');
+      },
+    },
+    {
+      element: '[data-tour="nav-rechargeLog"]',
+      popover: {
+        title: '充值记录',
+        description: '查看您的充值历史和交易记录，了解消费明细。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('rechargeLog');
+      },
+    },
+    {
+      element: '[data-tour="nav-usageStatistics"]',
+      popover: {
+        title: '用量统计',
+        description: '查看您的AI模型使用情况和消费统计，掌握使用详情。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('usageStatistics');
+      },
+    },
+    {
+      element: '[data-tour="nav-premiumService"]',
+      popover: {
+        title: '尊享服务',
+        description: '了解尊享服务包专属特权和服务，我们将详细介绍这个页面的功能。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('premiumService');
+      },
+    },
+    {
+      element: '[data-tour="premium-package-info"]',
+      popover: {
+        title: '套餐信息',
+        description: '这里显示您的尊享服务套餐详情，包括总额度、已使用额度、剩余额度等信息。',
+        side: 'left',
+        align: 'start',
+      },
+    },
+    {
+      element: '[data-tour="premium-usage-list"]',
+      popover: {
+        title: '额度明细列表',
+        description: '查看您的额度使用明细记录，包括每次使用的时间、消耗的额度等详细信息。',
+        side: 'left',
+        align: 'start',
+      },
+    },
+    {
+      element: '[data-tour="nav-dailyTask"]',
+      popover: {
+        title: '每日任务',
+        description: '完成每日任务获取额外奖励，提升您的使用体验。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('dailyTask');
+      },
+    },
+    {
+      element: '[data-tour="nav-cardFlip"]',
+      popover: {
+        title: '每周邀请',
+        description: '邀请好友加入，获得丰厚奖励。接下来将详细介绍这个页面的各项功能。',
+        side: 'right',
+        align: 'center',
+      },
+      onHighlightStarted: () => {
+        guideTourStore.changeUserCenterNav('cardFlip');
+      },
+    },
+    {
+      element: '[data-tour="card-flip-area"]',
+      popover: {
+        title: '每周免费翻牌',
+        description: '每周您有10次免费翻牌机会，前7次为基础免费次数。翻牌可获得Token奖励，幸运值随着翻牌次数增加而提升。',
+        side: 'left',
+        align: 'start',
+      },
+    },
+    {
+      element: '[data-tour="use-invite-code-btn"]',
+      popover: {
+        title: '使用邀请码',
+        description: '输入好友的邀请码，双方各增加1次翻牌机会！填写邀请码后，第8-10次翻牌必定中奖，每次奖励最大额度翻倍！',
+        side: 'left',
+        align: 'center',
+      },
+    },
+    {
+      element: '[data-tour="my-invite-code-btn"]',
+      popover: {
+        title: '我的邀请码',
+        description: '生成您的专属邀请码，分享给好友。好友使用您的邀请码后，双方各获得1次额外翻牌机会。您可以复制邀请码或分享带邀请码的链接。',
+        side: 'left',
+        align: 'center',
+      },
+    },
+  ];
+
+  // 开始 Header 引导
+  async function startHeaderTour() {
+    if (!driverInstance.value) {
+      initDriver();
+    }
+
+    guideTourStore.setCurrentPhase('header');
+
+    // 等待 DOM 更新
+    await nextTick();
+
+    // 配置完成回调，触发用户中心引导
+    driverInstance.value?.setConfig({
+      onDestroyStarted: () => {
+        if (!driverInstance.value?.hasNextStep()) {
+          // Header 引导完成，触发打开用户中心弹窗
+          guideTourStore.triggerUserCenterTour();
+        }
+        driverInstance.value?.destroy();
+      },
+    });
+
+    driverInstance.value?.setSteps(headerSteps);
+    driverInstance.value?.drive();
+  }
+
+  // 开始用户中心引导
+  async function startUserCenterTour() {
+    if (!driverInstance.value) {
+      initDriver();
+    }
+
+    guideTourStore.setCurrentPhase('userCenter');
+
+    // 等待弹窗完全打开
+    await new Promise(resolve => setTimeout(resolve, 500));
+
+    // 配置完成回调，关闭弹窗并标记引导完成
+    driverInstance.value?.setConfig({
+      onDestroyStarted: () => {
+        if (!driverInstance.value?.hasNextStep()) {
+          // 用户中心引导完成，先关闭弹窗
+          guideTourStore.closeUserCenterDialog();
+
+          // 等待弹窗关闭后标记整个引导流程完成
+          setTimeout(() => {
+            guideTourStore.markTourCompleted();
+          }, 500);
+        }
+        driverInstance.value?.destroy();
+      },
+    });
+
+    driverInstance.value?.setSteps(userCenterSteps);
+    driverInstance.value?.drive();
+  }
+
+  // 开始完整引导流程
+  async function startFullTour() {
+    await startHeaderTour();
+  }
+
+  // 销毁 driver 实例
+  function destroyTour() {
+    if (driverInstance.value) {
+      driverInstance.value.destroy();
+      driverInstance.value = null;
+    }
+  }
+
+  // 组件卸载时清理
+  onUnmounted(() => {
+    destroyTour();
+  });
+
+  return {
+    startHeaderTour,
+    startUserCenterTour,
+    startFullTour,
+    destroyTour,
+  };
+}
--- a/Yi.Ai.Vue3/src/layouts/LayoutVertical/index.vue
+++ b/Yi.Ai.Vue3/src/layouts/LayoutVertical/index.vue
@@ -1,13 +1,15 @@
 <!-- 纵向布局作为基础布局 -->
 <script setup lang="ts">
+import SystemAnnouncementDialog from '@/components/SystemAnnouncementDialog/index.vue';
 import { useSafeArea } from '@/hooks/useSafeArea';
 import { useWindowWidthObserver } from '@/hooks/useWindowWidthObserver';
 import Aside from '@/layouts/components/Aside/index.vue';
 import Header from '@/layouts/components/Header/index.vue';
 import Main from '@/layouts/components/Main/index.vue';
-import { useDesignStore } from '@/stores';
+import { useAnnouncementStore, useDesignStore } from '@/stores';

 const designStore = useDesignStore();
+const announcementStore = useAnnouncementStore();

 const isCollapse = computed(() => designStore.isCollapse);

@@ -24,6 +26,16 @@ useSafeArea({

 /** 监听窗口大小变化，折叠侧边栏 */
 useWindowWidthObserver();
+
+// 应用加载时检查是否需要显示公告弹窗
+onMounted(() => {
+  console.log('announcementStore.shouldShowDialog--', announcementStore.shouldShowDialog);
+  // 检查是否应该显示弹窗（只有"关闭一周"且未超过7天才不显示）
+  // 数据获取已移至 SystemAnnouncementDialog 组件内部，每次打开弹窗时都会获取最新数据
+  if (announcementStore.shouldShowDialog) {
+    announcementStore.openDialog();
+  }
+});
 </script>

 <template>
@@ -39,6 +51,8 @@ useWindowWidthObserver();
      </el-main>
    </el-container>
  </el-container>
+  <!-- 系统公告弹窗 -->
+  <SystemAnnouncementDialog />
 </template>

 <style lang="scss" scoped>
--- a/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue
@@ -20,7 +20,7 @@ function openAnnouncement() {
 </script>

 <template>
-  <div class="announcement-btn-container">
+  <div class="announcement-btn-container" data-tour="announcement-btn">
    <el-badge
      is-dot
      class="announcement-badge"
@@ -32,7 +32,10 @@ function openAnnouncement() {
        class="announcement-btn"
        @click="openAnnouncement"
      >
-        <el-icon :size="20">
+        <!-- PC端显示文字 -->
+        <span class="pc-text">公告/活动</span>
+        <!-- 移动端显示图标 -->
+        <el-icon class="mobile-icon" :size="20">
          <Bell />
        </el-icon>
      </div>
@@ -44,65 +47,52 @@ function openAnnouncement() {
 .announcement-btn-container {
  display: flex;
  align-items: center;
-  margin-right: 12px;

  .announcement-badge {
    :deep(.el-badge__content) {
      background-color: #f56c6c;
      border: none;
-      //font-size: 12px;
-      //height: 18px;
-      //line-height: 18px;
-      //padding: 0 6px;
    }
  }

  .announcement-btn {
-    width: 40px;
-    height: 40px;
    display: flex;
    align-items: center;
-    justify-content: center;
-    border-radius: 50%;
-    background: transparent;
+    gap: 6px;
    cursor: pointer;
-    transition: all 0.3s;
-
-    .el-icon {
-      color: #606266;
-      transition: color 0.3s;
-    }
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #e6a23c;
+    transition: all 0.2s;

    &:hover {
-      background: rgba(0, 0, 0, 0.05);
+      color: #ebb563;
+      transform: translateY(-1px);
+    }

-      .el-icon {
-        color: #409eff;
-      }
+    // PC端显示文字，隐藏图标
+    .pc-text {
+      display: inline;
+      margin: 0 12px;
+
+    }
+
+    .mobile-icon {
+      display: none;
    }
  }
 }

-// 移动端适配
-@media screen and (max-width: 768px) {
+// 移动端显示图标，隐藏文字
+@media (max-width: 768px) {
  .announcement-btn-container {
-    margin-right: 8px;
-
    .announcement-btn {
-      width: 36px;
-      height: 36px;
-
-      .el-icon {
-        font-size: 18px;
+      .pc-text {
+        display: none;
      }
-    }

-    .announcement-badge {
-      :deep(.el-badge__content) {
-        //font-size: 10px;
-        //height: 16px;
-        //line-height: 16px;
-        //padding: 0 4px;
+      .mobile-icon {
+        display: inline;
      }
    }
  }
--- a/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
@@ -6,7 +6,8 @@ import { computed, nextTick, onMounted, ref, watch } from 'vue';
 import { useRouter } from 'vue-router';
 import Popover from '@/components/Popover/index.vue';
 import SvgIcon from '@/components/SvgIcon/index.vue';
-import { useUserStore } from '@/stores';
+import { useGuideTour } from '@/hooks/useGuideTour';
+import { useGuideTourStore, useUserStore } from '@/stores';
 import { useSessionStore } from '@/stores/modules/session';
 import { showProductPackage } from '@/utils/product-package';
 import { getUserProfilePicture, isUserVip } from '@/utils/user';
@@ -15,6 +16,8 @@ const router = useRouter();

 const userStore = useUserStore();
 const sessionStore = useSessionStore();
+const guideTourStore = useGuideTourStore();
+const { startUserCenterTour } = useGuideTour();

 // const src = computed(
 //   () => userStore.userInfo?.avatar ?? 'https://avatars.githubusercontent.com/u/76239030',
@@ -243,6 +246,34 @@ onMounted(() => {
    // URL 参数会在对话框关闭时清除
  }
 });
+
+// ============ 监听引导状态，自动打开用户中心并开始引导 ============
+watch(() => guideTourStore.shouldStartUserCenterTour, (shouldStart) => {
+  if (shouldStart) {
+    // 清除触发标记
+    guideTourStore.clearUserCenterTourTrigger();
+
+    // 注册导航切换回调
+    guideTourStore.setUserCenterNavChangeCallback((nav: string) => {
+      activeNav.value = nav;
+    });
+
+    // 注册关闭弹窗回调
+    guideTourStore.setUserCenterCloseCallback(() => {
+      dialogVisible.value = false;
+    });
+
+    // 打开用户中心弹窗
+    nextTick(() => {
+      dialogVisible.value = true;
+
+      // 等待弹窗打开后开始引导
+      setTimeout(() => {
+        startUserCenterTour();
+      }, 600);
+    });
+  }
+});
 </script>

 <template>
@@ -259,7 +290,7 @@ onMounted(() => {
    <!--      </a> -->
    <!--    </div> -->

-    <div class="text-1.2xl font-bold text-gray-800 hover:text-blue-600 transition-colors">
+    <div class="text-1.2xl font-bold text-gray-800 hover:text-blue-600 transition-colors" data-tour="ai-tutorial-link">
      <a
        href="https://ccnetcore.com/article/3a1bc4d1-6a7d-751d-91cc-2817eb2ddcde"
        target="_blank"
@@ -292,6 +323,7 @@ onMounted(() => {

    <el-button
      class="buy-btn flex items-center gap-2 px-5 py-2 font-semibold shadow-lg"
+      data-tour="buy-btn"
      @click="onProductPackage"
    >
      <span>立即购买</span>
@@ -321,7 +353,7 @@ onMounted(() => {
    </div>

    <!-- 头像区域 -->
-    <div class="avatar-container">
+    <div class="avatar-container" data-tour="user-avatar">
      <Popover
        ref="popoverRef"
        placement="bottom-end"
--- a/Yi.Ai.Vue3/src/layouts/components/Header/components/TutorialBtn.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/components/TutorialBtn.vue
@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import { QuestionFilled } from '@element-plus/icons-vue';
+import { useGuideTour } from '@/hooks/useGuideTour';
+
+const { startHeaderTour } = useGuideTour();
+
+// 开始引导教程
+function handleStartTutorial() {
+  startHeaderTour();
+}
+</script>
+
+<template>
+  <div class="tutorial-btn-container" data-tour="tutorial-btn">
+    <div
+      class="tutorial-btn"
+      @click="handleStartTutorial"
+    >
+      <!-- PC端显示文字 -->
+      <span class="pc-text">新手引导</span>
+      <!-- 移动端显示图标 -->
+      <el-icon class="mobile-icon" :size="20">
+        <QuestionFilled />
+      </el-icon>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.tutorial-btn-container {
+  display: flex;
+  align-items: center;
+
+  .tutorial-btn {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    cursor: pointer;
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #409eff;
+    transition: all 0.2s;
+
+    &:hover {
+      color: #66b1ff;
+      transform: translateY(-1px);
+    }
+
+    // PC端显示文字，隐藏图标
+    .pc-text {
+      display: inline;
+      margin: 0 12px;
+    }
+
+    .mobile-icon {
+      display: none;
+    }
+  }
+}
+
+// 移动端显示图标，隐藏文字
+@media (max-width: 768px) {
+  .tutorial-btn-container {
+    .tutorial-btn {
+      .pc-text {
+        display: none;
+      }
+
+      .mobile-icon {
+        display: inline;
+      }
+    }
+  }
+}
+</style>
--- a/Yi.Ai.Vue3/src/layouts/components/Header/index.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/index.vue
@@ -10,6 +10,7 @@ import Collapse from './components/Collapse.vue';
 import CreateChat from './components/CreateChat.vue';
 import LoginBtn from './components/LoginBtn.vue';
 import TitleEditing from './components/TitleEditing.vue';
+import TutorialBtn from './components/TutorialBtn.vue';

 const userStore = useUserStore();
 const designStore = useDesignStore();
@@ -71,6 +72,7 @@ onKeyStroke(event => event.ctrlKey && event.key.toLowerCase() === 'k', handleCtr
        <!-- 右边 -->
        <div class="right-box flex h-full items-center pr-20px flex-shrink-0 mr-auto flex-row">
          <AnnouncementBtn />
+          <TutorialBtn />
          <Avatar v-show="userStore.userInfo" />
          <LoginBtn v-show="!userStore.userInfo" />
        </div>
--- a/Yi.Ai.Vue3/src/pages/activity/detail.vue
+++ b/Yi.Ai.Vue3/src/pages/activity/detail.vue
@@ -1,52 +1,53 @@
 <script lang="ts" setup>
-import { ElMessage } from 'element-plus'
-import { useRoute, useRouter } from 'vue-router'
-import { getActivityDetail } from '@/api'
-import type { ActivityDetailResponse } from '@/api'
+import { ElMessage } from 'element-plus';
+import { useRoute, useRouter } from 'vue-router';
+// import { getActivityDetail } from '@/api'
+// import type { ActivityDetailResponse } from '@/api'

-const route = useRoute()
-const router = useRouter()
+const route = useRoute();
+const router = useRouter();

-const loading = ref(false)
-const activityDetail = ref<ActivityDetailResponse | null>(null)
+const loading = ref(false);
+// const activityDetail = ref<ActivityDetailResponse | null>(null)
+const activityDetail = ref<any | null>(null);

 // 获取活动详情
 async function fetchActivityDetail() {
-  const id = route.params.id as string
+  const id = route.params.id as string;
  if (!id)
-    return
+    return;

-  loading.value = true
+  loading.value = true;
  try {
-    const res = await getActivityDetail(id)
-    activityDetail.value = res.data
+    // const res = await getActivityDetail(id)
+    // activityDetail.value = res.data
  }
  catch (error) {
-    console.error('获取活动详情失败:', error)
-    ElMessage.error('获取活动详情失败')
+    console.error('获取活动详情失败:', error);
+    ElMessage.error('获取活动详情失败');
  }
  finally {
-    loading.value = false
+    loading.value = false;
  }
 }

 // 返回上一页
 function goBack() {
-  router.back()
+  router.back();
 }

 // 格式化时间
 function formatDateTime(time?: string) {
  if (!time)
-    return '-'
-  const date = new Date(time)
-  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`
+    return '-';
+  const date = new Date(time);
+  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;
 }

 // 页面加载时获取详情
 onMounted(() => {
-  fetchActivityDetail()
-})
+  fetchActivityDetail();
+});
 </script>

 <template>
@@ -64,7 +65,9 @@ onMounted(() => {
      <div v-if="activityDetail" class="detail-content">
        <!-- 活动头部 -->
        <div class="detail-header">
-          <h1 class="detail-title">{{ activityDetail.title }}</h1>
+          <h1 class="detail-title">
+            {{ activityDetail.title }}
+          </h1>
          <div class="detail-meta">
            <el-tag
              v-if="activityDetail.status === 'active'"
--- a/Yi.Ai.Vue3/src/pages/announcement/detail.vue
+++ b/Yi.Ai.Vue3/src/pages/announcement/detail.vue
@@ -1,52 +1,52 @@
 <script lang="ts" setup>
-import { ElMessage } from 'element-plus'
-import { useRoute, useRouter } from 'vue-router'
-import { getAnnouncementDetail } from '@/api'
-import type { AnnouncementDetailResponse } from '@/api'
+import { ElMessage } from 'element-plus';
+import { useRoute, useRouter } from 'vue-router';
+// import { getAnnouncementDetail } from '@/api'
+// import type { AnnouncementDetailResponse } from '@/api'

-const route = useRoute()
-const router = useRouter()
+const route = useRoute();
+const router = useRouter();

-const loading = ref(false)
-const announcementDetail = ref<AnnouncementDetailResponse | null>(null)
+const loading = ref(false);
+const announcementDetail = ref<any | null>(null);

 // 获取公告详情
 async function fetchAnnouncementDetail() {
-  const id = route.params.id as string
+  const id = route.params.id as string;
  if (!id)
-    return
+    return;

-  loading.value = true
+  loading.value = true;
  try {
-    const res = await getAnnouncementDetail(id)
-    announcementDetail.value = res.data
+    // const res = await getAnnouncementDetail(id)
+    // announcementDetail.value = res.data
  }
  catch (error) {
-    console.error('获取公告详情失败:', error)
-    ElMessage.error('获取公告详情失败')
+    console.error('获取公告详情失败:', error);
+    ElMessage.error('获取公告详情失败');
  }
  finally {
-    loading.value = false
+    loading.value = false;
  }
 }

 // 返回上一页
 function goBack() {
-  router.back()
+  router.back();
 }

 // 格式化时间
 function formatDateTime(time?: string) {
  if (!time)
-    return '-'
-  const date = new Date(time)
-  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`
+    return '-';
+  const date = new Date(time);
+  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;
 }

 // 页面加载时获取详情
 onMounted(() => {
-  fetchAnnouncementDetail()
-})
+  fetchAnnouncementDetail();
+});
 </script>

 <template>
--- a/Yi.Ai.Vue3/src/pages/chat/layouts/chatDefaul/index.vue
+++ b/Yi.Ai.Vue3/src/pages/chat/layouts/chatDefaul/index.vue
@@ -7,7 +7,8 @@ import { ElMessage } from 'element-plus';
 import { nextTick, ref, watch } from 'vue';
 import ModelSelect from '@/components/ModelSelect/index.vue';
 import WelecomeText from '@/components/WelecomeText/index.vue';
-import { useUserStore } from '@/stores';
+import { useGuideTour } from '@/hooks/useGuideTour';
+import { useGuideTourStore, useUserStore } from '@/stores';
 import { useFilesStore } from '@/stores/modules/files';

 import { useSessionStore } from '@/stores/modules/session';
@@ -15,6 +16,7 @@ import { useSessionStore } from '@/stores/modules/session';
 const userStore = useUserStore();
 const sessionStore = useSessionStore();
 const filesStore = useFilesStore();
+const guideTourStore = useGuideTourStore();

 const senderValue = ref('');
 const senderRef = ref();
@@ -87,6 +89,7 @@ watch(
      ref="senderRef"
      v-model="senderValue"
      class="chat-defaul-sender"
+      data-tour="chat-sender"
      :auto-size="{
        maxRows: 9,
        minRows: 3,
--- a/Yi.Ai.Vue3/src/pages/chat/layouts/chatWithId/index.vue
+++ b/Yi.Ai.Vue3/src/pages/chat/layouts/chatWithId/index.vue
@@ -13,6 +13,8 @@ import { Sender } from 'vue-element-plus-x';
 import { useRoute } from 'vue-router';
 import { send } from '@/api';
 import ModelSelect from '@/components/ModelSelect/index.vue';
+import { useGuideTour } from '@/hooks/useGuideTour';
+import { useGuideTourStore } from '@/stores';
 import { useChatStore } from '@/stores/modules/chat';
 import { useFilesStore } from '@/stores/modules/files';
 import { useModelStore } from '@/stores/modules/model';
@@ -35,6 +37,7 @@ const chatStore = useChatStore();
 const modelStore = useModelStore();
 const filesStore = useFilesStore();
 const userStore = useUserStore();
+const guideTourStore = useGuideTourStore();

 // 用户头像
 const avatar = computed(() => {
@@ -336,7 +339,7 @@ function copy(item: any) {
      </BubbleList>

      <Sender
-        ref="senderRef" v-model="inputValue" class="chat-defaul-sender" :auto-size="{
+        ref="senderRef" v-model="inputValue" class="chat-defaul-sender" data-tour="chat-sender" :auto-size="{
          maxRows: 6,
          minRows: 2,
        }" variant="updown" clearable allow-speech :loading="isLoading" @submit="startSSE" @cancel="cancelSSE"
--- a/Yi.Ai.Vue3/src/stores/index.ts
+++ b/Yi.Ai.Vue3/src/stores/index.ts
@@ -11,3 +11,4 @@ export * from './modules/announcement'
 // export * from './modules/chat';
 export * from './modules/design';
 export * from './modules/user';
+export * from './modules/guideTour';
--- a/Yi.Ai.Vue3/src/stores/modules/announcement.ts
+++ b/Yi.Ai.Vue3/src/stores/modules/announcement.ts
@@ -37,11 +37,11 @@ export const useAnnouncementStore = defineStore(
      const elapsed = now - closedAt.value;

      if (closeType.value === 'permanent')
-        return false;
+        return true;

      if (closeType.value === 'today') {
-        // 检查是否已过去一天（24小时）
-        return elapsed > 24 * 60 * 60 * 1000;
+        // 检查是否已过去一周（7天）
+        return elapsed > 7 * 24 * 60 * 60 * 1000;
      }

      return true;
@@ -72,7 +72,7 @@ export const useAnnouncementStore = defineStore(
  },
  {
    persist: {
-      // 只持久化关闭状态相关的数据
+      // 只持久化关闭状态相关的数据，公告数据不缓存
      paths: ['closeType', 'closedAt'],
    },
  },
--- a/Yi.Ai.Vue3/src/stores/modules/guideTour.ts
+++ b/Yi.Ai.Vue3/src/stores/modules/guideTour.ts
@@ -0,0 +1,105 @@
+import { defineStore } from 'pinia';
+
+// 存储键名
+const TOUR_STORAGE_KEY = 'guide_tour_completed';
+
+export const useGuideTourStore = defineStore('guideTour', () => {
+  // 是否是首次访问
+  const isFirstVisit = ref(!localStorage.getItem(TOUR_STORAGE_KEY));
+
+  // 当前引导阶段
+  const currentPhase = ref<'idle' | 'header' | 'userCenter' | 'chat'>('idle');
+
+  // 是否需要在用户中心弹窗打开后开始引导
+  const shouldStartUserCenterTour = ref(false);
+
+  // 是否需要在聊天页面开始引导
+  const shouldStartChatTour = ref(false);
+
+  // 用户中心导航切换回调
+  const userCenterNavChangeCallback = ref<((nav: string) => void) | null>(null);
+
+  // 用户中心弹窗关闭回调
+  const userCenterCloseCallback = ref<(() => void) | null>(null);
+
+  // 标记引导已完成
+  function markTourCompleted() {
+    localStorage.setItem(TOUR_STORAGE_KEY, Date.now().toString());
+    isFirstVisit.value = false;
+  }
+
+  // 重置引导状态
+  function resetTourStatus() {
+    localStorage.removeItem(TOUR_STORAGE_KEY);
+    isFirstVisit.value = true;
+  }
+
+  // 设置当前引导阶段
+  function setCurrentPhase(phase: 'idle' | 'header' | 'userCenter' | 'chat') {
+    currentPhase.value = phase;
+  }
+
+  // 触发用户中心引导
+  function triggerUserCenterTour() {
+    shouldStartUserCenterTour.value = true;
+  }
+
+  // 清除用户中心引导触发标记
+  function clearUserCenterTourTrigger() {
+    shouldStartUserCenterTour.value = false;
+  }
+
+  // 触发聊天页面引导
+  function triggerChatTour() {
+    shouldStartChatTour.value = true;
+  }
+
+  // 清除聊天页面引导触发标记
+  function clearChatTourTrigger() {
+    shouldStartChatTour.value = false;
+  }
+
+  // 设置用户中心导航切换回调
+  function setUserCenterNavChangeCallback(callback: (nav: string) => void) {
+    userCenterNavChangeCallback.value = callback;
+  }
+
+  // 设置用户中心弹窗关闭回调
+  function setUserCenterCloseCallback(callback: () => void) {
+    userCenterCloseCallback.value = callback;
+  }
+
+  // 切换用户中心导航
+  function changeUserCenterNav(nav: string) {
+    if (userCenterNavChangeCallback.value) {
+      userCenterNavChangeCallback.value(nav);
+    }
+  }
+
+  // 关闭用户中心弹窗
+  function closeUserCenterDialog() {
+    if (userCenterCloseCallback.value) {
+      userCenterCloseCallback.value();
+    }
+  }
+
+  return {
+    isFirstVisit,
+    currentPhase,
+    shouldStartUserCenterTour,
+    shouldStartChatTour,
+    userCenterNavChangeCallback,
+    userCenterCloseCallback,
+    markTourCompleted,
+    resetTourStatus,
+    setCurrentPhase,
+    triggerUserCenterTour,
+    clearUserCenterTourTrigger,
+    triggerChatTour,
+    clearChatTourTrigger,
+    setUserCenterNavChangeCallback,
+    setUserCenterCloseCallback,
+    changeUserCenterNav,
+    closeUserCenterDialog,
+  };
+});
--- a/Yi.Ai.Vue3/src/styles/guide-tour.scss
+++ b/Yi.Ai.Vue3/src/styles/guide-tour.scss
@@ -0,0 +1,148 @@
+// Guide Tour 自定义样式
+// 覆盖 driver.js 默认样式
+
+.driver-popover {
+  background-color: #fff;
+  border-radius: 12px;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
+  border: none;
+  padding: 20px;
+  min-width: 300px;
+  max-width: 400px;
+
+  &.guide-tour-popover {
+    // 自定义样式类
+  }
+
+  .driver-popover-title {
+    font-size: 18px;
+    font-weight: 600;
+    color: #303133;
+    margin-bottom: 12px;
+    padding-right: 24px;
+  }
+
+  .driver-popover-description {
+    font-size: 14px;
+    color: #606266;
+    line-height: 1.6;
+    margin-bottom: 16px;
+  }
+
+  .driver-popover-progress-text {
+    font-size: 12px;
+    color: #909399;
+    margin-bottom: 12px;
+  }
+
+  .driver-popover-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .driver-popover-navigation-btns {
+    display: flex;
+    gap: 8px;
+  }
+
+  .driver-popover-prev-btn,
+  .driver-popover-next-btn {
+    padding: 8px 16px;
+    border-radius: 6px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.3s;
+    border: none;
+  }
+
+  .driver-popover-prev-btn {
+    background-color: #f5f7fa;
+    color: #606266;
+
+    &:hover {
+      background-color: #e6e8eb;
+    }
+  }
+
+  .driver-popover-next-btn {
+    background-color: #409eff;
+    color: #fff;
+
+    &:hover {
+      background-color: #66b1ff;
+    }
+  }
+
+  .driver-popover-close-btn {
+    position: absolute;
+    top: 12px;
+    right: 12px;
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    background-color: transparent;
+    border: none;
+    color: #909399;
+    cursor: pointer;
+    transition: all 0.3s;
+    font-size: 18px;
+
+    &:hover {
+      background-color: #f5f7fa;
+      color: #606266;
+    }
+  }
+
+  // 箭头样式
+  .driver-popover-arrow {
+    border: none;
+  }
+
+  &.driver-popover-side-top .driver-popover-arrow {
+    border-top-color: #fff;
+  }
+
+  &.driver-popover-side-bottom .driver-popover-arrow {
+    border-bottom-color: #fff;
+  }
+
+  &.driver-popover-side-left .driver-popover-arrow {
+    border-left-color: #fff;
+  }
+
+  &.driver-popover-side-right .driver-popover-arrow {
+    border-right-color: #fff;
+  }
+}
+
+// 高亮区域样式
+.driver-highlighted-element {
+  outline: none !important;
+}
+
+// 遮罩层样式
+.driver-overlay {
+  background-color: rgba(0, 0, 0, 0.65) !important;
+}
+
+// 动画效果
+@keyframes fadeInUp {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.driver-popover {
+  animation: fadeInUp 0.3s ease-out;
+}
--- a/Yi.Ai.Vue3/src/styles/index.scss
+++ b/Yi.Ai.Vue3/src/styles/index.scss
@@ -3,6 +3,7 @@
@use 'reset-css';
@use './element-plus';
@use './elx';
+@use './guide-tour';
 body{
  overflow: hidden;
 }
--- a/Yi.Ai.Vue3/types/components.d.ts
+++ b/Yi.Ai.Vue3/types/components.d.ts
@@ -11,7 +11,6 @@ declare module 'vue' {
    AccountPassword: typeof import('./../src/components/LoginDialog/components/FormLogin/AccountPassword.vue')['default']
    APIKeyManagement: typeof import('./../src/components/userPersonalCenter/components/APIKeyManagement.vue')['default']
    CardFlipActivity: typeof import('./../src/components/userPersonalCenter/components/CardFlipActivity.vue')['default']
-    CardFlipActivity2: typeof import('./../src/components/userPersonalCenter/components/CardFlipActivity2.vue')['default']
    DailyTask: typeof import('./../src/components/userPersonalCenter/components/DailyTask.vue')['default']
    DeepThinking: typeof import('./../src/components/DeepThinking/index.vue')['default']
    ElAlert: typeof import('element-plus/es')['ElAlert']
@@ -20,11 +19,8 @@ declare module 'vue' {
    ElButton: typeof import('element-plus/es')['ElButton']
    ElButtonGroup: typeof import('element-plus/es')['ElButtonGroup']
    ElCard: typeof import('element-plus/es')['ElCard']
-    ElCarousel: typeof import('element-plus/es')['ElCarousel']
-    ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
    ElCollapse: typeof import('element-plus/es')['ElCollapse']
    ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
-    ElCollapseTransition: typeof import('element-plus/es')['ElCollapseTransition']
    ElContainer: typeof import('element-plus/es')['ElContainer']
    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
    ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
--- a/Yi.Ai.Vue3/types/import_meta.d.ts
+++ b/Yi.Ai.Vue3/types/import_meta.d.ts
@@ -6,6 +6,7 @@ interface ImportMetaEnv {
  readonly VITE_WEB_ENV: string;
  readonly VITE_WEB_BASE_API: string;
  readonly VITE_API_URL: string;
+  readonly VITE_BUILD_COMPRESS: string;
  readonly VITE_SSO_SEVER_URL: string;
  readonly VITE_APP_VERSION: string;
 }