add ios app

2026-01-31 21:20:50 +01:00
parent a170632270
commit 748f252c2f
63 changed files with 38507 additions and 0 deletions
--- a/app-ios/components/memoir/FullMemoirContent.tsx
+++ b/app-ios/components/memoir/FullMemoirContent.tsx
@@ -0,0 +1,196 @@
+import { AppColors } from '@/constants/theme';
+import { Memoir } from '@/data/mockData';
+import { Ionicons } from '@expo/vector-icons';
+import React from 'react';
+import { ScrollView, StyleSheet, Text, View } from 'react-native';
+
+interface FullMemoirContentProps {
+  memoir: Memoir;
+}
+
+const chineseNumbers = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'];
+
+function renderChapterContent(content: string | undefined) {
+  if (!content) {
+    return (
+      <Text style={styles.emptyText}>
+        这一章还没有内容，快去和回忆录助手聊聊吧！
+      </Text>
+    );
+  }
+
+  return content.split('\n\n').map((paragraph, index) => {
+    if (!paragraph.trim()) return null;
+    
+    // Check if it's a quote
+    if (paragraph.trim().startsWith('"') && paragraph.trim().endsWith('"')) {
+      return (
+        <View key={index} style={styles.quoteBlock}>
+          <Text style={styles.quoteText}>{paragraph.trim()}</Text>
+        </View>
+      );
+    }
+
+    return (
+      <Text key={index} style={styles.paragraph}>
+        {paragraph.trim()}
+      </Text>
+    );
+  });
+}
+
+export function FullMemoirContent({ memoir }: FullMemoirContentProps) {
+  return (
+    <View style={styles.container}>
+      {/* Content */}
+      <ScrollView 
+        style={styles.content}
+        showsVerticalScrollIndicator={false}
+        contentContainerStyle={styles.contentContainer}
+      >
+        {/* Book Title */}
+        <View style={styles.bookHeader}>
+          <Text style={styles.bookTitle}>{memoir.title}</Text>
+          <Text style={styles.bookSubtitle}>{memoir.subtitle}</Text>
+        </View>
+
+        {/* All Chapters */}
+        {memoir.chapters.map((chapter, index) => (
+          <View key={chapter.id} style={styles.chapterSection}>
+            {/* Chapter Header */}
+            <View style={styles.chapterHeader}>
+              <Text style={styles.chapterNumber}>
+                第{chineseNumbers[chapter.number - 1] || chapter.number}章
+              </Text>
+              <Text style={styles.chapterTitle}>{chapter.title}</Text>
+            </View>
+
+            {/* Chapter Content */}
+            <View style={styles.chapterContent}>
+              {renderChapterContent(chapter.content)}
+            </View>
+
+            {/* Chapter Divider (except for last chapter) */}
+            {index < memoir.chapters.length - 1 && (
+              <View style={styles.chapterDivider}>
+                <View style={styles.dividerLine} />
+                <Ionicons name="leaf-outline" size={16} color={AppColors.lavender} />
+                <View style={styles.dividerLine} />
+              </View>
+            )}
+          </View>
+        ))}
+
+        {/* End Mark */}
+        <View style={styles.endMark}>
+          <Text style={styles.endMarkText}>— 全文完 —</Text>
+        </View>
+      </ScrollView>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 20,
+  },
+  content: {
+    flex: 1,
+  },
+  contentContainer: {
+    paddingBottom: 100,
+  },
+  bookHeader: {
+    alignItems: 'center',
+    marginBottom: 40,
+    paddingBottom: 32,
+    borderBottomWidth: 1,
+    borderBottomColor: 'rgba(32, 0, 40, 0.08)',
+  },
+  bookTitle: {
+    fontSize: 28,
+    fontWeight: '600',
+    color: AppColors.deepPurple,
+    marginBottom: 8,
+    textAlign: 'center',
+  },
+  bookSubtitle: {
+    fontSize: 14,
+    color: AppColors.slatePurple,
+    textAlign: 'center',
+  },
+  chapterSection: {
+    marginBottom: 16,
+  },
+  chapterHeader: {
+    marginBottom: 20,
+  },
+  chapterNumber: {
+    fontSize: 13,
+    color: AppColors.mediumPurple,
+    fontWeight: '500',
+    marginBottom: 4,
+  },
+  chapterTitle: {
+    fontSize: 22,
+    fontWeight: '600',
+    color: AppColors.deepPurple,
+  },
+  chapterContent: {
+    marginBottom: 24,
+  },
+  paragraph: {
+    fontSize: 16,
+    lineHeight: 30,
+    color: AppColors.deepPurple,
+    marginBottom: 20,
+    textAlign: 'justify',
+  },
+  quoteBlock: {
+    marginVertical: 24,
+    paddingVertical: 16,
+    paddingHorizontal: 20,
+    backgroundColor: AppColors.lavender,
+    borderLeftWidth: 3,
+    borderLeftColor: AppColors.mediumPurple,
+    borderTopRightRadius: 12,
+    borderBottomRightRadius: 12,
+  },
+  quoteText: {
+    fontSize: 15,
+    fontStyle: 'italic',
+    color: AppColors.deepPurple,
+    lineHeight: 24,
+  },
+  emptyText: {
+    fontSize: 15,
+    color: AppColors.slatePurple,
+    fontStyle: 'italic',
+  },
+  chapterDivider: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginVertical: 32,
+    gap: 12,
+  },
+  dividerLine: {
+    flex: 1,
+    height: 1,
+    backgroundColor: 'rgba(32, 0, 40, 0.08)',
+    maxWidth: 80,
+  },
+  endMark: {
+    alignItems: 'center',
+    marginTop: 40,
+    paddingTop: 32,
+    borderTopWidth: 1,
+    borderTopColor: 'rgba(32, 0, 40, 0.08)',
+  },
+  endMarkText: {
+    fontSize: 14,
+    color: AppColors.slatePurple,
+    letterSpacing: 2,
+  },
+});