feat(CharacterDetail): 添加神器名称和图片显示功能

- 在 CharacterDetail 组件中添加神器图片和名称的显示逻辑
- 在 API接口中增加 arfName 和 arfPic 字段,用于获取神器信息
- 更新装备套装图片映射,添加护盾套装图片
This commit is contained in:
hxt
2025-05-29 20:54:18 +08:00
parent e16eb8e027
commit ca42e9e373
3 changed files with 15 additions and 2 deletions

View File

@@ -115,6 +115,8 @@ export interface HeroDetailResp {
efr: number;
hds: string;
ctr: string;
arfName: string;
arfPic: string;
}[];
}

View File

@@ -215,6 +215,7 @@ const setIconMap: Record<string, string> = {
'破灭': '/pic/eqset/setdestruction.png',
'暴击': '/pic/eqset/setcritical.png',
'伤口': '/pic/eqset/setinjury.png',
'护盾': '/pic/eqset/setprotection.png',
};
// 神器图片映射
@@ -581,10 +582,20 @@ const CharacterDetail: React.FC = () => {
</div>
{/* 神器图片 */}
<div className="flex-1 flex flex-col items-center justify-center">
<div className="w-24 h-24 rounded bg-[#2A211E] flex items-center justify-center text-3xl text-[#C17F59] mb-2">?</div>
{build.arfPic ? (
<img
src={build.arfPic}
alt={build.arfName || '神器图片'}
className="w-64 h-64 object-contain rounded mb-2"
/>
) : (
<div className="w-24 h-24 rounded bg-[#2A211E] flex items-center justify-center text-3xl text-[#C17F59] mb-2">?</div>
)}
</div>
{/* 神器名称 */}
<span className="text-[#E6B17E] font-bold text-base text-center mt-2"></span>
<span className="text-[#E6B17E] font-bold text-base text-center mt-2">
{build.arfName || '暂无神器数据'}
</span>
</div>
</div>
</div>