docs: 更新README文件并统一为英文版本

- 删除README.zh-CN.md文件 - 重命名README.md为README.en.md - 更新README.en.md内容为更详细的英文文档 - 创建新的README.md作为中文文档入口
2026-01-22 08:55:43 +08:00
parent e442296757
commit ae06b087c8
3 changed files with 206 additions and 199 deletions
--- a/README.en.md
+++ b/README.en.md
@@ -0,0 +1,119 @@
+# ThinkFlow AI
+
+[中文](./README.md) | English
+
+**ThinkFlow AI** is a next-generation, local-first, AI-driven mind mapping tool built with Vue 3 and VueFlow. More than just a drawing app, it serves as a "brain augmentor" that thinks with you. By combining the divergent capabilities of LLMs (Large Language Models) with structured visualization, ThinkFlow AI rapidly transforms fuzzy ideas into clear, deep knowledge systems.
+
+---
+
+## 🔗 Live Demo
+
+Experience it now: [https://thinkflow-ai.lz-t.top/](https://thinkflow-ai.lz-t.top/)
+
+---
+
+## 🌟 Why ThinkFlow AI?
+
+Traditional mind mapping tools often require manual entry of every branch, which can become a bottleneck during a burst of inspiration. ThinkFlow AI redefines this process:
+
+1.  **AI-Driven Automated Divergence**: Enter a core keyword, and the AI automatically expands outward based on logical chains, helping you break through "blank page anxiety."
+2.  **Context-Aware Deep Dialogue**: Every node carries its full path context within the thinking tree. This means the AI understands _why_ you moved from A to B, generating more precise follow-up suggestions.
+3.  **Multi-Dimensional Sensory Presentation**: Gain textual knowledge through deep "Answers," visual imagery through AI Image Generation, and macro insights through "Session Summaries."
+4.  **Ultimate Privacy & Freedom**: Adopts a local-first architecture. Configurations are stored locally in your browser. Supports any OpenAI-compatible interface with no platform lock-in.
+
+---
+
+## 🚀 Core Functional Architecture
+
+### 1. Intelligent Expansion System
+
+- **Core Idea Activation**: Generate the foundation of your thinking tree with one click.
+- **Path Contextual Follow-up**: Perform follow-ups on nodes; the AI reasons using the full logical path from the root to the current node.
+- **Node Management**: Supports subtree collapsing for large-scale graphs to keep the workspace clean.
+
+### 2. Deep Dive & Summarization
+
+- **Deep Answer (Deep Dive)**: Generates 300-500 words of professional analysis for specific concepts, supporting rich Markdown formatting.
+- **Visual Generation (Image Gen)**: Utilizes CogView or DALL-E to generate photorealistic visuals for nodes, reinforcing visual memory.
+- **Global Summary**: Automatically analyzes the entire graph's logic to extract core insights and conclusions.
+
+### 3. Canvas Interaction & Layout
+
+- **Smart Tree Layout**: Built-in algorithm based on dynamic subtree height calculations to solve overlap issues after node expansion.
+- **Linked Dragging**: When a parent node moves, child nodes move synchronously to maintain relative positions.
+- **Versatile Export**: Perfectly supports exporting to structured Markdown, preserving all deep answer content.
+
+---
+
+## 🛠️ Tech Stack
+
+| Dimension                | Technology Choice                                      |
+| :----------------------- | :----------------------------------------------------- |
+| **Frontend Framework**   | Vue 3 (Composition API)                                |
+| **Build Tool**           | Vite 5 + TypeScript                                    |
+| **Graph Engine**         | @vue-flow/core (High performance, highly customizable) |
+| **UI/Styling**           | Tailwind CSS + Lucide Icons                            |
+| **Internationalization** | Vue-I18n (Seamless English/Chinese switching)          |
+| **Markdown**             | Markdown-it (Node content rendering)                   |
+
+---
+
+## 📂 Source Structure
+
+```text
+src/
+├── components/             # UI Component Layer
+│   ├── WindowNode.vue      # Logic Carrier: Custom node with Image/Answer/Follow-up capabilities
+│   ├── TopNav.vue          # Global Controls: Layout triggers, export, summary, fullscreen, etc.
+│   ├── SideNav.vue         # View Config: MiniMap, edge styles, background, settings entry
+│   ├── BottomBar.vue       # Idea Entry: The spark of inspiration
+│   └── ...Modals           # Modal Logic: Settings, Preview, Reset confirmation, etc.
+├── composables/            # Domain Logic Layer
+│   └── useThinkFlow.ts     # Business Heart: State management, API scheduling, layout algorithm
+├── i18n/                   # Language Assets
+│   └── locales/            # zh.json / en.json translation files
+├── App.vue                 # App Skeleton: VueFlow container config and assembly
+└── main.ts                 # Entry Point
+```
+
+---
+
+## ⚙️ API Service Description (Important)
+
+To provide an out-of-the-box experience, this project includes a default set of demo endpoints.
+
+### 1. Demo Endpoint Details
+
+- **Service Proxying**: Default requests are proxied and controlled via **Cloudflare Workers & Pages**.
+- **Model Support**: Currently connected to Zhipu Bigmodel (glm-4-flash / cogview-3-flash) using free tiers.
+- **Limitations**: As these are public demo endpoints, you may encounter rate limits or exhausted quotas.
+
+### 2. Advanced Usage (Custom Endpoints)
+
+For more stable and higher-quality generation (e.g., using GPT-4o, Claude 3.5 Sonnet, etc.), we strongly recommend configuring your own API endpoints in **Settings**:
+
+- **Base URL**: Your API proxy address (must support CORS).
+- **Model**: Target model name.
+- **API Key**: Your private key.
+
+_Note: In custom mode, requests are sent directly from your browser to the target endpoint, bypassing any intermediaries for maximum security and efficiency._
+
+---
+
+## 📦 Quick Deployment
+
+```bash
+# Clone the repo
+git clone https://github.com/your-repo/ThinkFlowAI.git
+
+# Install dependencies
+npm install
+
+# Start development
+npm run dev
+
+# Build for production
+npm run build
+```
+
+---