kever/epic-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ci: 添加 Epic UI 构建和部署工作流

Browse Source 
- 新增 CI/CD 工作流文件，实现前端项目的自动构建和部署
- 支持 main、master 和 develop 分支的自动构建- 包含代码检出、环境安装、依赖管理、项目构建等步骤
- 实现构建产物的自动部署和 Docker 容器重启
This commit is contained in:
hu xiaotong
2025-07-09 11:44:27 +08:00
parent c945c99174
commit d859e54902
1 changed files with 66 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
src/pages/Characters.tsx
View File

@@ -82,18 +82,24 @@ const Characters: React.FC = () => {
const [selectedRole, setSelectedRole] = useState<string>("all");
const [searchTerm, setSearchTerm] = useState<string>("");
const [heroes, setHeroes] = useState<ExtendedHero[]>([]);
const [loading, setLoading] = useState(true);
const navigate = useNavigate();
// 拉取英雄数据
useEffect(() => {
EpicApi.getHeroList().then(data => {
// console.log('Heroes:', data);
// 类型转换，假设 API 返回的数据包含所需的所有属性
const extendedData = data as ExtendedHero[];
setHeroes(extendedData);
setAllHeroes(extendedData);
});
setLoading(true);
EpicApi.getHeroList()
.then(data => {
const extendedData = data as ExtendedHero[];
setHeroes(extendedData);
setAllHeroes(extendedData);
})
.catch(() => {
setHeroes([]);
setAllHeroes([]);
})
.finally(() => setLoading(false));
}, []);
// 过滤逻辑
@@ -202,56 +208,63 @@ const Characters: React.FC = () => {
</div>
</div>
{filteredHeroes.length > 0 ? (
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-6">
{filteredHeroes.map((hero) => (
<div
key={hero.heroCode}
className="flex items-center bg-[#23201B] rounded-xl border border-[#C17F59]/30 hover:border-[#C17F59] transition-all duration-300 shadow-md px-4 py-3 min-h-[96px] max-h-[96px] cursor-pointer backdrop-blur-sm"
onClick={() => navigate(`/character/${hero.heroCode}`)}
>
{/* 头像+attr */}
<div className="relative mr-4 flex-shrink-0">
<img
src={hero.headImgUrl}
alt={hero.heroName}
className="w-16 h-16 rounded-full border-2 border-[#C17F59] object-cover object-center"
/>
<div className="absolute -top-2 -right-2">
{getElementIcon(hero.attribute)}
</div>
</div>
{/* 右侧信息 */}
<div className="flex flex-col justify-center flex-1 min-w-0">
<div className="flex items-center mb-1">
<span className="text-[16px] font-bold text-[#E6B17E]">{hero.heroName}</span>
</div>
<div className="flex items-center mb-1">
{renderStars(hero.stars)}
</div>
<div className="flex items-center text-[#C17F59] text-base font-medium">
{hero.role && (
<>
<span className="inline-flex items-center justify-center w-8 h-8 rounded-full bg-[#E6B17E] mr-2">
<img src={`/pic/role/${hero.role}.png`} alt={hero.role} className="w-6 h-6" />
</span>
<span className="align-middle">{ROLE_LABELS[hero.role] || hero.role}</span>
</>
)}
</div>
</div>
</div>
))}
{loading ? (
<div className="flex flex-col items-center justify-center py-16">
<span className="inline-block w-10 h-10 mb-4 border-4 border-[#C17F59] border-t-transparent rounded-full animate-spin"></span>
<div className="text-[#C17F59] text-lg font-medium">加载中...</div>
</div>
) : (
<div className="flex flex-col items-center justify-center py-16">
<div className="text-[#9B8579] text-xl font-medium mb-4">
暂无匹配的角色数据
filteredHeroes.length > 0 ? (
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-6">
{filteredHeroes.map((hero) => (
<div
key={hero.heroCode}
className="flex items-center bg-[#23201B] rounded-xl border border-[#C17F59]/30 hover:border-[#C17F59] transition-all duration-300 shadow-md px-4 py-3 min-h-[96px] max-h-[96px] cursor-pointer backdrop-blur-sm"
onClick={() => navigate(`/character/${hero.heroCode}`)}
>
{/* 头像+attr */}
<div className="relative mr-4 flex-shrink-0">
<img
src={hero.headImgUrl}
alt={hero.heroName}
className="w-16 h-16 rounded-full border-2 border-[#C17F59] object-cover object-center"
/>
<div className="absolute -top-2 -right-2">
{getElementIcon(hero.attribute)}
</div>
</div>
{/* 右侧信息 */}
<div className="flex flex-col justify-center flex-1 min-w-0">
<div className="flex items-center mb-1">
<span className="text-[16px] font-bold text-[#E6B17E]">{hero.heroName}</span>
</div>
<div className="flex items-center mb-1">
{renderStars(hero.stars)}
</div>
<div className="flex items-center text-[#C17F59] text-base font-medium">
{hero.role && (
<>
<span className="inline-flex items-center justify-center w-8 h-8 rounded-full bg-[#E6B17E] mr-2">
<img src={`/pic/role/${hero.role}.png`} alt={hero.role} className="w-6 h-6" />
</span>
<span className="align-middle">{ROLE_LABELS[hero.role] || hero.role}</span>
</>
)}
</div>
</div>
</div>
))}
</div>
<div className="text-[#7A6B5F] text-sm">
请尝试调整搜索条件或筛选条件
) : (
<div className="flex flex-col items-center justify-center py-16">
<div className="text-[#9B8579] text-xl font-medium mb-4">
暂无匹配的角色数据
</div>
<div className="text-[#7A6B5F] text-sm">
请尝试调整搜索条件或筛选条件
</div>
</div>
</div>
)
)}
</div>
</div>