All checks were successful
Dev Deploy / Explore-Gitea-Actions (push) Successful in 24s
71 lines
3.1 KiB
TypeScript
71 lines
3.1 KiB
TypeScript
import UserSvg from '@/assets/icons/svg/ataver.svg';
|
||
import { ThemedText } from '@/components/ThemedText';
|
||
import { UserInfoDetails } from '@/types/user';
|
||
// import { Image } from 'expo-image';
|
||
import { Image, ScrollView, View } from 'react-native';
|
||
export default function UserInfo({ userInfo }: { userInfo: UserInfoDetails }) {
|
||
|
||
return (
|
||
<View className='flex flex-row items-center mt-[1rem] gap-[1rem]'>
|
||
{/* 用户名 */}
|
||
<View className='flex flex-col gap-4 w-[68vw]'>
|
||
<View className='flex flex-row items-center justify-between w-full'>
|
||
<View className='flex flex-row items-center gap-2'>
|
||
<ThemedText
|
||
className='max-w-[36vw] !text-textSecondary !font-semibold !text-2xl'
|
||
numberOfLines={1} // 限制为1行
|
||
ellipsizeMode="tail"
|
||
>
|
||
{userInfo?.user_info?.nickname}
|
||
</ThemedText>
|
||
<ScrollView
|
||
className='max-w-[26vw] '
|
||
horizontal // 水平滚动
|
||
showsHorizontalScrollIndicator={false} // 隐藏滚动条
|
||
contentContainerStyle={{
|
||
flexDirection: 'row',
|
||
gap: 8, // 间距,
|
||
alignItems: 'center',
|
||
}}
|
||
>
|
||
{
|
||
userInfo?.medal_infos?.map((item, index) => (
|
||
<Image
|
||
key={index}
|
||
source={{ uri: item.url }}
|
||
style={{ width: 24, height: 24 }}
|
||
/>
|
||
))
|
||
}
|
||
</ScrollView>
|
||
</View>
|
||
</View>
|
||
<ScrollView
|
||
className='max-w-[68vw]'
|
||
horizontal // 水平滚动
|
||
showsHorizontalScrollIndicator={false} // 隐藏滚动条
|
||
contentContainerStyle={{
|
||
flexDirection: 'row',
|
||
gap: 8 // 间距
|
||
}}
|
||
>
|
||
<ThemedText style={{ color: '#AC7E35', fontSize: 12, fontWeight: '600' }}>User ID:{userInfo?.user_info?.user_id}</ThemedText>
|
||
</ScrollView>
|
||
</View>
|
||
{/* 头像 */}
|
||
<View>
|
||
{userInfo?.user_info?.avatar_file_url
|
||
?
|
||
<Image
|
||
source={{ uri: "http://cdn.fairclip.cn/files/7348942720074911745/original_1752124481039_198d7b9a428c67f2bfd87ec128daad1b.jpg" }}
|
||
style={{ width: 80, height: 80, borderRadius: 40 }}
|
||
/>
|
||
:
|
||
<UserSvg width={80} height={80} />
|
||
}
|
||
</View>
|
||
</View >
|
||
);
|
||
}
|
||
|