diff --git a/.gitignore b/.gitignore
index 8ed69463..7bd589c0 100644
--- 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
diff --git a/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore.Abstractions/DbConnOptions.cs b/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore.Abstractions/DbConnOptions.cs
index 647ca0e8..65c83f13 100644
--- a/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore.Abstractions/DbConnOptions.cs
+++ b/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore.Abstractions/DbConnOptions.cs
@@ -60,8 +60,8 @@ namespace Yi.Framework.SqlSugarCore.Abstractions
         public bool EnabledSaasMultiTenancy { get; set; } = false;
 
         /// <summary>
-        /// 并发乐观锁异常，否则不处理
+        /// 是否开启更新并发乐观锁
         /// </summary>
-        public bool EnabledConcurrencyException { get; set; } = true;
+        public bool EnabledConcurrencyException { get;set; } = false;
     }
 }
\ No newline at end of file
diff --git a/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore/Repositories/SqlSugarRepository.cs b/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore/Repositories/SqlSugarRepository.cs
index 1cc1ea61..786254ec 100644
--- a/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore/Repositories/SqlSugarRepository.cs
+++ b/Yi.Abp.Net8/framework/Yi.Framework.SqlSugarCore/Repositories/SqlSugarRepository.cs
@@ -1,12 +1,7 @@
-using System.Linq;
 using System.Linq.Expressions;
-using System.Text;
-using Microsoft.Extensions.Logging;
 using Microsoft.Extensions.Options;
 using Nito.AsyncEx;
 using SqlSugar;
-using Volo.Abp;
-using Volo.Abp.Auditing;
 using Volo.Abp.Data;
 using Volo.Abp.DependencyInjection;
 using Volo.Abp.Domain.Entities;
