diff --git a/backend/routes/sectors.py b/backend/routes/sectors.py index c45fde6..5e10e76 100644 --- a/backend/routes/sectors.py +++ b/backend/routes/sectors.py @@ -1,8 +1,4 @@ -"""板块数据路由：行业板块、概念板块 - -注意：行业/概念必须走不同 path（/industry、/concept），不能仅靠 query 参数区分。 -上游反代/CDN 可能按 path 缓存并忽略 query，导致两个 tab 返回相同数据。 -""" +"""板块数据路由：行业板块、概念板块""" from fastapi import APIRouter, Query, HTTPException from fastapi.responses import JSONResponse @@ -10,63 +6,34 @@ from services import eastmoney, mootdx router = APIRouter() -# 禁止任何中间层缓存，确保每次请求都打到后端 +# 行业/概念通过 query 参数区分，但上游反代/CDN 可能按 path 缓存而忽略 query， +# 导致两个 tab 返回相同数据。显式禁止缓存，保证按 query 区分。 _NO_CACHE_HEADERS = {"Cache-Control": "no-store, no-cache, must-revalidate, max-age=0"} -_SORT_KEYS = {"mainNetInflow", "changePercent"} +@router.get("", summary="板块列表") +async def sector_list( + type: str = Query("industry", description="板块类型：industry=行业板块, concept=概念板块"), +): + if type not in ("industry", "concept"): + raise HTTPException(status_code=400, detail="板块类型错误，仅支持 industry/concept") -def _sort_sectors(data: list[dict], sort: str, order: str) -> list[dict]: - """后端排序：mainNetInflow=资金流入，changePercent=涨幅%""" - reverse = order != "asc" - if sort == "changePercent": - # changePercent 为 None 的排到最后（与方向无关） - return sorted( - data, - key=lambda x: (x.get("changePercent") is None, -(x.get("changePercent") or 0)), - reverse=reverse, - ) - return sorted(data, key=lambda x: -(x.get("mainNetInflow") or 0), reverse=reverse) - - -async def _sector_response(sector_type: str, sort: str, order: str) -> JSONResponse: - data = await eastmoney.fetch_sector_list(sector_type) - source = None - if not data: - # 降级：通达信 mootdx（不含实时资金流数据） - md_data = await mootdx.fetch_sector_list(sector_type) - if md_data: - data = md_data - source = "mootdx" - + data = await eastmoney.fetch_sector_list(type) if data: - data = _sort_sectors(data, sort, order) + return JSONResponse( + {"data": data, "count": len(data), "type": type}, + headers=_NO_CACHE_HEADERS, + ) - payload: dict = {"data": data, "count": len(data), "type": sector_type} - if source: - payload["source"] = source - return JSONResponse(payload, headers=_NO_CACHE_HEADERS) + # 降级：通达信 mootdx（不含实时资金流数据） + md_data = await mootdx.fetch_sector_list(type) + if md_data: + return JSONResponse( + {"data": md_data, "count": len(md_data), "type": type, "source": "mootdx"}, + headers=_NO_CACHE_HEADERS, + ) - -@router.get("/industry", summary="行业板块列表") -async def sector_industry( - sort: str = Query("mainNetInflow", description="排序字段：mainNetInflow=资金流入, changePercent=涨幅%"), - order: str = Query("desc", description="排序方向：asc=升序, desc=降序"), -): - if sort not in _SORT_KEYS: - sort = "mainNetInflow" - if order not in ("asc", "desc"): - order = "desc" - return await _sector_response("industry", sort, order) - - -@router.get("/concept", summary="概念板块列表") -async def sector_concept( - sort: str = Query("mainNetInflow", description="排序字段：mainNetInflow=资金流入, changePercent=涨幅%"), - order: str = Query("desc", description="排序方向：asc=升序, desc=降序"), -): - if sort not in _SORT_KEYS: - sort = "mainNetInflow" - if order not in ("asc", "desc"): - order = "desc" - return await _sector_response("concept", sort, order) + return JSONResponse( + {"data": [], "count": 0, "type": type}, + headers=_NO_CACHE_HEADERS, + ) diff --git a/src/lib/stock-api.ts b/src/lib/stock-api.ts index 78ab078..a334065 100755 --- a/src/lib/stock-api.ts +++ b/src/lib/stock-api.ts @@ -460,23 +460,15 @@ export interface SectorResponse { } /** - * 获取东方财富板块列表 - * 行业/概念走不同 path（/industry、/concept），避免上游反代按 path 缓存忽略 query 导致数据串味 + * 获取东方财富板块列表（按主力净流入排序） * @param type industry=行业板块, concept=概念板块 - * @param sort mainNetInflow=资金流入, changePercent=涨幅% - * @param order asc=升序, desc=降序 */ -export async function fetchSectors( - type: SectorType, - opts?: { sort?: "mainNetInflow" | "changePercent"; order?: "asc" | "desc"; signal?: AbortSignal }, -): Promise { +export async function fetchSectors(type: SectorType, signal?: AbortSignal): Promise { const baseUrl = getApiBaseUrl(); - const sort = opts?.sort ?? "mainNetInflow"; - const order = opts?.order ?? "desc"; - const url = `${baseUrl}/api/sectors/${type}?sort=${sort}&order=${order}`; + const url = `${baseUrl}/api/sectors?type=${type}`; try { - const resp = await fetch(url, { method: "GET", signal: opts?.signal, cache: "no-store" }); + const resp = await fetch(url, { method: "GET", signal, cache: "no-store" }); if (!resp.ok) return []; const result: SectorResponse = await resp.json(); return result.data || []; diff --git a/src/routes/sectors.tsx b/src/routes/sectors.tsx index 81f47f5..bf738e5 100644 --- a/src/routes/sectors.tsx +++ b/src/routes/sectors.tsx @@ -1,5 +1,6 @@ import { createFileRoute, Link } from "@tanstack/react-router"; -import { useEffect, useMemo, useRef, useState } from "react"; +import { useMemo, useState } from "react"; +import { useQuery } from "@tanstack/react-query"; import { fetchSectors, type SectorItem, type SectorType } from "@/lib/stock-api"; import { Card, CardContent } from "@/components/ui/card"; import { ArrowLeft, RefreshCw, ArrowDown, ArrowUp, TrendingUp, TrendingDown } from "lucide-react"; @@ -8,7 +9,7 @@ export const Route = createFileRoute("/sectors")({ component: SectorsPage, }); -/* ── Tabs：行业 / 概念（各自独立 path，互不串数据）── */ +/* ── Tabs：行业 / 概念 ── */ const TABS: { key: SectorType; label: string }[] = [ { key: "industry", label: "行业" }, { key: "concept", label: "概念" }, @@ -21,27 +22,30 @@ function SectorsPage() { const [tab, setTab] = useState("industry"); const [sortKey, setSortKey] = useState("mainNetInflow"); const [asc, setAsc] = useState(true); - const [data, setData] = useState([]); - const [loading, setLoading] = useState(true); - const abortRef = useRef(null); - // 每次 tab / 排序变化都重新发起请求（带 no-store，不缓存） - useEffect(() => { - abortRef.current?.abort(); - const controller = new AbortController(); - abortRef.current = controller; - setLoading(true); - fetchSectors(tab, { sort: sortKey, order: asc ? "asc" : "desc", signal: controller.signal }) - .then((items) => { - if (!controller.signal.aborted) { - setData(items); - setLoading(false); - } - }); - return () => controller.abort(); - }, [tab, sortKey, asc]); + // 行业 / 概念 各自独立的 Query，数据完全隔离，杜绝来回切换时的合并 + const industryQ = useQuery({ + queryKey: ["sectors", "industry"], + queryFn: ({ signal }) => fetchSectors("industry", signal), + staleTime: 30_000, + retry: false, + }); + const conceptQ = useQuery({ + queryKey: ["sectors", "concept"], + queryFn: ({ signal }) => fetchSectors("concept", signal), + staleTime: 30_000, + retry: false, + }); + + const { data = [], isLoading, isFetching, refetch } = + tab === "industry" ? industryQ : conceptQ; + + // 切换 tab 时强制重新请求，绕过 React Query 缓存和上游反代缓存，确保拿到对应类型的数据 + const handleTab = (t: SectorType) => { + setTab(t); + (t === "industry" ? industryQ : conceptQ).refetch(); + }; - // 后端已按 sort/order 排序；此处再排一次作为兜底，确保 UI 一定响应排序 const sorted = useMemo(() => { const dir = asc ? 1 : -1; return [...data].sort((a, b) => { @@ -59,21 +63,6 @@ function SectorsPage() { } }; - const reload = () => { - abortRef.current?.abort(); - const controller = new AbortController(); - abortRef.current = controller; - setLoading(true); - fetchSectors(tab, { sort: sortKey, order: asc ? "asc" : "desc", signal: controller.signal }).then( - (items) => { - if (!controller.signal.aborted) { - setData(items); - setLoading(false); - } - }, - ); - }; - return (
{/* 顶栏 */} @@ -86,21 +75,21 @@ function SectorsPage() {

板块资金流向

- {/* Tab 切换：行业 / 概念（不同 path 请求） */} + {/* Tab 切换：行业 / 概念 */}
{TABS.map((t) => (