Files
bw-expo-app/components/ErrorRetry.tsx
imeepos b9399bf4cf feat: 应用界面重构 - 从模板中心到AI内容生成平台
- 重构首页:从模板列表展示改为AI功能展示界面
- 更新底部导航:将explore改为content,index改为home
- 新增多个页面:积分、兑换、历史记录、结果展示、设置等
- 优化UI组件:新增通用按钮、分类标签、加载状态等组件
- 清理冗余文件:删除旧的认证文档和积分详情页面
- 更新主题配置:调整配色方案和视觉风格
- 修复导入路径:优化组件导入结构

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-31 17:53:56 +08:00

106 lines
2.5 KiB
TypeScript

import React from 'react';
import { View, Text, TouchableOpacity, StyleSheet, StyleProp, ViewStyle } from 'react-native';
import { AlertCircle, RefreshCw } from 'lucide-react';
import { Colors, Spacing, BorderRadius, FontSize, Shadow } from '@/constants/theme';
interface ErrorRetryProps {
message: string;
onRetry: () => void;
subMessage?: string;
style?: StyleProp<ViewStyle>;
showIcon?: boolean;
buttonText?: string;
}
export function ErrorRetry({
message,
onRetry,
subMessage,
style,
showIcon = true,
buttonText = '重试',
}: ErrorRetryProps) {
return (
<View style={[styles.container, style]}>
<View style={styles.content}>
{showIcon && (
<View style={styles.iconContainer}>
<AlertCircle size={48} color={Colors.brand.danger} strokeWidth={1.5} />
</View>
)}
<Text style={styles.title}>{message}</Text>
{subMessage && <Text style={styles.subtitle}>{subMessage}</Text>}
<TouchableOpacity
style={styles.button}
onPress={onRetry}
activeOpacity={0.7}
>
<RefreshCw size={18} color={Colors.brand.primary} style={styles.buttonIcon} />
<Text style={styles.buttonText}>{buttonText}</Text>
</TouchableOpacity>
</View>
</View>
);
}
const styles = StyleSheet.create({
container: {
width: '100%',
height: '100%',
backgroundColor: Colors.background.secondary,
alignItems: 'center',
justifyContent: 'center',
paddingHorizontal: Spacing.xl,
},
content: {
alignItems: 'center',
maxWidth: 280,
},
iconContainer: {
width: 80,
height: 80,
borderRadius: 40,
backgroundColor: Colors.background.tertiary,
justifyContent: 'center',
alignItems: 'center',
marginBottom: Spacing.lg,
},
title: {
fontSize: FontSize.lg,
fontWeight: '600',
color: Colors.text.primary,
textAlign: 'center',
marginBottom: Spacing.sm,
},
subtitle: {
fontSize: FontSize.sm,
color: Colors.text.tertiary,
textAlign: 'center',
lineHeight: 20,
marginBottom: Spacing.xl,
},
button: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: Colors.background.tertiary,
paddingHorizontal: Spacing.xl,
paddingVertical: Spacing.md,
borderRadius: BorderRadius.full,
...Shadow.small,
},
buttonIcon: {
marginRight: Spacing.sm,
},
buttonText: {
fontSize: FontSize.md,
fontWeight: '600',
color: Colors.brand.primary,
},
});
export default ErrorRetry;