@@ -17,18 +12,17 @@ using Yi.Framework.SqlSugarCore.Abstractions;
 
 namespace Yi.Framework.SqlSugarCore.Repositories
 {
-    public class SqlSugarRepository<TEntity> : ISqlSugarRepository<TEntity>, IRepository<TEntity>
-        where TEntity : class, IEntity, new()
+    public class SqlSugarRepository<TEntity> : ISqlSugarRepository<TEntity>, IRepository<TEntity> where TEntity : class, IEntity, new()
     {
         public ISqlSugarClient _Db => AsyncContext.Run(async () => await GetDbContextAsync());
 
         public ISugarQueryable<TEntity> _DbQueryable => _Db.Queryable<TEntity>();
 
         private readonly ISugarDbContextProvider<ISqlSugarDbContext> _dbContextProvider;
-
+        
         public IAbpLazyServiceProvider LazyServiceProvider { get; set; }
+        
         protected DbConnOptions? Options => LazyServiceProvider?.LazyGetService<IOptions<DbConnOptions>>().Value;
-
         /// <summary>
         /// 异步查询执行器
         /// </summary>
@@ -64,26 +58,22 @@ namespace Yi.Framework.SqlSugarCore.Repositories
 
         #region Abp模块
 
-        public virtual async Task<TEntity?> FindAsync(Expression<Func<TEntity, bool>> predicate,
-            bool includeDetails = true, CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity?> FindAsync(Expression<Func<TEntity, bool>> predicate, bool includeDetails = true, CancellationToken cancellationToken = default)
         {
             return await GetFirstAsync(predicate);
         }
 
-        public virtual async Task<TEntity> GetAsync(Expression<Func<TEntity, bool>> predicate,
-            bool includeDetails = true, CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity> GetAsync(Expression<Func<TEntity, bool>> predicate, bool includeDetails = true, CancellationToken cancellationToken = default)
         {
             return await GetFirstAsync(predicate);
         }
 
-        public virtual async Task DeleteAsync(Expression<Func<TEntity, bool>> predicate, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteAsync(Expression<Func<TEntity, bool>> predicate, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await this.DeleteAsync(predicate);
         }
 
-        public virtual async Task DeleteDirectAsync(Expression<Func<TEntity, bool>> predicate,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteDirectAsync(Expression<Func<TEntity, bool>> predicate, CancellationToken cancellationToken = default)
         {
             await this.DeleteAsync(predicate);
         }
@@ -113,71 +103,60 @@ namespace Yi.Framework.SqlSugarCore.Repositories
             throw new NotImplementedException();
         }
 
-        public virtual async Task<List<TEntity>> GetListAsync(Expression<Func<TEntity, bool>> predicate,
-            bool includeDetails = false, CancellationToken cancellationToken = default)
+        public virtual async Task<List<TEntity>> GetListAsync(Expression<Func<TEntity, bool>> predicate, bool includeDetails = false, CancellationToken cancellationToken = default)
         {
             return await GetListAsync(predicate);
         }
 
-        public virtual async Task<TEntity> InsertAsync(TEntity entity, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity> InsertAsync(TEntity entity, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             return await InsertReturnEntityAsync(entity);
         }
 
-        public virtual async Task InsertManyAsync(IEnumerable<TEntity> entities, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task InsertManyAsync(IEnumerable<TEntity> entities, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await InsertRangeAsync(entities.ToList());
         }
 
-        public virtual async Task<TEntity> UpdateAsync(TEntity entity, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity> UpdateAsync(TEntity entity, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await UpdateAsync(entity);
             return entity;
         }
 
-        public virtual async Task UpdateManyAsync(IEnumerable<TEntity> entities, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task UpdateManyAsync(IEnumerable<TEntity> entities, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await UpdateRangeAsync(entities.ToList());
         }
 
-        public virtual async Task DeleteAsync(TEntity entity, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteAsync(TEntity entity, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await DeleteAsync(entity);
         }
 
-        public virtual async Task DeleteManyAsync(IEnumerable<TEntity> entities, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteManyAsync(IEnumerable<TEntity> entities, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await DeleteAsync(entities.ToList());
         }
 
-        public virtual async Task<List<TEntity>> GetListAsync(bool includeDetails = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task<List<TEntity>> GetListAsync(bool includeDetails = false, CancellationToken cancellationToken = default)
         {
             return await GetListAsync();
         }
 
         public virtual async Task<long> GetCountAsync(CancellationToken cancellationToken = default)
         {
-            return await this.CountAsync(_ => true);
+            return await this.CountAsync(_=>true);
         }
 
-        public virtual async Task<List<TEntity>> GetPagedListAsync(int skipCount, int maxResultCount, string sorting,
-            bool includeDetails = false, CancellationToken cancellationToken = default)
+        public virtual async Task<List<TEntity>> GetPagedListAsync(int skipCount, int maxResultCount, string sorting, bool includeDetails = false, CancellationToken cancellationToken = default)
         {
             return await GetPageListAsync(_ => true, skipCount, maxResultCount);
         }
-
         #endregion
 
 
         #region 内置DB快捷操作
-
         public virtual async Task<IDeleteable<TEntity>> AsDeleteable()
         {
             return (await GetDbSimpleClientAsync()).AsDeleteable();
@@ -192,7 +171,7 @@ namespace Yi.Framework.SqlSugarCore.Repositories
         {
             return (await GetDbSimpleClientAsync()).AsInsertable(insertObj);
         }
-
+        
         public virtual async Task<IInsertable<TEntity>> AsInsertable(TEntity[] insertObjs)
         {
             return (await GetDbSimpleClientAsync()).AsInsertable(insertObjs);
@@ -232,11 +211,9 @@ namespace Yi.Framework.SqlSugarCore.Repositories
         {
             return (await GetDbSimpleClientAsync()).AsUpdateable(updateObjs);
         }
-
         #endregion
 
         #region SimpleClient模块
-
         public virtual async Task<int> CountAsync(Expression<Func<TEntity, bool>> whereExpression)
         {
             return await (await GetDbSimpleClientAsync()).CountAsync(whereExpression);
@@ -253,6 +230,7 @@ namespace Yi.Framework.SqlSugarCore.Repositories
             {
                 return await (await GetDbSimpleClientAsync()).DeleteAsync(deleteObj);
             }
+
         }
 
         public virtual async Task<bool> DeleteAsync(List<TEntity> deleteObjs)
@@ -272,13 +250,13 @@ namespace Yi.Framework.SqlSugarCore.Repositories
         {
             if (typeof(ISoftDelete).IsAssignableFrom(typeof(TEntity)))
             {
-                return await (await GetDbSimpleClientAsync()).AsUpdateable()
-                    .SetColumns(nameof(ISoftDelete.IsDeleted), true).Where(whereExpression).ExecuteCommandAsync() > 0;
+                return await (await GetDbSimpleClientAsync()).AsUpdateable().SetColumns(nameof(ISoftDelete.IsDeleted), true).Where(whereExpression).ExecuteCommandAsync() > 0;
             }
             else
             {
                 return await (await GetDbSimpleClientAsync()).DeleteAsync(whereExpression);
             }
+
         }
 
         public virtual async Task<bool> DeleteByIdAsync(dynamic id)
@@ -286,11 +264,7 @@ namespace Yi.Framework.SqlSugarCore.Repositories
             if (typeof(ISoftDelete).IsAssignableFrom(typeof(TEntity)))
             {
                 var entity = await GetByIdAsync(id);
-                if (entity is null)
-                {
-                    return false;
-                }
-
+                if (entity == null) return false;
                 //反射赋值
                 ReflexHelper.SetModelValue(nameof(ISoftDelete.IsDeleted), true, entity);
                 return await UpdateAsync(entity);
@@ -311,7 +285,6 @@ namespace Yi.Framework.SqlSugarCore.Repositories
                 {
                     return false;
                 }
-
                 //反射赋值
                 entities.ForEach(e => ReflexHelper.SetModelValue(nameof(ISoftDelete.IsDeleted), true, e));
                 return await UpdateRangeAsync(entities);
@@ -320,6 +293,7 @@ namespace Yi.Framework.SqlSugarCore.Repositories
             {
                 return await (await GetDbSimpleClientAsync()).DeleteByIdAsync(ids);
             }
+
         }
 
         public virtual async Task<TEntity> GetByIdAsync(dynamic id)
@@ -328,6 +302,7 @@ namespace Yi.Framework.SqlSugarCore.Repositories
         }
 
 
+
         public virtual async Task<TEntity> GetFirstAsync(Expression<Func<TEntity, bool>> whereExpression)
         {
             return await (await GetDbSimpleClientAsync()).GetFirstAsync(whereExpression);
@@ -343,19 +318,14 @@ namespace Yi.Framework.SqlSugarCore.Repositories
             return await (await GetDbSimpleClientAsync()).GetListAsync(whereExpression);
         }
 
-        public virtual async Task<List<TEntity>> GetPageListAsync(Expression<Func<TEntity, bool>> whereExpression,
-            int pageNum, int pageSize)
+        public virtual async Task<List<TEntity>> GetPageListAsync(Expression<Func<TEntity, bool>> whereExpression, int pageNum, int pageSize)
         {
-            return await (await GetDbSimpleClientAsync()).GetPageListAsync(whereExpression,
-                new PageModel() { PageIndex = pageNum, PageSize = pageSize });
+            return await (await GetDbSimpleClientAsync()).GetPageListAsync(whereExpression, new PageModel() { PageIndex = pageNum, PageSize = pageSize });
         }
 
-        public virtual async Task<List<TEntity>> GetPageListAsync(Expression<Func<TEntity, bool>> whereExpression,
-            int pageNum, int pageSize, Expression<Func<TEntity, object>>? orderByExpression = null,
-            OrderByType orderByType = OrderByType.Asc)
+        public virtual async Task<List<TEntity>> GetPageListAsync(Expression<Func<TEntity, bool>> whereExpression, int pageNum, int pageSize, Expression<Func<TEntity, object>>? orderByExpression = null, OrderByType orderByType = OrderByType.Asc)
         {
-            return await (await GetDbSimpleClientAsync()).GetPageListAsync(whereExpression,
-                new PageModel { PageIndex = pageNum, PageSize = pageSize }, orderByExpression, orderByType);
+            return await (await GetDbSimpleClientAsync()).GetPageListAsync(whereExpression, new PageModel { PageIndex = pageNum, PageSize = pageSize }, orderByExpression, orderByType);
         }
 
         public virtual async Task<TEntity> GetSingleAsync(Expression<Func<TEntity, bool>> whereExpression)
@@ -410,9 +380,9 @@ namespace Yi.Framework.SqlSugarCore.Repositories
 
         public virtual async Task<bool> UpdateAsync(TEntity updateObj)
         {
-            if (typeof(TEntity).IsAssignableTo<IHasConcurrencyStamp>()) //带版本号乐观锁更新
+            if (Options is not null && Options.EnabledConcurrencyException)
             {
-                if (Options is not null && Options.EnabledConcurrencyException)
+                if (typeof(TEntity).IsAssignableTo<IHasConcurrencyStamp>()) //带版本号乐观锁更新
                 {
                     try
                     {
@@ -426,24 +396,18 @@ namespace Yi.Framework.SqlSugarCore.Repositories
                             $"{ex.Message}[更新失败：ConcurrencyStamp不是最新版本],entityInfo：{updateObj}", ex);
                     }
                 }
-                else
-                {
-                    int num = await (await GetDbSimpleClientAsync())
-                        .Context.Updateable(updateObj).ExecuteCommandAsync();
-                    return num > 0;
-                }
             }
 
             return await (await GetDbSimpleClientAsync()).UpdateAsync(updateObj);
         }
 
-        public virtual async Task<bool> UpdateAsync(Expression<Func<TEntity, TEntity>> columns,
-            Expression<Func<TEntity, bool>> whereExpression)
+        public virtual async Task<bool> UpdateAsync(Expression<Func<TEntity, TEntity>> columns, Expression<Func<TEntity, bool>> whereExpression)
         {
             return await (await GetDbSimpleClientAsync()).UpdateAsync(columns, whereExpression);
         }
 
 
+
         public virtual async Task<bool> UpdateRangeAsync(List<TEntity> updateObjs)
         {
             return await (await GetDbSimpleClientAsync()).UpdateRangeAsync(updateObjs);
@@ -452,36 +416,30 @@ namespace Yi.Framework.SqlSugarCore.Repositories
         #endregion
     }
 
-    public class SqlSugarRepository<TEntity, TKey> : SqlSugarRepository<TEntity>, ISqlSugarRepository<TEntity, TKey>,
-        IRepository<TEntity, TKey> where TEntity : class, IEntity<TKey>, new()
+    public class SqlSugarRepository<TEntity, TKey> : SqlSugarRepository<TEntity>, ISqlSugarRepository<TEntity, TKey>, IRepository<TEntity, TKey> where TEntity : class, IEntity<TKey>, new()
     {
-        public SqlSugarRepository(ISugarDbContextProvider<ISqlSugarDbContext> dbContextProvider) : base(
-            dbContextProvider)
+        public SqlSugarRepository(ISugarDbContextProvider<ISqlSugarDbContext> sugarDbContextProvider) : base(sugarDbContextProvider)
         {
         }
 
-        public virtual async Task DeleteAsync(TKey id, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteAsync(TKey id, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await DeleteByIdAsync(id);
         }
 
-        public virtual async Task DeleteManyAsync(IEnumerable<TKey> ids, bool autoSave = false,
-            CancellationToken cancellationToken = default)
+        public virtual async Task DeleteManyAsync(IEnumerable<TKey> ids, bool autoSave = false, CancellationToken cancellationToken = default)
         {
             await DeleteByIdsAsync(ids.Select(x => (object)x).ToArray());
         }
 
-        public virtual async Task<TEntity?> FindAsync(TKey id, bool includeDetails = true,
-            CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity?> FindAsync(TKey id, bool includeDetails = true, CancellationToken cancellationToken = default)
         {
             return await GetByIdAsync(id);
         }
 
-        public virtual async Task<TEntity> GetAsync(TKey id, bool includeDetails = true,
-            CancellationToken cancellationToken = default)
+        public virtual async Task<TEntity> GetAsync(TKey id, bool includeDetails = true, CancellationToken cancellationToken = default)
         {
             return await GetByIdAsync(id);
         }
     }
-}
\ No newline at end of file
+}
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementCacheDto.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementCacheDto.cs
index 5b8cd6c7..b1e1e30c 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementCacheDto.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementCacheDto.cs
@@ -14,4 +14,9 @@ public class AnnouncementCacheDto
     /// 公告日志列表
     /// </summary>
     public List<AnnouncementLogDto> Logs { get; set; } = new List<AnnouncementLogDto>();
+    
+    /// <summary>
+    /// 跳转链接
+    /// </summary>
+    public string? Url { get; set; }
 }
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementLogDto.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementLogDto.cs
index 0a7ef430..6014896c 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementLogDto.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/Announcement/AnnouncementLogDto.cs
@@ -1,3 +1,5 @@
+using Yi.Framework.AiHub.Domain.Shared.Enums;
+
 namespace Yi.Framework.AiHub.Application.Contracts.Dtos.Announcement;
 
 /// <summary>
@@ -5,18 +7,38 @@ namespace Yi.Framework.AiHub.Application.Contracts.Dtos.Announcement;
 /// </summary>
 public class AnnouncementLogDto
 {
-    /// <summary>
-    /// 日期
-    /// </summary>
-    public string Date { get; set; } = string.Empty;
-
     /// <summary>
     /// 标题
     /// </summary>
-    public string Title { get; set; } = string.Empty;
+    public string Title { get; set; } 
 
     /// <summary>
     /// 内容列表
     /// </summary>
     public List<string> Content { get; set; } = new List<string>();
+    
+    /// <summary>
+    /// 图片url
+    /// </summary>
+    public string? ImageUrl { get; set; }
+    
+    /// <summary>
+    /// 开始时间（系统公告时间、活动开始时间）
+    /// </summary>
+    public DateTime StartTime { get; set; }
+
+    /// <summary>
+    /// 活动结束时间
+    /// </summary>
+    public DateTime? EndTime { get; set; }
+    
+    /// <summary>
+    /// 公告类型（系统、活动）
+    /// </summary>
+    public AnnouncementTypeEnum Type{ get; set; }
+    
+    /// <summary>
+    /// 跳转链接
+    /// </summary>
+    public string? Url { get; set; }
 }
diff --git 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
index 3594dbb8..082c20f9 100644
--- 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>
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListInput.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListInput.cs
new file mode 100644
index 00000000..e3766e10
--- /dev/null
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListInput.cs
@@ -0,0 +1,12 @@
+using Volo.Abp.Application.Dtos;
+using Yi.Framework.Ddd.Application.Contracts;
+
+namespace Yi.Framework.AiHub.Application.Contracts.Dtos.UsageStatistics;
+
+public class PremiumTokenUsageGetListInput : PagedAllResultRequestDto
+{
+    /// <summary>
+    /// 是否免费
+    /// </summary>
+    public bool? IsFree { get; set; }
+}
\ No newline at end of file
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListOutput.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListOutput.cs
new file mode 100644
index 00000000..d3b29ffc
--- /dev/null
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/Dtos/UsageStatistics/PremiumTokenUsageGetListOutput.cs
@@ -0,0 +1,57 @@
+using Volo.Abp.Application.Dtos;
+using Yi.Framework.Ddd.Application.Contracts;
+
+namespace Yi.Framework.AiHub.Application.Contracts.Dtos.UsageStatistics;
+
+public class PremiumTokenUsageGetListOutput : CreationAuditedEntityDto
+{
+   /// <summary>
+   /// id
+   /// </summary>
+   public Guid Id { get; set; }
+
+   /// <summary>
+   /// 用户ID
+   /// </summary>
+   public Guid UserId { get; set; }
+
+   /// <summary>
+   /// 包名称
+   /// </summary>
+   public string PackageName { get; set; }
+
+   /// <summary>
+   /// 总用量（总token数）
+   /// </summary>
+   public long TotalTokens { get; set; }
+
+   /// <summary>
+   /// 剩余用量（剩余token数）
+   /// </summary>
+   public long RemainingTokens { get; set; }
+
+   /// <summary>
+   /// 已使用token数
+   /// </summary>
+   public long UsedTokens { get; set; }
+
+   /// <summary>
+   /// 到期时间
+   /// </summary>
+   public DateTime? ExpireDateTime { get; set; }
+
+   /// <summary>
+   /// 是否激活
+   /// </summary>
+   public bool IsActive { get; set; }
+
+   /// <summary>
+   /// 购买金额
+   /// </summary>
+   public decimal PurchaseAmount { get; set; }
+
+   /// <summary>
+   /// 备注
+   /// </summary>
+   public string? Remark { get; set; }
+}
\ No newline at end of file
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/IServices/IAnnouncementService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/IServices/IAnnouncementService.cs
index 77d4d29a..acdda549 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/IServices/IAnnouncementService.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application.Contracts/IServices/IAnnouncementService.cs
@@ -11,5 +11,5 @@ public interface IAnnouncementService
     /// 获取公告信息
     /// </summary>
     /// <returns>公告信息</returns>
-    Task<AnnouncementOutput> GetAsync();
+    Task<List<AnnouncementLogDto>> GetAsync();
 }
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AnnouncementService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AnnouncementService.cs
index 8914cd25..2399070e 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AnnouncementService.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AnnouncementService.cs
@@ -1,3 +1,4 @@
+using Mapster;
 using Microsoft.Extensions.Caching.Distributed;
 using Microsoft.Extensions.Configuration;
 using Volo.Abp.Application.Services;
@@ -14,13 +15,13 @@ namespace Yi.Framework.AiHub.Application.Services;
 /// </summary>
 public class AnnouncementService : ApplicationService, IAnnouncementService
 {
-    private readonly ISqlSugarRepository<AnnouncementLogAggregateRoot> _announcementRepository;
+    private readonly ISqlSugarRepository<AnnouncementAggregateRoot> _announcementRepository;
     private readonly IConfiguration _configuration;
     private readonly IDistributedCache<AnnouncementCacheDto> _announcementCache;
     private const string AnnouncementCacheKey = "AiHub:Announcement";
 
     public AnnouncementService(
-        ISqlSugarRepository<AnnouncementLogAggregateRoot> announcementRepository,
+        ISqlSugarRepository<AnnouncementAggregateRoot> announcementRepository,
         IConfiguration configuration,
         IDistributedCache<AnnouncementCacheDto> announcementCache)
     {
@@ -32,7 +33,7 @@ public class AnnouncementService : ApplicationService, IAnnouncementService
     /// <summary>
     /// 获取公告信息
     /// </summary>
-    public async Task<AnnouncementOutput> GetAsync()
+    public async Task<List<AnnouncementLogDto>> GetAsync()
     {
         // 使用 GetOrAddAsync 从缓存获取或添加数据，缓存1小时
         var cacheData = await _announcementCache.GetOrAddAsync(
@@ -44,11 +45,7 @@ public class AnnouncementService : ApplicationService, IAnnouncementService
             }
         );
 
-        return new AnnouncementOutput
-        {
-            Version = cacheData?.Version ?? "v1.0.0",
-            Logs = cacheData?.Logs ?? new List<AnnouncementLogDto>()
-        };
+        return cacheData?.Logs ?? new List<AnnouncementLogDto>();
     }
 
     /// <summary>
@@ -56,25 +53,15 @@ public class AnnouncementService : ApplicationService, IAnnouncementService
     /// </summary>
     private async Task<AnnouncementCacheDto> LoadAnnouncementDataAsync()
     {
-        // 从配置文件读取版本号，如果没有配置则使用默认值
-        var version = _configuration["AiHubVersion"] ?? "v1.0.0";
-
         // 查询所有公告日志，按日期降序排列
         var logs = await _announcementRepository._DbQueryable
-            .OrderByDescending(x => x.Date)
+            .OrderByDescending(x => x.StartTime)
             .ToListAsync();
 
         // 转换为 DTO
-        var logDtos = logs.Select(log => new AnnouncementLogDto
-        {
-            Date = log.Date.ToString("yyyy-MM-dd"),
-            Title = log.Title,
-            Content = log.Content
-        }).ToList();
-
+        var logDtos = logs.Adapt<List<AnnouncementLogDto>>();
         return new AnnouncementCacheDto
         {
-            Version = version,
             Logs = logDtos
         };
     }
diff --git 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
index d7bb6ba8..feefd4ba 100644
--- 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,
@@ -183,6 +181,9 @@ public class CardFlipService : ApplicationService, ICardFlipService
         var flippedOrder = task != null ? _cardFlipManager.GetFlippedOrder(task) : new List<int>();
         var flippedNumbers = new HashSet<int>(flippedOrder);
 
+        // 获取中奖记录
+        var winRecords = task?.WinRecords ?? new Dictionary<int, long>();
+
         // 构建记录，按照原始序号1-10排列
         for (int i = 1; i <= CardFlipManager.TOTAL_MAX_FLIPS; i++)
         {
@@ -202,23 +203,11 @@ public class CardFlipService : ApplicationService, ICardFlipService
             {
                 var flipOrderIndex = flippedOrder.IndexOf(i) + 1; // 第几次翻的（1-based）
 
-                // 第8次翻的卡中奖
-                if (flipOrderIndex == 8)
+                // 检查这次翻牌是否中奖
+                if (winRecords.TryGetValue(flipOrderIndex, out var rewardAmount))
                 {
                     record.IsWin = true;
-                    record.RewardAmount = task.EighthRewardAmount;
-                }
-                // 第9次翻的卡中奖
-                else if (flipOrderIndex == 9)
-                {
-                    record.IsWin = true;
-                    record.RewardAmount = task.NinthRewardAmount;
-                }
-                // 第10次翻的卡中奖
-                else if (flipOrderIndex == 10)
-                {
-                    record.IsWin = true;
-                    record.RewardAmount = task.TenthRewardAmount;
+                    record.RewardAmount = rewardAmount;
                 }
             }
 
@@ -246,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 "继续加油!";
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AiChatService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/AiChatService.cs
similarity index 100%
rename from Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/AiChatService.cs
rename to Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/AiChatService.cs
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/MessageService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/MessageService.cs
similarity index 100%
rename from Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/MessageService.cs
rename to Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/MessageService.cs
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/SessionService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/SessionService.cs
similarity index 100%
rename from Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/SessionService.cs
rename to Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/SessionService.cs
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/TokenService.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/TokenService.cs
similarity index 100%
rename from Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/TokenService.cs
rename to Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Application/Services/Chat/TokenService.cs
diff --git 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
index 05d6eaeb..feedf690 100644
--- 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
@@ -1,5 +1,8 @@
+using Mapster;
 using Microsoft.AspNetCore.Authorization;
+using Microsoft.AspNetCore.Mvc;
 using SqlSugar;
+using Volo.Abp.Application.Dtos;
 using Volo.Abp.Application.Services;
 using Volo.Abp.Users;
 using Yi.Framework.AiHub.Application.Contracts.Dtos.UsageStatistics;
@@ -7,6 +10,7 @@ using Yi.Framework.AiHub.Application.Contracts.IServices;
 using Yi.Framework.AiHub.Domain.Entities;
 using Yi.Framework.AiHub.Domain.Entities.Chat;
 using Yi.Framework.AiHub.Domain.Extensions;
+using Yi.Framework.Ddd.Application.Contracts;
 using Yi.Framework.SqlSugarCore.Abstractions;
 
 namespace Yi.Framework.AiHub.Application.Services;
@@ -137,4 +141,27 @@ public class UsageStatisticsService : ApplicationService, IUsageStatisticsServic
 
         return result;
     }
+
+    /// <summary>
+    ///  获取当前用户尊享服务token用量统计列表
+    /// </summary>
+    /// <returns></returns>
+    [HttpGet("usage-statistics/premium-token-usage/list")]
+    public async Task<PagedResultDto<PremiumTokenUsageGetListOutput>> GetPremiumTokenUsageListAsync(
+        PremiumTokenUsageGetListInput input)
+    {
+        var userId = CurrentUser.GetId();
+        RefAsync<int> total = 0;
+        // 获取尊享包Token信息
+        var entities = await _premiumPackageRepository._DbQueryable
+            .Where(x => x.UserId == userId)
+            .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,
+            entities.Adapt<List<PremiumTokenUsageGetListOutput>>());
+    }
 }
\ No newline at end of file
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain.Shared/Enums/AnnouncementTypeEnum.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain.Shared/Enums/AnnouncementTypeEnum.cs
new file mode 100644
index 00000000..fa898e18
--- /dev/null
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain.Shared/Enums/AnnouncementTypeEnum.cs
@@ -0,0 +1,7 @@
+namespace Yi.Framework.AiHub.Domain.Shared.Enums;
+
+public enum AnnouncementTypeEnum
+{
+    Activity=1,
+    System=2
+}
\ No newline at end of file
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementAggregateRoot.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementAggregateRoot.cs
new file mode 100644
index 00000000..4488d985
--- /dev/null
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementAggregateRoot.cs
@@ -0,0 +1,57 @@
+using SqlSugar;
+using Volo.Abp.Domain.Entities.Auditing;
+using Yi.Framework.AiHub.Domain.Shared.Enums;
+
+namespace Yi.Framework.AiHub.Domain.Entities;
+
+/// <summary>
+/// 公告日志
+/// </summary>
+[SugarTable("Ai_Announcement")]
+public class AnnouncementAggregateRoot : FullAuditedAggregateRoot<Guid>
+{
+    public AnnouncementAggregateRoot()
+    {
+    }
+    
+    /// <summary>
+    /// 标题
+    /// </summary>
+    public string Title { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 内容列表（JSON格式存储）
+    /// </summary>
+    [SugarColumn(IsJson = true, IsNullable = false)]
+    public List<string> Content { get; set; } = new List<string>();
+
+    /// <summary>
+    /// 备注
+    /// </summary>
+    public string? Remark { get; set; }
+
+    /// <summary>
+    /// 图片url
+    /// </summary>
+    public string? ImageUrl { get; set; }
+    
+    /// <summary>
+    /// 开始时间（系统公告时间、活动开始时间）
+    /// </summary>
+    public DateTime StartTime { get; set; }
+
+    /// <summary>
+    /// 活动结束时间
+    /// </summary>
+    public DateTime? EndTime { get; set; }
+    
+    /// <summary>
+    /// 公告类型（系统、活动）
+    /// </summary>
+    public AnnouncementTypeEnum Type{ get; set; }
+
+    /// <summary>
+    /// 跳转链接
+    /// </summary>
+    public string? Url { get; set; }
+}
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementLogAggregateRoot.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementLogAggregateRoot.cs
deleted file mode 100644
index ec890394..00000000
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/AnnouncementLogAggregateRoot.cs
+++ /dev/null
@@ -1,44 +0,0 @@
-using SqlSugar;
-using Volo.Abp.Domain.Entities.Auditing;
-
-namespace Yi.Framework.AiHub.Domain.Entities;
-
-/// <summary>
-/// 公告日志
-/// </summary>
-[SugarTable("Ai_AnnouncementLog")]
-[SugarIndex($"index_{nameof(Date)}", nameof(Date), OrderByType.Desc)]
-public class AnnouncementLogAggregateRoot : FullAuditedAggregateRoot<Guid>
-{
-    public AnnouncementLogAggregateRoot()
-    {
-    }
-
-    public AnnouncementLogAggregateRoot(DateTime date, string title, List<string> content)
-    {
-        Date = date;
-        Title = title;
-        Content = content;
-    }
-
-    /// <summary>
-    /// 日期
-    /// </summary>
-    public DateTime Date { get; set; }
-
-    /// <summary>
-    /// 标题
-    /// </summary>
-    public string Title { get; set; } = string.Empty;
-
-    /// <summary>
-    /// 内容列表（JSON格式存储）
-    /// </summary>
-    [SugarColumn(IsJson = true, IsNullable = false)]
-    public List<string> Content { get; set; } = new List<string>();
-
-    /// <summary>
-    /// 备注
-    /// </summary>
-    public string? Remark { get; set; }
-}
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/CardFlipTaskAggregateRoot.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/CardFlipTaskAggregateRoot.cs
index 3adaba7e..9f51870e 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/CardFlipTaskAggregateRoot.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Entities/CardFlipTaskAggregateRoot.cs
@@ -25,9 +25,8 @@ public class CardFlipTaskAggregateRoot : FullAuditedAggregateRoot<Guid>
         BonusFlipsUsed = 0;
         InviteFlipsUsed = 0;
         IsFirstFlipDone = false;
-        HasNinthReward = false;
-        HasTenthReward = false;
         FlippedOrder = new List<int>();
+        WinRecords = new Dictionary<int, long>();
     }
 
     /// <summary>
@@ -66,34 +65,10 @@ public class CardFlipTaskAggregateRoot : FullAuditedAggregateRoot<Guid>
     public bool IsFirstFlipDone { get; set; }
 
     /// <summary>
-    /// 是否已获得第8次奖励
+    /// 中奖记录（以翻牌顺序为key，例如第1次翻牌中奖则key为1，奖励金额为value）
     /// </summary>
-    public bool HasEighthReward { get; set; }
-
-    /// <summary>
-    /// 第8次奖励金额（100-300w）
-    /// </summary>
-    public long? EighthRewardAmount { get; set; }
-
-    /// <summary>
-    /// 是否已获得第9次奖励
-    /// </summary>
-    public bool HasNinthReward { get; set; }
-
-    /// <summary>
-    /// 第9次奖励金额（100-500w）
-    /// </summary>
-    public long? NinthRewardAmount { get; set; }
-
-    /// <summary>
-    /// 是否已获得第10次奖励
-    /// </summary>
-    public bool HasTenthReward { get; set; }
-
-    /// <summary>
-    /// 第10次奖励金额（100-1000w）
-    /// </summary>
-    public long? TenthRewardAmount { get; set; }
+    [SugarColumn(IsJson = true, IsNullable = true)]
+    public Dictionary<int, long>? WinRecords { get; set; }
 
     /// <summary>
     /// 备注信息
@@ -135,33 +110,17 @@ public class CardFlipTaskAggregateRoot : FullAuditedAggregateRoot<Guid>
     }
 
     /// <summary>
-    /// 记录第8次奖励
+    /// 记录中奖
     /// </summary>
+    /// <param name="flipCount">第几次翻牌（1-10）</param>
     /// <param name="amount">奖励金额</param>
-    public void SetEighthReward(long amount)
+    public void SetWinReward(int flipCount, long amount)
     {
-        HasEighthReward = true;
-        EighthRewardAmount = amount;
-    }
-
-    /// <summary>
-    /// 记录第9次奖励
-    /// </summary>
-    /// <param name="amount">奖励金额</param>
-    public void SetNinthReward(long amount)
-    {
-        HasNinthReward = true;
-        NinthRewardAmount = amount;
-    }
-
-    /// <summary>
-    /// 记录第10次奖励
-    /// </summary>
-    /// <param name="amount">奖励金额</param>
-    public void SetTenthReward(long amount)
-    {
-        HasTenthReward = true;
-        TenthRewardAmount = amount;
+        if (WinRecords == null)
+        {
+            WinRecords = new Dictionary<int, long>();
+        }
+        WinRecords[flipCount] = amount;
     }
 }
 
diff --git 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
index de569b49..bcd310af 100644
--- 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,8 +19,6 @@ public class InviteCodeAggregateRoot : FullAuditedAggregateRoot<Guid>
     {
         UserId = userId;
         Code = code;
-        IsUsed = false;
-        IsUserInvited = false;
         UsedCount = 0;
     }
 
@@ -34,55 +32,16 @@ public class InviteCodeAggregateRoot : FullAuditedAggregateRoot<Guid>
     /// </summary>
     [SugarColumn(Length = 50)]
     public string Code { get; set; } = string.Empty;
-
+    
     /// <summary>
-    /// 是否已被使用（一个邀请码只能被使用一次）
-    /// </summary>
-    public bool IsUsed { get; set; }
-
-    /// <summary>
-    /// 邀请码拥有者是否已被他人邀请（被邀请后不可再提供邀请码）
-    /// </summary>
-    public bool IsUserInvited { get; set; }
-
-    /// <summary>
-    /// 被使用次数（统计用）
+    /// 被使用次数（统计用，一个邀请码可以被多人使用）
     /// </summary>
     public int UsedCount { get; set; }
 
-    /// <summary>
-    /// 使用时间
-    /// </summary>
-    public DateTime? UsedTime { get; set; }
-
-    /// <summary>
-    /// 使用人ID
-    /// </summary>
-    public Guid? UsedByUserId { get; set; }
-
     /// <summary>
     /// 备注信息
     /// </summary>
     [SugarColumn(Length = 500, IsNullable = true)]
     public string? Remark { get; set; }
-
-    /// <summary>
-    /// 标记邀请码已被使用
-    /// </summary>
-    /// <param name="usedByUserId">使用者ID</param>
-    public void MarkAsUsed(Guid usedByUserId)
-    {
-        IsUsed = true;
-        UsedTime = DateTime.Now;
-        UsedByUserId = usedByUserId;
-        UsedCount++;
-    }
-
-    /// <summary>
-    /// 标记用户已被邀请
-    /// </summary>
-    public void MarkUserAsInvited()
-    {
-        IsUserInvited = true;
-    }
+    
 }
diff --git a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/CardFlipManager.cs b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/CardFlipManager.cs
index 0eae034c..96ae5d1d 100644
--- a/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/CardFlipManager.cs
+++ b/Yi.Abp.Net8/module/ai-hub/Yi.Framework.AiHub.Domain/Managers/CardFlipManager.cs
@@ -24,6 +24,11 @@ public class CardFlipManager : DomainService
     private const int NINTH_FLIP = 9;            // 第9次翻牌
     private const int TENTH_FLIP = 10;           // 第10次翻牌
 
+    // 前7次免费翻牌奖励配置
+    private const long FREE_MIN_REWARD = 10000;       // 前7次最小奖励 1w
+    private const long FREE_MAX_REWARD = 30000;       // 前7次最大奖励 3w
+    private const double FREE_WIN_RATE = 0.5;         // 前7次中奖概率 50%
+
     private const long EIGHTH_MIN_REWARD = 1000000;   // 第8次最小奖励 100w
     private const long EIGHTH_MAX_REWARD = 3000000;   // 第8次最大奖励 300w
     private const long NINTH_MIN_REWARD = 1000000;    // 第9次最小奖励 100w
@@ -112,23 +117,23 @@ public class CardFlipManager : DomainService
             throw new UserFriendlyException(GetFlipTypeErrorMessage(flipType));
         }
 
-        // 如果是邀请类型翻牌，必须验证用户本周填写的邀请码数量足够
+        // 如果是邀请类型翻牌，必须验证用户本周的邀请记录数量足够（包括填写别人的邀请码和别人填写我的邀请码）
         if (flipType == FlipType.Invite)
         {
-            // 查询本周已使用的邀请码数量
-            var weeklyInviteCodeUsedCount = await _invitationRecordRepository._DbQueryable
-                .Where(x => x.InvitedUserId == userId)
+            // 查询本周作为邀请人或被邀请人的记录数量（双方都会增加翻牌次数）
+            var weeklyInviteRecordCount = await _invitationRecordRepository._DbQueryable
+                .Where(x => x.InviterId == userId || x.InvitedUserId == userId)
                 .Where(x => x.InvitationTime >= weekStart)
                 .CountAsync();
 
-            // 本周填写的邀请码数量必须 >= 即将使用的邀请翻牌次数
-            // 例如: 要翻第8次(InviteFlipsUsed=0->1), 需要至少填写了1个邀请码
-            //      要翻第9次(InviteFlipsUsed=1->2), 需要至少填写了2个邀请码
-            //      要翻第10次(InviteFlipsUsed=2->3), 需要至少填写了3个邀请码
-            var requiredInviteCodeCount = task.InviteFlipsUsed + 1;
-            if (weeklyInviteCodeUsedCount < requiredInviteCodeCount)
+            // 本周邀请记录数量必须 >= 即将使用的邀请翻牌次数
+            // 例如: 要翻第8次(InviteFlipsUsed=0->1), 需要至少有1条邀请记录（我邀请别人或别人邀请我）
+            //      要翻第9次(InviteFlipsUsed=1->2), 需要至少有2条邀请记录
+            //      要翻第10次(InviteFlipsUsed=2->3), 需要至少有3条邀请记录
+            var requiredInviteRecordCount = task.InviteFlipsUsed + 1;
+            if (weeklyInviteRecordCount < requiredInviteRecordCount)
             {
-                throw new UserFriendlyException($"需本周累积使用{requiredInviteCodeCount}个他人邀请码才能解锁第{task.TotalFlips + 1}次翻牌，您还差一个~");
+                throw new UserFriendlyException($"需本周累积{requiredInviteRecordCount}次邀请记录（填写别人的邀请码或别人填写你的邀请码）才能解锁第{task.TotalFlips + 1}次翻牌");
             }
         }
 
@@ -152,18 +157,7 @@ public class CardFlipManager : DomainService
         // 如果中奖，记录奖励金额（用于后续查询显示）
         if (result.IsWin)
         {
-            if (flipCount == EIGHTH_FLIP)
-            {
-                task.SetEighthReward(result.RewardAmount);
-            }
-            else if (flipCount == NINTH_FLIP)
-            {
-                task.SetNinthReward(result.RewardAmount);
-            }
-            else if (flipCount == TENTH_FLIP)
-            {
-                task.SetTenthReward(result.RewardAmount);
-            }
+            task.SetWinReward(flipCount, result.RewardAmount);
         }
 
         await _cardFlipTaskRepository.UpdateAsync(task);
@@ -223,11 +217,24 @@ public class CardFlipManager : DomainService
             IsWin = false
         };
 
-        // 前7次固定失败
+        var random = new Random();
+
+        // 前7次: 50%概率中奖，奖励1w-3w
         if (flipCount <= 7)
         {
-            result.IsWin = false;
-            result.RewardDesc = "很遗憾,未中奖";
+            // 50%概率中奖
+            if (random.NextDouble() < FREE_WIN_RATE)
+            {
+                var rewardAmount = GenerateRandomReward(FREE_MIN_REWARD, FREE_MAX_REWARD);
+                result.IsWin = true;
+                result.RewardAmount = rewardAmount;
+                result.RewardDesc = $"恭喜获得尊享包 {rewardAmount / 10000m:0.##}w tokens!";
+            }
+            else
+            {
+                result.IsWin = false;
+                result.RewardDesc = "很遗憾,未中奖";
+            }
         }
         // 第8次中奖 (邀请码解锁)
         else if (flipCount == EIGHTH_FLIP)
@@ -271,21 +278,24 @@ public class CardFlipManager : DomainService
     }
 
     /// <summary>
-    /// 生成随机奖励金额 (最小单位100w)
+    /// 生成随机奖励金额
     /// </summary>
     private long GenerateRandomReward(long min, long max)
     {
         var random = new Random();
-        const long unit = 1000000; // 100w的单位
 
-        // 将min和max转换为100w的倍数
+        // 根据最小值判断单位
+        // 如果min小于100000，则使用1w(10000)作为单位；否则使用100w(1000000)作为单位
+        long unit = min < 100000 ? 10000 : 1000000;
+
+        // 将min和max转换为单位的倍数
         long minUnits = min / unit;
         long maxUnits = max / unit;
 
         // 在倍数范围内随机
         long randomUnits = random.Next((int)minUnits, (int)maxUnits + 1);
 
-        // 返回100w的倍数
+        // 返回单位的倍数
         return randomUnits * unit;
     }
 
diff --git 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
index 1deed773..9fae5e81 100644
--- 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>
@@ -91,7 +96,7 @@ public class InviteCodeManager : DomainService
     }
 
     /// <summary>
-    /// 使用邀请码
+    /// 使用邀请码（双方都增加翻牌次数）
     /// </summary>
     /// <param name="userId">使用者ID</param>
     /// <param name="inviteCode">邀请码</param>
@@ -118,75 +123,40 @@ public class InviteCodeManager : DomainService
         {
             throw new UserFriendlyException("不能使用自己的邀请码");
         }
+        
+        // 检查当前用户是否已经填写过别人的邀请码（一辈子只能填写一次）
+        var hasUsedOthersCode = await IsFilledInviteCodeAsync(userId);
 
-        // 验证邀请码是否已被使用
-        if (inviteCodeEntity.IsUsed)
+        if (hasUsedOthersCode)
         {
-            throw new UserFriendlyException("该邀请码已被使用");
+            throw new UserFriendlyException("您已经填写过别人的邀请码了，每个账号只能填写一次");
         }
-
-        // 验证邀请码拥有者是否已被邀请
-        if (inviteCodeEntity.IsUserInvited)
-        {
-            throw new UserFriendlyException("该用户已被邀请,邀请码无效");
-        }
-
-        // 验证本周邀请码使用次数
-        var weekStart = CardFlipManager.GetWeekStartDate(DateTime.Now);
-        var weeklyUseCount = await _invitationRecordRepository._DbQueryable
-            .Where(x => x.InvitedUserId == userId)
-            .Where(x => x.InvitationTime >= weekStart)
-            .CountAsync();
-
-        if (weeklyUseCount >= CardFlipManager.MAX_INVITE_FLIPS)
-        {
-            throw new UserFriendlyException($"本周邀请码使用次数已达上限({CardFlipManager.MAX_INVITE_FLIPS}次),请下周再来");
-        }
-
-        // 检查当前用户的邀请码信息
-        var myInviteCode = await _inviteCodeRepository._DbQueryable
-            .Where(x => x.UserId == userId)
-            .FirstAsync();
-
-        // 标记邀请码为已使用
-        inviteCodeEntity.MarkAsUsed(userId);
+        
+        // 增加邀请码被使用次数
+        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,
             userId,
             inviteCode);
         await _invitationRecordRepository.InsertAsync(invitationRecord);
 
-        _logger.LogInformation($"用户 {userId} 使用邀请码 {inviteCode} 成功");
+        _logger.LogInformation($"用户 {userId} 使用邀请码 {inviteCode} 成功，邀请人 {inviteCodeEntity.UserId} 和被邀请人 {userId} 都增加一次翻牌机会");
 
         return inviteCodeEntity.UserId;
     }
 
     /// <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>
