You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
765 lines
22 KiB
765 lines
22 KiB
import { Ionicons } from '@expo/vector-icons';
|
|
import { LinearGradient } from 'expo-linear-gradient';
|
|
import { useRouter } from 'expo-router';
|
|
import {
|
|
ActivityIndicator,
|
|
Pressable,
|
|
ScrollView,
|
|
StyleSheet,
|
|
Text,
|
|
View,
|
|
} from 'react-native';
|
|
import { SafeAreaView } from 'react-native-safe-area-context';
|
|
import { useProfileData } from '../../src/hooks';
|
|
import { UNSET_LABEL } from '../../src/constants';
|
|
import { Avatar } from '../../components/onboarding/ui/Avatar';
|
|
import { isAvatarPreset } from '../../components/onboarding/assets';
|
|
import { useRole } from '../../src/context/RoleContext';
|
|
import { colors, headerGradientSolid } from '../../src/theme';
|
|
import type { Badge, DimensionScore, EnterpriseEntry, JobPreference, MenuItem, UserStats } from '../../src/types';
|
|
|
|
/* ===================== 展示层映射（全部使用主题令牌） ===================== */
|
|
|
|
/** 维度等级 → 展示配置（优秀=品牌蓝，良好=灰色） */
|
|
const DIMENSION_LEVEL: Record<
|
|
DimensionScore['level'],
|
|
{ label: string; bar: string; bg: string; text: string }
|
|
> = {
|
|
excellent: { label: '优秀', bar: colors.primary, bg: colors.primaryLight, text: colors.primaryDark },
|
|
good: { label: '良好', bar: colors.textHint, bg: colors.pageBg, text: colors.textSecondary },
|
|
};
|
|
|
|
/** 求职偏好字段 → 展示标签 */
|
|
const PREF_ITEMS: { key: keyof JobPreference; label: string }[] = [
|
|
{ key: 'position', label: '期望职位' },
|
|
{ key: 'city', label: '期望城市' },
|
|
{ key: 'salary', label: '期望薪资' },
|
|
{ key: 'workType', label: '工作类型' },
|
|
{ key: 'status', label: '求职状态' },
|
|
];
|
|
|
|
/** 功能菜单 → 图标底色（浅）与图标色（深），区分不同菜单避免单调 */
|
|
const MENU_ICON_THEME: Record<string, { bg: string; color: string }> = {
|
|
resume: { bg: colors.primaryLight, color: colors.primaryDark },
|
|
favorites: { bg: colors.actionLight, color: colors.actionText },
|
|
history: { bg: colors.infoLight, color: colors.infoText },
|
|
compare: { bg: colors.primaryLight, color: colors.primaryBtn },
|
|
'offer-compare': { bg: colors.actionLight, color: colors.actionText },
|
|
assessment: { bg: colors.successLight, color: colors.successText },
|
|
interview: { bg: colors.infoLight, color: colors.infoText },
|
|
rank: { bg: colors.primaryLight, color: colors.primaryText },
|
|
'hr-evaluation': { bg: colors.actionLight, color: colors.actionText },
|
|
onboarding: { bg: colors.successLight, color: colors.successText },
|
|
'skill-cloud': { bg: colors.successLight, color: colors.successText },
|
|
salary: { bg: colors.primaryLight, color: colors.primaryBtn },
|
|
progress: { bg: colors.infoLight, color: colors.infoText },
|
|
game: { bg: colors.successLight, color: colors.successText },
|
|
legal: { bg: colors.primaryLight, color: colors.primaryDark },
|
|
'job-publish': { bg: colors.actionLight, color: colors.actionText },
|
|
'job-evaluations': { bg: colors.successLight, color: colors.successText },
|
|
'candidate-detail': { bg: colors.infoLight, color: colors.infoText },
|
|
'interview-score': { bg: colors.actionLight, color: colors.actionText },
|
|
'job-management': { bg: colors.primaryLight, color: colors.primary },
|
|
'talent-recommendation': { bg: colors.infoLight, color: colors.infoText },
|
|
'enterprise-chat': { bg: colors.successLight, color: colors.successText },
|
|
'operation-rules': { bg: colors.primaryLight, color: colors.primaryText },
|
|
'audit-report': { bg: colors.infoLight, color: colors.infoText },
|
|
'enterprise-certification': { bg: colors.primaryLight, color: colors.primary },
|
|
};
|
|
function getMenuIconBg(id: string): string {
|
|
return MENU_ICON_THEME[id]?.bg ?? colors.primaryLight;
|
|
}
|
|
function getMenuIconColor(id: string): string {
|
|
return MENU_ICON_THEME[id]?.color ?? colors.primaryDark;
|
|
}
|
|
|
|
/* ===================== 子组件 ===================== */
|
|
|
|
/** 单个维度评分行（横向评分条） */
|
|
function DimensionRow({ dimension }: { dimension: DimensionScore }) {
|
|
const theme = DIMENSION_LEVEL[dimension.level];
|
|
return (
|
|
<View style={styles.dimRow}>
|
|
<Text style={styles.dimName}>{dimension.name}</Text>
|
|
<View style={styles.dimTrack}>
|
|
<View style={[styles.dimFill, { width: `${dimension.score}%`, backgroundColor: theme.bar }]} />
|
|
</View>
|
|
<Text style={styles.dimScore}>{dimension.score}</Text>
|
|
<View style={[styles.levelTag, { backgroundColor: theme.bg }]}>
|
|
<Text style={[styles.levelTagText, { color: theme.text }]}>{theme.label}</Text>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/** 单个勋章卡片（已获得=彩色，未获得=灰色+进度条） */
|
|
function BadgeCard({ badge }: { badge: Badge }) {
|
|
return (
|
|
<View style={styles.badgeCard}>
|
|
<Text style={[styles.badgeIcon, !badge.obtained && styles.badgeIconLocked]}>
|
|
{badge.icon}
|
|
</Text>
|
|
<Text style={[styles.badgeTitle, !badge.obtained && styles.badgeTitleLocked]}>
|
|
{badge.title}
|
|
</Text>
|
|
<Text style={styles.badgeDesc}>{badge.description}</Text>
|
|
{badge.obtained ? (
|
|
<View style={styles.badgeObtainedTag}>
|
|
<Text style={styles.badgeObtainedText}>已获得</Text>
|
|
</View>
|
|
) : (
|
|
<>
|
|
<View style={styles.badgeProgressTrack}>
|
|
<View
|
|
style={[
|
|
styles.badgeProgressFill,
|
|
{ width: `${((badge.progress ?? 0) / (badge.target ?? 1)) * 100}%` },
|
|
]}
|
|
/>
|
|
</View>
|
|
<Text style={styles.badgeProgressText}>
|
|
{badge.progress}/{badge.target}
|
|
</Text>
|
|
</>
|
|
)}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/** 用户统计数据行 */
|
|
function StatsRow({ stats }: { stats: UserStats }) {
|
|
const items: { key: keyof UserStats; label: string }[] = [
|
|
{ key: 'deliveries', label: '投递' },
|
|
{ key: 'favorites', label: '收藏' },
|
|
{ key: 'chats', label: '沟通' },
|
|
{ key: 'offers', label: 'Offer' },
|
|
];
|
|
return (
|
|
<View style={styles.statsCard}>
|
|
{items.map((item, index) => {
|
|
const isLast = index === items.length - 1;
|
|
return (
|
|
<View key={item.key} style={[styles.statItem, isLast && styles.statItemLast]}>
|
|
<Text style={styles.statValue}>{stats[item.key]}</Text>
|
|
<Text style={styles.statLabel}>{item.label}</Text>
|
|
</View>
|
|
);
|
|
})}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/** 切换到企业端卡片 */
|
|
function EnterpriseEntryCard({ entry }: { entry: EnterpriseEntry }) {
|
|
const router = useRouter();
|
|
const { setRole } = useRole();
|
|
return (
|
|
<Pressable
|
|
style={styles.enterpriseCard}
|
|
onPress={() => {
|
|
setRole('enterprise');
|
|
router.replace('/(enterprise)/enterprise-overview');
|
|
}}
|
|
hitSlop={4}
|
|
>
|
|
<View style={styles.enterpriseIconWrap}>
|
|
<Ionicons name="business-outline" size={22} color={colors.primary} />
|
|
</View>
|
|
<View style={styles.enterpriseText}>
|
|
<Text style={styles.enterpriseTitle}>{entry.title}</Text>
|
|
<Text style={styles.enterpriseDesc}>{entry.description}</Text>
|
|
</View>
|
|
<Text style={styles.enterpriseAction}>{entry.action}</Text>
|
|
</Pressable>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* 我的页
|
|
*/
|
|
export default function ProfileScreen() {
|
|
const { role } = useRole();
|
|
const {
|
|
profile,
|
|
userStats,
|
|
overallScore,
|
|
dimensions,
|
|
preference,
|
|
badges,
|
|
menuItems,
|
|
enterpriseEntry,
|
|
loading,
|
|
error,
|
|
refresh,
|
|
} = useProfileData(role ?? 'candidate');
|
|
const router = useRouter();
|
|
|
|
// 错误态
|
|
if (error) {
|
|
return (
|
|
<SafeAreaView style={styles.safeArea} edges={['top']}>
|
|
<View style={styles.stateWrap}>
|
|
<Text style={styles.stateText}>加载失败，请重试</Text>
|
|
<Pressable style={styles.retryBtn} onPress={refresh}>
|
|
<Text style={styles.retryText}>重试</Text>
|
|
</Pressable>
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
// 加载态
|
|
if (loading || !profile || !userStats || !overallScore || !preference) {
|
|
return (
|
|
<SafeAreaView style={styles.safeArea} edges={['top']}>
|
|
<View style={styles.stateWrap}>
|
|
<ActivityIndicator size="large" color={colors.primary} />
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<SafeAreaView style={styles.safeArea} edges={['top']}>
|
|
<ScrollView
|
|
style={styles.scroll}
|
|
contentContainerStyle={styles.scrollContent}
|
|
showsVerticalScrollIndicator={false}
|
|
>
|
|
{/* 顶部渐变头部：标题 + 用户信息（随页面滚动） */}
|
|
<LinearGradient
|
|
colors={headerGradientSolid}
|
|
start={{ x: 0, y: 0 }}
|
|
end={{ x: 1, y: 1 }}
|
|
style={styles.headerGradient}
|
|
>
|
|
<View style={styles.headerRow}>
|
|
<Text style={styles.headerTitle}>我的</Text>
|
|
<Pressable onPress={() => router.push('/settings')} hitSlop={8}>
|
|
<Ionicons name="settings-outline" size={22} color={colors.textInverse} />
|
|
</Pressable>
|
|
</View>
|
|
<View style={styles.profileRow}>
|
|
{/* P21 选过头像就显示真实选择（预设素材 / 本地图片）；没选过才回落到姓名首字 */}
|
|
{profile.avatarKey ? (
|
|
<Avatar
|
|
name={isAvatarPreset(profile.avatarKey) ? profile.avatarKey : 'defaultAvatar'}
|
|
uri={isAvatarPreset(profile.avatarKey) ? null : profile.avatarKey}
|
|
size={60}
|
|
/>
|
|
) : (
|
|
<View style={styles.avatar}>
|
|
<Text style={styles.avatarText}>{profile.avatar}</Text>
|
|
</View>
|
|
)}
|
|
<View style={styles.profileInfo}>
|
|
{/* 姓名未采集（P6/P16 可跳过直接进入）时显示「未设置」，不显示别人的名字 */}
|
|
<Text style={styles.userName}>{profile.name || UNSET_LABEL}</Text>
|
|
{profile.bio !== '' && <Text style={styles.bio}>{profile.bio}</Text>}
|
|
</View>
|
|
</View>
|
|
</LinearGradient>
|
|
|
|
{/* 内容区 */}
|
|
<View style={styles.content}>
|
|
{/* 切换到企业端 */}
|
|
{enterpriseEntry ? <EnterpriseEntryCard entry={enterpriseEntry} /> : null}
|
|
|
|
{/* 用户统计 */}
|
|
<StatsRow stats={userStats} />
|
|
|
|
{/* 综合评分卡片 */}
|
|
<View style={styles.scoreCard}>
|
|
<Text style={styles.scoreValue}>
|
|
{overallScore.score}
|
|
<Text style={styles.scoreUnit}>分</Text>
|
|
</Text>
|
|
<View style={styles.scoreTag}>
|
|
<Text style={styles.scoreTagText}>{overallScore.level}</Text>
|
|
</View>
|
|
<Text style={styles.scoreRank}>{overallScore.rank}</Text>
|
|
</View>
|
|
|
|
{/* 八大维度评分 */}
|
|
<View style={styles.sectionHeader}>
|
|
<View style={styles.sectionBar} />
|
|
<Text style={[styles.sectionTitle, styles.sectionTitleGrow]}>八大维度评分</Text>
|
|
<Pressable onPress={() => router.push('/appeal')} hitSlop={6}>
|
|
<Text style={styles.sectionLink}>评分申诉</Text>
|
|
</Pressable>
|
|
</View>
|
|
<View style={styles.dimCard}>
|
|
{dimensions.map((dimension) => (
|
|
<DimensionRow key={dimension.id} dimension={dimension} />
|
|
))}
|
|
</View>
|
|
|
|
{/* 求职偏好 */}
|
|
<View style={styles.sectionHeader}>
|
|
<View style={styles.sectionBar} />
|
|
<Text style={[styles.sectionTitle, styles.sectionTitleGrow]}>求职偏好</Text>
|
|
<Pressable onPress={() => router.push('/job-preference')} hitSlop={6}>
|
|
<Text style={styles.sectionLink}>编辑</Text>
|
|
</Pressable>
|
|
</View>
|
|
<View style={styles.prefCard}>
|
|
{PREF_ITEMS.map(({ key, label }, index) => {
|
|
const value = preference[key];
|
|
const isLast = index === PREF_ITEMS.length - 1;
|
|
// 未采集到的项显示「未设置」，不拿空串冒充已填；也就不再显示状态圆点
|
|
const isUnset = value.trim() === '';
|
|
const display = isUnset ? UNSET_LABEL : value;
|
|
const isStatus = key === 'status' && !isUnset;
|
|
return (
|
|
<Pressable
|
|
key={key}
|
|
style={[styles.prefRow, isLast && styles.prefRowLast]}
|
|
onPress={() => router.push('/job-preference')}
|
|
>
|
|
<Text style={styles.prefLabel}>{label}</Text>
|
|
{isStatus ? (
|
|
<View style={styles.prefStatus}>
|
|
<View style={styles.prefStatusDot} />
|
|
<Text style={styles.prefStatusText}>{display}</Text>
|
|
</View>
|
|
) : (
|
|
<Text style={[styles.prefValue, isUnset && styles.prefValueUnset]}>
|
|
{display}
|
|
</Text>
|
|
)}
|
|
</Pressable>
|
|
);
|
|
})}
|
|
</View>
|
|
|
|
{/* 全部勋章 */}
|
|
<View style={styles.sectionHeader}>
|
|
<View style={styles.sectionBar} />
|
|
<Text style={[styles.sectionTitle, styles.sectionTitleGrow]}>全部勋章</Text>
|
|
</View>
|
|
<ScrollView
|
|
horizontal
|
|
showsHorizontalScrollIndicator={false}
|
|
style={styles.hScroll}
|
|
contentContainerStyle={styles.hScrollContent}
|
|
>
|
|
{badges.map((badge) => (
|
|
<BadgeCard key={badge.id} badge={badge} />
|
|
))}
|
|
</ScrollView>
|
|
|
|
{/* 功能菜单（简历 / 收藏 / 历史 / 岗位对比 / 测评 / 竞争力排名） */}
|
|
<View style={styles.sectionHeader}>
|
|
<View style={styles.sectionBar} />
|
|
<Text style={[styles.sectionTitle, styles.sectionTitleGrow]}>功能菜单</Text>
|
|
</View>
|
|
<View style={styles.menuCard}>
|
|
{menuItems.map((item: MenuItem, idx: number) => {
|
|
const isLast = idx === menuItems.length - 1;
|
|
return (
|
|
<Pressable
|
|
key={item.id}
|
|
style={[styles.menuRow, isLast && styles.menuRowLast]}
|
|
onPress={() => {
|
|
if (item.route) router.push(item.route);
|
|
}}
|
|
hitSlop={4}
|
|
>
|
|
<View style={[styles.menuIconWrap, { backgroundColor: getMenuIconBg(item.id) }]}>
|
|
<Ionicons name={item.icon as keyof typeof Ionicons.glyphMap} size={18} color={getMenuIconColor(item.id)} />
|
|
</View>
|
|
<Text style={styles.menuTitle}>{item.title}</Text>
|
|
<Ionicons name="chevron-forward" size={16} color={colors.textHint} />
|
|
</Pressable>
|
|
);
|
|
})}
|
|
</View>
|
|
</View>
|
|
</ScrollView>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
safeArea: {
|
|
flex: 1,
|
|
backgroundColor: colors.pageBg,
|
|
},
|
|
stateWrap: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
stateText: {
|
|
marginTop: 12,
|
|
fontSize: 14,
|
|
color: colors.textSecondary,
|
|
},
|
|
retryBtn: {
|
|
marginTop: 16,
|
|
paddingHorizontal: 24,
|
|
paddingVertical: 8,
|
|
borderRadius: 18,
|
|
backgroundColor: colors.primaryBtn,
|
|
},
|
|
retryText: {
|
|
fontSize: 13,
|
|
fontWeight: '600',
|
|
color: colors.white,
|
|
},
|
|
/* ---- 顶部渐变头部 ---- */
|
|
headerGradient: {
|
|
paddingHorizontal: 8,
|
|
paddingTop: 8,
|
|
paddingBottom: 24,
|
|
borderBottomLeftRadius: 24,
|
|
borderBottomRightRadius: 24,
|
|
},
|
|
headerRow: {
|
|
height: 40,
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
},
|
|
headerTitle: {
|
|
fontSize: 17,
|
|
fontWeight: '700',
|
|
color: colors.textInverse,
|
|
},
|
|
profileRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
marginTop: 8,
|
|
},
|
|
avatar: {
|
|
width: 60,
|
|
height: 60,
|
|
borderRadius: 30,
|
|
backgroundColor: colors.white,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
avatarText: {
|
|
fontSize: 26,
|
|
fontWeight: '700',
|
|
color: colors.primary,
|
|
},
|
|
profileInfo: {
|
|
marginLeft: 14,
|
|
},
|
|
userName: {
|
|
fontSize: 20,
|
|
fontWeight: '700',
|
|
color: colors.textInverse,
|
|
},
|
|
bio: {
|
|
marginTop: 6,
|
|
fontSize: 13,
|
|
color: colors.textInverse,
|
|
opacity: 0.85,
|
|
},
|
|
/* ---- 内容区 ---- */
|
|
scroll: {
|
|
flex: 1,
|
|
},
|
|
scrollContent: {
|
|
paddingBottom: 24,
|
|
},
|
|
content: {
|
|
paddingHorizontal: 8,
|
|
paddingTop: 16,
|
|
},
|
|
/* ---- 综合评分卡片 ---- */
|
|
scoreCard: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 16,
|
|
},
|
|
scoreValue: {
|
|
fontSize: 40,
|
|
fontWeight: '700',
|
|
color: colors.primaryDark,
|
|
},
|
|
scoreUnit: {
|
|
fontSize: 16,
|
|
fontWeight: '600',
|
|
color: colors.primaryDark,
|
|
},
|
|
scoreTag: {
|
|
marginLeft: 12,
|
|
backgroundColor: colors.primaryLight,
|
|
paddingHorizontal: 10,
|
|
paddingVertical: 4,
|
|
borderRadius: 12,
|
|
},
|
|
scoreTagText: {
|
|
fontSize: 13,
|
|
fontWeight: '600',
|
|
color: colors.primaryDark,
|
|
},
|
|
scoreRank: {
|
|
flex: 1,
|
|
textAlign: 'right',
|
|
marginLeft: 12,
|
|
fontSize: 13,
|
|
color: colors.textSecondary,
|
|
},
|
|
/* ---- 分区标题 ---- */
|
|
sectionHeader: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
marginTop: 24,
|
|
marginBottom: 12,
|
|
},
|
|
sectionBar: {
|
|
width: 4,
|
|
height: 16,
|
|
borderRadius: 2,
|
|
backgroundColor: colors.primary,
|
|
marginRight: 8,
|
|
},
|
|
sectionTitle: {
|
|
fontSize: 18,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
},
|
|
sectionTitleGrow: {
|
|
flex: 1,
|
|
},
|
|
sectionLink: {
|
|
fontSize: 13,
|
|
color: colors.primary,
|
|
},
|
|
/* ---- 八大维度（横向评分条） ---- */
|
|
dimCard: {
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 6,
|
|
},
|
|
dimRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
paddingVertical: 12,
|
|
},
|
|
dimName: {
|
|
width: 78,
|
|
fontSize: 13,
|
|
color: colors.textSecondary,
|
|
},
|
|
dimTrack: {
|
|
flex: 1,
|
|
height: 6,
|
|
borderRadius: 3,
|
|
backgroundColor: colors.border,
|
|
marginHorizontal: 12,
|
|
},
|
|
dimFill: {
|
|
height: 6,
|
|
borderRadius: 3,
|
|
},
|
|
dimScore: {
|
|
width: 28,
|
|
textAlign: 'right',
|
|
fontSize: 14,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
},
|
|
levelTag: {
|
|
marginLeft: 10,
|
|
paddingHorizontal: 8,
|
|
paddingVertical: 2,
|
|
borderRadius: 10,
|
|
},
|
|
levelTagText: {
|
|
fontSize: 11,
|
|
fontWeight: '600',
|
|
},
|
|
/* ---- 求职偏好 ---- */
|
|
prefCard: {
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 6,
|
|
},
|
|
prefRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
paddingVertical: 12,
|
|
borderBottomWidth: 1,
|
|
borderBottomColor: colors.borderLight,
|
|
},
|
|
prefRowLast: {
|
|
borderBottomWidth: 0,
|
|
},
|
|
prefLabel: {
|
|
fontSize: 14,
|
|
color: colors.textSecondary,
|
|
},
|
|
prefValue: {
|
|
fontSize: 14,
|
|
fontWeight: '600',
|
|
color: colors.textPrimary,
|
|
},
|
|
// 未采集态：弱化为占位符视觉，与真实填写的值区分开
|
|
prefValueUnset: {
|
|
fontWeight: '400',
|
|
color: colors.textHint,
|
|
},
|
|
prefStatus: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
},
|
|
prefStatusDot: {
|
|
width: 8,
|
|
height: 8,
|
|
borderRadius: 4,
|
|
backgroundColor: colors.success,
|
|
marginRight: 6,
|
|
},
|
|
prefStatusText: {
|
|
fontSize: 14,
|
|
fontWeight: '600',
|
|
color: colors.successText,
|
|
},
|
|
/* ---- 全部勋章 ---- */
|
|
hScroll: {
|
|
flexGrow: 0,
|
|
|
|
marginHorizontal: -8,
|
|
},
|
|
hScrollContent: {
|
|
paddingHorizontal: 8,
|
|
gap: 12,
|
|
},
|
|
badgeCard: {
|
|
width: 140,
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
padding: 16,
|
|
alignItems: 'center',
|
|
},
|
|
badgeIcon: {
|
|
fontSize: 32,
|
|
},
|
|
badgeIconLocked: {
|
|
opacity: 0.35,
|
|
},
|
|
badgeTitle: {
|
|
marginTop: 10,
|
|
fontSize: 14,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
},
|
|
badgeTitleLocked: {
|
|
color: colors.textHint,
|
|
},
|
|
badgeDesc: {
|
|
marginTop: 4,
|
|
fontSize: 12,
|
|
color: colors.textSecondary,
|
|
textAlign: 'center',
|
|
},
|
|
badgeObtainedTag: {
|
|
marginTop: 10,
|
|
backgroundColor: colors.successLight,
|
|
paddingHorizontal: 10,
|
|
paddingVertical: 3,
|
|
borderRadius: 10,
|
|
},
|
|
badgeObtainedText: {
|
|
fontSize: 11,
|
|
fontWeight: '600',
|
|
color: colors.successText,
|
|
},
|
|
badgeProgressTrack: {
|
|
width: '100%',
|
|
height: 4,
|
|
borderRadius: 2,
|
|
backgroundColor: colors.border,
|
|
marginTop: 12,
|
|
},
|
|
badgeProgressFill: {
|
|
height: 4,
|
|
borderRadius: 2,
|
|
backgroundColor: colors.primary,
|
|
},
|
|
badgeProgressText: {
|
|
marginTop: 6,
|
|
fontSize: 11,
|
|
color: colors.textHint,
|
|
},
|
|
/* ---- 用户统计 ---- */
|
|
statsCard: {
|
|
flexDirection: 'row',
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingVertical: 16,
|
|
marginBottom: 12,
|
|
},
|
|
statItem: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
borderRightWidth: StyleSheet.hairlineWidth,
|
|
borderRightColor: colors.borderLight,
|
|
},
|
|
statItemLast: { borderRightWidth: 0 },
|
|
statValue: { fontSize: 18, fontWeight: '800', color: colors.textPrimary },
|
|
statLabel: { fontSize: 12, color: colors.textSecondary, marginTop: 4 },
|
|
/* ---- 切换到企业端 ---- */
|
|
enterpriseCard: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 16,
|
|
marginBottom: 12,
|
|
},
|
|
enterpriseIconWrap: {
|
|
width: 44,
|
|
height: 44,
|
|
borderRadius: 12,
|
|
backgroundColor: colors.primaryLight,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
enterpriseText: { flex: 1, marginLeft: 12 },
|
|
enterpriseTitle: { fontSize: 15, fontWeight: '700', color: colors.textPrimary },
|
|
enterpriseDesc: { fontSize: 12, color: colors.textSecondary, marginTop: 3 },
|
|
enterpriseAction: { fontSize: 13, fontWeight: '600', color: colors.primaryDark },
|
|
/* ---- 功能菜单 ---- */
|
|
menuCard: {
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
paddingHorizontal: 16,
|
|
},
|
|
menuRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
paddingVertical: 14,
|
|
borderBottomWidth: StyleSheet.hairlineWidth,
|
|
borderBottomColor: colors.borderLight,
|
|
},
|
|
menuRowLast: {
|
|
borderBottomWidth: 0,
|
|
},
|
|
menuIconWrap: {
|
|
width: 32,
|
|
height: 32,
|
|
borderRadius: 8,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
marginRight: 12,
|
|
},
|
|
menuTitle: {
|
|
flex: 1,
|
|
fontSize: 14,
|
|
fontWeight: '500',
|
|
color: colors.textPrimary,
|
|
},
|
|
});
|
|
|