feat(个人中心): 优化会员横幅组件，支持深色模式与国际化；新增医疗记录卡片组件，完善健康档案功能

components/health/MedicalRecordCard.tsx

@@ -0,0 +1,151 @@
+import { Colors, palette } from '@/constants/Colors';
+import { MedicalRecordItem } from '@/services/healthProfile';
+import { Ionicons } from '@expo/vector-icons';
+import dayjs from 'dayjs';
+import { Image } from 'expo-image';
+import React from 'react';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+
+interface MedicalRecordCardProps {
+  item: MedicalRecordItem;
+  onPress: (item: MedicalRecordItem) => void;
+  onDelete: (item: MedicalRecordItem) => void;
+}
+
+export const MedicalRecordCard: React.FC<MedicalRecordCardProps> = ({ item, onPress, onDelete }) => {
+  const firstAttachment = item.images && item.images.length > 0 ? item.images[0] : null;
+  const isPdf = firstAttachment?.toLowerCase().endsWith('.pdf');
+
+  return (
+    <TouchableOpacity 
+      style={styles.container} 
+      onPress={() => onPress(item)}
+      activeOpacity={0.8}
+    >
+      <View style={styles.thumbnailContainer}>
+        {firstAttachment ? (
+          isPdf ? (
+            <View style={styles.pdfThumbnail}>
+              <Ionicons name="document-text" size={32} color="#EF4444" />
+              <Text style={styles.pdfText}>PDF</Text>
+            </View>
+          ) : (
+            <Image
+              source={{ uri: firstAttachment }}
+              style={styles.thumbnail}
+              contentFit="cover"
+              transition={200}
+            />
+          )
+        ) : (
+          <View style={styles.placeholderThumbnail}>
+            <Ionicons name="document-text-outline" size={32} color={palette.gray[300]} />
+          </View>
+        )}
+        
+        {item.images && item.images.length > 1 && (
+          <View style={styles.badge}>
+            <Text style={styles.badgeText}>+{item.images.length - 1}</Text>
+          </View>
+        )}
+      </View>
+      
+      <View style={styles.content}>
+        <Text style={styles.title} numberOfLines={1}>{item.title}</Text>
+        <Text style={styles.date}>{dayjs(item.date).format('YYYY-MM-DD')}</Text>
+      </View>
+
+      <TouchableOpacity 
+        style={styles.deleteButton} 
+        onPress={() => onDelete(item)}
+        hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
+      >
+        <Ionicons name="trash-outline" size={16} color={palette.gray[400]} />
+      </TouchableOpacity>
+    </TouchableOpacity>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: '#FFFFFF',
+    borderRadius: 16,
+    marginBottom: 12,
+    shadowColor: palette.gray[200],
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.5,
+    shadowRadius: 8,
+    elevation: 2,
+    overflow: 'hidden',
+    flexDirection: 'row',
+    height: 100,
+  },
+  thumbnailContainer: {
+    width: 100,
+    height: '100%',
+    backgroundColor: palette.gray[50],
+    position: 'relative',
+  },
+  thumbnail: {
+    width: '100%',
+    height: '100%',
+  },
+  pdfThumbnail: {
+    width: '100%',
+    height: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: '#F3F4F6',
+  },
+  pdfText: {
+    fontSize: 10,
+    marginTop: 4,
+    color: '#EF4444',
+    fontWeight: '600',
+  },
+  placeholderThumbnail: {
+    width: '100%',
+    height: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: palette.gray[50],
+  },
+  badge: {
+    position: 'absolute',
+    right: 8,
+    bottom: 8,
+    backgroundColor: 'rgba(0,0,0,0.6)',
+    borderRadius: 10,
+    paddingHorizontal: 6,
+    paddingVertical: 2,
+  },
+  badgeText: {
+    color: '#FFFFFF',
+    fontSize: 10,
+    fontWeight: '600',
+  },
+  content: {
+    flex: 1,
+    padding: 12,
+    justifyContent: 'center',
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: palette.gray[800],
+    marginBottom: 4,
+    fontFamily: 'AliBold',
+  },
+  date: {
+    fontSize: 12,
+    color: palette.purple[600],
+    fontWeight: '500',
+    fontFamily: 'AliRegular',
+  },
+  deleteButton: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    padding: 4,
+  },
+});