diff --git a/Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Domain.Shared/Caches/FileCacheItem.cs b/Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Domain.Shared/Caches/FileCacheItem.cs
index 47a91d4f..a8bfe3ab 100644
--- a/Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Domain.Shared/Caches/FileCacheItem.cs
+++ b/Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Domain.Shared/Caches/FileCacheItem.cs
@@ -1,4 +1,4 @@
-namespace Yi.Framework.Rbac.Domain.Shared.Caches;
+namespace Yi.Framework.Rbac.Domain.Shared.Caches;
 
 public class FileCacheItem
 {
diff --git a/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs b/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs
index 1e701178..a7d136b7 100644
--- a/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs
+++ b/Yi.Abp.Net8/src/Yi.Abp.Web/YiAbpWebModule.cs
@@ -29,6 +29,7 @@ using Volo.Abp.Swashbuckle;
 using Yi.Abp.Application;
 using Yi.Abp.SqlsugarCore;
 using Yi.Framework.AiHub.Application;
+using Yi.Framework.AiHub.Application.Services;
 using Yi.Framework.AiHub.Domain.Entities;
 using Yi.Framework.AspNetCore;
 using Yi.Framework.AspNetCore.Authentication.OAuth;
@@ -354,7 +355,10 @@ namespace Yi.Abp.Web
             var app = context.GetApplicationBuilder();
             app.UseRouting();
 
-            //app.ApplicationServices.GetRequiredService<ISqlSugarDbContext>().SqlSugarClient.CodeFirst.InitTables<AnnouncementLogAggregateRoot>();
+            // 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);
diff --git a/Yi.Ai.Vue3/.claude/settings.local.json b/Yi.Ai.Vue3/.claude/settings.local.json
new file mode 100644
index 00000000..4477e4c3
--- /dev/null
+++ b/Yi.Ai.Vue3/.claude/settings.local.json
@@ -0,0 +1,9 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npx vue-tsc --noEmit)"
+    ],
+    "deny": [],
+    "ask": []
+  }
+}
diff --git a/Yi.Ai.Vue3/index.html b/Yi.Ai.Vue3/index.html
index 88c0e7d3..312c6934 100644
--- 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>
diff --git a/Yi.Ai.Vue3/src/App.vue b/Yi.Ai.Vue3/src/App.vue
index e1bab0c5..3ea0046e 100644
--- a/Yi.Ai.Vue3/src/App.vue
+++ b/Yi.Ai.Vue3/src/App.vue
@@ -1,37 +1,8 @@
 <script setup lang="ts">
-import SystemAnnouncementDialog from '@/components/SystemAnnouncementDialog/index.vue';
-import { getMockSystemAnnouncements } from '@/data/mockAnnouncementData.ts';
-import { useAnnouncementStore } from '@/stores';
-
-const announcementStore = useAnnouncementStore();
-
-// 应用加载时检查是否需要显示公告弹窗
-onMounted(async () => {
-  // 检查是否应该显示弹窗
-  if (announcementStore.shouldShowDialog) {
-    try {
-      // 获取公告数据
-      // const res = await getSystemAnnouncements();
-      // 使用模拟数据进行测试
-      const res = await getMockSystemAnnouncements();
-      if (res.data) {
-        announcementStore.setAnnouncementData(res.data);
-        // 显示弹窗
-        announcementStore.openDialog();
-      }
-    }
-    catch (error) {
-      console.error('获取系统公告失败:', error);
-      // 静默失败，不影响用户体验
-    }
-  }
-});
 </script>
 
 <template>
   <router-view />
-  <!-- 系统公告弹窗 -->
-  <SystemAnnouncementDialog />
 </template>
 
 <style scoped lang="scss"></style>
diff --git a/Yi.Ai.Vue3/src/api/announcement/index.ts b/Yi.Ai.Vue3/src/api/announcement/index.ts
index 25b7b76c..a8ae2870 100644
--- a/Yi.Ai.Vue3/src/api/announcement/index.ts
+++ b/Yi.Ai.Vue3/src/api/announcement/index.ts
@@ -1,31 +1,12 @@
-import { get } from '@/utils/request'
-import type {
-  ActivityDetailResponse,
-  AnnouncementDetailResponse,
-  SystemAnnouncementResponse,
-} from './types'
+import type { AnnouncementLogDto } from './types';
+import { get } from '@/utils/request';
 
 /**
  * 获取系统公告和活动数据
+ * 后端接口: GET /api/app/announcement
+ * 返回格式: AnnouncementLogDto[]
  */
 export function getSystemAnnouncements() {
-  return get<SystemAnnouncementResponse>('/announcement/system').json()
+  return get<AnnouncementLogDto[]>('/announcement').json();
 }
-
-/**
- * 获取活动详情
- * @param id 活动ID
- */
-export function getActivityDetail(id: string | number) {
-  return get<ActivityDetailResponse>(`/announcement/activity/${id}`).json()
-}
-
-/**
- * 获取公告详情
- * @param id 公告ID
- */
-export function getAnnouncementDetail(id: string | number) {
-  return get<AnnouncementDetailResponse>(`/announcement/detail/${id}`).json()
-}
-
-export * from './types'
+export * from './types';
diff --git a/Yi.Ai.Vue3/src/api/announcement/types.ts b/Yi.Ai.Vue3/src/api/announcement/types.ts
index 576cee6f..c05a030a 100644
--- a/Yi.Ai.Vue3/src/api/announcement/types.ts
+++ b/Yi.Ai.Vue3/src/api/announcement/types.ts
@@ -1,51 +1,18 @@
-// 轮播图类型
-export interface CarouselItem {
-  id: number | string
-  imageUrl: string
-  link?: string
-  title?: string
-}
+// 公告类型（对应后端 AnnouncementTypeEnum）
+export type AnnouncementType = 'Activity' | 'System'
 
-// 活动类型
-export interface Activity {
-  id: number | string
+// 公告DTO（对应后端 AnnouncementLogDto）
+export interface AnnouncementLogDto {
+  /** 标题 */
   title: string
-  description: string
-  content: string
-  coverImage?: string
-  startTime?: string
-  endTime?: string
-  status: 'active' | 'inactive' | 'expired'
-  createdAt: string
-  updatedAt?: string
-}
-
-// 公告类型
-export interface Announcement {
-  id: number | string
-  title: string
-  content: string
-  type: 'latest' | 'history'
-  isImportant?: boolean
-  publishTime: string
-  createdAt: string
-  updatedAt?: string
-}
-
-// 系统公告响应类型
-export interface SystemAnnouncementResponse {
-  carousels: CarouselItem[]
-  activities: Activity[]
-  announcements: Announcement[]
-}
-
-// 公告详情响应类型
-export interface AnnouncementDetailResponse extends Announcement {
-  views?: number
-}
-
-// 活动详情响应类型
-export interface ActivityDetailResponse extends Activity {
-  views?: number
-  participantCount?: number
+  /** 内容列表 */
+  content: string[]
+  /** 图片url */
+  imageUrl?: string | null
+  /** 开始时间（系统公告时间、活动开始时间） */
+  startTime: string
+  /** 活动结束时间 */
+  endTime?: string | null
+  /** 公告类型（系统、活动） */
+  type: AnnouncementType
 }
diff --git a/Yi.Ai.Vue3/src/api/cardFlip/types.ts b/Yi.Ai.Vue3/src/api/cardFlip/types.ts
index 4683f9a3..6b0ceab0 100644
--- 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;// 当前用户是否已经填写过邀请码
 }
 
 // 翻牌记录
diff --git a/Yi.Ai.Vue3/src/api/user/index.ts b/Yi.Ai.Vue3/src/api/user/index.ts
index 2c1db1b7..6b9d6b8d 100644
--- a/Yi.Ai.Vue3/src/api/user/index.ts
+++ b/Yi.Ai.Vue3/src/api/user/index.ts
@@ -1,5 +1,61 @@
 import { get, post } from '@/utils/request';
 
+// 尊享包用量明细DTO
+export interface PremiumTokenUsageDto {
+  /** id */
+  id: string;
+  /** 用户ID */
+  userId: string;
+  /** 包名称 */
+  packageName: string;
+  /** 总用量（总token数） */
+  totalTokens: number;
+  /** 剩余用量（剩余token数） */
+  remainingTokens: number;
+  /** 已使用token数 */
+  usedTokens: number;
+  /** 到期时间 */
+  expireDateTime?: string;
+  /** 是否激活 */
+  isActive: boolean;
+  /** 购买金额 */
+  purchaseAmount: number;
+  /** 备注 */
+  remark?: string;
+  /** 创建时间 */
+  creationTime?: string;
+  /** 创建者ID */
+  creatorId?: string;
+}
+
+// 查询参数接口 - 匹配后端 PagedAllResultRequestDto
+export interface PremiumTokenUsageQueryParams {
+  /** 查询开始时间 */
+  startTime?: string;
+  /** 查询结束时间 */
+  endTime?: string;
+  /** 排序列名 */
+  orderByColumn?: string;
+  /** 排序方向（ascending/descending） */
+  isAsc?: string;
+  /** 跳过数量（分页） */
+  skipCount?: number;
+  /** 最大返回数量（分页） */
+  maxResultCount?: number;
+  /** 是否免费 */
+  isFree?: boolean;
+  // 是否为升序排序
+  isAscending?: boolean;
+}
+
+// 分页响应接口
+export interface PagedResult<T> {
+  /** 数据列表 */
+  items: T[];
+  /** 总数量 */
+  totalCount: number;
+}
+
 // 获取用户信息
 export function getUserInfo() {
   return get<any>('/account/ai').json();
@@ -24,3 +80,63 @@ export function getWechatAuth(data: any) {
 export function getPremiumTokenPackage() {
   return get<any>('/usage-statistics/premium-token-usage').json();
 }
+
+// 获取尊享包用量明细列表
+export function getPremiumTokenUsageList(params?: PremiumTokenUsageQueryParams) {
+  return get<PagedResult<PremiumTokenUsageDto>>('/usage-statistics/premium-token-usage/list', params).json();
+}
+
+// 查询条件的后端dto,其他查询或者排序由前端自己实现：
+// using Volo.Abp.Application.Dtos;
+//
+// namespace Yi.Framework.Ddd.Application.Contracts
+// {
+//   /// <summary>
+//   /// 分页查询请求DTO，包含时间范围和自定义排序功能
+//   /// </summary>
+//   public class PagedAllResultRequestDto : PagedAndSortedResultRequestDto, IPagedAllResultRequestDto
+//   {
+//     /// <summary>
+//     /// 查询开始时间
+//     /// </summary>
+//   public DateTime? StartTime { get; set; }
+//
+//     /// <summary>
+//     /// 查询结束时间
+//     /// </summary>
+//   public DateTime? EndTime { get; set; }
+//
+//     /// <summary>
+//     /// 排序列名
+//     /// </summary>
+//   public string? OrderByColumn { get; set; }
+//
+//     /// <summary>
+//     /// 排序方向（ascending/descending）
+//     /// </summary>
+//   public string? IsAsc { get; set; }
+//
+//     /// <summary>
+//     /// 是否为升序排序
+//     /// </summary>
+//   public bool IsAscending => string.Equals(IsAsc, "ascending", StringComparison.OrdinalIgnoreCase);
+//
+//   private string? _sorting;
+//
+//     /// <summary>
+//     /// 排序表达式
+//     /// </summary>
+//   public override string? Sorting
+//     {
+//       get
+//     {
+//       if (!string.IsNullOrWhiteSpace(OrderByColumn))
+//       {
+//         return $"{OrderByColumn} {(IsAscending ? "ASC" : "DESC")}";
+//       }
+//       return _sorting;
+//     }
+//     set => _sorting = value;
+//   }
+//   }
+// }
diff --git a/Yi.Ai.Vue3/src/components/LoginDialog/components/QrCodeLogin/index.vue b/Yi.Ai.Vue3/src/components/LoginDialog/components/QrCodeLogin/index.vue
index 601387d1..0031b25b 100644
--- 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;
+  }
 }
 
 // 处理注册授权
diff --git a/Yi.Ai.Vue3/src/components/ModelSelect/index.vue b/Yi.Ai.Vue3/src/components/ModelSelect/index.vue
index ddadb148..ce697df9 100644
--- 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(() => {
         // 点击右上角关闭或“关闭”按钮，不执行任何操作
@@ -110,6 +100,9 @@ function handleModelClick(item: GetSessionListVO) {
    规则3：彩色流光（尊享/高级）
 -------------------------------- */
 function getModelStyleClass(modelName: any) {
+  if (!modelName) {
+    return;
+  }
   const name = modelName.toLowerCase();
 
   // 规则3：彩色流光
@@ -156,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"
diff --git a/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue b/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue
index f73bcdb0..9354a37c 100644
--- a/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue
+++ b/Yi.Ai.Vue3/src/components/SystemAnnouncementDialog/index.vue
@@ -1,84 +1,105 @@
 <script lang="ts" setup>
-import { storeToRefs } from 'pinia'
-import { ElMessage } from 'element-plus'
-import { useRouter } from 'vue-router'
-import type { Activity, Announcement } from '@/api'
-import { useAnnouncementStore } from '@/stores'
-import type { CloseType } from '@/stores/modules/announcement'
+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 router = useRouter()
-const announcementStore = useAnnouncementStore()
+const announcementStore = useAnnouncementStore();
+const isLoadingData = ref(false);
 
-const activeTab = ref('activity')
+const activeTab = ref('activity');
 
 // 窗口宽度响应式状态
-const windowWidth = ref(typeof window !== 'undefined' ? window.innerWidth : 1920)
+const windowWidth = ref(typeof window !== 'undefined' ? window.innerWidth : 1920);
 
 // 监听窗口大小变化
 onMounted(() => {
   const handleResize = () => {
-    windowWidth.value = window.innerWidth
-  }
-  window.addEventListener('resize', handleResize)
+    windowWidth.value = window.innerWidth;
+  };
+  window.addEventListener('resize', handleResize);
   onUnmounted(() => {
-    window.removeEventListener('resize', handleResize)
-  })
-})
+    window.removeEventListener('resize', handleResize);
+  });
+});
 
 // 响应式弹窗宽度
 const dialogWidth = computed(() => {
-  if (windowWidth.value < 768) return '95%'
-  if (windowWidth.value < 1024) return '90%'
-  return '700px'
-})
+  if (windowWidth.value < 768)
+    return '95%';
+  if (windowWidth.value < 1024)
+    return '90%';
+  return '700px';
+});
 
 // 从store获取数据
-const { carousels, activities, announcements, isDialogVisible } = storeToRefs(announcementStore)
+const { announcements, isDialogVisible } = storeToRefs(announcementStore);
 
-// 分离最新公告和历史公告
-const latestAnnouncements = computed(() =>
-  announcements.value.filter(a => a.type === 'latest'),
-)
-const historyAnnouncements = computed(() =>
-  announcements.value.filter(a => a.type === 'history'),
-)
+// 分离活动和系统公告
+const activities = computed(() => {
+  if (!Array.isArray(announcements.value))
+    return [];
+  return announcements.value.filter(a => a.type === 'Activity');
+});
+const systemAnnouncements = computed(() => {
+  if (!Array.isArray(announcements.value))
+    return [];
+  return announcements.value.filter(a => a.type === 'System');
+});
 
 // 处理关闭弹窗
 function handleClose(type: CloseType) {
-  announcementStore.closeDialog(type)
+  announcementStore.closeDialog(type);
 
   const messages = {
-    today: '今日内不再显示',
-    week: '本周内不再显示',
+    today: '一周内不再显示',
     permanent: '公告已关闭',
-  }
+  };
 
-  ElMessage.success(messages[type])
-}
-
-// 查看活动详情
-function viewActivityDetail(activity: Activity) {
-  router.push({
-    name: 'activityDetail',
-    params: { id: activity.id },
-  })
-  announcementStore.isDialogVisible = false
-}
-
-// 查看公告详情
-function viewAnnouncementDetail(announcement: Announcement) {
-  router.push({
-    name: 'announcementDetail',
-    params: { id: announcement.id },
-  })
-  announcementStore.isDialogVisible = false
+  ElMessage.success(messages[type]);
 }
 
 // 格式化时间
 function formatTime(time: string) {
-  const date = new Date(time)
-  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
+  const date = new Date(time);
+  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
 }
