+
setConfirmOpen(false)} />
+
+
本地暂无分钟K数据，是否立即获取最近 {totalDays} 日分钟K？
+
+ { setConfirmOpen(false); extend.mutate() }}
+ disabled={extend.isPending}
+ className="px-4 py-1.5 rounded-btn bg-accent/90 text-base text-xs font-medium hover:bg-accent disabled:opacity-40 transition-colors duration-150"
+ >
+ 确定
+
+ setConfirmOpen(false)}
+ className="px-4 py-1.5 rounded-btn bg-elevated text-secondary text-xs hover:bg-elevated/80 transition-colors duration-150"
+ >
+ 取消
+
+
+
+
+ )}
+
+ )
+}
diff --git a/frontend/src/components/data/QuoteConfigCard.tsx b/frontend/src/components/data/QuoteConfigCard.tsx
new file mode 100644
index 0000000..02484b7
--- /dev/null
+++ b/frontend/src/components/data/QuoteConfigCard.tsx
@@ -0,0 +1,165 @@
+import { useState } from 'react'
+import { AnimatePresence, motion } from 'framer-motion'
+import { Activity, Settings } from 'lucide-react'
+import { Skeleton } from './Skeleton'
+
+export function QuoteConfigCard({ enabled, running, isTrading, lastFetchMs, intervalS, intervalMin, intervalMax, loading, onToggle, toggling, showIntervalEdit, onShowIntervalEdit, onIntervalChange }: {
+ enabled: boolean
+ running: boolean
+ isTrading: boolean
+ lastFetchMs: number | null
+ intervalS: number
+ intervalMin: number
+ intervalMax: number
+ loading: boolean
+ onToggle: (enabled: boolean) => void
+ toggling: boolean
+ showIntervalEdit: boolean
+ onShowIntervalEdit: () => void
+ onIntervalChange: (v: number) => void
+}) {
+ const statusColor = running && isTrading
+ ? 'bg-accent shadow-[0_0_6px_rgba(61,214,140,0.5)]'
+ : enabled && running
+ ? 'bg-warning/60'
+ : 'bg-muted'
+
+ const statusText = !enabled
+ ? '已关闭'
+ : !isTrading
+ ? '非交易时段'
+ : running
+ ? '行情运行中'
+ : '已停止'
+
+ const lastFetchTime = lastFetchMs
+ ? new Date(lastFetchMs).toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' })
+ : null
+
+ return (
+
+
+
+
onToggle(!enabled)}
+ disabled={toggling}
+ className={`relative inline-flex h-4 w-7 items-center rounded-full shrink-0 transition-colors duration-200 ${
+ enabled
+ ? 'bg-accent shadow-[0_0_6px_rgba(59,130,246,0.3)]'
+ : 'bg-elevated'
+ } ${toggling ? 'opacity-50' : 'cursor-pointer'}`}
+ >
+
+
+
+ {loading ? (
+
+ ) : (
+
+
+
状态
+
+ {statusText}
+
+
+
+ 交易时段
+ {isTrading ? '交易中' : '休市'}
+
+
+
+ 轮询间隔
+ onShowIntervalEdit()}
+ className={`p-0.5 rounded hover:bg-elevated transition-colors ${showIntervalEdit ? 'text-accent' : 'text-secondary'}`}
+ title="设置轮询间隔"
+ >
+
+
+
{intervalS}s
+
+
+ 最后获取
+ {lastFetchTime ?? '—'}
+
+
+ )}
+
+
+ {showIntervalEdit && (
+
+
+ )}
+
+
+ )
+}
+
+function IntervalEditor({ min, max, value, onChange }: {
+ min: number; max: number; value: number; onChange: (v: number) => void
+}) {
+ const [draft, setDraft] = useState(value)
+ const clamped = Math.max(min, Math.min(max, draft))
+ const step = min < 1 ? 0.1 : min < 3 ? 0.5 : 1
+ const presets = min <= 3 ? [3, 5, 10, 30, 60] : [5, 10, 15, 30, 60]
+
+ return (
+
+
+ 轮询间隔 ({min}s ~ {max}s)
+
+
+ {presets.map(p => (
+ { setDraft(p); onChange(p) }}
+ className={`px-1.5 py-0.5 rounded text-[10px] font-mono transition-colors ${
+ Math.abs(clamped - p) < 0.01
+ ? 'bg-accent/15 text-accent border border-accent/30'
+ : 'bg-elevated text-secondary hover:text-foreground border border-transparent'
+ }`}
+ >
+ {p}s
+
+ ))}
+
+
+
+ {clamped < 1 ? clamped.toFixed(1) : clamped.toFixed(0)}s
+
+
+
+ )
+}
diff --git a/frontend/src/components/data/ScheduleEditor.tsx b/frontend/src/components/data/ScheduleEditor.tsx
new file mode 100644
index 0000000..e8c2171
--- /dev/null
+++ b/frontend/src/components/data/ScheduleEditor.tsx
@@ -0,0 +1,43 @@
+import { useState, useEffect } from 'react'
+
+export function ScheduleEditor({ value, onSave, loading, hint }: {
+ value: { hour: number; minute: number }
+ onSave: (hour: number, minute: number) => void
+ loading: boolean
+ hint?: string
+}) {
+ const [h, setH] = useState(value.hour)
+ const [m, setM] = useState(value.minute)
+
+ useEffect(() => { setH(value.hour); setM(value.minute) }, [value.hour, value.minute])
+
+ const handleSave = () => {
+ if (h === value.hour && m === value.minute) return
+ onSave(h, m)
+ }
+
+ return (
+
+ 每日
+ :
+
+ {loading ? '保存中…' : '保存'}
+
+ 工作日自动执行{hint ? ` · ${hint}` : ''}
+
+ )
+}
diff --git a/frontend/src/components/data/SchemaModal.tsx b/frontend/src/components/data/SchemaModal.tsx
new file mode 100644
index 0000000..0a42867
--- /dev/null
+++ b/frontend/src/components/data/SchemaModal.tsx
@@ -0,0 +1,102 @@
+import { AnimatePresence, motion } from 'framer-motion'
+import { useQuery } from '@tanstack/react-query'
+import { api, type EnrichedField } from '@/lib/api'
+import { QK } from '@/lib/queryKeys'
+
+const TABLE_TITLES: Record
= {
+ instruments: '标的维表',
+ daily: '日 K',
+ adj_factor: '除权因子',
+ enriched: 'Enriched',
+ minute: '分钟 K',
+ index_instruments: '指数维表',
+ index_daily: '指数日 K',
+ index_enriched: '指数 Enriched',
+}
+
+function categorize(name: string): string {
+ if (['symbol', 'date'].includes(name)) return '基础'
+ if (['open', 'high', 'low', 'close', 'volume', 'amount'].includes(name)) return '行情'
+ if (name.startsWith('raw_') || name.startsWith('ex_') || name === 'close_pre_adj') return '复权'
+ if (name.startsWith('ma')) return '均线 MA'
+ if (name.startsWith('ema')) return '指数均线 EMA'
+ if (name.startsWith('macd')) return 'MACD'
+ if (name.startsWith('boll')) return '布林带'
+ if (name.startsWith('kdj')) return 'KDJ'
+ if (name.startsWith('rsi')) return 'RSI'
+ if (name.startsWith('signal_') || name.startsWith('consecutive_')) return '信号'
+ if (['atr_14', 'vol_ratio_5d', 'vol_ma5', 'vol_ma10', 'momentum_5d', 'momentum_10d', 'momentum_20d', 'momentum_30d', 'momentum_60d', 'annual_vol_20d', 'change_pct', 'change_amount', 'amplitude', 'turnover_rate'].includes(name)) return '波动/动量'
+ if (['high_60d', 'low_60d'].includes(name)) return '极值'
+ return '其他'
+}
+
+export function EnrichedSchemaModal({ table, onClose }: { table: string | null; onClose: () => void }) {
+ const open = !!table
+ const schema = useQuery({
+ queryKey: QK.tableSchema(table!),
+ queryFn: () => api.enrichedSchema(table!),
+ enabled: open,
+ staleTime: Infinity,
+ })
+
+ const fields = schema.data ?? []
+
+ const groups: Record = {}
+ for (const f of fields) {
+ const cat = categorize(f.name)
+ if (!groups[cat]) groups[cat] = []
+ groups[cat].push(f)
+ }
+
+ const title = table ? (TABLE_TITLES[table] ?? table) : ''
+
+ return (
+
+ {open && (
+
+
+
+
+
{title} 字段说明
+ {fields.length} 个字段
+
+
+ {schema.isLoading ? (
+
加载中…
+ ) : (
+
+ {Object.entries(groups).map(([cat, items]) => (
+
+
{cat}
+
+ {items.map((f) => (
+
+ {f.name}
+ {f.desc}
+ {f.type}
+
+ ))}
+
+
+ ))}
+
+ )}
+
+
+ )}
+
+ )
+}
diff --git a/frontend/src/components/data/SectionTitle.tsx b/frontend/src/components/data/SectionTitle.tsx
new file mode 100644
index 0000000..3756bcb
--- /dev/null
+++ b/frontend/src/components/data/SectionTitle.tsx
@@ -0,0 +1,61 @@
+import { CheckCircle2, XCircle, Loader2, AlertCircle } from 'lucide-react'
+import { formatDuration } from '@/lib/format'
+
+export function SectionTitle({ icon: Icon, children }: { icon: React.ComponentType<{ className?: string }>; children: React.ReactNode }) {
+ return (
+
+
+ )
+}
+
+export function HistoryRow({ job, onClick }: { job: any; onClick: () => void }) {
+ const statusIcon = {
+ succeeded: { icon: CheckCircle2, color: 'text-bear' },
+ failed: { icon: XCircle, color: 'text-danger' },
+ running: { icon: Loader2, color: 'text-accent', spinning: true },
+ pending: { icon: Loader2, color: 'text-muted', spinning: true },
+ }[job.status as 'succeeded'] ?? { icon: AlertCircle, color: 'text-muted' }
+ const Icon = statusIcon.icon
+
+ return (
+
+
+
+
+
{job.id}
+
+ {job.started_at ? new Date(job.started_at).toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) : '—'}
+ {' · '}
+ {job.duration_s != null ? formatDuration(job.duration_s) : '...'}
+
+
+
+ {job.result && (() => {
+ const r = job.result as Record
+ const parts: string[] = []
+ if (r.daily_days != null) parts.push(`日K ${r.daily_days}日`)
+ if (r.enriched_days != null) parts.push(`enriched ${r.enriched_days}行`)
+ if (r.minute_rows != null) parts.push(`分钟K ${r.minute_rows}行`)
+ if (r.earliest_after && r.earliest_before) {
+ const a = String(r.earliest_after).slice(0, 10)
+ const b = String(r.earliest_before).slice(0, 10)
+ const days = r.daily_days ?? r.minute_days ?? 0
+ parts.push(days <= 1 ? a : `${a}~${b}`)
+ }
+ return parts.length > 0 ? (
+ {parts.join(' · ')}
+ ) : null
+ })()}
+ {job.error && (
+ {job.error}
+ )}
+
+ )
+}
diff --git a/frontend/src/components/data/SettingsModal.tsx b/frontend/src/components/data/SettingsModal.tsx
new file mode 100644
index 0000000..5054ef0
--- /dev/null
+++ b/frontend/src/components/data/SettingsModal.tsx
@@ -0,0 +1,27 @@
+import { motion } from 'framer-motion'
+import { X } from 'lucide-react'
+
+export function SettingsModal({ title, onClose, children }: { title: string; onClose: () => void; children: React.ReactNode }) {
+ return (
+
+
+
+
+
{title}
+
+
+
+
+ {children}
+
+
+
+ )
+}
diff --git a/frontend/src/components/data/StatCard.tsx b/frontend/src/components/data/StatCard.tsx
new file mode 100644
index 0000000..c66cd33
--- /dev/null
+++ b/frontend/src/components/data/StatCard.tsx
@@ -0,0 +1,312 @@
+import { motion } from 'framer-motion'
+import { Loader2, CheckCircle2, Settings, Table2 } from 'lucide-react'
+import { formatNumber } from '@/lib/format'
+import { fmtDate } from '@/lib/format'
+import { Skeleton } from './Skeleton'
+
+// 卡片能力定义：capKey → 查 capability limits；tierReq → 无权限时显示的档位要求
+export const CARD_META: Record = {
+ instruments: { capKey: 'quote.by_symbol', tierReq: 'Free' },
+ daily: { capKey: 'kline.daily.batch', tierReq: 'Starter+' },
+ adj_factor: { capKey: 'adj_factor', tierReq: 'Starter+' },
+ enriched: { capKey: '', tierReq: '' },
+ minute: { capKey: 'kline.minute.batch', tierReq: 'Pro+' },
+ financials: { capKey: 'financial', tierReq: 'Expert' },
+}
+
+export function Pill({ label, value }: { label: string; value: number | string }) {
+ return (
+
+ )
+}
+
+function CapBadge({ hasCap, isLocal, tierLabel, tierReq, capInfo, localSuffix }: {
+ hasCap: boolean
+ isLocal: boolean
+ tierLabel?: string
+ tierReq?: string
+ capInfo?: { rpm: number | null; batch: number | null; subscribe: number | null } | undefined
+ localSuffix?: string
+}) {
+ if (isLocal) {
+ return (
+
+ 本地计算{localSuffix ? ` · ${localSuffix}` : ''}
+
+ )
+ }
+
+ if (hasCap && capInfo && tierLabel) {
+ const parts = [tierLabel, `${capInfo.rpm}/min`]
+ if (capInfo.batch != null && capInfo.batch > 1) parts.push(`${capInfo.batch}股/批`)
+ return (
+
+ {parts.join(' · ')}
+
+ )
+ }
+
+ if (!hasCap && tierReq) {
+ return (
+
+ 需 {tierReq}
+
+ )
+ }
+
+ if (hasCap) {
+ return (
+
+ {tierLabel ?? '已授权'}
+
+ )
+ }
+
+ return null
+}
+
+export type FieldTab = { label: string; table: string }
+
+export function StatCard({
+ title, hint, stats, isInstrument = false, loading = false,
+ active = false, done = false, skipped = false, stagePct = 0,
+ tierKey, capLimits, tierLabel,
+ auto, onSettings, onShowFields, settingsOpen, subLabel, localBadgeSuffix, fieldTabs,
+}: {
+ title: string
+ hint: string
+ stats: any | null | undefined
+ isInstrument?: boolean
+ loading?: boolean
+ active?: boolean
+ done?: boolean
+ skipped?: boolean
+ stagePct?: number
+ tierKey?: string
+ capLimits?: Record
+ tierLabel?: string
+ onSettings?: () => void
+ onShowFields?: (table?: string) => void
+ settingsOpen?: boolean
+ auto?: boolean
+ subLabel?: string
+ localBadgeSuffix?: string
+ // 多表字段入口: [{label: '维表', table: 'index_instruments'}, ...]
+ // 提供时渲染多个图标按钮(每个对应一张表的字段说明); 否则回退到单个 onShowFields
+ fieldTabs?: FieldTab[]
+}) {
+ const empty = loading || !stats || (stats.rows === 0 && !stats.trading_days && !stats.fields)
+ const borderCls = active
+ ? 'border-accent/50'
+ : done
+ ? 'border-bear/30'
+ : 'border-border'
+ const bgCls = active ? 'bg-accent/[0.03]' : 'bg-surface'
+
+ const meta = tierKey ? CARD_META[tierKey] : undefined
+ const isLocal = meta?.capKey === ''
+ const capInfo = meta?.capKey ? capLimits?.[meta.capKey] : undefined
+ const hasCap = isLocal || !!capInfo
+
+ // 渲染字段说明入口图标
+ // - fieldTabs 提供时: 返回 null (图标由 renderSubLabelInline 内联到文字后)
+ // - 否则: 单个图标按钮 (onShowFields)
+ const renderFieldButtons = () => {
+ if (fieldTabs && fieldTabs.length > 0) return null
+ if (onShowFields) {
+ return (
+ { e.stopPropagation(); onShowFields() }}
+ className="inline-flex align-middle ml-1 p-0.5 rounded hover:bg-elevated transition-colors text-secondary hover:text-accent"
+ title="查看字段说明"
+ >
+
+ )
+ }
+ return null
+ }
+
+ // 单个图标按钮 (复用样式)
+ const fieldIconButton = (tab: FieldTab) => (
+ { e.stopPropagation(); onShowFields?.(tab.table) }}
+ className="inline-flex align-middle -mt-px p-0.5 rounded hover:bg-elevated transition-colors text-secondary hover:text-accent"
+ title={`查看${tab.label}字段说明`}
+ >
+
+ )
+
+ // subLabel 文本内容 (不含图标)
+ const subLabelText = subLabel
+ ?? (isInstrument
+ ? `标的 · ${((stats?.named ?? stats?.rows) ?? 0).toLocaleString()} 个含名称`
+ : stats?.fields
+ ? '字段 · 复权 · 技术指标'
+ : title === '日 K' && stats?.trading_days
+ ? '日 · A股标的 · 日线'
+ : stats?.trading_days && !stats?.rows
+ ? '日 · A股标的 · 分钟级'
+ : (() => {
+ const parts = [`行 · ${(stats?.symbols_covered ?? 0)} 只标的`]
+ if (stats?.trading_days) parts.push(`· ${stats.trading_days} 日`)
+ return parts.join(' ')
+ })())
+
+ // 有 fieldTabs 时: 把 subLabel 按分隔符拆开, 每个匹配词后面内联图标
+ // 例如 "日 · 维表 · 日K · 指标" → 日 · 维表[icon] · 日K[icon] · 指标[icon]
+ const renderSubLabelInline = () => {
+ if (!fieldTabs || fieldTabs.length === 0) {
+ return <>{subLabelText}{renderFieldButtons()}
+ }
+ const labels = fieldTabs.map(t => t.label)
+ // 按非字母数字汉字的分隔符拆分, 保留分隔符
+ const tokens = subLabelText.split(/(\s*·\s*|\s+)/).filter(t => t !== '')
+ const used = new Set()
+ return (
+ <>
+ {tokens.map((tok, i) => {
+ const trimmed = tok.trim()
+ // 跳过纯分隔符
+ if (trimmed === '' || trimmed === '·') return {tok}
+ // 匹配某个 tab label (整体匹配, 避免部分子串误命中)
+ const idx = labels.indexOf(trimmed)
+ if (idx >= 0 && !used.has(trimmed)) {
+ used.add(trimmed)
+ return {tok}{fieldIconButton(fieldTabs[idx])}
+ }
+ return {tok}
+ })}
+
+ )
+ }
+
+ return (
+
+
+
{title}
+
+ {auto !== undefined && !loading && (
+
+ {auto ? '自动' : '关闭'}
+
+ )}
+ {active &&
+ 本次跳过
+
+ )}
+ {onSettings && (
+ { e.stopPropagation(); onSettings() }}
+ className={`p-0.5 rounded hover:bg-elevated transition-colors ${
+ settingsOpen ? 'text-accent' : 'text-secondary'
+ }`}
+ >
+
+ )}
+
+
+
+
{hint}
+
+
+ {loading ? (
+
+
+
+ {loading ? (
+ <>
+
+
+
+ ) : empty ? (
+ <>
+
—
+
+ 暂无数据{renderFieldButtons()}
+
+
+ ) : (
+ <>
+
+ {stats.fields
+ ? stats.fields
+ : stats.trading_days && !stats.rows
+ ? stats.trading_days.toLocaleString()
+ : formatNumber(stats.rows)}
+
+
+ {renderSubLabelInline()}
+
+
+ )}
+
+
+
+ {loading ? (
+ <>
+
+
+
+ ) : empty ? (
+ <>
+
+ {isInstrument ? '快照日' : '起'}
+ —
+
+
+ {isInstrument ? '标的数' : '止'}
+ —
+
+
+ ) : (
+ <>
+
+ {isInstrument ? '快照日' : '起'}
+ {fmtDate(isInstrument ? stats.latest_as_of : stats.earliest_date)}
+
+
+ {isInstrument ? '标的数' : '止'}
+ {isInstrument ? String(stats.rows) : fmtDate(stats.latest_date)}
+
+
+ )}
+
+
+ {active && stagePct > 0 && (
+
+
+ )}
+
([])
+ const [error, setError] = useState('')
+ const detectFileRef = useRef(null)
+ const [detecting, setDetecting] = useState(false)
+ const [dragOver, setDragOver] = useState(false)
+ const [symbolMap, setSymbolMap] = useState>({})
+ const [codeMap, setCodeMap] = useState>({})
+ const [matchStatus, setMatchStatus] = useState<'none' | 'partial' | 'full'>('none')
+ const [selectMapping, setSelectMapping] = useState<{ fields: { name: string; dtype: string; label: string }[]; need: 'symbol' | 'code' | 'both' } | null>(null)
+
+ const create = useMutation({
+ mutationFn: () => {
+ const userF = fields.filter((f) => f.name.trim() && f.name !== 'symbol' && f.name !== 'code')
+ return api.extDataCreate({
+ id,
+ label,
+ mode,
+ fields: [
+ { name: 'symbol', dtype: 'string', label: '标的代码' },
+ { name: 'code', dtype: 'string', label: '代码' },
+ ...userF,
+ ],
+ description: description.trim() || undefined,
+ symbol_map: symbolMap,
+ code_map: codeMap,
+ })
+ },
+ onSuccess: () => {
+ qc.invalidateQueries({ queryKey: QK.extData })
+ onClose()
+ },
+ onError: (err) => setError(String(err)),
+ })
+
+ const addField = () =>
+ setFields([...fields, { name: '', dtype: 'string', label: '' }])
+
+ const removeField = (i: number) =>
+ setFields(fields.filter((_, idx) => idx !== i))
+
+ const updateField = (i: number, key: keyof ExtDataField, val: string) =>
+ setFields(fields.map((f, idx) => (idx === i ? { ...f, [key]: val } : f)))
+
+ const valid = id.trim() && label.trim() && fields.some((f) => f.name.trim()) && matchStatus !== 'none'
+
+ const processDetection = (
+ detected: { name: string; dtype: string; label: string }[],
+ symCands: string[],
+ codeCands: string[],
+ ) => {
+ let sm: Record = {}
+ let cm: Record = {}
+ let status: 'none' | 'partial' | 'full' = 'none'
+
+ if (symCands.length === 1 && codeCands.length === 1) {
+ sm = { type: 'mapped', col: symCands[0] }
+ cm = { type: 'mapped', col: codeCands[0] }
+ status = 'full'
+ } else if (symCands.length === 1 && codeCands.length === 0) {
+ sm = { type: 'mapped', col: symCands[0] }
+ cm = { type: 'computed', from: 'symbol', method: 'strip_exchange' }
+ status = 'full'
+ } else if (symCands.length === 0 && codeCands.length === 1) {
+ cm = { type: 'mapped', col: codeCands[0] }
+ sm = { type: 'computed', from: 'code', method: 'append_exchange' }
+ status = 'full'
+ } else if (symCands.length > 1 || codeCands.length > 1) {
+ setSelectMapping({
+ fields: detected,
+ need: symCands.length > 0 && codeCands.length > 0 ? 'both' : symCands.length > 0 ? 'symbol' : 'code',
+ })
+ setFields(detected)
+ return
+ } else {
+ setSelectMapping({ fields: detected, need: 'both' })
+ setFields(detected)
+ return
+ }
+
+ setSymbolMap(sm)
+ setCodeMap(cm)
+ setMatchStatus(status)
+ setFields(detected)
+ setSelectMapping(null)
+ }
+
+ const handleDetectFile = (e: React.ChangeEvent) => {
+ const file = e.target.files?.[0]
+ if (!file) return
+ e.target.value = ''
+ setDetecting(true); setError(''); setSelectMapping(null)
+ api.extDataDetectFields(file)
+ .then((res) => {
+ processDetection(res.fields, res.symbol_candidates, res.code_candidates)
+ })
+ .catch((err) => setError(String(err)))
+ .finally(() => setDetecting(false))
+ }
+
+ const userFields = fields.filter(f => f.name !== 'symbol' && f.name !== 'code')
+
+ return (
+
+
+
+
+
+
+
新增扩展数据
+
+ 接入自有数据，与标的自动关联（第三方接口或CSV/Excel），支持概念、人气、资金流、舆情、研报评分标签等场景
+
+
+
+
+
+
+
+
数据类型
+
+ {(['snapshot', 'timeseries'] as const).map((m) => {
+ const active = mode === m
+ return (
+
setMode(m)}
+ className={`relative flex items-start gap-3 px-4 py-3 rounded-xl border transition-all duration-200 text-left ${
+ active
+ ? 'border-amber-500/40 bg-amber-500/[0.08] shadow-sm shadow-amber-500/10'
+ : 'border-border bg-elevated/30 hover:bg-elevated/60'
+ }`}
+ >
+
+ {m === 'snapshot' ?
+
+
+ {m === 'snapshot' ? '快照型' : '时序型'}
+
+
+ {m === 'snapshot' ? '每个标的一条，如概念、行业、人气排名' : '按日期记录，如资金流、情绪指数'}
+
+
+ )
+ })}
+
+
+
+
+
+
显示名称
+
setLabel(e.target.value)}
+ placeholder={mode === 'snapshot' ? '例: 概念' : '例: 资金流'}
+ className="w-full h-9 px-3 rounded-lg bg-base border border-border text-xs text-foreground placeholder:text-muted/40 focus:outline-none focus:ring-1 focus:ring-accent/30 focus:border-accent/50 transition-shadow"
+ />
+
+
+
标识符
+
setId(e.target.value.replace(/[^a-zA-Z0-9_]/g, ''))}
+ placeholder={mode === 'snapshot' ? '例: concept' : '例: money_flow'}
+ className="w-full h-9 px-3 rounded-lg bg-base border border-border text-xs text-foreground font-mono placeholder:text-muted/40 focus:outline-none focus:ring-1 focus:ring-accent/30 focus:border-accent/50 transition-shadow"
+ />
+
+
+
+
+
描述
+
setDescription(e.target.value)}
+ placeholder="扩展数据 · 与标的 JOIN（可选自定义描述）"
+ className="w-full h-9 px-3 rounded-lg bg-base border border-border text-xs text-foreground placeholder:text-muted/40 focus:outline-none focus:ring-1 focus:ring-accent/30 focus:border-accent/50 transition-shadow"
+ />
+
+
+
+
字段定义
+
+
+
+ {selectMapping && (
+
+
+ 未自动识别到标的代码，请选择哪一列作为标的代码（symbol）
+
+
+ {selectMapping.fields.map(f => (
+ {
+ const sm = { type: 'mapped', col: f.name }
+ const cm = { type: 'computed', from: 'symbol', method: 'strip_exchange' }
+ setSymbolMap(sm)
+ setCodeMap(cm)
+ setMatchStatus('full')
+ setSelectMapping(null)
+ }}
+ className="px-2.5 py-1 rounded-md bg-accent/10 text-accent text-[10px] font-medium hover:bg-accent/20 transition-colors"
+ >
+ {f.name}
+
+ ))}
+ setSelectMapping(null)}
+ className="px-2.5 py-1 rounded-md bg-elevated text-muted text-[10px] hover:text-secondary transition-colors"
+ >
+ 取消
+
+
+
+ )}
+
+ {userFields.length === 0 ? (
+
detectFileRef.current?.click()}
+ onDragOver={e => { e.preventDefault(); setDragOver(true) }}
+ onDragLeave={() => setDragOver(false)}
+ onDrop={e => {
+ e.preventDefault()
+ setDragOver(false)
+ const file = e.dataTransfer.files[0]
+ if (file) { setDetecting(true); setError(''); setSelectMapping(null); api.extDataDetectFields(file).then(res => { processDetection(res.fields, res.symbol_candidates, res.code_candidates); }).catch(err => setError(String(err))).finally(() => setDetecting(false)) }
+ }}
+ className={`rounded-xl border-2 border-dashed py-6 flex flex-col items-center justify-center gap-2 cursor-pointer transition-colors ${
+ dragOver ? 'border-accent bg-accent/[0.06]' : detecting ? 'border-border/40 pointer-events-none' : 'border-border/30 hover:border-accent/40 hover:bg-accent/[0.02]'
+ }`}
+ >
+ {detecting ? (
+ <>检测字段中…
+ ) : (
+ <>
+ 上传数据文件（CSV / Excel）自动识别数据格式
+ 自动识别列名和类型，symbol 列自动匹配
+
+ )}
+
+ ) : (
+ <>
+
+
detectFileRef.current?.click()}
+ disabled={detecting}
+ className="inline-flex items-center gap-1 px-2 py-0.5 rounded-md text-[10px] text-muted hover:text-accent hover:bg-accent/[0.06] disabled:opacity-40 transition-colors"
+ >
+ {detecting ?
+
+
+
+
+
+
标的代码
+
symbol
+
文本
+ {matchStatus !== 'none'
+ ?
+ {symbolMap.type === 'mapped' ? `← ${symbolMap.col}` : '← 计算'}
+
+ :
}
+
+
+
代码
+
code
+
文本
+ {matchStatus !== 'none'
+ ?
+ {codeMap.type === 'mapped' ? `← ${codeMap.col}` : codeMap.method === 'strip_exchange' ? '← symbol截取' : '← 推算'}
+
+ :
}
+
+ {userFields.map((f) => {
+ const idx = fields.indexOf(f)
+ return (
+
+ updateField(idx, 'dtype', e.target.value)}
+ className="h-7 px-2 rounded-md border border-border bg-base text-[11px] text-foreground"
+ >
+ 文本
+ 整数
+ 小数
+ 布尔
+
+ removeField(idx)}
+ className="p-1 rounded text-muted/40 hover:text-danger hover:bg-danger/10 opacity-0 group-hover:opacity-100 transition-all"
+ >
+
+
+ )
+ })}
+
+
+ )}
+
+
+ {error && (
+
{error}
+ )}
+
+
数据需自行维护和更新，系统不会自动同步
+
+
+ 取消
+
+ create.mutate()}
+ disabled={!valid || create.isPending}
+ className="px-5 py-2 rounded-lg bg-accent text-base text-xs font-medium hover:bg-accent/90 disabled:opacity-40 transition-colors shadow-sm shadow-accent/20"
+ >
+ {create.isPending ? '创建中…' : '创建'}
+
+
+
+
([...config.fields])
+ const [error, setError] = useState('')
+ const detectFileRef = useRef(null)
+ const [detecting, setDetecting] = useState(false)
+ const [symbolMapping, setSymbolMapping] = useState<{ candidates: string[]; file: File } | null>(null)
+
+ const update = useMutation({
+ mutationFn: () =>
+ api.extDataUpdate(config.id, {
+ label: label.trim(),
+ fields: fields.filter((f) => f.name.trim()),
+ description: description.trim() || '',
+ }),
+ onSuccess: () => {
+ qc.invalidateQueries({ queryKey: QK.extData })
+ onClose()
+ },
+ onError: (err) => setError(String(err)),
+ })
+
+ const addField = () =>
+ setFields([...fields, { name: '', dtype: 'string', label: '' }])
+
+ const removeField = (i: number) =>
+ setFields(fields.filter((_, idx) => idx !== i))
+
+ const updateField = (i: number, key: keyof ExtDataField, val: string) =>
+ setFields(fields.map((f, idx) => (idx === i ? { ...f, [key]: val } : f)))
+
+ const valid = label.trim() && fields.some((f) => f.name.trim())
+
+ const applyDetectedFields = (detected: { name: string; dtype: string; label: string }[]) => {
+ const rest = detected.filter(f => f.name !== 'symbol')
+ setFields([
+ { name: 'symbol', dtype: 'string', label: '标的代码' },
+ ...rest,
+ ])
+ }
+
+ const handleDetectFile = (e: React.ChangeEvent) => {
+ const file = e.target.files?.[0]
+ if (!file) return
+ e.target.value = ''
+ setDetecting(true); setError(''); setSymbolMapping(null)
+ api.extDataDetectFields(file)
+ .then((res) => {
+ const hasSym = res.symbol_candidates.length > 0
+ const hasCode = res.code_candidates.length > 0
+ if (hasSym || hasCode) {
+ applyDetectedFields(res.fields)
+ } else {
+ const candidates = res.fields.map(f => f.name)
+ setSymbolMapping({ candidates, file })
+ }
+ })
+ .catch((err) => setError(String(err)))
+ .finally(() => setDetecting(false))
+ }
+
+ const handleSymbolMap = (_col: string) => {
+ if (!symbolMapping) return
+ setDetecting(true); setError('')
+ const rest = fields.filter(f => f.name !== 'symbol')
+ setFields([{ name: 'symbol', dtype: 'string', label: '标的代码' }, ...rest])
+ setSymbolMapping(null)
+ setDetecting(false)
+ }
+
+ return (
+
+
+
+
+
编辑扩展数据
+
+
+
+
+
+
+
+
标识符
+
+ {config.id}
+
+
+
+
数据类型
+
+ {config.mode === 'snapshot' ? '快照型' : '时序型'}
+
+
+
+
+
+ 显示名称
+
+
+
+ 描述
+
+
+
+
+
字段定义
+
+ detectFileRef.current?.click()}
+ disabled={detecting}
+ className="text-[10px] text-accent/80 hover:text-accent inline-flex items-center gap-0.5 disabled:opacity-40"
+ >
+ {detecting ?
+ + 添加字段
+
+
+ {symbolMapping && (
+
+
未找到 symbol 列，请选择哪一列作为标的代码：
+
+ {symbolMapping.candidates.map(col => (
+ handleSymbolMap(col)}
+ className="px-2 py-1 rounded-btn bg-accent/10 text-accent text-[10px] font-medium hover:bg-accent/20 transition-colors"
+ >
+ {col}
+
+ ))}
+ setSymbolMapping(null)}
+ className="px-2 py-1 rounded-btn bg-elevated text-muted text-[10px] hover:text-secondary transition-colors"
+ >
+ 取消
+
+
+
+ )}
+
+ {fields.map((f, i) => {
+ const isBuiltin = f.name === 'symbol' || f.name === 'name'
+ return (
+
+
updateField(i, 'label', e.target.value)}
+ placeholder="显示名"
+ disabled={isBuiltin}
+ className={`w-20 h-7 px-2 rounded-btn border text-[11px] text-foreground placeholder:text-muted/40 focus:outline-none focus:border-accent/50 ${
+ isBuiltin
+ ? 'bg-elevated/50 border-border text-muted cursor-not-allowed'
+ : 'bg-base border-border'
+ }`}
+ />
+
updateField(i, 'name', e.target.value)}
+ placeholder="字段名 (英文)"
+ disabled={isBuiltin}
+ className={`flex-1 h-7 px-2 rounded-btn border text-[11px] font-mono placeholder:text-muted/40 focus:outline-none focus:border-accent/50 ${
+ isBuiltin
+ ? 'bg-elevated/50 border-border text-muted cursor-not-allowed'
+ : 'bg-base border-border'
+ }`}
+ />
+
updateField(i, 'dtype', e.target.value)}
+ disabled={isBuiltin}
+ className={`h-7 px-2 rounded-btn border border-border text-[11px] text-foreground ${
+ isBuiltin ? 'bg-elevated/50 text-muted cursor-not-allowed' : 'bg-base'
+ }`}
+ >
+ 文本
+ 整数
+ 小数
+ 布尔
+
+ {!isBuiltin && fields.length > 3 && (
+
removeField(i)} className="p-1 text-muted hover:text-danger">
+
+ )}
+ {isBuiltin &&
}
+
+ )
+ })}
+
+
+
+ {error && (
+
{error}
+ )}
+
+
+ 取消
+
+ update.mutate()}
+ disabled={!valid || update.isPending}
+ className="px-4 py-1.5 rounded-btn bg-accent/90 text-base text-xs font-medium hover:bg-accent disabled:opacity-40 transition-colors"
+ >
+ {update.isPending ? '保存中…' : '保存'}
+
+
+
+
= { symbol: '000001.SZ' }
+ for (const f of config.fields) {
+ if (f.name === 'symbol' || f.name === 'code') continue
+ exampleRow[f.name] = f.dtype === 'int' ? 100 : f.dtype === 'float' ? 1.5 : f.dtype === 'bool' ? true : '示例'
+ }
+ if (config.fields.some(f => f.name === 'code')) {
+ exampleRow['code'] = '000001'
+ }
+ const exampleBody = {
+ date: config.mode === 'timeseries' ? '2025-01-15' : undefined,
+ rows: [exampleRow],
+ }
+ const exampleJson = JSON.stringify(exampleBody, null, 2)
+ const curlCmd = `curl -X POST http://localhost:${window.location.port || '3018'}/api/ext-data/${config.id}/ingest \\
+ -H 'Content-Type: application/json' \\
+ -d '${JSON.stringify(exampleBody)}'`
+
+ const handleCopy = (text: string) => {
+ navigator.clipboard.writeText(text).then(() => {
+ setCopied(true)
+ setTimeout(() => setCopied(false), 2000)
+ })
+ }
+
+ return (
+
+
+
接口端点
+
+ {endpoint}
+ handleCopy(endpoint)} className="text-muted hover:text-secondary transition-colors">
+ {copied ?
+
+
+
+
+
请求体示例
+
+ {exampleJson}
+
+
+
+
+
+ cURL 示例
+ handleCopy(curlCmd)}
+ className="text-[10px] text-accent hover:text-accent/80 flex items-center gap-0.5 transition-colors"
+ >
+ {copied ?
+
+
+ {curlCmd}
+
+
+
+
+ {config.mode === 'snapshot' ? (
+ <>date 可选，默认当天；每次写入覆盖同日期数据
+ ) : (
+ <>date 必填，指定交易日；按日期分区存储
+ )}
+
+
[]; has_symbol: boolean } | null>(null)
+ const [error, setError] = useState('')
+
+ const handleSave = () => {
+ let headers: Record | undefined
+ if (headerStr.trim()) {
+ try { headers = JSON.parse(headerStr) }
+ catch { setError('Headers 不是有效 JSON'); return }
+ }
+ let field_map: Record | undefined
+ if (fieldMapStr.trim()) {
+ try { field_map = JSON.parse(fieldMapStr) }
+ catch { setError('字段映射不是有效 JSON'); return }
+ }
+ setSaving(true); setError('')
+ api.extDataPullConfig(config.id, {
+ url, method, headers, body: body || undefined,
+ response_path: responsePath, field_map,
+ schedule_minutes: schedule, enabled,
+ }).then(() => onSaved())
+ .catch(e => setError(e.message || '保存失败'))
+ .finally(() => setSaving(false))
+ }
+
+ const handleTest = () => {
+ setTesting(true); setError(''); setTestResult(null)
+ let headers: Record | undefined
+ if (headerStr.trim()) {
+ try { headers = JSON.parse(headerStr) }
+ catch { setError('Headers 不是有效 JSON'); setTesting(false); return }
+ }
+ let field_map: Record | undefined
+ if (fieldMapStr.trim()) {
+ try { field_map = JSON.parse(fieldMapStr) }
+ catch { setError('字段映射不是有效 JSON'); setTesting(false); return }
+ }
+ api.extDataPullConfig(config.id, {
+ url, method, headers, body: body || undefined,
+ response_path: responsePath, field_map,
+ schedule_minutes: schedule, enabled,
+ }).then(() => api.extDataPullTest(config.id))
+ .then(r => { setTestResult(r); onSaved() })
+ .catch(e => setError(e.message || '测试失败'))
+ .finally(() => setTesting(false))
+ }
+
+ const handleRun = () => {
+ setRunning(true); setError('')
+ api.extDataPullRun(config.id)
+ .then(() => onSaved())
+ .catch(e => setError(e.message || '执行失败'))
+ .finally(() => setRunning(false))
+ }
+
+ return (
+
+
+ setMethod(e.target.value)}
+ className="shrink-0 rounded-md border border-border bg-elevated px-2 py-1.5 text-[11px] text-foreground"
+ >
+ GET
+ POST
+
+
+
+
