@using Dpz.Core.EnumLibrary
@model Dpz.Core.Public.ViewModel.Steam.VmSteamGame
@if (Model == null || Model.Achievements == null || !Model.Achievements.Any())
{
<div class="blog-container">
<blockquote class="layui-elem-quote sitemap layui-breadcrumb shadow">
<a href="/" title="网站首页" data-pjax>网站首页</a>
<a asp-action="Index" data-pjax>Steam</a>
<a><cite>成就详情</cite></a>
</blockquote>
<div class="achievement-main">
<div class="steam-games">
<div class="steam-empty-state">
<i class="layui-icon layui-icon-face-cry empty-icon"></i>
<h3 class="empty-title">暂无成就数据</h3>
<p class="empty-description">该游戏暂未支持Steam成就系统,或成就数据正在加载中...</p>
<div class="empty-actions">
<a href="javascript:history.back()" class="layui-btn layui-btn-primary">
<i class="layui-icon layui-icon-return"></i> 返回游戏列表
</a>
</div>
</div>
</div>
</div>
</div>
}
else
{
var unlockedAchievements = Model.Achievements.Where(x => x.UnlockTime.HasValue).ToList();
var lockedAchievements = Model.Achievements.Where(x => !x.Hidden && x.UnlockTime == null).ToList();
var hiddenAchievements = Model.Achievements.Where(x => x.Hidden && x.UnlockTime == null).ToList();
var totalAchievements = Model.Achievements.Count;
var unlockedCount = unlockedAchievements.Count;
var progressPercentage = totalAchievements > 0 ? (decimal)unlockedCount / totalAchievements * 100 : 0;
<div class="blog-container">
<blockquote class="layui-elem-quote sitemap layui-breadcrumb shadow">
<a href="/" title="网站首页" data-pjax>网站首页</a>
<a asp-action="Index" data-pjax>Steam</a>
<a><cite>@Model.Name</cite></a>
</blockquote>
<div class="achievement-main">
<div class="steam-games">
<!-- 游戏信息头部 -->
<div class="game-card game-info-card">
<div class="game-content">
<img src="@Model.ImageLogo" alt="@Model.Name" class="game-logo-image"/>
<div class="game-info">
<div class="game-name">
<h2 class="game-title">@Model.Name</h2>
</div>
<div class="game-time">
<i class="layui-icon layui-icon-time game-playtime"></i>
游戏时长:<span class="game-playtime-text">@{
var time = TimeSpan.FromMinutes(Model.PlayTime);
}
@($"{time.TotalHours:00}小时{time.Minutes:00}分钟")</span>
</div>
</div>
</div>
<!-- 成就总体统计 -->
<div class="game-achievements">
<div class="achievement-summary achievement-summary-section">
<span>
<i class="layui-icon layui-icon-star-fill"
style="color: #fbbf24; margin-right: 0.5rem;"></i>
总体进度
</span>
<span class="progress-count">
<span class="stat-value unlocked">@unlockedCount</span> / @totalAchievements
</span>
<div class="achievement-progress progress-bar-container">
<div class="achievement-progress-bar"
style="width: @progressPercentage.ToString("F1")%"
data-progress="@progressPercentage.ToString("F1")"></div>
</div>
<span class="completion-rate">完成度:@progressPercentage.ToString("F1")%</span>
</div>
<div class="stats-numbers">
<div class="stat-item">
<div class="stat-value unlocked">@unlockedCount</div>
<div class="stat-label">已解锁</div>
</div>
<div class="stat-item">
<div class="stat-value locked">@lockedAchievements.Count</div>
<div class="stat-label">未解锁</div>
</div>
@if (hiddenAchievements.Any())
{
<div class="stat-item">
<div class="stat-value hidden">@hiddenAchievements.Count</div>
<div class="stat-label">隐藏</div>
</div>
}
</div>
<!-- 最近解锁的成就图标 -->
@if (unlockedAchievements.Any())
{
<div class="achievement-icons recent-achievements-section">
<div class="recent-achievements-label">最近解锁:</div>
<div class="recent-achievements-icons">
@foreach (var item in unlockedAchievements.OrderByDescending(x => x.UnlockTime).Take(6))
{
<div class="achievement-icon-item"
title="@item.DisplayName - @item.UnlockTime?.ToString("yyyy/MM/dd HH:mm")">
<img alt="@item.DisplayName" src="@item.Icon"/>
</div>
}
</div>
</div>
}
</div>
</div>
<!-- 成就分类展示 -->
<div class="achievements">
<!-- 已解锁成就 -->
@if (unlockedAchievements.Any())
{
<div class="layui-colla-item unlock achievement-category-section" data-category="unlocked">
<div class="achievement-category-header unlock-header category-toggle">
<h2 class="category-title unlock-title">
<i class="layui-icon layui-icon-ok-circle category-icon unlock-icon"></i>
已解锁成就
</h2>
<span class="category-badge unlock-badge">@unlockedCount 个</span>
<i class="layui-icon layui-icon-down toggle-icon"></i>
</div>
<div class="layui-colla-content category-content">
@foreach (var item in unlockedAchievements.OrderByDescending(x => x.UnlockTime))
{
<div class="item">
<div class="ach-icon">
<img src="@item.Icon" alt="@item.DisplayName" title="@item.DisplayName"/>
</div>
<div class="ach-desc">
<div class="game-info">
<div class="game-name">@item.DisplayName</div>
<div class="desc">@item.Description</div>
</div>
</div>
<div class="ach-un-lock">
<div class="un-lock">
<i class="layui-icon layui-icon-time unlock-time-display"></i>
@item.UnlockTime?.ToString("yyyy/MM/dd")
<br/>
<span class="unlock-time-detail">
@item.UnlockTime?.ToString("HH:mm")
</span>
</div>
</div>
</div>
}
</div>
</div>
}
<!-- 未解锁成就 -->
@if (lockedAchievements.Any())
{
<div class="layui-colla-item lock achievement-category-section" data-category="locked">
<div class="achievement-category-header lock-header category-toggle collapsed">
<h2 class="category-title lock-title">
<i class="layui-icon layui-icon-circle category-icon lock-icon"></i>
待解锁成就
</h2>
<span class="category-badge lock-badge">@lockedAchievements.Count 个</span>
<i class="layui-icon layui-icon-right toggle-icon"></i>
</div>
<div class="layui-colla-content category-content collapsed">
@foreach (var item in lockedAchievements)
{
<div class="item locked-achievement">
<div class="ach-icon">
<img src="@item.Icon" alt="@item.DisplayName" title="@item.DisplayName"/>
</div>
<div class="ach-desc">
<div class="game-info">
<div class="game-name">@item.DisplayName</div>
<div class="desc">@item.Description</div>
</div>
</div>
<div class="ach-un-lock">
<div class="un-lock locked-status-display">
<i class="layui-icon layui-icon-password locked-icon"></i>
未解锁
</div>
</div>
</div>
}
</div>
</div>
}
<!-- 隐藏成就 -->
@if (hiddenAchievements.Any())
{
<div class="layui-colla-item lock-hide achievement-category-section" data-category="hidden">
<div class="achievement-category-header hide-header category-toggle collapsed">
<h2 class="category-title hide-title">
<i class="layui-icon layui-icon-hide category-icon hide-icon"></i>
隐藏成就
</h2>
<span class="category-badge hide-badge">@hiddenAchievements.Count 个</span>
<i class="layui-icon layui-icon-right toggle-icon"></i>
</div>
<div class="layui-colla-content category-content collapsed">
@foreach (var item in hiddenAchievements)
{
<div class="item hidden-achievement">
<div class="ach-icon">
<img src="@item.Icon" alt="隐藏成就" title="隐藏成就"/>
</div>
<div class="ach-desc">
<div class="game-info">
<div class="game-name">隐藏成就</div>
<div class="desc">此成就的详细信息被隐藏,请在游戏中探索发现...</div>
</div>
</div>
<div class="ach-un-lock">
<div class="un-lock hidden-status-display">
<i class="layui-icon layui-icon-hide hidden-icon"></i>
隐藏
</div>
</div>
</div>
}
</div>
</div>
}
</div>
<!-- 返回按钮 -->
<div class="return-section">
<a asp-action="Index" data-pjax class="layui-btn layui-btn-primary return-button">
<i class="layui-icon layui-icon-return"></i> 返回游戏列表
</a>
</div>
<!-- 评论区域 -->
@{
var commentModel = (CommentNode.Steam, Model.Name);
}
<div class="comments-section">
<partial name="_GlobalCommentPartial" model="commentModel"/>
</div>
</div>
</div>
</div>
}