+
+// 判断活动状态
+function getActivityStatus(activity: AnnouncementLogDto): 'active' | 'expired' {
+  if (!activity.endTime)
+    return 'active';
+  const now = new Date();
+  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>
@@ -86,70 +107,80 @@ function formatTime(time: string) {
     v-model="isDialogVisible"
     title="系统公告"
     :width="dialogWidth"
-    :close-on-click-modal="false"
+    :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">
           <div class="tab-content-wrapper">
             <div class="activity-content">
-              <!-- 轮播图 -->
-              <el-carousel
-                v-if="carousels.length > 0"
-                height="250px"
-                class="carousel-container"
-              >
-                <el-carousel-item v-for="item in carousels" :key="item.id">
-                  <img
-                    :src="item.imageUrl"
-                    :alt="item.title"
-                    class="carousel-image"
-                  >
-                  <div v-if="item.title" class="carousel-title">
-                    {{ item.title }}
-                  </div>
-                </el-carousel-item>
-              </el-carousel>
-
               <!-- 活动列表 -->
-              <div class="activity-list">
+              <div v-if="activities.length > 0" class="activity-list">
                 <div
-                  v-for="activity in activities"
-                  :key="activity.id"
+                  v-for="(activity, index) in activities"
+                  :key="index"
                   class="activity-item"
                 >
-                  <div class="activity-header">
-                    <h3 class="activity-title">{{ activity.title }}</h3>
-                    <el-tag
-                      v-if="activity.status === 'active'"
-                      type="success"
-                      size="small"
-                    >
-                      进行中
-                    </el-tag>
-                    <el-tag
-                      v-else-if="activity.status === 'expired'"
-                      type="info"
-                      size="small"
-                    >
-                      已结束
-                    </el-tag>
+                  <!-- 活动图片 -->
+                  <div v-if="activity.imageUrl" class="activity-image-wrapper">
+                    <img :src="activity.imageUrl" :alt="activity.title" class="activity-image">
+                    <!-- 图片上的状态标签 -->
+                    <div class="activity-status-badge">
+                      <el-tag
+                        v-if="getActivityStatus(activity) === 'active'"
+                        type="success"
+                        size="small"
+                        effect="dark"
+                      >
+                        进行中
+                      </el-tag>
+                      <el-tag
+                        v-else
+                        type="info"
+                        size="small"
+                        effect="dark"
+                      >
+                        已结束
+                      </el-tag>
+                    </div>
                   </div>
-                  <p class="activity-description">{{ activity.description }}</p>
-                  <div class="activity-footer">
-                    <span class="activity-time">{{ formatTime(activity.createdAt) }}</span>
-                    <el-button
-                      type="primary"
-                      link
-                      @click="viewActivityDetail(activity)"
-                    >
-                      查看详情
-                    </el-button>
+
+                  <div class="activity-body">
+                    <div class="activity-header">
+                      <h3 class="activity-title">
+                        {{ activity.title }}
+                      </h3>
+                    </div>
+
+                    <!-- 活动内容 -->
+                    <div class="activity-content-list">
+                      <p v-for="(line, idx) in activity.content" :key="idx" class="content-line">
+                        {{ line }}
+                      </p>
+                    </div>
+
+                    <div class="activity-footer">
+                      <div class="activity-time-range">
+                        <span class="activity-time">{{ formatTime(activity.startTime) }}</span>
+                        <span v-if="activity.endTime" class="activity-time">至 {{ formatTime(activity.endTime) }}</span>
+                      </div>
+                      <!-- 查看详情按钮 -->
+                      <a
+                        v-if="activity.url"
+                        :href="activity.url"
+                        target="_blank"
+                        class="detail-link"
+                      >
+                        查看详情
+                        <span class="detail-icon">→</span>
+                      </a>
+                    </div>
                   </div>
                 </div>
               </div>
+              <el-empty v-else description="暂无活动" />
             </div>
           </div>
         </el-tab-pane>
@@ -158,70 +189,45 @@ function formatTime(time: string) {
         <el-tab-pane label="公告" name="announcement">
           <div class="tab-content-wrapper">
             <div class="announcement-content">
-              <!-- 最新公告 -->
-              <div v-if="latestAnnouncements.length > 0" class="latest-section">
-                <h3 class="section-title">最新公告</h3>
-                <div
-                  v-for="announcement in latestAnnouncements"
-                  :key="announcement.id"
-                  class="announcement-item latest"
-                >
-                  <div class="announcement-header">
-                    <h4 class="announcement-title">
-                      <el-icon v-if="announcement.isImportant" color="#f56c6c">
-                        <i-ep-warning />
-                      </el-icon>
-                      {{ announcement.title }}
-                    </h4>
-                    <span class="announcement-time">{{ formatTime(announcement.publishTime) }}</span>
-                  </div>
-                  <p class="announcement-summary">{{ announcement.content.substring(0, 100) }}...</p>
-                  <el-button
-                    type="primary"
-                    link
-                    @click="viewAnnouncementDetail(announcement)"
-                  >
-                    查看详情
-                  </el-button>
-                </div>
-              </div>
-
-              <!-- 历史公告（时间线） -->
-              <div v-if="historyAnnouncements.length > 0" class="history-section">
-                <h3 class="section-title">历史公告</h3>
+              <!-- 系统公告列表 -->
+              <div v-if="systemAnnouncements.length > 0">
                 <el-timeline>
                   <el-timeline-item
-                    v-for="announcement in historyAnnouncements"
-                    :key="announcement.id"
-                    :timestamp="formatTime(announcement.publishTime)"
+                    v-for="(announcement, index) in systemAnnouncements"
+                    :key="index"
+                    :timestamp="formatTime(announcement.startTime)"
                     placement="top"
                   >
-                    <div class="timeline-item-content">
-                      <h4 class="timeline-title">{{ announcement.title }}</h4>
-                      <p class="timeline-summary">{{ announcement.content.substring(0, 80) }}...</p>
-                      <el-button
-                        type="primary"
-                        link
-                        size="small"
-                        @click="viewAnnouncementDetail(announcement)"
-                      >
-                        查看详情
-                      </el-button>
+                    <div class="announcement-item">
+                      <div class="announcement-header">
+                        <h4 class="announcement-title">
+                          {{ announcement.title }}
+                        </h4>
+                      </div>
+
+                      <!-- 公告内容 -->
+                      <div class="announcement-content-list">
+                        <p v-for="(line, idx) in announcement.content" :key="idx" class="content-line">
+                          {{ line }}
+                        </p>
+                      </div>
                     </div>
                   </el-timeline-item>
                 </el-timeline>
               </div>
+              <el-empty v-else description="暂无公告" />
             </div>
           </div>
         </el-tab-pane>
-    </el-tabs>
+      </el-tabs>
     </div>
 
     <!-- 底部按钮 -->
     <template #footer>
       <div class="dialog-footer">
-        <el-button @click="handleClose('week')">本周关闭</el-button>
-        <el-button @click="handleClose('today')">今日关闭</el-button>
+        <el-button @click="handleClose('today')">
+          关闭一周
+        </el-button>
         <el-button type="primary" @click="handleClose('permanent')">
           关闭公告
         </el-button>
@@ -231,6 +237,21 @@ function formatTime(time: string) {
 </template>
 
 <style scoped lang="scss">
+// 弹窗遮罩动画
+:deep(.el-overlay) {
+  backdrop-filter: blur(4px);
+  animation: fadeIn 0.3s ease-out;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
 // 确保弹窗本身不会溢出
 :deep(.el-dialog) {
   margin-top: 5vh !important;
@@ -238,6 +259,101 @@ function formatTime(time: string) {
   max-height: 90vh;
   display: flex;
   flex-direction: column;
+  border-radius: 16px;
+  overflow: hidden;
+  box-shadow: 0 20px 60px rgba(102, 126, 234, 0.3);
+  animation: slideInDown 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+
+@keyframes slideInDown {
+  from {
+    opacity: 0;
+    transform: translateY(-30px) scale(0.95);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+:deep(.el-dialog__header) {
+  padding: 24px 28px;
+  border-bottom: none;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  position: relative;
+  overflow: hidden;
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: -50%;
+    right: -5%;
+    width: 200px;
+    height: 200px;
+    background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
+    border-radius: 50%;
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    bottom: -20%;
+    left: -3%;
+    width: 150px;
+    height: 150px;
+    background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
+    border-radius: 50%;
+  }
+
+  .el-dialog__title {
+    color: #fff;
+    font-size: 20px;
+    font-weight: 700;
+    letter-spacing: 0.5px;
+    position: relative;
+    z-index: 1;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+
+    &::before {
+      content: '📣';
+      font-size: 24px;
+      animation: bounce 2s infinite;
+    }
+  }
+
+  .el-dialog__headerbtn {
+    top: 24px;
+    right: 24px;
+    z-index: 1;
+
+    .el-dialog__close {
+      color: #fff;
+      font-size: 22px;
+      width: 32px;
+      height: 32px;
+      border-radius: 50%;
+      background: rgba(255, 255, 255, 0.15);
+      backdrop-filter: blur(10px);
+      transition: all 0.3s;
+
+      &:hover {
+        color: #fff;
+        background: rgba(255, 255, 255, 0.25);
+        transform: rotate(90deg);
+      }
+    }
+  }
+}
+
+@keyframes bounce {
+  0%, 100% {
+    transform: translateY(0);
+  }
+  50% {
+    transform: translateY(-5px);
+  }
 }
 
 :deep(.el-dialog__body) {
@@ -246,6 +362,36 @@ function formatTime(time: string) {
   display: flex;
   flex-direction: column;
   padding: 0 !important;
+  background: linear-gradient(to bottom, #f8f9fa 0%, #ffffff 100%);
+  position: relative;
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 3px;
+    background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #667eea 100%);
+    background-size: 200% 100%;
+    animation: shimmer 3s linear infinite;
+  }
+}
+
+@keyframes shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+
+:deep(.el-dialog__footer) {
+  padding: 20px 28px;
+  border-top: 1px solid #e4e7ed;
+  background: linear-gradient(to top, #fafbfc 0%, #ffffff 100%);
+  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.03);
 }
 
 .announcement-dialog-content {
@@ -264,6 +410,31 @@ function formatTime(time: string) {
   :deep(.el-tabs__header) {
     flex-shrink: 0;
     margin: 0 20px;
+    padding-top: 16px;
+    background-color: #f8f9fa;
+  }
+
+  :deep(.el-tabs__nav-wrap::after) {
+    display: none;
+  }
+
+  :deep(.el-tabs__active-bar) {
+    background-color: #667eea;
+    height: 3px;
+  }
+
+  :deep(.el-tabs__item) {
+    font-size: 15px;
+    font-weight: 500;
+    color: #606266;
+
+    &:hover {
+      color: #667eea;
+    }
+
+    &.is-active {
+      color: #667eea;
+    }
   }
 
   :deep(.el-tabs__content) {
@@ -283,25 +454,26 @@ function formatTime(time: string) {
   max-height: 60vh;
   overflow-y: auto;
   overflow-x: hidden;
-  padding: 0 20px 20px;
+  padding: 20px 24px 24px;
   flex-shrink: 0;
 
-  // 确保滚动条样式
+  // 自定义滚动条样式
   &::-webkit-scrollbar {
-    width: 6px;
+    width: 8px;
   }
 
   &::-webkit-scrollbar-track {
-    background: #f1f1f1;
-    border-radius: 3px;
+    background: #f1f3f5;
+    border-radius: 4px;
   }
 
   &::-webkit-scrollbar-thumb {
-    background: #c1c1c1;
-    border-radius: 3px;
+    background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
+    border-radius: 4px;
+    transition: background 0.3s;
 
     &:hover {
-      background: #a8a8a8;
+      background: linear-gradient(180deg, #5568d3 0%, #65408b 100%);
     }
   }
 }
@@ -309,112 +481,409 @@ function formatTime(time: string) {
 .activity-content {
   min-height: min-content;
 
-  .carousel-container {
-    margin-bottom: 24px;
-    border-radius: 8px;
-    overflow: hidden;
-  }
-
-  .carousel-image {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-  }
-
-  .carousel-title {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    padding: 12px 16px;
-    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
-    color: #fff;
-    font-size: 16px;
-    font-weight: 500;
-  }
-
   .activity-list {
     display: flex;
     flex-direction: column;
-    gap: 16px;
+    gap: 20px;
   }
 
   .activity-item {
-    padding: 16px;
-    background: #f5f7fa;
-    border-radius: 8px;
-    transition: all 0.3s;
+    position: relative;
+    padding: 0;
+    background: #fff;
+    border-radius: 16px;
+    overflow: hidden;
+    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+    border: 2px solid transparent;
+    background-clip: padding-box;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      border-radius: 16px;
+      padding: 2px;
+      background: linear-gradient(135deg, transparent 0%, transparent 100%);
+      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+      -webkit-mask-composite: xor;
+      mask-composite: exclude;
+      opacity: 0;
+      transition: opacity 0.4s;
+    }
 
     &:hover {
-      background: #e8eaed;
-      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+      transform: translateY(-8px) scale(1.01);
+      box-shadow: 0 16px 40px rgba(102, 126, 234, 0.25);
+      border-color: #667eea;
+
+      &::before {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        opacity: 1;
+      }
+
+      .activity-image {
+        transform: scale(1.1);
+        filter: brightness(1.05);
+      }
+
+      .detail-link {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: #fff;
+        padding-right: 16px;
+        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
+
+        .detail-icon {
+          transform: translateX(6px) scale(1.2);
+        }
+      }
     }
   }
 
+  .activity-image-wrapper {
+    position: relative;
+    width: 100%;
+    height: 220px;
+    overflow: hidden;
+    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: -100%;
+      width: 100%;
+      height: 100%;
+      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
+      z-index: 1;
+      animation: shine 3s infinite;
+    }
+
+    &::after {
+      content: '';
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      height: 100px;
+      background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
+      pointer-events: none;
+      z-index: 1;
+    }
+  }
+
+  @keyframes shine {
+    0% {
+      left: -100%;
+    }
+    50%, 100% {
+      left: 100%;
+    }
+  }
+
+  .activity-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .activity-status-badge {
+    position: absolute;
+    top: 16px;
+    right: 16px;
+    z-index: 2;
+    animation: fadeInScale 0.5s ease-out 0.3s both;
+
+    :deep(.el-tag) {
+      border-radius: 20px;
+      padding: 7px 18px;
+      font-weight: 700;
+      font-size: 13px;
+      border: none;
+      backdrop-filter: blur(12px);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+      transition: all 0.3s;
+      text-transform: uppercase;
+      letter-spacing: 0.5px;
+
+      &.el-tag--success.el-tag--dark {
+        background: linear-gradient(135deg, rgba(16, 185, 129, 0.95), rgba(5, 150, 105, 0.95));
+        color: #fff;
+        animation: pulse 2s ease-in-out infinite;
+      }
+
+      &.el-tag--info.el-tag--dark {
+        background: rgba(148, 163, 184, 0.95);
+        color: #fff;
+      }
+
+      &:hover {
+        transform: scale(1.05);
+        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
+      }
+    }
+  }
+
+  @keyframes fadeInScale {
+    from {
+      opacity: 0;
+      transform: scale(0.5);
+    }
+    to {
+      opacity: 1;
+      transform: scale(1);
+    }
+  }
+
+  @keyframes pulse {
+    0%, 100% {
+      box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
+    }
+    50% {
+      box-shadow: 0 4px 20px rgba(16, 185, 129, 0.6);
+    }
+  }
+
+  .activity-body {
+    padding: 20px;
+  }
+
   .activity-header {
     display: flex;
     align-items: center;
     gap: 12px;
-    margin-bottom: 8px;
+    margin-bottom: 12px;
   }
 
   .activity-title {
     margin: 0;
-    font-size: 16px;
-    font-weight: 600;
-    color: #303133;
+    font-size: 18px;
+    font-weight: 700;
+    color: #1a1a1a;
     flex: 1;
+    line-height: 1.4;
+    background: linear-gradient(135deg, #1a1a1a 0%, #4a5568 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    transition: all 0.3s;
+
+    .activity-item:hover & {
+      letter-spacing: 0.3px;
+    }
   }
 
-  .activity-description {
-    margin: 0 0 12px 0;
-    color: #606266;
+  .activity-content-list {
+    padding: 0;
+    margin: 0 0 16px 0;
+    color: #4a5568;
     font-size: 14px;
-    line-height: 1.5;
+    line-height: 1.8;
+
+    .content-line {
+      margin: 8px 0;
+      padding-left: 18px;
+      position: relative;
+
+      &::before {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 11px;
+        width: 6px;
+        height: 6px;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        border-radius: 50%;
+      }
+
+      &:first-child {
+        margin-top: 0;
+      }
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
   }
 
   .activity-footer {
     display: flex;
     justify-content: space-between;
     align-items: center;
+    gap: 16px;
+    padding-top: 16px;
+    border-top: 1px dashed #e8e9eb;
+  }
+
+  .activity-time-range {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-wrap: wrap;
   }
 
   .activity-time {
-    font-size: 12px;
-    color: #909399;
+    font-size: 13px;
+    color: #718096;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+
+    &:first-child::before {
+      content: '🕐';
+      font-size: 14px;
+    }
+  }
+
+  .detail-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    padding: 10px 18px;
+    background: linear-gradient(135deg, #f0f1f3 0%, #e8eaed 100%);
+    color: #667eea;
+    border-radius: 24px;
+    font-size: 13px;
+    font-weight: 700;
+    text-decoration: none;
+    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    white-space: nowrap;
+    position: relative;
+    overflow: hidden;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 0;
+      height: 0;
+      border-radius: 50%;
+      background: rgba(255, 255, 255, 0.3);
+      transform: translate(-50%, -50%);
+      transition: width 0.6s, height 0.6s;
+    }
+
+    &:hover::before {
+      width: 300px;
+      height: 300px;
+    }
+
+    &:hover {
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      color: #fff;
+      transform: translateX(4px) scale(1.05);
+      box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
+    }
+
+    .detail-icon {
+      font-size: 18px;
+      font-weight: bold;
+      transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+      position: relative;
+      z-index: 1;
+    }
+
+    span:not(.detail-icon) {
+      position: relative;
+      z-index: 1;
+    }
   }
 }
 
 .announcement-content {
   min-height: min-content;
 
-  .section-title {
-    margin: 0 0 16px 0;
-    font-size: 16px;
-    font-weight: 600;
-    color: #303133;
-    padding-bottom: 8px;
-    border-bottom: 2px solid #409eff;
+  :deep(.el-timeline) {
+    padding-left: 20px;
   }
 
-  .latest-section {
-    margin-bottom: 32px;
+  :deep(.el-timeline-item__node) {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    border: 3px solid #fff;
+    box-shadow: 0 0 0 2px #e8e9eb;
+    width: 16px;
+    height: 16px;
+  }
+
+  :deep(.el-timeline-item__tail) {
+    border-left: 2px dashed #d1d5db;
+  }
+
+  :deep(.el-timeline-item__timestamp) {
+    color: #718096;
+    font-size: 13px;
+    font-weight: 500;
+    margin-bottom: 10px;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    white-space: nowrap;
+
+    &::before {
+      content: '📅';
+      font-size: 14px;
+    }
   }
 
   .announcement-item {
-    padding: 16px;
-    background: #f5f7fa;
-    border-radius: 8px;
-    margin-bottom: 12px;
-    transition: all 0.3s;
+    position: relative;
+    padding: 24px;
+    background: #fff;
+    border-radius: 12px;
+    overflow: hidden;
+    margin-bottom: 16px;
+    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+    border: 1px solid #e8e9eb;
+    border-left: 4px solid #e8e9eb;
 
-    &:hover {
-      background: #e8eaed;
-      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    &::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 0;
+      bottom: 0;
+      width: 4px;
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      transform: scaleY(0);
+      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     }
 
-    &.latest {
-      border-left: 3px solid #409eff;
+    &::after {
+      content: '';
+      position: absolute;
+      top: 50%;
+      left: -100%;
+      width: 100%;
+      height: 100%;
+      background: linear-gradient(90deg, transparent, rgba(102, 126, 234, 0.05), transparent);
+      transform: translateY(-50%);
+      transition: left 0.6s;
+    }
+
+    &:hover {
+      transform: translateX(8px) scale(1.02);
+      box-shadow: 0 8px 24px rgba(102, 126, 234, 0.15);
+      border-color: transparent;
+      background: linear-gradient(to right, rgba(102, 126, 234, 0.03), #fff);
+
+      &::before {
+        transform: scaleY(1);
+      }
+
+      &::after {
+        left: 100%;
+      }
+
+      .announcement-title {
+        color: #667eea;
+        transform: translateX(4px);
+      }
     }
   }
 
@@ -422,52 +891,73 @@ function formatTime(time: string) {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    margin-bottom: 8px;
+    margin-bottom: 12px;
   }
 
   .announcement-title {
     margin: 0;
-    font-size: 15px;
-    font-weight: 600;
-    color: #303133;
+    font-size: 16px;
+    font-weight: 700;
+    color: #1a1a1a;
+    line-height: 1.4;
     display: flex;
     align-items: center;
-    gap: 6px;
+    gap: 10px;
+    transition: all 0.3s;
+
+    &::before {
+      content: '📢';
+      font-size: 20px;
+      animation: swing 2s ease-in-out infinite;
+      transform-origin: top center;
+    }
   }
 
-  .announcement-time {
-    font-size: 12px;
-    color: #909399;
+  @keyframes swing {
+    0%, 100% {
+      transform: rotate(0deg);
+    }
+    10%, 30% {
+      transform: rotate(-10deg);
+    }
+    20%, 40% {
+      transform: rotate(10deg);
+    }
+    50% {
+      transform: rotate(0deg);
+    }
   }
 
-  .announcement-summary {
-    margin: 0 0 12px 0;
-    color: #606266;
+  .announcement-content-list {
+    padding: 0;
+    margin: 0;
+    color: #4a5568;
     font-size: 14px;
-    line-height: 1.5;
-  }
+    line-height: 1.8;
 
-  .history-section {
-    :deep(.el-timeline) {
-      padding-left: 0;
-    }
+    .content-line {
+      margin: 8px 0;
+      padding-left: 18px;
+      position: relative;
 
-    .timeline-item-content {
-      padding-left: 8px;
-    }
+      &::before {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 11px;
+        width: 6px;
+        height: 6px;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        border-radius: 50%;
+      }
 
-    .timeline-title {
-      margin: 0 0 8px 0;
-      font-size: 14px;
-      font-weight: 600;
-      color: #303133;
-    }
+      &:first-child {
+        margin-top: 0;
+      }
 
-    .timeline-summary {
-      margin: 0 0 8px 0;
-      color: #606266;
-      font-size: 13px;
-      line-height: 1.5;
+      &:last-child {
+        margin-bottom: 0;
+      }
     }
   }
 }
@@ -476,6 +966,83 @@ function formatTime(time: string) {
   display: flex;
   justify-content: flex-end;
   gap: 12px;
+
+  :deep(.el-button) {
+    border-radius: 24px;
+    padding: 12px 28px;
+    font-weight: 600;
+    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    overflow: hidden;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 0;
+      height: 0;
+      border-radius: 50%;
+      background: rgba(255, 255, 255, 0.3);
+      transform: translate(-50%, -50%);
+      transition: width 0.6s, height 0.6s;
+    }
+
+    &:active::before {
+      width: 300px;
+      height: 300px;
+    }
+
+    &:not(.el-button--primary) {
+      border: 2px solid #d1d5db;
+      color: #4a5568;
+      background: #fff;
+
+      &:hover {
+        border-color: #667eea;
+        color: #667eea;
+        background: linear-gradient(135deg, rgba(102, 126, 234, 0.05), rgba(118, 75, 162, 0.05));
+        transform: translateY(-2px);
+        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
+      }
+    }
+
+    &.el-button--primary {
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      border: none;
+      box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
+
+      &:hover {
+        background: linear-gradient(135deg, #5568d3 0%, #65408b 100%);
+        transform: translateY(-3px) scale(1.02);
+        box-shadow: 0 8px 20px rgba(102, 126, 234, 0.5);
+      }
+
+      &:active {
+        transform: translateY(-1px) scale(0.98);
+      }
+    }
+
+    span {
+      position: relative;
+      z-index: 1;
+    }
+  }
+}
+
+// 空状态样式优化
+:deep(.el-empty) {
+  padding: 60px 0;
+
+  .el-empty__image {
+    width: 120px;
+  }
+
+  .el-empty__description {
+    color: #9ca3af;
+    font-size: 14px;
+    margin-top: 16px;
+  }
 }
 
 // 移动端适配
@@ -483,93 +1050,111 @@ function formatTime(time: string) {
   :deep(.el-dialog) {
     margin: 5vh auto !important;
     max-height: 90vh;
+    border-radius: 10px;
   }
 
   :deep(.el-dialog__header) {
-    padding: 16px;
-    flex-shrink: 0;
+    padding: 16px 20px;
+
+    .el-dialog__title {
+      font-size: 16px;
+    }
   }
 
   :deep(.el-dialog__footer) {
-    padding: 12px;
-    flex-shrink: 0;
+    padding: 12px 16px;
   }
 
   .announcement-tabs {
     :deep(.el-tabs__header) {
       margin: 0 12px;
+      padding-top: 12px;
+    }
+
+    :deep(.el-tabs__item) {
+      font-size: 14px;
+      padding: 0 16px;
     }
   }
 
   .tab-content-wrapper {
     height: calc(90vh - 230px);
     max-height: calc(90vh - 230px);
-    padding: 0 12px 12px;
-    flex-shrink: 0;
+    padding: 16px 16px 20px;
     -webkit-overflow-scrolling: touch;
 
-    // 移动端滚动条样式
     &::-webkit-scrollbar {
       width: 4px;
     }
   }
 
   .activity-content {
-    .carousel-container {
-      margin-bottom: 16px;
-    }
-
-    .carousel-title {
-      padding: 8px 12px;
-      font-size: 14px;
+    .activity-list {
+      gap: 16px;
     }
 
     .activity-item {
-      padding: 12px;
+      border-radius: 10px;
+    }
+
+    .activity-image-wrapper {
+      height: 180px;
+    }
+
+    .activity-body {
+      padding: 16px;
+    }
+
+    .activity-header {
+      margin-bottom: 10px;
     }
 
     .activity-title {
-      font-size: 14px;
+      font-size: 16px;
     }
 
-    .activity-description {
+    .activity-content-list {
+      margin-bottom: 12px;
       font-size: 13px;
+      line-height: 1.7;
     }
 
     .activity-footer {
+      padding-top: 12px;
       flex-direction: column;
       align-items: flex-start;
-      gap: 8px;
+      gap: 12px;
+    }
+
+    .detail-link {
+      width: 100%;
+      justify-content: center;
+      padding: 10px 16px;
     }
   }
 
   .announcement-content {
-    .section-title {
-      font-size: 14px;
-      margin-bottom: 12px;
+    :deep(.el-timeline) {
+      padding-left: 16px;
     }
 
     .announcement-item {
-      padding: 12px;
-      margin-bottom: 8px;
+      padding: 16px;
+      border-radius: 10px;
+      margin-bottom: 12px;
     }
 
     .announcement-title {
-      font-size: 14px;
+      font-size: 15px;
+
+      &::before {
+        font-size: 16px;
+      }
     }
 
-    .announcement-summary {
+    .announcement-content-list {
       font-size: 13px;
-    }
-
-    .history-section {
-      .timeline-title {
-        font-size: 13px;
-      }
-
-      .timeline-summary {
-        font-size: 12px;
-      }
+      line-height: 1.7;
     }
   }
 
@@ -577,9 +1162,10 @@ function formatTime(time: string) {
     flex-direction: column;
     gap: 8px;
 
-    .el-button {
+    :deep(.el-button) {
       width: 100%;
       margin: 0;
+      padding: 11px 24px;
     }
   }
 }
@@ -594,5 +1180,82 @@ function formatTime(time: string) {
   .announcement-tabs {
     max-height: calc(90vh - 200px);
   }
+
+  .activity-content {
+    .activity-image-wrapper {
+      height: 200px;
+    }
+  }
+
+  .announcement-content {
+    .announcement-item {
+      padding: 18px;
+    }
+  }
+}
+
+// 添加入场动画
+@keyframes slideInUp {
+  from {
+    opacity: 0;
+    transform: translateY(30px) scale(0.95);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+.activity-item {
+  animation: slideInUp 0.5s ease-out both;
+
+  @for $i from 1 through 10 {
+    &:nth-child(#{$i}) {
+      animation-delay: #{$i * 0.08}s;
+    }
+  }
+}
+
+.announcement-item {
+  animation: slideInUp 0.5s ease-out both;
+}
+
+// 滚动条美化
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  background: #f1f3f5;
+  border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
+  border-radius: 4px;
+  transition: background 0.3s;
+
+  &:hover {
+    background: linear-gradient(180deg, #5568d3 0%, #65408b 100%);
+  }
+}
+
+// 添加标签页切换动画
+:deep(.el-tabs__content) {
+  .el-tab-pane {
+    animation: fadeInContent 0.4s ease-out;
+  }
+}
+
+@keyframes fadeInContent {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 </style>
diff --git a/Yi.Ai.Vue3/src/components/userPersonalCenter/NavDialog.vue b/Yi.Ai.Vue3/src/components/userPersonalCenter/NavDialog.vue
index dba47a6f..437d729a 100644
--- 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">
diff --git a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/CardFlipActivity.vue b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/CardFlipActivity.vue
index ea27fc96..0d686c44 100644
--- 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 {
diff --git a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumPackageInfo.vue b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumPackageInfo.vue
new file mode 100644
index 00000000..5dff94eb
--- /dev/null
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumPackageInfo.vue
@@ -0,0 +1,590 @@
+<script lang="ts" setup>
+import { Clock, Coin, TrophyBase, WarningFilled } from '@element-plus/icons-vue';
+import { showProductPackage } from '@/utils/product-package.ts';
+
+// Props
+interface Props {
+  packageData: {
+    totalQuota: number;
+    usedQuota: number;
+    remainingQuota: number;
+    usagePercentage: number;
+    packageName: string;
+    expireDate: string;
+  };
+  loading?: boolean;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  loading: false,
+});
+
+// Emits
+const emit = defineEmits<{
+  refresh: [];
+}>();
+
+// 计算属性
+const usagePercent = computed(() => {
+  if (props.packageData.totalQuota === 0)
+    return 0;
+  return Number(((props.packageData.usedQuota / props.packageData.totalQuota) * 100).toFixed(2));
+});
+
+const remainingPercent = computed(() => {
+  if (props.packageData.totalQuota === 0)
+    return 0;
+  return Number(((props.packageData.remainingQuota / props.packageData.totalQuota) * 100).toFixed(2));
+});
+
+// 获取进度条颜色（基于剩余百分比）
+const progressColor = computed(() => {
+  const percent = remainingPercent.value;
+  if (percent <= 10)
+    return '#f56c6c'; // 红色 - 剩余很少
+  if (percent <= 30)
+    return '#e6a23c'; // 橙色 - 剩余较少
+  return '#67c23a'; // 绿色 - 剩余充足
+});
+
+// 格式化数字 - 转换为万为单位
+function formatNumber(num: number): string {
+  if (num === 0)
+    return '0';
+  const wan = num / 10000;
+  // 保留2位小数，去掉末尾的0
+  return wan.toFixed(2).replace(/\.?0+$/, '');
+}
+
+// 格式化原始数字（带千分位）
+function formatRawNumber(num: number): string {
+  return num.toLocaleString();
+}
+
+function onProductPackage() {
+  showProductPackage();
+}
+</script>
+
+<template>
+  <div v-loading="loading" class="premium-package-info">
+    <div class="header">
+      <div class="header-left">
+        <el-icon class="header-main-icon">
+          <TrophyBase />
+        </el-icon>
+        <div class="header-titles">
+          <h2 class="main-title">
+            尊享服务
+          </h2>
+          <p class="sub-title">
+            Premium Service
+          </p>
+        </div>
+      </div>
+      <el-button
+        type="primary"
+        size="default"
+        @click="emit('refresh')"
+      >
+        <el-icon><i-ep-refresh /></el-icon>
+        刷新数据
+      </el-button>
+    </div>
+
+    <!-- 套餐信息卡片 -->
+    <el-card class="package-card" shadow="hover">
+      <template #header>
+        <div class="card-header">
+          <div class="card-header-left">
+            <el-icon class="header-icon">
+              <Coin />
+            </el-icon>
+            <div class="header-text">
+              <span class="header-title">尊享TOKEN包总览</span>
+              <span class="header-subtitle">{{ packageData.packageName }}</span>
+            </div>
+          </div>
+        </div>
+      </template>
+
+      <div class="package-content">
+        <!-- 统计数据 -->
+        <div class="stats-grid">
+          <div class="stat-item total">
+            <div class="stat-label">
+              购买总额度
+            </div>
+            <div class="stat-value">
+              {{ formatNumber(packageData.totalQuota) }}
+            </div>
+            <div class="stat-unit">
+              万 Tokens
+            </div>
+            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.totalQuota)} Tokens`">
+              ({{ formatRawNumber(packageData.totalQuota) }})
+            </div>
+          </div>
+
+          <div class="stat-item used">
+            <div class="stat-label">
+              已用额度
+            </div>
+            <div class="stat-value">
+              {{ formatNumber(packageData.usedQuota) }}
+            </div>
+            <div class="stat-unit">
+              万 Tokens
+            </div>
+            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.usedQuota)} Tokens`">
+              ({{ formatRawNumber(packageData.usedQuota) }})
+            </div>
+          </div>
+
+          <div class="stat-item remaining">
+            <div class="stat-label">
+              剩余额度
+            </div>
+            <div class="stat-value">
+              {{ formatNumber(packageData.remainingQuota) }}
+            </div>
+            <div class="stat-unit">
+              万 Tokens
+            </div>
+            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.remainingQuota)} Tokens`">
+              ({{ formatRawNumber(packageData.remainingQuota) }})
+            </div>
+          </div>
+        </div>
+
+        <!-- 进度条 -->
+        <div class="progress-section">
+          <div class="progress-header">
+            <span class="progress-label">剩余进度</span>
+            <span class="progress-percent" :style="{ color: progressColor }">
+              {{ remainingPercent }}%
+            </span>
+          </div>
+
+          <el-progress
+            :percentage="remainingPercent"
+            :color="progressColor"
+            :stroke-width="20"
+            :show-text="false"
+          />
+
+          <div class="progress-legend">
+            <div class="legend-item">
+              <span class="legend-dot " :style="{ background: progressColor }" />
+              <span class="legend-text">剩余: {{ remainingPercent }}%</span>
+            </div>
+            <div class="legend-item">
+              <span class="legend-dot used-dot" />
+              <span class="legend-text">已使用: {{ usagePercent }}%</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 购买提示卡片（额度不足时显示） -->
+        <el-card
+          v-if="remainingPercent < 20"
+          class="warning-card"
+          shadow="hover"
+        >
+          <div class="warning-content">
+            <el-icon class="warning-icon" color="#e6a23c">
+              <WarningFilled />
+            </el-icon>
+            <div class="warning-text">
+              <h3>额度即将用完</h3>
+              <p>您的Token额度已使用{{ usagePercent }}%，剩余额度较少，建议及时充值。</p>
+            </div>
+            <el-button type="warning" @click="onProductPackage()">
+              立即充值
+            </el-button>
+          </div>
+        </el-card>
+
+        <!-- 过期时间 -->
+        <div v-if="packageData.expireDate" class="expire-info">
+          <el-icon><Clock /></el-icon>
+          <span>有效期至: {{ packageData.expireDate }}</span>
+        </div>
+
+        <!-- 温馨提示 -->
+        <el-alert
+          class="tips-alert"
+          type="info"
+          :closable="false"
+          show-icon
+        >
+          <template #title>
+            <div class="tips-content">
+              <p>温馨提示：</p>
+              <ul>
+                <li>Token额度根据不同模型消耗速率不同</li>
+                <li>建议合理使用，避免额度过快消耗</li>
+                <li>额度不足时请及时充值，避免影响使用</li>
+              </ul>
+            </div>
+          </template>
+        </el-alert>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.premium-package-info {
+  width: 100%;
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 24px;
+  padding-bottom: 20px;
+  border-bottom: 2px solid #f0f2f5;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.header-main-icon {
+  font-size: 36px;
+  color: #f59e0b;
+  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
+  padding: 12px;
+  border-radius: 12px;
+  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.2);
+}
+
+.header-titles {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.main-title {
+  margin: 0;
+  font-size: 24px;
+  font-weight: 700;
+  color: #1a1a1a;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+
+.sub-title {
+  margin: 0;
+  font-size: 13px;
+  color: #909399;
+  font-weight: 500;
+  letter-spacing: 0.5px;
+}
+
+/* 套餐卡片 */
+.package-card {
+  border-radius: 16px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+  border: 1px solid #f0f2f5;
+  transition: all 0.3s;
+
+  &:hover {
+    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.12);
+    border-color: #667eea;
+  }
+
+  :deep(.el-card__header) {
+    background: linear-gradient(to bottom, #fafbfc 0%, #ffffff 100%);
+    border-bottom: 2px solid #f0f2f5;
+  }
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.card-header-left {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.header-icon {
+  font-size: 24px;
+  color: #f59e0b;
+  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
+  padding: 8px;
+  border-radius: 8px;
+}
+
+.header-text {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.header-title {
+  font-size: 18px;
+  font-weight: 700;
+  color: #1a1a1a;
+}
+
+.header-subtitle {
+  font-size: 13px;
+  color: #909399;
+}
+
+.package-content {
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+}
+
+/* 统计数据网格 */
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 16px;
+}
+
+.stat-item {
+  padding: 20px;
+  border-radius: 8px;
+  text-align: center;
+  transition: transform 0.2s;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: white;
+}
+
+.stat-item:hover {
+  transform: translateY(-4px);
+}
+
+.stat-item.total {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+}
+
+.stat-item.used {
+  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
+}
+
+.stat-item.remaining {
+  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
+}
+
+.stat-label {
+  font-size: 14px;
+  opacity: 0.9;
+  margin-bottom: 8px;
+}
+
+.stat-value {
+  font-size: 28px;
+  font-weight: 700;
+  margin-bottom: 4px;
+}
+
+.stat-unit {
+  font-size: 12px;
+  opacity: 0.8;
+}
+
+.stat-raw {
+  font-size: 11px;
+  opacity: 0.7;
+  margin-top: 4px;
+  cursor: help;
+  transition: opacity 0.2s;
+}
+
+.stat-raw:hover {
+  opacity: 1;
+}
+
+/* 进度条部分 */
+.progress-section {
+  padding: 20px;
+  background: #f7f8fa;
+  border-radius: 8px;
+}
+
+.progress-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.progress-label {
+  font-size: 16px;
+  font-weight: 600;
+  color: #333;
+}
+
+.progress-percent {
+  font-size: 20px;
+  font-weight: 700;
+}
+
+.progress-legend {
+  display: flex;
+  justify-content: center;
+  gap: 24px;
+  margin-top: 12px;
+}
+
+.legend-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.legend-dot {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+}
+
+.used-dot {
+  background: #409eff;
+}
+
+.legend-text {
+  font-size: 14px;
+  color: #606266;
+}
+
+/* 过期信息 */
+.expire-info {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 16px;
+  background: #f0f9ff;
+  border-radius: 6px;
+  color: #0369a1;
+  font-size: 14px;
+}
+
+/* 温馨提示 */
+.tips-alert {
+  border-radius: 8px;
+}
+
+.tips-content p {
+  margin: 0 0 8px 0;
+  font-weight: 600;
+}
+
+.tips-content ul {
+  margin: 0;
+  padding-left: 20px;
+}
+
+.tips-content li {
+  margin: 4px 0;
+  font-size: 13px;
+}
+
+/* 警告卡片 */
+.warning-card {
+  border-radius: 12px;
+  border: 2px solid #e6a23c;
+  background: #fef3e9;
+}
+
+.warning-content {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.warning-icon {
+  font-size: 40px;
+  flex-shrink: 0;
+}
+
+.warning-text {
+  flex: 1;
+}
+
+.warning-text h3 {
+  margin: 0 0 8px 0;
+  color: #e6a23c;
+  font-size: 18px;
+}
+
+.warning-text p {
+  margin: 0;
+  color: #606266;
+  font-size: 14px;
+}
+
+/* 响应式布局 */
+@media (max-width: 768px) {
+  .header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 16px;
+    padding-bottom: 16px;
+  }
+
+  .header-main-icon {
+    font-size: 28px;
+    padding: 10px;
+  }
+
+  .main-title {
+    font-size: 20px;
+  }
+
+  .sub-title {
+    font-size: 12px;
+  }
+
+  .stats-grid {
+    grid-template-columns: 1fr;
+    gap: 12px;
+  }
+
+  .stat-value {
+    font-size: 24px;
+  }
+
+  .progress-legend {
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .warning-content {
+    flex-direction: column;
+    text-align: center;
+  }
+
+  .card-header-left {
+    gap: 10px;
+  }
+
+  .header-icon {
+    font-size: 20px;
+    padding: 6px;
+  }
+
+  .header-title {
+    font-size: 16px;
+  }
+
+  .header-subtitle {
+    font-size: 12px;
+  }
+}
+</style>
diff --git a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue
index 7032219d..7a0c4cd8 100644
--- a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumService.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { Clock, Coin, TrophyBase, WarningFilled } from '@element-plus/icons-vue';
 import { getPremiumTokenPackage } from '@/api/user';
-import { showProductPackage } from '@/utils/product-package.ts';
+import PremiumPackageInfo from './PremiumPackageInfo.vue';
+import PremiumUsageList from './PremiumUsageList.vue';
 
 // 尊享服务数据
 const loading = ref(false);
@@ -14,59 +14,8 @@ const packageData = ref<any>({
   expireDate: '', // 过期时间
 });
 
-// 计算属性
-const usagePercent = computed(() => {
-  if (packageData.value.totalQuota === 0)
-    return 0;
-  return Number(((packageData.value.usedQuota / packageData.value.totalQuota) * 100).toFixed(2));
-});
-
-const remainingPercent = computed(() => {
-  if (packageData.value.totalQuota === 0)
-    return 0;
-  return Number(((packageData.value.remainingQuota / packageData.value.totalQuota) * 100).toFixed(2));
-});
-
-// 获取进度条颜色（基于剩余百分比）
-const progressColor = computed(() => {
-  const percent = remainingPercent.value;
-  if (percent <= 10)
-    return '#f56c6c'; // 红色 - 剩余很少
-  if (percent <= 30)
-    return '#e6a23c'; // 橙色 - 剩余较少
-  return '#67c23a'; // 绿色 - 剩余充足
-});
-
-// 格式化数字 - 转换为万为单位
-function formatNumber(num: number): string {
-  if (num === 0)
-    return '0';
-  const wan = num / 10000;
-  // 保留2位小数，去掉末尾的0
-  return wan.toFixed(2).replace(/\.?0+$/, '');
-}
-
-// 格式化原始数字（带千分位）
-function formatRawNumber(num: number): string {
-  return num.toLocaleString();
-}
-/*
-前端已准备好，后端需要提供以下API：
-
-  接口地址: GET /account/premium/token-package
-
-返回数据格式:
-{
-  "success": true,
-  "data": {
-  "totalQuota": 1000000,       // 购买总额度
-    "usedQuota": 350000,          // 已使用额度
-    "remainingQuota": 650000,     // 剩余额度（可选，前端会自动计算）
-    "usagePercentage": 35,        // 使用百分比（可选）
-    "packageName": "尊享VIP套餐",  // 套餐名称（可选）
-    "expireDate": "2024-12-31"    // 过期时间（可选）
-}
-} */
+// 子组件引用
+const usageListRef = ref<InstanceType<typeof PremiumUsageList>>();
 
 // 获取尊享服务Token包数据
 async function fetchPremiumTokenPackage() {
@@ -103,434 +52,86 @@ async function fetchPremiumTokenPackage() {
   }
 }
 
-// 刷新数据
+// 刷新所有数据
 function refreshData() {
   fetchPremiumTokenPackage();
+  usageListRef.value?.refresh();
 }
 
 onMounted(() => {
   fetchPremiumTokenPackage();
 });
-
-function onProductPackage() {
-  showProductPackage();
-}
 </script>
 
 <template>
-  <div v-loading="loading" class="premium-service">
-    <div class="header">
-      <h2>
-        <el-icon><TrophyBase /></el-icon>
-        尊享服务
-      </h2>
-      <el-button
-        type="primary"
-        size="small"
-        @click="refreshData"
-      >
-        刷新数据
-      </el-button>
+  <div class="premium-service">
+    <!-- 套餐信息 -->
+    <div data-tour="premium-package-info">
+      <PremiumPackageInfo
+        :package-data="packageData"
+        :loading="loading"
+        @refresh="refreshData"
+      />
     </div>
 
-    <!-- 套餐信息卡片 -->
-    <el-card class="package-card" shadow="hover">
-      <template #header>
-        <div class="card-header">
-          <el-icon class="header-icon">
-            <Coin />
-          </el-icon>
-          <span class="header-title">{{ packageData.packageName }}</span>
-        </div>
-      </template>
-
-      <div class="package-content">
-        <!-- 统计数据 -->
-        <div class="stats-grid">
-          <div class="stat-item total">
-            <div class="stat-label">
-              购买总额度
-            </div>
-            <div class="stat-value">
-              {{ formatNumber(packageData.totalQuota) }}
-            </div>
-            <div class="stat-unit">
-              万 Tokens
-            </div>
-            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.totalQuota)} Tokens`">
-              ({{ formatRawNumber(packageData.totalQuota) }})
-            </div>
-          </div>
-
-          <div class="stat-item used">
-            <div class="stat-label">
-              已用额度
-            </div>
-            <div class="stat-value">
-              {{ formatNumber(packageData.usedQuota) }}
-            </div>
-            <div class="stat-unit">
-              万 Tokens
-            </div>
-            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.usedQuota)} Tokens`">
-              ({{ formatRawNumber(packageData.usedQuota) }})
-            </div>
-          </div>
-
-          <div class="stat-item remaining">
-            <div class="stat-label">
-              剩余额度
-            </div>
-            <div class="stat-value">
-              {{ formatNumber(packageData.remainingQuota) }}
-            </div>
-            <div class="stat-unit">
-              万 Tokens
-            </div>
-            <div class="stat-raw" :title="`原始值: ${formatRawNumber(packageData.remainingQuota)} Tokens`">
-              ({{ formatRawNumber(packageData.remainingQuota) }})
-            </div>
-          </div>
-        </div>
-
-        <!-- 进度条 -->
-        <div class="progress-section">
-          <div class="progress-header">
-            <span class="progress-label">剩余进度</span>
-            <span class="progress-percent" :style="{ color: progressColor }">
-              {{ remainingPercent }}%
-            </span>
-          </div>
-
-          <el-progress
-            :percentage="remainingPercent"
-            :color="progressColor"
-            :stroke-width="20"
-            :show-text="false"
-          />
-
-          <div class="progress-legend">
-            <div class="legend-item">
-              <span class="legend-dot " :style="{ background: progressColor }" />
-              <span class="legend-text">剩余: {{ remainingPercent }}%</span>
-            </div>
-            <div class="legend-item">
-              <span class="legend-dot used-dot" />
-              <span class="legend-text">已使用: {{ usagePercent }}%</span>
-            </div>
-          </div>
-        </div>
-
-        <!-- 购买提示卡片（额度不足时显示） -->
-        <el-card
-          v-if="remainingPercent < 20"
-          class="warning-card"
-          shadow="hover"
-        >
-          <div class="warning-content">
-            <el-icon class="warning-icon" color="#e6a23c">
-              <WarningFilled />
-            </el-icon>
-            <div class="warning-text">
-              <h3>额度即将用完</h3>
-              <p>您的Token额度已使用{{ usagePercent }}%，剩余额度较少，建议及时充值。</p>
-            </div>
-            <el-button type="warning" @click="onProductPackage()">
-              立即充值
-            </el-button>
-          </div>
-        </el-card>
-        <!-- 过期时间 -->
-        <div v-if="packageData.expireDate" class="expire-info">
-          <el-icon><Clock /></el-icon>
-          <span>有效期至: {{ packageData.expireDate }}</span>
-        </div>
-
-        <!-- 温馨提示 -->
-        <el-alert
-          class="tips-alert"
-          type="info"
-          :closable="false"
-          show-icon
-        >
-          <template #title>
-            <div class="tips-content">
-              <p>温馨提示：</p>
-              <ul>
-                <li>Token额度根据不同模型消耗速率不同</li>
-                <li>建议合理使用，避免额度过快消耗</li>
-                <li>额度不足时请及时充值，避免影响使用</li>
-              </ul>
-            </div>
-          </template>
-        </el-alert>
-      </div>
-    </el-card>
+    <!-- 额度明细列表 -->
+    <div class="usage-list-wrapper" data-tour="premium-usage-list">
+      <PremiumUsageList ref="usageListRef" />
+    </div>
   </div>
 </template>
 
-<style scoped>
+<style scoped lang="scss">
 .premium-service {
-  padding: 20px;
-  position: relative;
+  padding: 24px;
   height: 100%;
   overflow-y: auto;
+  background: linear-gradient(to bottom, #f8f9fa 0%, #ffffff 100%);
+
+  // 美化滚动条
+  &::-webkit-scrollbar {
+    width: 8px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: #f1f3f5;
+    border-radius: 4px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
+    border-radius: 4px;
+
+    &:hover {
+      background: linear-gradient(180deg, #5568d3 0%, #65408b 100%);
+    }
+  }
 }
 
-.header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 20px;
+.usage-list-wrapper {
+  margin-top: 24px;
+  animation: slideInUp 0.4s ease-out;
 }
 
-.header h2 {
-  display: flex;
-  align-items: center;
-  margin: 0;
-  font-size: 20px;
-  color: #333;
-}
-
-.header .el-icon {
-  margin-right: 8px;
-  color: #f59e0b;
-}
-
-/* 套餐卡片 */
-.package-card {
-  margin-bottom: 20px;
-  border-radius: 12px;
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
-}
-
-.card-header {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: 18px;
-  font-weight: 600;
-  color: #333;
-}
-
-.header-icon {
-  font-size: 20px;
-  color: #f59e0b;
-}
-
-.package-content {
-  display: flex;
-  flex-direction: column;
-  gap: 24px;
-}
-
-/* 统计数据网格 */
-.stats-grid {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 16px;
-}
-
-.stat-item {
-  padding: 20px;
-  border-radius: 8px;
-  text-align: center;
-  transition: transform 0.2s;
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  color: white;
-}
-
-.stat-item:hover {
-  transform: translateY(-4px);
-}
-
-.stat-item.total {
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-}
-
-.stat-item.used {
-  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
-}
-
-.stat-item.remaining {
-  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
-}
-
-.stat-label {
-  font-size: 14px;
-  opacity: 0.9;
-  margin-bottom: 8px;
-}
-
-.stat-value {
-  font-size: 28px;
-  font-weight: 700;
-  margin-bottom: 4px;
-}
-
-.stat-unit {
-  font-size: 12px;
-  opacity: 0.8;
-}
-
-.stat-raw {
-  font-size: 11px;
-  opacity: 0.7;
-  margin-top: 4px;
-  cursor: help;
-  transition: opacity 0.2s;
-}
-
-.stat-raw:hover {
-  opacity: 1;
-}
-
-/* 进度条部分 */
-.progress-section {
-  padding: 20px;
-  background: #f7f8fa;
-  border-radius: 8px;
-}
-
-.progress-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 12px;
-}
-
-.progress-label {
-  font-size: 16px;
-  font-weight: 600;
-  color: #333;
-}
-
-.progress-percent {
-  font-size: 20px;
-  font-weight: 700;
-}
-
-.progress-legend {
-  display: flex;
-  justify-content: center;
-  gap: 24px;
-  margin-top: 12px;
-}
-
-.legend-item {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.legend-dot {
-  width: 12px;
-  height: 12px;
-  border-radius: 50%;
-}
-
-.used-dot {
-  background: #409eff;
-}
-
-.remaining-dot {
-  background: #e4e7ed;
-}
-
-.legend-text {
-  font-size: 14px;
-  color: #606266;
-}
-
-/* 过期信息 */
-.expire-info {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 16px;
-  background: #f0f9ff;
-  border-radius: 6px;
-  color: #0369a1;
-  font-size: 14px;
-}
-
-/* 温馨提示 */
-.tips-alert {
-  border-radius: 8px;
-}
-
-.tips-content p {
-  margin: 0 0 8px 0;
-  font-weight: 600;
-}
-
-.tips-content ul {
-  margin: 0;
-  padding-left: 20px;
-}
-
-.tips-content li {
-  margin: 4px 0;
-  font-size: 13px;
-}
-
-/* 警告卡片 */
-.warning-card {
-  border-radius: 12px;
-  border: 2px solid #e6a23c;
-  background: #fef3e9;
-}
-
-.warning-content {
-  display: flex;
-  align-items: center;
-  gap: 16px;
-}
-
-.warning-icon {
-  font-size: 40px;
-  flex-shrink: 0;
-}
-
-.warning-text {
-  flex: 1;
-}
-
-.warning-text h3 {
-  margin: 0 0 8px 0;
-  color: #e6a23c;
-  font-size: 18px;
-}
-
-.warning-text p {
-  margin: 0;
-  color: #606266;
-  font-size: 14px;
+@keyframes slideInUp {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 
 /* 响应式布局 */
 @media (max-width: 768px) {
   .premium-service {
-    padding: 10px;
+    padding: 12px;
   }
 
-  .stats-grid {
-    grid-template-columns: 1fr;
-    gap: 12px;
-  }
-
-  .stat-value {
-    font-size: 24px;
-  }
-
-  .progress-legend {
-    flex-direction: column;
-    gap: 8px;
-  }
-
-  .warning-content {
-    flex-direction: column;
-    text-align: center;
+  .usage-list-wrapper {
+    margin-top: 16px;
   }
 }
 </style>
diff --git a/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumUsageList.vue b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumUsageList.vue
new file mode 100644
index 00000000..a9bf16e5
--- /dev/null
+++ b/Yi.Ai.Vue3/src/components/userPersonalCenter/components/PremiumUsageList.vue
@@ -0,0 +1,826 @@
+<script lang="ts" setup>
+import type { PremiumTokenUsageDto, PremiumTokenUsageQueryParams } from '@/api/user';
+import { Clock, Refresh } from '@element-plus/icons-vue';
+import { getPremiumTokenUsageList } from '@/api/user';
+
+// 额度明细列表
+const usageList = ref<PremiumTokenUsageDto[]>([]);
+const listLoading = ref(false);
+const totalCount = ref(0);
+
+// 查询参数
+const queryParams = ref<PremiumTokenUsageQueryParams>({
+  skipCount: 0,
+  maxResultCount: 10,
+});
+
+// 当前页码
+const currentPage = ref(1);
+const pageSize = ref(10);
+
+// 筛选条件
+const dateRange = ref<[Date, Date] | null>(null);
+const freeFilter = ref<boolean | null>(null);
+
+// 快捷时间选择
+const shortcuts = [
+  {
+    text: '最近一周',
+    value: () => {
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+      return [start, end];
+    },
+  },
+  {
+    text: '最近一个月',
+    value: () => {
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+      return [start, end];
+    },
+  },
+  {
+    text: '最近三个月',
+    value: () => {
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+      return [start, end];
+    },
+  },
+];
+
+// 格式化数字 - 转换为万为单位
+function formatNumber(num: number): string {
+  if (num === 0)
+    return '0';
+  const wan = num / 10000;
+  return wan.toFixed(2).replace(/\.?0+$/, '');
+}
+
+// 格式化日期时间
+function formatDateTime(dateTime: string): string {
+  return new Date(dateTime).toLocaleString('zh-CN', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+  });
+}
+
+// 获取使用率颜色
+function getUsageColor(used: number, total: number): string {
+  if (total === 0)
+    return '#e4e7ed';
+  const percent = (used / total) * 100;
+  if (percent >= 90)
+    return '#f56c6c'; // 红色
+  if (percent >= 70)
+    return '#e6a23c'; // 橙色
+  return '#409eff'; // 蓝色
+}
+
+// 获取额度明细列表
+async function fetchUsageList(resetPage = false) {
+  if (resetPage) {
+    currentPage.value = 1;
+  }
+
+  listLoading.value = true;
+  try {
+    const params: PremiumTokenUsageQueryParams = {
+      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);
+
+    const res = await getPremiumTokenUsageList(params);
+    console.log('后端返回结果:', res);
+
+    if (res.data) {
+      usageList.value = res.data.items || [];
+      totalCount.value = res.data.totalCount || 0;
+    }
+  }
+  catch (error) {
+    console.error('获取额度明细列表失败:', error);
+    ElMessage.error('获取额度明细列表失败');
+    usageList.value = [];
+    totalCount.value = 0;
+  }
+  finally {
+    listLoading.value = false;
+  }
+}
+
+// 处理分页
+function handlePageChange(page: number) {
+  console.log('切换页码:', page);
+  currentPage.value = page;
+  fetchUsageList();
+}
+
+// 处理每页大小变化
+function handleSizeChange(size: number) {
+  console.log('修改每页大小:', size);
+  pageSize.value = size;
+  queryParams.value.maxResultCount = size;
+  currentPage.value = 1;
+  fetchUsageList();
+}
+
+// 处理排序（使用 OrderByColumn 和 IsAsc）
+function handleSortChange({ prop, order }: { prop: string; order: string | null }) {
+  console.log('排序变化:', { prop, order });
+  if (order) {
+    queryParams.value.orderByColumn = prop;
+    queryParams.value.isAsc = order === 'ascending' ? 'ascending' : 'descending';
+  }
+  else {
+    queryParams.value.orderByColumn = undefined;
+    queryParams.value.isAsc = undefined;
+  }
+  fetchUsageList(true);
+}
+
+// 处理时间筛选
+function handleDateChange(value: [Date, Date] | null) {
+  console.log('时间筛选变化:', value);
+  if (value && value.length === 2) {
+    // 设置开始时间为当天00:00:00
+    const startDate = new Date(value[0]);
+    startDate.setHours(0, 0, 0, 0);
+
+    // 设置结束时间为当天23:59:59
+    const endDate = new Date(value[1]);
+    endDate.setHours(23, 59, 59, 999);
+
+    queryParams.value.startTime = startDate.toISOString();
+    queryParams.value.endTime = endDate.toISOString();
+    console.log('时间范围:', {
+      start: queryParams.value.startTime,
+      end: queryParams.value.endTime,
+    });
+  }
+  else {
+    queryParams.value.startTime = undefined;
+    queryParams.value.endTime = undefined;
+  }
+  fetchUsageList(true); // 重置到第一页并获取数据
+}
+
+// 重置筛选
+function resetFilters() {
+  console.log('重置所有筛选条件');
+  dateRange.value = null;
+  freeFilter.value = null;
+
+  // 重置后端查询参数
+  queryParams.value = {
+    maxResultCount: pageSize.value,
+    orderByColumn: undefined,
+    isAsc: undefined,
+    startTime: undefined,
+    endTime: undefined,
+    isFree: undefined,
+  };
+
+  fetchUsageList(true);
+}
+
+// 处理是否免费筛选
+function handleFreeFilterChange(value: boolean | null) {
+  console.log('是否免费筛选:', value);
+  queryParams.value.isFree = value === null ? undefined : value;
+  fetchUsageList(true);
+}
+
+// 判断是否有活动的筛选条件
+const hasActiveFilters = computed(() => {
+  return !!dateRange.value || freeFilter.value !== null;
+});
+
+// 对外暴露刷新方法
+defineExpose({
+  refresh: fetchUsageList,
+});
+
+onMounted(() => {
+  fetchUsageList();
+});
+</script>
+
+<template>
+  <el-card v-loading="listLoading" class="usage-list-card" shadow="hover">
+    <template #header>
+      <div class="list-header">
+        <div class="header-left">
+          <el-icon class="header-icon">
+            <i-ep-document />
+          </el-icon>
+          <div class="header-text">
+            <span class="header-title">尊享包额度明细</span>
+            <!--            <span class="header-subtitle">Premium Package Usage Details</span> -->
+          </div>
+        </div>
+        <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>
+        </div>
+      </div>
+    </template>
+
+    <!-- 筛选工具栏 -->
+    <div class="filter-toolbar">
+      <div class="filter-row">
+        <div class="filter-item">
+          <el-date-picker
+            v-model="dateRange"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            size="default"
+            :shortcuts="shortcuts"
+            class="date-picker"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            :editable="false"
+            @change="handleDateChange"
+          />
+        </div>
+
+        <div class="filter-item">
+          <el-select
+            v-model="freeFilter"
+            placeholder="全部类型"
+            clearable
+            size="default"
+            class="free-select"
+            @change="handleFreeFilterChange"
+          >
+            <el-option label="免费" :value="true" />
+            <el-option label="付费" :value="false" />
+          </el-select>
+        </div>
+
+        <div class="filter-actions">
+          <el-button
+            v-if="hasActiveFilters"
+            size="default"
+            @click="resetFilters"
+          >
+            <el-icon><i-ep-refresh-left /></el-icon>
+            重置
+          </el-button>
+          <el-button
+            type="primary"
+            size="default"
+            :icon="Refresh"
+            @click="fetchUsageList"
+          >
+            刷新
+          </el-button>
+        </div>
+      </div>
+    </div>
+
+    <!-- 数据表格 -->
+    <el-table
+      :data="usageList"
+      stripe
+      class="usage-table"
+      empty-text="暂无数据"
+      border
+      @sort-change="handleSortChange"
+    >
+      <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">
+              <i-ep-box />
+            </el-icon>
+            <span>{{ row.packageName }}</span>
+          </div>
+        </template>
+      </el-table-column>
+
+      <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>
+            <span class="token-unit">万</span>
+          </div>
+        </template>
+      </el-table-column>
+
+      <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>
+            <span class="token-unit">万</span>
+          </div>
+        </template>
+      </el-table-column>
+
+      <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
+              class="token-value"
+              :style="{ color: row.remainingTokens > 0 ? '#67c23a' : '#f56c6c', fontWeight: '600' }"
+            >
+              {{ formatNumber(row.remainingTokens) }}
+            </span>
+            <span class="token-unit">万</span>
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="使用率" min-width="130" align="center" header-align="center" resizable>
+        <template #default="{ row }">
+          <div class="usage-progress-cell">
+            <el-progress
+              :percentage="row.totalTokens > 0 ? Number(((row.usedTokens / row.totalTokens) * 100).toFixed(1)) : 0"
+              :color="getUsageColor(row.usedTokens, row.totalTokens)"
+              :stroke-width="8"
+              :show-text="true"
+              :text-inside="false"
+            >
+              <template #default="{ percentage }">
+                <span class="percentage-text">{{ percentage }}%</span>
+              </template>
+            </el-progress>
+          </div>
+        </template>
+      </el-table-column>
+
+      <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 align="center" header-align="center" resizable>
+        <template #default="{ row }">
+          <el-tag :type="row.isActive ? 'success' : 'info'" size="small" effect="dark">
+            {{ row.isActive ? '激活' : '未激活' }}
+          </el-tag>
+        </template>
+      </el-table-column>
+
+      <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">
+              <Clock />
+            </el-icon>
+            <span>{{ formatDateTime(row.expireDateTime) }}</span>
+          </div>
+          <span v-else class="no-data">-</span>
+        </template>
+      </el-table-column>
+
+      <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>
+      </el-table-column>
+    </el-table>
+
+    <!-- 空状态 -->
+    <div v-if="!usageList.length && !listLoading" class="empty-container">
+      <el-empty :description="hasActiveFilters ? '当前筛选条件下无数据' : '暂无明细记录'">
+        <el-button v-if="hasActiveFilters" type="primary" @click="resetFilters">
+          清除筛选
+        </el-button>
+      </el-empty>
+    </div>
+
+    <!-- 分页 -->
+    <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="totalCount"
+        layout="total, sizes, prev, pager, next, jumper"
+        prev-text="上一页"
+        next-text="下一页"
+        @size-change="handleSizeChange"
+        @current-change="handlePageChange"
+      />
+    </div>
+  </el-card>
+</template>
+
+<style scoped lang="scss">
+/* 额度明细列表卡片 */
+.usage-list-card {
+  border-radius: 16px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+  border: 1px solid #f0f2f5;
+  transition: all 0.3s;
+
+  &:hover {
+    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.12);
+    border-color: #667eea;
+  }
+
+  :deep(.el-card__header) {
+    background: linear-gradient(to bottom, #fafbfc 0%, #ffffff 100%);
+    border-bottom: 2px solid #f0f2f5;
+  }
+}
+
+.list-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+}
+
+.list-header .header-left {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.header-icon {
+  font-size: 24px;
+  color: #f59e0b;
+  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
+  padding: 8px;
+  border-radius: 8px;
+}
+
+.header-text {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.header-title {
+  font-size: 18px;
+  font-weight: 700;
+  color: #1a1a1a;
+}
+
+.header-subtitle {
+  font-size: 13px;
+  color: #909399;
+}
+
+.header-right {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.count-tag {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 16px;
+  font-weight: 600;
+  border-radius: 20px;
+
+  .el-icon {
+    font-size: 14px;
+  }
+}
+
+/* 筛选工具栏 */
+.filter-toolbar {
+  margin-bottom: 20px;
+  padding: 20px;
+  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
+  border-radius: 12px;
+  border: 1px solid #e8eaed;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.filter-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  align-items: center;
+}
+
+.filter-tip {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 12px;
+  padding: 8px 12px;
+  background: #fff;
+  border-radius: 4px;
+  font-size: 13px;
+  color: #606266;
+  border-left: 3px solid #409eff;
+}
+
+.filter-item {
+  flex: 0 0 auto;
+}
+
+.date-picker {
+  width: 320px;
+}
+
+.free-select {
+  width: 140px;
+}
+
+.filter-actions {
+  margin-left: auto;
+  display: flex;
+  gap: 8px;
+}
+
+/* 表格样式 */
+.usage-table {
+  width: 100%;
+}
+
+.package-name-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.package-icon {
+  font-size: 16px;
+  flex-shrink: 0;
+}
+
+.usage-progress-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 12px;
+}
+
+.usage-progress-cell :deep(.el-progress) {
+  flex: 1;
+}
+
+.usage-progress-cell :deep(.el-progress__text) {
+  font-size: 13px !important;
+  font-weight: 600;
+  min-width: 45px;
+  text-align: right;
+}
+
+.percentage-text {
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.token-cell {
+  display: flex;
+  align-items: baseline;
+  gap: 4px;
+  justify-content: center;
+}
+
+.token-value {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+}
+
+.token-unit {
+  font-size: 12px;
+  color: #909399;
+}
+
+.amount-cell {
+  font-weight: 600;
+  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;
+  gap: 6px;
+  color: #606266;
+}
+
+.expire-icon {
+  font-size: 14px;
+  color: #909399;
+}
+
+.remark-cell {
+  color: #606266;
+  font-size: 13px;
+}
+
+.no-data {
+  color: #c0c4cc;
+}
+
+/* 空状态 */
+.empty-container {
+  padding: 40px 0;
+}
+
+/* 分页容器 */
+.pagination-container {
+  margin-top: 20px;
+  padding: 20px 0;
+  display: flex;
+  justify-content: center;
+  border-top: 2px solid #f0f2f5;
+
+  :deep(.el-pagination) {
+    gap: 8px;
+
+    .btn-prev,
+    .btn-next {
+      border-radius: 8px;
+      padding: 0 16px;
+      border: 1px solid #dcdfe6;
+      background: #fff;
+      font-weight: 500;
+
+      &:hover {
+        color: #667eea;
+        border-color: #667eea;
+        background: #f5f7fa;
+      }
+    }
+
+    .el-pager li {
+      border-radius: 8px;
+      min-width: 36px;
+      height: 36px;
+      line-height: 36px;
+      border: 1px solid transparent;
+      transition: all 0.3s;
+
+      &:hover {
+        color: #667eea;
+        background: #f5f7fa;
+      }
+
+      &.is-active {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: #fff;
+        border-color: transparent;
+      }
+    }
+
+    .el-pagination__sizes {
+      .el-select {
+        .el-input__wrapper {
+          border-radius: 8px;
+        }
+      }
+    }
+
+    .el-pagination__jump {
+      .el-input__wrapper {
+        border-radius: 8px;
+      }
+    }
+  }
+}
+
+/* 响应式布局 */
+@media (max-width: 768px) {
+  .list-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 12px;
+  }
+
+  .header-icon {
+    font-size: 20px;
+    padding: 6px;
+  }
+
+  .header-title {
+    font-size: 16px;
+  }
+
+  .header-subtitle {
+    font-size: 12px;
+  }
+
+  .header-right {
+    width: 100%;
+  }
+
+  .count-tag {
+    width: 100%;
+    justify-content: center;
+  }
+
+  /* 移动端筛选工具栏 */
+  .filter-toolbar {
+    padding: 16px;
+  }
+
+  .filter-row {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 10px;
+  }
+
+  .filter-item {
+    width: 100%;
+  }
+
+  .date-picker,
+  .free-select {
+    width: 100%;
+  }
+
+  .filter-actions {
+    margin-left: 0;
+    display: flex;
+    gap: 8px;
+  }
+
+  .filter-actions .el-button {
+    flex: 1;
+  }
+
+  /* 移动端分页 */
+  .pagination-container {
+    padding: 16px 0;
+  }
+
+  .pagination-container :deep(.el-pagination) {
+    flex-wrap: wrap;
+    justify-content: center;
+    gap: 6px;
+
+    .btn-prev,
+    .btn-next {
+      padding: 0 12px;
+      font-size: 13px;
+    }
+
+    .el-pager li {
+      min-width: 32px;
+      height: 32px;
+      line-height: 32px;
+      font-size: 13px;
+    }
+  }
+}
+
+/* 平板适配 */
+@media (min-width: 769px) and (max-width: 1024px) {
+  .filter-row {
+    gap: 10px;
+  }
+
+  .search-input {
+    width: 180px;
+  }
+
+  .date-picker {
+    width: 280px;
+  }
+}
+</style>
diff --git a/Yi.Ai.Vue3/src/hooks/useGuideTour.ts b/Yi.Ai.Vue3/src/hooks/useGuideTour.ts
new file mode 100644
index 00000000..24add702
--- /dev/null
+++ 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,
+  };
+}
diff --git a/Yi.Ai.Vue3/src/layouts/LayoutVertical/index.vue b/Yi.Ai.Vue3/src/layouts/LayoutVertical/index.vue
index 03b382d2..671d7c2b 100644
--- 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>
diff --git a/Yi.Ai.Vue3/src/layouts/components/Aside/index.vue b/Yi.Ai.Vue3/src/layouts/components/Aside/index.vue
index d1fd2c42..87e7efbe 100644
--- a/Yi.Ai.Vue3/src/layouts/components/Aside/index.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Aside/index.vue
@@ -385,5 +385,8 @@ function handleMenuCommand(command: string, item: ConversationItem<ChatSessionVo
   {
     z-index: 0 ;
   }
+  .conversation-group .sticky-title{
+    z-index: 0 ;
+  }
 }
 </style>
diff --git a/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue b/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue
index 5502fddc..d14ee6ef 100644
--- a/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue
+++ b/Yi.Ai.Vue3/src/layouts/components/Header/components/AnnouncementBtn.vue
@@ -1,35 +1,41 @@
 <script setup lang="ts">
-import { Bell } from '@element-plus/icons-vue'
-import { storeToRefs } from 'pinia'
-import { useAnnouncementStore } from '@/stores'
+import { Bell } from '@element-plus/icons-vue';
+import { storeToRefs } from 'pinia';
+import { useAnnouncementStore } from '@/stores';
 
-const announcementStore = useAnnouncementStore()
-const { announcements } = storeToRefs(announcementStore)
+const announcementStore = useAnnouncementStore();
+const { announcements } = storeToRefs(announcementStore);
 
-// 计算未读公告数量（最新公告）
+// 计算未读公告数量（系统公告数量）
 const unreadCount = computed(() => {
-  return announcements.value.filter(a => a.type === 'latest').length
-})
+  if (!Array.isArray(announcements.value))
+    return 0;
+  return announcements.value.filter(a => a.type === 'System').length;
+});
 
 // 打开公告弹窗
 function openAnnouncement() {
-  announcementStore.openDialog()
+  announcementStore.openDialog();
 }
 </script>
 
 <template>
-  <div class="announcement-btn-container">
+  <div class="announcement-btn-container" data-tour="announcement-btn">
     <el-badge
-      :value="unreadCount"
-      :hidden="unreadCount === 0"
-      :max="99"
+      is-dot
       class="announcement-badge"
     >
+      <!--      :value="unreadCount" -->
+      <!--      :hidden="unreadCount === 0" -->
+      <!--      :max="99" -->
       <div
         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>
@@ -41,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;
       }
     }
   }
diff --git a/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue b/Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue
index af4e9605..6c81ec5f 100644
--- 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"
diff --git a/Yi.Ai.Vue3/src/layouts/components/Header/components/TutorialBtn.vue b/Yi.Ai.Vue3/src/layouts/components/Header/components/TutorialBtn.vue
new file mode 100644
index 00000000..524ae1cd
--- /dev/null
+++ 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>
diff --git a/Yi.Ai.Vue3/src/layouts/components/Header/index.vue b/Yi.Ai.Vue3/src/layouts/components/Header/index.vue
index 40f63023..239624b4 100644
--- 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>
diff --git a/Yi.Ai.Vue3/src/pages/activity/detail.vue b/Yi.Ai.Vue3/src/pages/activity/detail.vue
index 249a8785..90a5aede 100644
--- 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'"
diff --git a/Yi.Ai.Vue3/src/pages/announcement/detail.vue b/Yi.Ai.Vue3/src/pages/announcement/detail.vue
index 17035801..7ddd4c29 100644
--- 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>
diff --git a/Yi.Ai.Vue3/src/pages/chat/layouts/chatDefaul/index.vue b/Yi.Ai.Vue3/src/pages/chat/layouts/chatDefaul/index.vue
index 6c77d854..25eab569 100644
--- 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,
diff --git a/Yi.Ai.Vue3/src/pages/chat/layouts/chatWithId/index.vue b/Yi.Ai.Vue3/src/pages/chat/layouts/chatWithId/index.vue
index c245087f..a24e1d60 100644
--- 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"
diff --git a/Yi.Ai.Vue3/src/stores/index.ts b/Yi.Ai.Vue3/src/stores/index.ts
index 71f27da4..cc1a71eb 100644
--- 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';
diff --git a/Yi.Ai.Vue3/src/stores/modules/announcement.ts b/Yi.Ai.Vue3/src/stores/modules/announcement.ts
index b30583a0..f10020a6 100644
--- a/Yi.Ai.Vue3/src/stores/modules/announcement.ts
+++ b/Yi.Ai.Vue3/src/stores/modules/announcement.ts
@@ -1,80 +1,65 @@
-import { defineStore } from 'pinia'
-import type { Activity, Announcement, CarouselItem } from '@/api'
+import type { AnnouncementLogDto } from '@/api';
+import { defineStore } from 'pinia';
 
-export type CloseType = 'today' | 'week' | 'permanent'
+export type CloseType = 'today' | 'permanent';
 
 export const useAnnouncementStore = defineStore(
   'announcement',
   () => {
     // 弹窗显示状态
-    const isDialogVisible = ref(false)
+    const isDialogVisible = ref(false);
 
-    // 公告数据
-    const carousels = ref<CarouselItem[]>([])
-    const activities = ref<Activity[]>([])
-    const announcements = ref<Announcement[]>([])
+    // 公告数据（统一存储所有公告）
+    const announcements = ref<AnnouncementLogDto[]>([]);
 
     // 关闭记录
-    const closeType = ref<CloseType | null>(null)
-    const closedAt = ref<number | null>(null)
+    const closeType = ref<CloseType | null>(null);
+    const closedAt = ref<number | null>(null);
 
     // 打开弹窗
     const openDialog = () => {
-      isDialogVisible.value = true
-    }
+      isDialogVisible.value = true;
+    };
 
     // 关闭弹窗
     const closeDialog = (type: CloseType) => {
-      isDialogVisible.value = false
-      closeType.value = type
-      closedAt.value = Date.now()
-    }
+      isDialogVisible.value = false;
+      closeType.value = type;
+      closedAt.value = Date.now();
+    };
 
     // 检查是否应该显示弹窗
     const shouldShowDialog = computed(() => {
       if (!closedAt.value || !closeType.value)
-        return true
+        return true;
 
-      const now = Date.now()
-      const elapsed = now - closedAt.value
+      const now = Date.now();
+      const elapsed = now - closedAt.value;
 
       if (closeType.value === 'permanent')
-        return false
+        return true;
 
       if (closeType.value === 'today') {
-        // 检查是否已过去一天（24小时）
-        return elapsed > 24 * 60 * 60 * 1000
-      }
-
-      if (closeType.value === 'week') {
         // 检查是否已过去一周（7天）
-        return elapsed > 7 * 24 * 60 * 60 * 1000
+        return elapsed > 7 * 24 * 60 * 60 * 1000;
       }
 
-      return true
-    })
+      return true;
+    });
 
     // 设置公告数据
-    const setAnnouncementData = (data: {
-      carousels: CarouselItem[]
-      activities: Activity[]
-      announcements: Announcement[]
-    }) => {
-      carousels.value = data.carousels
-      activities.value = data.activities
-      announcements.value = data.announcements
-    }
+    const setAnnouncementData = (data: AnnouncementLogDto[]) => {
+      announcements.value = data;
+    };
 
     // 重置关闭状态（用于测试或管理员重置）
     const resetCloseStatus = () => {
-      closeType.value = null
-      closedAt.value = null
-    }
+      closeType.value = null;
+      closedAt.value = null;
+    };
 
     return {
       isDialogVisible,
-      carousels,
-      activities,
       announcements,
       closeType,
       closedAt,
@@ -83,12 +68,12 @@ export const useAnnouncementStore = defineStore(
       closeDialog,
       setAnnouncementData,
       resetCloseStatus,
-    }
+    };
   },
   {
     persist: {
-      // 只持久化关闭状态相关的数据
+      // 只持久化关闭状态相关的数据，公告数据不缓存
       paths: ['closeType', 'closedAt'],
     },
   },
-)
+);
diff --git a/Yi.Ai.Vue3/src/stores/modules/guideTour.ts b/Yi.Ai.Vue3/src/stores/modules/guideTour.ts
new file mode 100644
index 00000000..fcdb116b
--- /dev/null
+++ 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,
+  };
+});
diff --git a/Yi.Ai.Vue3/src/styles/guide-tour.scss b/Yi.Ai.Vue3/src/styles/guide-tour.scss
new file mode 100644
index 00000000..3c3fdac8
--- /dev/null
+++ 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;
+}
diff --git a/Yi.Ai.Vue3/src/styles/index.scss b/Yi.Ai.Vue3/src/styles/index.scss
index 184e6ab7..df4238d5 100644
--- 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;
 }
diff --git a/Yi.Ai.Vue3/types/components.d.ts b/Yi.Ai.Vue3/types/components.d.ts
index f3d68c9b..ecb90f84 100644
--- 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,12 +19,12 @@ 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']
+    ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
     ElDialog: typeof import('element-plus/es')['ElDialog']
     ElDivider: typeof import('element-plus/es')['ElDivider']
     ElEmpty: typeof import('element-plus/es')['ElEmpty']
@@ -38,8 +37,10 @@ declare module 'vue' {
     ElMain: typeof import('element-plus/es')['ElMain']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
+    ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElProgress: typeof import('element-plus/es')['ElProgress']
+    ElSelect: typeof import('element-plus/es')['ElSelect']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
@@ -56,7 +57,9 @@ declare module 'vue' {
     ModelSelect: typeof import('./../src/components/ModelSelect/index.vue')['default']
     NavDialog: typeof import('./../src/components/userPersonalCenter/NavDialog.vue')['default']
     Popover: typeof import('./../src/components/Popover/index.vue')['default']
+    PremiumPackageInfo: typeof import('./../src/components/userPersonalCenter/components/PremiumPackageInfo.vue')['default']
     PremiumService: typeof import('./../src/components/userPersonalCenter/components/PremiumService.vue')['default']
+    PremiumUsageList: typeof import('./../src/components/userPersonalCenter/components/PremiumUsageList.vue')['default']
     ProductPackage: typeof import('./../src/components/ProductPackage/index.vue')['default']
     QrCodeLogin: typeof import('./../src/components/LoginDialog/components/QrCodeLogin/index.vue')['default']
     RechargeLog: typeof import('./../src/components/userPersonalCenter/components/RechargeLog.vue')['default']
diff --git a/Yi.Ai.Vue3/系统公告API接口文档.md b/Yi.Ai.Vue3/系统公告API接口文档.md
deleted file mode 100644
index 416276b7..00000000
--- a/Yi.Ai.Vue3/系统公告API接口文档.md
+++ /dev/null
@@ -1,232 +0,0 @@
-# 系统公告 API 接口文档
-
-## 概述
-
-本文档定义了系统公告和活动功能所需的后端API接口。包括公告弹窗数据、活动详情、公告详情三个主要接口。
-
----
-
-## 1. 获取系统公告和活动数据
-
-### 接口信息
-
-- **路径**: `GET /announcement/system`
-- **描述**: 获取系统公告弹窗所需的所有数据，包括轮播图、活动列表、公告列表
-- **权限**: 无需登录即可访问
-
-### 响应数据结构
-
-```typescript
-{
-  "success": true,
-  "data": {
-    "carousels": [
-      {
-        "id": 1,
-        "imageUrl": "https://example.com/carousel/1.jpg",
-        "link": "https://example.com/activity/1",
-        "title": "新年活动"
-      }
-    ],
-    "activities": [
-      {
-        "id": 1,
-        "title": "新年特惠活动",
-        "description": "参与活动即可获得丰厚奖励",
-        "content": "<p>活动详细内容HTML格式</p>",
-        "coverImage": "https://example.com/activity/cover1.jpg",
-        "startTime": "2025-01-01T00:00:00Z",
-        "endTime": "2025-01-31T23:59:59Z",
-        "status": "active",
-        "createdAt": "2025-01-01T00:00:00Z",
-        "updatedAt": "2025-01-02T00:00:00Z"
-      }
-    ],
-    "announcements": [
-      {
-        "id": 1,
-        "title": "系统升级公告",
-        "content": "<p>系统将于今晚进行维护升级</p>",
-        "type": "latest",
-        "isImportant": true,
-        "publishTime": "2025-01-05T10:00:00Z",
-        "createdAt": "2025-01-05T09:00:00Z",
-        "updatedAt": "2025-01-05T10:00:00Z"
-      }
-    ]
-  },
-  "message": "获取成功"
-}
-```
-
-### 字段说明
-
-#### carousels（轮播图）
-
-| 字段 | 类型 | 必填 | 说明 |
-|------|------|------|------|
-| id | number/string | 是 | 轮播图ID |
-| imageUrl | string | 是 | 图片URL |
-| link | string | 否 | 点击跳转链接 |
-| title | string | 否 | 轮播图标题 |
-
-#### activities（活动）
-
-| 字段 | 类型 | 必填 | 说明 |
-|------|------|------|------|
-| id | number/string | 是 | 活动ID |
-| title | string | 是 | 活动标题 |
-| description | string | 是 | 活动简介 |
-| content | string | 是 | 活动详细内容（HTML格式） |
-| coverImage | string | 否 | 封面图URL |
-| startTime | string | 否 | 开始时间（ISO 8601格式） |
-| endTime | string | 否 | 结束时间（ISO 8601格式） |
-| status | string | 是 | 状态：active(进行中), inactive(未开始), expired(已结束) |
-| createdAt | string | 是 | 创建时间（ISO 8601格式） |
-| updatedAt | string | 否 | 更新时间（ISO 8601格式） |
-
-#### announcements（公告）
-
-| 字段 | 类型 | 必填 | 说明 |
-|------|------|------|------|
-| id | number/string | 是 | 公告ID |
-| title | string | 是 | 公告标题 |
-| content | string | 是 | 公告内容（HTML格式） |
-| type | string | 是 | 类型：latest(最新公告), history(历史公告) |
-| isImportant | boolean | 否 | 是否重要公告（显示警告图标） |
-| publishTime | string | 是 | 发布时间（ISO 8601格式） |
-| createdAt | string | 是 | 创建时间（ISO 8601格式） |
-| updatedAt | string | 否 | 更新时间（ISO 8601格式） |
-
----
-
-## 2. 获取活动详情
-
-### 接口信息
-
-- **路径**: `GET /announcement/activity/{id}`
-- **描述**: 获取单个活动的详细信息
-- **权限**: 无需登录即可访问
-
-### 请求参数
-
-| 参数 | 位置 | 类型 | 必填 | 说明 |
-|------|------|------|------|------|
-| id | path | string/number | 是 | 活动ID |
-
-### 响应数据结构
-
-```typescript
-{
-  "success": true,
-  "data": {
-    "id": 1,
-    "title": "新年特惠活动",
-    "description": "参与活动即可获得丰厚奖励",
-    "content": "<p>活动详细内容HTML格式...</p>",
-    "coverImage": "https://example.com/activity/cover1.jpg",
-    "startTime": "2025-01-01T00:00:00Z",
-    "endTime": "2025-01-31T23:59:59Z",
-    "status": "active",
-    "createdAt": "2025-01-01T00:00:00Z",
-    "updatedAt": "2025-01-02T00:00:00Z",
-    "views": 1234,
-    "participantCount": 567
-  },
-  "message": "获取成功"
-}
-```
-
-### 额外字段说明
-
-| 字段 | 类型 | 必填 | 说明 |
-|------|------|------|------|
-| views | number | 否 | 浏览次数 |
-| participantCount | number | 否 | 参与人数 |
-
----
-
-## 3. 获取公告详情
-
-### 接口信息
-
-- **路径**: `GET /announcement/detail/{id}`
-- **描述**: 获取单个公告的详细信息
-- **权限**: 无需登录即可访问
-
-### 请求参数
-
-| 参数 | 位置 | 类型 | 必填 | 说明 |
-|------|------|------|------|------|
-| id | path | string/number | 是 | 公告ID |
-
-### 响应数据结构
-
-```typescript
-{
-  "success": true,
-  "data": {
-    "id": 1,
-    "title": "系统升级公告",
-    "content": "<p>系统将于今晚进行维护升级，预计时间为晚上10点至次日凌晨2点...</p>",
-    "type": "latest",
-    "isImportant": true,
-    "publishTime": "2025-01-05T10:00:00Z",
-    "createdAt": "2025-01-05T09:00:00Z",
-    "updatedAt": "2025-01-05T10:00:00Z",
-    "views": 5678
-  },
-  "message": "获取成功"
-}
-```
-
-### 额外字段说明
-
-| 字段 | 类型 | 必填 | 说明 |
-|------|------|------|------|
-| views | number | 否 | 浏览次数 |
-
----
-
-## 错误响应
-
-所有接口在出错时应返回统一的错误格式：
-
-```typescript
-{
-  "success": false,
-  "data": null,
-  "message": "错误描述信息",
-  "errorCode": "ERROR_CODE" // 可选的错误码
-}
-```
-
-### 常见错误码
-
-| 状态码 | 说明 |
-|--------|------|
-| 404 | 资源不存在 |
-| 500 | 服务器内部错误 |
-
----
-
-## 注意事项
-
-1. **时间格式**: 所有时间字段使用 ISO 8601 格式（如：`2025-01-05T10:00:00Z`）
-2. **HTML内容**: content 字段包含HTML格式的内容，前端会进行渲染，请确保内容安全，防止XSS攻击
-3. **图片URL**: 所有图片URL应该是完整的可访问地址
-4. **状态管理**: 活动状态（active/inactive/expired）应该根据当前时间和活动时间自动判断
-5. **公告分类**: 公告的 type 字段（latest/history）可以根据发布时间自动分类，或由管理员手动指定
-6. **浏览统计**: views 字段建议在每次访问详情页时自动递增
-
----
-
-## 前端状态管理
-
-前端使用 Pinia 管理公告弹窗的显示状态：
-
-- **今日关闭**: 24小时内不再显示
-- **本周关闭**: 7天内不再显示
-- **关闭公告**: 永久不再显示（除非用户清除浏览器缓存）
-
-这些状态存储在浏览器的 localStorage 中，不需要后端接口支持。
diff --git a/Yi.Ai.Vue3/系统公告功能使用说明.md b/Yi.Ai.Vue3/系统公告功能使用说明.md
deleted file mode 100644
index 0d832488..00000000
--- a/Yi.Ai.Vue3/系统公告功能使用说明.md
+++ /dev/null
@@ -1,337 +0,0 @@
-# 系统公告功能使用说明
-
-## 功能概述
-
-本次更新为项目添加了完整的系统公告弹窗功能，包括活动展示、公告通知、轮播图等。用户可以通过不同的关闭选项来控制弹窗的显示频率。
-
----
-
-## 已实现的功能
-
-### 1. 系统公告弹窗
-
-- **自动弹出**: 用户进入应用时自动检测并显示公告弹窗
-- **手动打开**: 右上角有公告按钮（铃铛图标），随时可以点击打开公告弹窗
-- **未读提示**: 公告按钮上显示红色徽章，标识最新公告数量
-- **Tab切换**: 支持"活动"和"公告"两个Tab页面
-- **关闭选项**: 提供三种关闭方式
-  - 今日关闭：24小时内不再自动弹出，但仍可通过按钮手动打开
-  - 本周关闭：7天内不再自动弹出，但仍可通过按钮手动打开
-  - 关闭公告：永久不再自动弹出（除非清除浏览器缓存），但仍可通过按钮手动打开
-
-### 2. 活动页面
-
-- **轮播图**: 顶部展示活动轮播图，支持自动播放
-- **活动列表**: 显示所有活动，包含标题、简介、状态标签
-- **状态标识**:
-  - 进行中：绿色标签
-  - 已结束：灰色标签
-- **查看详情**: 点击可跳转到活动详情页面
-
-### 3. 公告页面
-
-- **最新公告**: 顶部显示最新发布的公告，带蓝色边框高亮
-- **重要标识**: 重要公告显示警告图标
-- **历史公告**: 使用时间线形式展示历史公告
-- **查看详情**: 点击可跳转到公告详情页面
-
-### 4. 详情页面
-
-#### 活动详情页面
-- 活动标题和状态
-- 浏览次数和参与人数
-- 活动封面图
-- 活动简介
-- 活动时间信息（开始、结束、发布、更新时间）
-- 完整的活动内容（支持HTML格式）
-
-#### 公告详情页面
-- 公告标题和类型
-- 重要公告标识（带动画效果）
-- 浏览次数
-- 发布时间
-- 完整的公告内容（支持HTML格式）
-- 创建和更新时间
-
----
-
-## 文件结构
-
-```
-Yi.Ai.Vue3/
-├── src/
-│   ├── api/
-│   │   └── announcement/
-│   │       ├── index.ts          # API接口定义
-│   │       └── types.ts          # TypeScript类型定义
-│   ├── components/
-│   │   └── SystemAnnouncementDialog/
-│   │       └── index.vue         # 系统公告弹窗组件
-│   ├── layouts/
-│   │   └── components/
-│   │       └── Header/
-│   │           ├── components/
-│   │           │   └── AnnouncementBtn.vue  # 公告按钮组件（新增）
-│   │           └── index.vue     # Header组件（已更新）
-│   ├── pages/
-│   │   ├── activity/
-│   │   │   └── detail.vue        # 活动详情页面
-│   │   └── announcement/
-│   │       └── detail.vue        # 公告详情页面
-│   ├── stores/
-│   │   └── modules/
-│   │       └── announcement.ts   # 公告状态管理
-│   ├── data/
-│   │   └── mockAnnouncementData.ts  # 模拟数据
-│   ├── routers/
-│   │   └── modules/
-│   │       └── staticRouter.ts   # 路由配置（已更新）
-│   ├── utils/
-│   │   └── request.ts            # HTTP请求工具（已修复Pinia初始化问题）
-│   └── App.vue                   # 主应用文件（已更新）
-├── 系统公告API接口文档.md          # API接口文档
-└── 系统公告功能使用说明.md          # 本文档
-```
-
----
-
-## 如何使用
-
-### 开发环境测试（使用模拟数据）
-
-1. **导入模拟数据**
-
-在 `src/App.vue` 中临时替换API调用：
-
-```typescript
-// 导入模拟数据函数
-import { getMockSystemAnnouncements } from '@/data/mockAnnouncementData'
-
-// 替换 getSystemAnnouncements() 为 getMockSystemAnnouncements()
-onMounted(async () => {
-  if (announcementStore.shouldShowDialog) {
-    try {
-      // 使用模拟数据
-      const res = await getMockSystemAnnouncements()
-      if (res.data) {
-        announcementStore.setAnnouncementData(res.data)
-        announcementStore.openDialog()
-      }
-    }
-    catch (error) {
-      console.error('获取系统公告失败:', error)
-    }
-  }
-})
-```
-
-2. **同样的方式更新详情页面**
-
-在 `src/pages/activity/detail.vue` 和 `src/pages/announcement/detail.vue` 中也可以使用模拟数据函数进行测试。
-
-3. **启动开发服务器**
-
-```bash
-npm run dev
-```
-
-4. **测试功能**
-
-- 打开浏览器访问应用
-- 应该会自动弹出系统公告弹窗
-- 测试不同的关闭选项
-- 点击"查看详情"按钮测试跳转
-
-### 生产环境部署（使用真实API）
-
-1. **后端实现API接口**
-
-参考 `系统公告API接口文档.md` 实现以下三个接口：
-- `GET /announcement/system` - 获取系统公告数据
-- `GET /announcement/activity/{id}` - 获取活动详情
-- `GET /announcement/detail/{id}` - 获取公告详情
-
-2. **确认API调用**
-
-确保 `src/App.vue` 和详情页面使用的是真实的API函数（默认配置）：
-- `getSystemAnnouncements()`
-- `getActivityDetail(id)`
-- `getAnnouncementDetail(id)`
-
-3. **构建部署**
-
-```bash
-npm run build
-```
-
----
-
-## 自定义配置
-
-### 修改关闭时间
-
-在 `src/stores/modules/announcement.ts` 中修改时间计算逻辑：
-
-```typescript
-const shouldShowDialog = computed(() => {
-  // ... 现有代码
-
-  if (closeType.value === 'today') {
-    // 修改为其他时间，如12小时
-    return elapsed > 12 * 60 * 60 * 1000
-  }
-
-  if (closeType.value === 'week') {
-    // 修改为其他时间，如3天
-    return elapsed > 3 * 24 * 60 * 60 * 1000
-  }
-
-  // ... 现有代码
-})
-```
-
-### 修改弹窗样式
-
-在 `src/components/SystemAnnouncementDialog/index.vue` 中修改样式：
-
-- 修改弹窗宽度：`width="700px"` 改为其他值
-- 修改轮播图高度：`height="250px"` 改为其他值
-- 修改CSS样式：在 `<style>` 部分进行调整
-
-### 添加新的Tab页
-
-1. 在弹窗组件中添加新的 `<el-tab-pane>`
-2. 添加对应的数据类型定义
-3. 更新API接口和store
-
----
-
-## 管理功能
-
-### 手动触发弹窗
-
-用户可以通过以下方式打开公告弹窗：
-
-1. **点击右上角公告按钮**（推荐）
-   - 位于Header右侧的铃铛图标
-   - 显示未读公告数量的红色徽章
-   - 点击即可打开公告弹窗
-
-2. **在代码中手动调用**
-
-在任何组件中可以手动打开公告弹窗：
-
-```typescript
-import { useAnnouncementStore } from '@/stores'
-
-const announcementStore = useAnnouncementStore()
-
-// 打开弹窗
-announcementStore.openDialog()
-```
-
-### 重置关闭状态
-
-如果需要重置用户的关闭状态（例如有重要公告需要强制显示）：
-
-```typescript
-// 重置关闭状态
-announcementStore.resetCloseStatus()
-
-// 然后重新打开弹窗
-announcementStore.openDialog()
-```
-
-### 查看当前状态
-
-```typescript
-const announcementStore = useAnnouncementStore()
-
-// 查看是否应该显示弹窗
-console.log(announcementStore.shouldShowDialog)
-
-// 查看关闭类型
-console.log(announcementStore.closeType)
-
-// 查看关闭时间
-console.log(announcementStore.closedAt)
-```
-
----
-
-## 注意事项
-
-1. **XSS防护**: 公告和活动内容使用 `v-html` 渲染，请确保后端返回的HTML内容是安全的，建议进行内容过滤和转义。
-
-2. **图片资源**: 轮播图和封面图需要可访问的URL地址，建议使用CDN。
-
-3. **性能优化**:
-   - 弹窗数据会在应用启动时加载，确保接口响应快速
-   - 考虑添加加载状态和错误处理
-
-4. **响应式设计**: 当前设计主要针对PC端，如需移动端适配，需要调整样式和布局。
-
-5. **浏览器兼容**: 使用了现代CSS特性，建议在主流现代浏览器中使用。
-
-6. **状态持久化**: 关闭状态存储在 localStorage 中，清除浏览器缓存会重置状态。
-
----
-
-## 后续优化建议
-
-1. **数据统计**: 添加打点统计，记录用户查看公告的行为
-2. **推送通知**: 对重要公告支持浏览器推送通知
-3. **多语言支持**: 支持国际化（i18n）
-4. **个性化推荐**: 根据用户兴趣推荐相关活动
-5. **评论功能**: 允许用户对活动和公告进行评论
-6. **分享功能**: 支持将活动和公告分享到社交媒体
-7. **搜索功能**: 添加公告和活动的搜索功能
-8. **管理后台**: 开发管理后台用于创建和管理公告活动
-
----
-
-## 技术栈
-
-- **Vue 3.5.17**: 核心框架，使用 Composition API
-- **TypeScript**: 类型安全
-- **Element Plus**: UI组件库
-- **Pinia**: 状态管理，支持持久化
-- **Vue Router 4**: 路由管理
-- **Vite**: 构建工具
-
----
-
-## 问题排查
-
-### 弹窗不显示
-
-1. 检查 `announcementStore.shouldShowDialog` 的值
-2. 检查API是否返回数据
-3. 查看浏览器控制台是否有错误
-4. 尝试调用 `announcementStore.resetCloseStatus()` 重置状态
-
-### 详情页面404
-
-1. 确认路由配置是否正确
-2. 检查路由名称是否匹配
-3. 确认ID参数是否正确传递
-
-### 样式显示异常
-
-1. 检查Element Plus是否正确安装
-2. 确认 SCSS 预处理器是否配置
-3. 清除浏览器缓存重试
-
----
-
-## 联系支持
-
-如有问题或建议，请通过以下方式联系：
-
-- GitHub Issues
-- 项目文档
-- 技术支持团队
-
----
-
-**祝使用愉快！**
diff --git a/Yi.Ai.Vue3/系统公告功能更新日志.md b/Yi.Ai.Vue3/系统公告功能更新日志.md
deleted file mode 100644
index 05f10f85..00000000
--- a/Yi.Ai.Vue3/系统公告功能更新日志.md
+++ /dev/null
@@ -1,177 +0,0 @@
-# 系统公告功能更新日志
-
-## 2025-01-05 - 完整功能实现
-
-### 新增功能
-
-#### 1. 系统公告弹窗
-- ✅ 自动弹出机制：应用启动时自动检测并显示
-- ✅ 双Tab设计：活动页和公告页分离展示
-- ✅ 三种关闭模式：今日关闭、本周关闭、永久关闭
-- ✅ 状态持久化：关闭状态保存到localStorage
-
-#### 2. 活动展示
-- ✅ 轮播图组件：支持多图轮播、自动播放
-- ✅ 活动列表：展示活动标题、简介、状态
-- ✅ 状态标签：进行中（绿色）、已结束（灰色）
-- ✅ 活动详情页：完整的活动信息展示
-
-#### 3. 公告展示
-- ✅ 最新公告区：高亮显示最新发布的公告
-- ✅ 重要标识：重要公告显示警告图标（带动画）
-- ✅ 历史公告：时间线形式展示历史公告
-- ✅ 公告详情页：完整的公告内容展示
-
-#### 4. 右上角公告入口（新增）
-- ✅ 铃铛图标按钮：位于Header右侧
-- ✅ 未读徽章：显示最新公告数量的红色徽章
-- ✅ 随时可访问：即使关闭自动弹窗后也能手动打开
-- ✅ 悬停效果：鼠标悬停时图标变色
-
-### 技术实现
-
-#### API接口（3个）
-1. `GET /announcement/system` - 获取系统公告数据
-2. `GET /announcement/activity/{id}` - 获取活动详情
-3. `GET /announcement/detail/{id}` - 获取公告详情
-
-#### 核心组件（3个）
-1. `SystemAnnouncementDialog` - 系统公告弹窗
-2. `AnnouncementBtn` - 公告按钮
-3. 活动和公告详情页
-
-#### 状态管理
-- Pinia Store：`announcementStore`
-- 持久化：localStorage（仅存储关闭状态）
-- 响应式数据：轮播图、活动、公告列表
-
-#### 路由配置
-- `/activity/:id` - 活动详情
-- `/announcement/:id` - 公告详情
-
-### 文件变更
-
-#### 新增文件（11个）
-```
-src/api/announcement/index.ts
-src/api/announcement/types.ts
-src/stores/modules/announcement.ts
-src/components/SystemAnnouncementDialog/index.vue
-src/layouts/components/Header/components/AnnouncementBtn.vue
-src/pages/activity/detail.vue
-src/pages/announcement/detail.vue
-src/data/mockAnnouncementData.ts
-系统公告API接口文档.md
-系统公告功能使用说明.md
-系统公告功能更新日志.md (本文件)
-```
-
-#### 修改文件（5个）
-```
-src/api/index.ts - 导出announcement模块
-src/stores/index.ts - 导出announcementStore
-src/routers/modules/staticRouter.ts - 添加详情页路由
-src/layouts/components/Header/index.vue - 添加公告按钮
-src/utils/request.ts - 修复Pinia初始化问题
-src/App.vue - 集成系统公告弹窗
-```
-
-### 问题修复
-
-#### 1. Pinia初始化错误
-**问题**：`getActivePinia() was called but there was no active Pinia`
-
-**原因**：在 `request.ts` 的 `jwtPlugin()` 函数中，在模块加载时就调用了 `useUserStore()`，此时 Pinia 还未初始化。
-
-**解决方案**：将 `useUserStore()` 的调用从函数开始移到各个钩子函数内部（`beforeRequest`、`afterResponse`、`onError`），确保只在实际请求时才调用 store。
-
-#### 2. storeToRefs未定义
-**问题**：`storeToRefs is not defined`
-
-**原因**：在 `SystemAnnouncementDialog/index.vue` 中使用了 `storeToRefs` 但忘记导入。
-
-**解决方案**：添加 `import { storeToRefs } from 'pinia'`
-
-### 功能亮点
-
-1. **智能弹窗机制**
-   - 首次访问自动弹出
-   - 支持三种关闭模式
-   - 即使关闭后仍可通过按钮手动打开
-
-2. **优雅的UI设计**
-   - 响应式布局
-   - 平滑过渡动画
-   - Element Plus组件库
-   - SCSS样式编写
-
-3. **完善的类型定义**
-   - TypeScript类型安全
-   - 接口类型定义完整
-   - IDE智能提示友好
-
-4. **灵活的数据来源**
-   - 支持真实API接口
-   - 提供模拟数据用于测试
-   - 易于切换
-
-5. **用户友好**
-   - 右上角固定入口
-   - 未读徽章提示
-   - 查看详情便捷
-
-### 待优化项
-
-1. **移动端适配**
-   - 当前主要针对PC端设计
-   - 需要优化移动端显示效果
-
-2. **国际化支持**
-   - 添加i18n多语言支持
-
-3. **性能优化**
-   - 图片懒加载
-   - 虚拟滚动（公告列表很长时）
-
-4. **功能扩展**
-   - 公告搜索功能
-   - 评论功能
-   - 分享到社交媒体
-   - 推送通知
-
-5. **数据统计**
-   - 浏览量统计
-   - 用户行为分析
-   - 点击率跟踪
-
-### 使用指南
-
-详细使用说明请查看：
-- 📖 [系统公告功能使用说明.md](./系统公告功能使用说明.md)
-- 📝 [系统公告API接口文档.md](./系统公告API接口文档.md)
-
-### 开发测试
-
-使用模拟数据进行测试：
-
-```typescript
-// 在 src/App.vue 中
-import { getMockSystemAnnouncements } from '@/data/mockAnnouncementData'
-
-// 使用模拟数据
-const res = await getMockSystemAnnouncements()
-```
-
-### 生产部署
-
-1. 后端实现三个API接口
-2. 确认前端使用真实API（默认配置）
-3. 执行构建命令：`npm run build`
-4. 部署dist目录
-
----
-
-**开发团队**：Claude Code
-**版本**：v1.0.0
-**日期**：2025-01-05
-**状态**：✅ 已完成并测试