feat: 股息率案例口径 + 策略库与图表统一 + 回测存档完整化
汇总三轮未提交的开发（每轮均在本机 MariaDB + 真实浏览器上验证）：
1) 股息率案例（全市场股息率最高 n 只，默认 20，每 m 月择股）
- 新增日频估值表 daily_basic + 迁移；股息率因子（dv_ratio / dividend_yield / TTM）
- 名称历史表 stock_name_history：剔除 ST 按**择股日当时名称**判定，消除
「曾高股息后 ST」的股息陷阱（实测 3.70pp 偏差）
- 区间择股/调仓双周期（m 择股 / y 调仓）、指数成分与白名单、停牌近似剔除
- 复权因子口径核对（4,164,742 行、缺失 0.0%）、收盘价成交与涨跌停拦单
- 案例实测：2020-01-01~2026-09-04 总收益 +24.86%（年化 3.52%、回撤 -28.58%）
2) 策略库与前端统一
- strategy 表 + CRUD/PUT 原地更新 + `describe_strategy` 按 spec 真实推导
「一句话说明 + 计算公式 + 执行步骤 + 注意事项」（与引擎实执行规则同源）
- 任何出现股票代码处都成对显示名称且可点击进个股页
- 全站图表基座统一 TradingView Lightweight Charts（ECharts 依赖、
锁文件、组件与文档标注一并清除），买卖点标记只落在真实交易日上
3) 回测存档完整化（可往复查看）
- 同步端点（POST /api/backtests、/api/factor-tests）此前完全不落库 → 现在同样归档，
归档 id 经响应头 X-Experiment-Id 返回（不破坏 response_model）
- data_version 首次真实写入（数据快照指纹：最新交易日 + 各表规模）
- 个股收益曲线默认**全量保存**（此前硬截断 60 只）；超出体积预算才裁剪，
并写 archive_meta（机器可读）+ unimplemented（人可读）如实标注
- 列表 kind/q 过滤 + X-Total-Count（此前 limit=50 静默截断）、DELETE 归档
- 只读归档页 /experiments/{id}（Server Component，SSR 直出**选股条件**与
**交易执行依据**）；结果视图按 kind 分发（backtest/factor_test/selection），
非回测归档不套用回测口径
- 新增 CLI：prune_experiments（保留策略，默认 dry-run）、
restore_experiment_from_job（从 Job 副本按原 id 重建被删的历史归档，默认 dry-run）
门禁：pytest 388 passed、ruff All checks passed、tsc 0 错误、图表单测 7 passed、
next build 成功、契约脚本 verify_strategy_workspace 59/59（含按 kind 逐类验证归档页）。
This commit is contained in:
Simon
@@ -1290,3 +1290,518 @@ table.tbl {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
图表（TradingView Lightweight Charts）—— 图例 / tooltip / 容器
|
||||
============================================================ */
|
||||
|
||||
.lw-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--sp-2);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.lw-legend {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--sp-1) var(--sp-2);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lw-legend-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 3px 8px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 999px;
|
||||
background: var(--surface-2);
|
||||
color: var(--text-2);
|
||||
font-size: var(--fs-xs);
|
||||
cursor: pointer;
|
||||
transition: opacity 0.12s ease, border-color 0.12s ease, background 0.12s ease;
|
||||
}
|
||||
|
||||
.lw-legend-item:hover {
|
||||
border-color: var(--line-strong);
|
||||
background: var(--surface-3);
|
||||
}
|
||||
|
||||
.lw-legend-item:focus-visible {
|
||||
outline: 2px solid var(--focus);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.lw-legend-item i {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-radius: 2px;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.lw-legend-item b {
|
||||
color: var(--text-1);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.lw-legend-item.is-off {
|
||||
opacity: 0.42;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.lw-canvas {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
/* tooltip：LW 无内置实现，由 LwChart 订阅十字光标渲染 */
|
||||
.lw-tip {
|
||||
position: absolute;
|
||||
z-index: 5;
|
||||
pointer-events: none;
|
||||
min-width: 132px;
|
||||
padding: 7px 9px;
|
||||
border: 1px solid rgba(150, 165, 195, 0.28);
|
||||
border-radius: var(--r-sm);
|
||||
background: rgba(20, 29, 48, 0.96);
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
|
||||
font-size: var(--fs-xs);
|
||||
}
|
||||
|
||||
.lw-tip-time {
|
||||
color: var(--text-3);
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.lw-tip-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.lw-tip-row i {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 2px;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.lw-tip-label {
|
||||
color: var(--text-2);
|
||||
flex: 1 1 auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.lw-tip-row b {
|
||||
color: var(--text-1);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
股票代码 + 名称（任何出现代码的地方都必须成对出现且可点击）
|
||||
============================================================ */
|
||||
|
||||
.symlink {
|
||||
display: inline-flex;
|
||||
align-items: baseline;
|
||||
gap: 6px;
|
||||
max-width: 100%;
|
||||
padding: 1px 3px;
|
||||
margin: -1px -3px;
|
||||
border-radius: var(--r-xs);
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
transition: background 0.12s ease;
|
||||
}
|
||||
|
||||
.symlink:hover {
|
||||
background: var(--accent-soft);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.symlink:focus-visible {
|
||||
outline: 2px solid var(--focus);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.symlink .sym-code {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.92em;
|
||||
color: var(--text-2);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.symlink:hover .sym-code {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.symlink .sym-name {
|
||||
color: var(--text-1);
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 9em;
|
||||
}
|
||||
|
||||
.symlink .sym-name--missing {
|
||||
color: var(--text-3);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* 名称列优先：窄屏时允许名称换行而不是把代码挤掉 */
|
||||
.sym-cell {
|
||||
min-width: 132px;
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
策略说明与计算公式
|
||||
============================================================ */
|
||||
|
||||
.doc-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
.doc-summary {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--sp-2);
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-left: 3px solid var(--accent);
|
||||
border-radius: var(--r-sm);
|
||||
background: linear-gradient(90deg, rgba(63, 182, 255, 0.08), transparent 70%);
|
||||
color: var(--text-1);
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
.doc-formula {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.doc-formula pre {
|
||||
margin: 0;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-sm);
|
||||
background: var(--bg-1);
|
||||
color: var(--text-1);
|
||||
font-family: var(--font-mono);
|
||||
font-size: var(--fs-xs);
|
||||
line-height: 1.75;
|
||||
overflow-x: auto;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.doc-steps {
|
||||
margin: 0;
|
||||
padding-left: 18px;
|
||||
color: var(--text-2);
|
||||
font-size: var(--fs-sm);
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.doc-steps li b {
|
||||
color: var(--text-1);
|
||||
}
|
||||
|
||||
/* 策略卡片 */
|
||||
.strategy-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
|
||||
gap: var(--sp-4);
|
||||
}
|
||||
|
||||
.strategy-desc {
|
||||
color: var(--text-2);
|
||||
line-height: 1.7;
|
||||
font-size: var(--fs-sm);
|
||||
}
|
||||
|
||||
.strategy-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
实验对比
|
||||
============================================================ */
|
||||
|
||||
.cmp-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
.cmp-diff-add {
|
||||
color: var(--pos);
|
||||
}
|
||||
.cmp-diff-del {
|
||||
color: var(--neg);
|
||||
}
|
||||
.cmp-diff-same {
|
||||
color: var(--text-3);
|
||||
}
|
||||
|
||||
.cmp-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: var(--fs-xs);
|
||||
color: var(--text-3);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
易用性：粘性操作条 / 结果锚点 / 键盘提示
|
||||
============================================================ */
|
||||
|
||||
.sticky-bar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 20;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: var(--sp-3);
|
||||
padding: 10px 12px;
|
||||
margin-bottom: var(--sp-3);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-md);
|
||||
background: rgba(10, 15, 28, 0.92);
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
.kbd {
|
||||
display: inline-block;
|
||||
padding: 1px 5px;
|
||||
border: 1px solid var(--line-strong);
|
||||
border-bottom-width: 2px;
|
||||
border-radius: 4px;
|
||||
background: var(--surface-2);
|
||||
color: var(--text-2);
|
||||
font-family: var(--font-mono);
|
||||
font-size: 11px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 表单校验：错误态 + 行内提示 */
|
||||
.field--invalid input,
|
||||
.field--invalid select {
|
||||
border-color: var(--neg);
|
||||
}
|
||||
|
||||
.field-err {
|
||||
color: var(--neg);
|
||||
font-size: var(--fs-xs);
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
/* 可点击行（表格） */
|
||||
.tbl tbody tr.row-clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* 进度阶段列表 */
|
||||
.stages {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--sp-2);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.stage {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 3px 9px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 999px;
|
||||
background: var(--surface-2);
|
||||
color: var(--text-3);
|
||||
font-size: var(--fs-xs);
|
||||
}
|
||||
|
||||
.stage.is-done {
|
||||
color: var(--pos);
|
||||
border-color: rgba(61, 220, 151, 0.35);
|
||||
}
|
||||
|
||||
.stage.is-active {
|
||||
color: var(--accent);
|
||||
border-color: rgba(63, 182, 255, 0.45);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
/* 面包屑 / 返回 */
|
||||
.crumb {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
color: var(--text-3);
|
||||
font-size: var(--fs-sm);
|
||||
}
|
||||
|
||||
.crumb a {
|
||||
color: var(--text-2);
|
||||
}
|
||||
|
||||
.crumb a:hover {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
/* ---------- 补充：既有页面已在用但此前没有样式规则的类 ---------- */
|
||||
|
||||
/* .dim：次要信息（日期/计数），此前无规则导致与正文同色，层级不清 */
|
||||
.dim {
|
||||
color: var(--text-3);
|
||||
}
|
||||
|
||||
/* .input--invalid：单个输入框的错误态（.field--invalid 是整字段态） */
|
||||
.input--invalid,
|
||||
.input--invalid:focus {
|
||||
border-color: var(--neg);
|
||||
box-shadow: 0 0 0 3px var(--neg-soft);
|
||||
}
|
||||
|
||||
/* ---------- 单选组（买不进补位策略：三选一） ---------- */
|
||||
.radio-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
.radio-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 7px;
|
||||
font-size: 13px;
|
||||
color: var(--text-2);
|
||||
cursor: pointer;
|
||||
line-height: 1.45;
|
||||
}
|
||||
.radio-row input {
|
||||
margin-top: 2px;
|
||||
flex: none;
|
||||
}
|
||||
.radio-row:hover {
|
||||
color: var(--text-1);
|
||||
}
|
||||
|
||||
/* ---------- 归档详情：元数据条 / KV / 规格表 / 代码块 ---------- */
|
||||
|
||||
/* 归档元数据与完整度提示条：信息密度高但不抢图表注意力 */
|
||||
.archive-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
padding: 9px 12px;
|
||||
margin: 0 0 10px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-sm);
|
||||
background: linear-gradient(180deg, var(--surface-2), var(--surface-1));
|
||||
}
|
||||
|
||||
.kv-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
|
||||
gap: 8px 18px;
|
||||
}
|
||||
|
||||
.kv {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 8px;
|
||||
font-size: 13px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.kv__k {
|
||||
flex: none;
|
||||
color: var(--text-3);
|
||||
}
|
||||
|
||||
.kv__v {
|
||||
color: var(--text-1);
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.kv__v--warn {
|
||||
color: var(--warn);
|
||||
}
|
||||
|
||||
/* 规格表：选股条件 / 交易执行依据 */
|
||||
.spec-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.spec-block {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-sm);
|
||||
padding: 10px 12px;
|
||||
background: var(--surface-1);
|
||||
}
|
||||
|
||||
.spec-block__title {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.04em;
|
||||
color: var(--text-2);
|
||||
margin-bottom: 8px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px dashed var(--line);
|
||||
}
|
||||
|
||||
.spec-row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: baseline;
|
||||
font-size: 13px;
|
||||
padding: 3px 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.spec-row__k {
|
||||
flex: none;
|
||||
min-width: 96px;
|
||||
color: var(--text-3);
|
||||
}
|
||||
|
||||
.spec-row__v {
|
||||
color: var(--text-1);
|
||||
min-width: 0;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.codeblock {
|
||||
max-height: 420px;
|
||||
overflow: auto;
|
||||
font-size: 12px;
|
||||
line-height: 1.55;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-sm);
|
||||
background: var(--bg-1);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
/* 行内代码：后端说明文本用 `…` 标记字段/命令名 */
|
||||
.inline-code {
|
||||
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
|
||||
font-size: 0.92em;
|
||||
padding: 1px 5px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--r-xs);
|
||||
background: var(--bg-2);
|
||||
color: var(--text-1);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user