feat(web): 按原型调整响应式研究工作台

zhixing-web/src/features/selection/pages/selection-results-page.test.tsx

@@ -5,6 +5,7 @@ import type { SelectionResults } from "../api/selection.types"
 
 import { SelectionResultsPage } from "./selection-results-page"
 
+const routerNavigate = vi.hoisted(() => vi.fn())
 const useSelectionResults = vi.fn()
 const useSelectionRun = vi.fn()
 const useTriggerSelectionRun = vi.fn()
@@ -17,6 +18,11 @@ vi.mock("@/features/selection/api/selection.query", () => ({
   useTriggerSelectionRun: () => useTriggerSelectionRun(),
 }))
 
+vi.mock("@tanstack/react-router", () => ({
+  useNavigate: () => routerNavigate,
+  useSearch: () => ({ page: 1, pageSize: 5 }),
+}))
+
 const selectedResult: SelectionResults = {
   created_at: "2026-08-08T09:00:00+08:00",
   coverage: 1,
@@ -77,18 +83,75 @@ describe("SelectionResultsPage", () => {
     })
     mutate.mockReset()
     reset.mockReset()
+    routerNavigate.mockReset()
   })
 
   it("renders persisted results and keeps multiple categories visible", () => {
     render(<SelectionResultsPage />)
 
+    expect(screen.getByText("执行完成")).toBeInTheDocument()
+    const table = screen.getByRole("table")
+    expect(table).toBeInTheDocument()
+    expect(within(table).getByText("原始 B1")).toBeInTheDocument()
+    expect(within(table).getByText("回踩白线 B")).toBeInTheDocument()
+    expect(within(table).getAllByText("平安银行")).toHaveLength(2)
+  })
+
+  it("filters signals, updates the detail panel, and expands mobile details", () => {
+    const extraSignal = {
+      ...selectedResult.signals[0],
+      category: "zhixing_b1_oversold_volume",
+      details: { macd: 3.2 },
+      name: "招商银行",
+      ts_code: "600036.SH",
+    }
+    useSelectionResults.mockReturnValue({
+      data: {
+        ...selectedResult,
+        signal_count: 3,
+        signals: [...selectedResult.signals, extraSignal],
+      },
+      isError: false,
+      isPending: false,
+    })
+
+    render(<SelectionResultsPage />)
+
+    fireEvent.change(screen.getByLabelText("搜索命中信号"), {
+      target: { value: "招商" },
+    })
+    const table = screen.getByRole("table")
+    expect(within(table).getByText("招商银行")).toBeInTheDocument()
+    fireEvent.click(within(table).getByText("招商银行"))
     expect(
-      screen.getByRole("heading", { name: "选股策略" }),
+      within(
+        screen.getByRole("complementary", { name: "当前股票详情" }),
+      ).getByText("招商银行"),
     ).toBeInTheDocument()
-    expect(screen.getByText("知行 B1 执行结果")).toBeInTheDocument()
-    expect(screen.getByText("原始 B1")).toBeInTheDocument()
-    expect(screen.getByText("回踩白线 B")).toBeInTheDocument()
-    expect(screen.getAllByText("平安银行")).toHaveLength(2)
+
+    const expandButton = screen.getAllByRole("button", { name: "查看详情" })[0]
+    fireEvent.click(expandButton)
+    expect(expandButton).toHaveAttribute("aria-expanded", "true")
+    expect(screen.getAllByText("macd: 3.2").length).toBeGreaterThan(1)
+  })
+
+  it("navigates to another page when the result list is paginated", () => {
+    const signals = Array.from({ length: 6 }, (_, index) => ({
+      ...selectedResult.signals[0],
+      name: `股票${index + 1}`,
+      ts_code: `00000${index + 1}.SZ`,
+    }))
+    useSelectionResults.mockReturnValue({
+      data: { ...selectedResult, signal_count: signals.length, signals },
+      isError: false,
+      isPending: false,
+    })
+
+    render(<SelectionResultsPage />)
+
+    expect(screen.getByText("第 1–5 条，共 6 条")).toBeInTheDocument()
+    fireEvent.click(screen.getByRole("button", { name: "第 2 页" }))
+    expect(routerNavigate).toHaveBeenCalled()
   })
 
   it("requires confirmation before a rerun and does not trigger on cancel", () => {