Fundamental_Analysis/frontend/archive/v2_nextjs/src/app/docs/page.tsx
Lv, Qi b41eaf8b99 Refactor frontend to Vite+React SPA and update docs
Major architectural shift from Next.js to a lightweight Vite + React SPA model ("Puppet Architecture") to better support real-time workflow visualization and strict type safety.

Key Changes:
1. **Architecture & Build**:
   - Initialized Vite + React + TypeScript project.
   - Configured Tailwind CSS v4 and Shadcn UI.
   - Archived legacy Next.js frontend to 'frontend/archive/v2_nextjs'.

2. **Core Features**:
   - **Dashboard**: Implemented startup page with Symbol, Market, and Template selection.
   - **Report Page**:
     - **Workflow Visualization**: Integrated ReactFlow to show dynamic DAG of analysis tasks.
     - **Real-time Status**: Implemented Mock SSE logic to simulate task progress, logs, and status changes.
     - **Multi-Tab Interface**: Dynamic tabs for 'Overview', 'Fundamental Data', and analysis modules.
     - **Streaming Markdown**: Enabled typewriter-style streaming rendering for analysis reports using 'react-markdown'.
   - **Config Page**: Implemented settings for AI Providers, Data Sources, and Templates using TanStack Query.

3. **Documentation**:
   - Created v2.0 User Guide ('docs/1_requirements/20251122_[Active]_user-guide_v2.md').
   - Implemented 'DocsPage' in frontend to render the user guide directly within the app.

4. **Backend Alignment**:
   - Created 'docs/frontend/backend_todos.md' outlining necessary backend adaptations (OpenAPI, Progress tracking).

This commit establishes the full frontend 'shell' ready for backend integration.
2025-11-22 19:37:36 +08:00

63 lines
2.0 KiB
TypeScript

import { promises as fs } from 'fs';
import path from 'path';
import ReactMarkdown from 'react-markdown';
import remarkGfm from 'remark-gfm';
import { Card, CardContent } from '@/components/ui/card';
async function getMarkdownContent() {
// process.cwd() is the root of the Next.js project (the 'frontend' directory)
const root = path.join(process.cwd(), '..', 'docs');
const candidates = [
path.join(root, '1_requirements', '20251109_[Active]_user-guide.md'),
path.join(root, '1_requirements', '20251108_[Active]_requirements.md'),
path.join(root, '2_architecture', '20251116_[Active]_system_architecture.md'),
];
for (const p of candidates) {
try {
const content = await fs.readFile(p, 'utf8');
return content;
} catch {
// try next
}
}
return [
'# 文档加载失败',
'',
'未找到以下任意文档:',
'- docs/1_requirements/20251109_[Active]_user-guide.md',
'- docs/1_requirements/20251108_[Active]_requirements.md',
'- docs/2_architecture/20251116_[Active]_system_architecture.md',
].join('\n');
}
export default async function DocsPage() {
const content = await getMarkdownContent();
return (
<div className="container mx-auto py-6 space-y-6">
<header className="space-y-2">
<h1 className="text-3xl font-bold">使</h1>
<p className="text-muted-foreground">
使
</p>
</header>
<Card>
<CardContent className="p-6">
<article className="markdown-body" style={{
boxSizing: 'border-box',
minWidth: '200px',
maxWidth: '980px',
margin: '0 auto',
padding: '0'
}}>
<ReactMarkdown
remarkPlugins={[remarkGfm]}
>
{content}
</ReactMarkdown>
</article>
</CardContent>
</Card>
</div>
);
}