feat: Phase 3 Web — 业务 API（stocks/factors/backtests）+ Next.js 前端

- 后端业务 API：GET /api/stocks(搜索/分页)、GET /api/factors（因子目录）、POST /api/factor-tests 与 /api/backtests（Research Spec 驱动同步执行）、GET /api/backtests/last；Annotated 依赖注入 + CORS(dev) - Repository 批量查询 get_range_many（研究装配一次查询，避免逐只拉取） - 前端 frontend/web：Next.js 15(TS) + ECharts —— 总览 / 股票池 / 因子研究(IC·RankIC·分层展示) / 回测（净值·回撤·月度·持仓·未建模标注） - 前端只消费业务 API 与标准化 BacktestResult，无 Qlib/SQL 概念泄漏 - 真实数据：同步 20 只权重股 2023-2024 日线（9680 根）支撑截面研究 - 验证：API 集成测试 8 项（DTO 校验/装配/引擎/标准结果，内存 repo 全链路）+ 全量 pytest 68 passed；前端 tsc + next build 通过；无头浏览器端到端（factors/backtest 页面渲染后端数据） - ruff clean
2026-09-06 17:14:33 +08:00
parent e9f59d3cf8
commit 92627f5b6b
27 changed files with 1863 additions and 7 deletions
@@ -0,0 +1,60 @@
+"use client";
+
+import { useEffect, useRef } from "react";
+import * as echarts from "echarts";
+
+export interface XY {
+  date: string;
+  value: number;
+}
+
+export function LineChart({
+  title,
+  data,
+  color = "#38bdf8",
+}: {
+  title: string;
+  data: XY[];
+  color?: string;
+}) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (!ref.current || data.length === 0) return;
+    const chart = echarts.init(ref.current);
+    chart.setOption({
+      title: { text: title, textStyle: { color: "#e2e8f0", fontSize: 13 } },
+      tooltip: { trigger: "axis" },
+      grid: { left: 60, right: 20, top: 40, bottom: 30 },
+      xAxis: {
+        type: "category",
+        data: data.map((p) => p.date),
+        axisLabel: { color: "#94a3b8", fontSize: 10 },
+      },
+      yAxis: {
+        type: "value",
+        scale: true,
+        axisLabel: { color: "#94a3b8" },
+        splitLine: { lineStyle: { color: "#334155" } },
+      },
+      series: [
+        {
+          type: "line",
+          showSymbol: false,
+          data: data.map((p) => p.value),
+          lineStyle: { color, width: 1.6 },
+          itemStyle: { color },
+        },
+      ],
+    });
+    const onResize = () => chart.resize();
+    window.addEventListener("resize", onResize);
+    return () => {
+      window.removeEventListener("resize", onResize);
+      chart.dispose();
+    };
+  }, [data, color, title]);
+
+  if (data.length === 0) return <div className="muted">暂无数据</div>;
+  return <div ref={ref} style={{ height: 360, width: "100%" }} />;
+}