From a7aab01f051487327e5ce52b6a8905208c546e8c Mon Sep 17 00:00:00 2001 From: "Somhairle H. Marisol" Date: Fri, 18 Sep 2026 15:49:44 +0800 Subject: [变更性质] feat(frontend) [新增功能] 12 页面组件全量 shadcn：Card/Button/Table/Tabs/Select/Alert；375 底部 Tab Bar 改用 Tabs 组件实现 [实现方案] 页面级手写 class 全部移除（.btn/.banner/table.data/.badge/.tabs/.metric-row/.m-tile/.hint 等改为 shadcn + tailwind 工具类）；Modal/DatasetWizard/DatasetCard/DiffView/CodeEditor/Status/Layout 同步 [影响范围] src/pages/*.svelte、src/components/*.svelte MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/components/CodeEditor.svelte | 27 +- frontend/src/components/DatasetCard.svelte | 60 ++--- frontend/src/components/DatasetWizard.svelte | 223 ++++++++------- frontend/src/components/DiffView.svelte | 41 +-- frontend/src/components/Layout.svelte | 344 ++++++------------------ frontend/src/components/Loading.svelte | 28 +- frontend/src/components/Modal.svelte | 33 +-- frontend/src/components/Page.svelte | 22 +- frontend/src/components/ProjectMetricRow.svelte | 58 ++-- frontend/src/components/Status.svelte | 60 +---- frontend/src/pages/AccountPage.svelte | 24 +- frontend/src/pages/AdminPage.svelte | 74 ++--- frontend/src/pages/AuthPages.svelte | 154 +++++------ frontend/src/pages/ProjectBacktestTab.svelte | 136 +++++----- frontend/src/pages/ProjectDataTab.svelte | 2 +- frontend/src/pages/ProjectPage.svelte | 35 +-- frontend/src/pages/ProjectStrategyTab.svelte | 182 ++++++------- frontend/src/pages/ProjectsPage.svelte | 52 ++-- frontend/src/pages/RunsPage.svelte | 28 +- frontend/src/pages/UsagePage.svelte | 22 +- 20 files changed, 606 insertions(+), 999 deletions(-) (limited to 'frontend/src') diff --git a/frontend/src/components/CodeEditor.svelte b/frontend/src/components/CodeEditor.svelte index 544a6a4..da11555 100644 --- a/frontend/src/components/CodeEditor.svelte +++ b/frontend/src/components/CodeEditor.svelte @@ -15,6 +15,7 @@ } let { value, onInput, height = 420, readOnly = false, label }: Props = $props(); + const hostClass = 'rounded-md border border-border overflow-hidden bg-card [&>.cm-editor]:min-h-[60px]'; let host: HTMLDivElement; let view: EditorView | null = null; let applyingExternal = false; @@ -41,8 +42,8 @@ EditorView.theme({ '&': { fontSize: '13px', - background: 'var(--surface)', - color: 'var(--text)', + background: 'var(--card)', + color: 'var(--foreground)', fontFamily: "ui-monospace, 'SF Mono', Menlo, Consolas, 'Noto Sans Mono CJK SC', monospace" }, @@ -50,12 +51,12 @@ '.cm-scroller': { lineHeight: '1.55' }, '&.cm-focused': { outline: 'none' }, '.cm-gutters': { - background: 'var(--surface)', + background: 'var(--card)', border: 'none', - color: 'var(--text-3)' + color: 'var(--muted-foreground)' }, - '.cm-activeLine': { background: 'var(--surface-2)' }, - '.cm-activeLineGutter': { background: 'var(--surface-2)' } + '.cm-activeLine': { background: 'var(--secondary)' }, + '.cm-activeLineGutter': { background: 'var(--secondary)' } }), EditorView.updateListener.of((u) => { if (applyingExternal) return; @@ -88,17 +89,7 @@
- {#if label}{label}{/if} -
+ {#if label}{label}{/if} +
- diff --git a/frontend/src/components/DatasetCard.svelte b/frontend/src/components/DatasetCard.svelte index 69083fb..266c9a4 100644 --- a/frontend/src/components/DatasetCard.svelte +++ b/frontend/src/components/DatasetCard.svelte @@ -119,50 +119,49 @@ {#if ds} -
+
- {ds.name ?? '未命名数据集'} - {#if ds.manifest_hash}manifest {ds.manifest_hash.slice(0, 10)}…{/if} + {ds.name ?? '未命名数据集'} + {#if ds.manifest_hash}manifest {ds.manifest_hash.slice(0, 10)}…{/if} {#if ds.cache_hit}缓存命中 · 复用现有物化对象{/if}
- + {datasetStatusLabel[ds.status]}
-
+
- 请求标的 + 请求标的 {(ds.request.instruments ?? []).map(instrumentLabel).join('；')} - 范围 + 范围 {ds.request.start_date} ~ {ds.request.end_date} · {ds.request.frequency} · {adjustmentLabel[ds.request.adjustment] ?? ds.request.adjustment} - 字段 + 字段 {(ds.request.fields ?? []).join(', ')} - 创建时间 + 创建时间 {fmtDate(ds.created_at)}
{#if ds.status === 'failed'} - {ds.error ?? '数据获取失败'} -
- {#if recreatedId} - + 已用原请求创建新数据集（编号 {recreatedId.slice(0, 8)}…），新数据集出现在下方列表并自动跟踪进度；本条失败记录原样保留。 {/if} @@ -176,22 +175,22 @@
{#if showPreview} -
+
{#if preview} {@const cov = summarizeCoverage(preview.coverage ?? [])} {#if cov.warnings.length > 0} -
-
覆盖差异（共有区间 {cov.common.start ?? '—'} ~ {cov.common.end ?? '—'}）：
-
    +
    +
    覆盖差异（共有区间 {cov.common.start ?? '—'} ~ {cov.common.end ?? '—'}）：
    +
      {#each cov.warnings as w, i (i)}
    • {w}
      • {/each}
    {/if} {#if (preview.coverage ?? []).some((c) => (c.warnings ?? []).length > 0)} -
    -
    来源与口径说明：
    -
      +
      +
      来源与口径说明：
      +
        {#each preview.coverage.filter((c) => (c.warnings ?? []).length > 0) as c (c.instrument)}
      • {c.instrument}：{(c.warnings ?? []).join('；')}
        • {/each} @@ -199,12 +198,12 @@
      {/if} {#if cov.common.start && cov.warnings.length === 0} - + 覆盖平稳：共有可用区间 {cov.common.start} ~ {cov.common.end}。可以直接用于回测。 {/if} -
      +
      @@ -214,14 +213,14 @@ {#each preview.rows as row, i (i)} - {#each preview.columns as c (c)}{row[c]}{/each} + {#each preview.columns as c (c)}{row[c]}{/each} {/each}
      {#if preview.truncated} -

      预览仅展示部分行

      +

      预览仅展示部分行

      {/if} {/if}
      @@ -231,14 +230,3 @@ {/if} - - diff --git a/frontend/src/components/DatasetWizard.svelte b/frontend/src/components/DatasetWizard.svelte index d9e923a..e6ec105 100644 --- a/frontend/src/components/DatasetWizard.svelte +++ b/frontend/src/components/DatasetWizard.svelte @@ -3,6 +3,11 @@ import { Button } from '$lib/components/ui/button'; import { Badge } from '$lib/components/ui/badge'; import { Alert } from '$lib/components/ui/alert'; + import { Input } from '$lib/components/ui/input'; + import { Label } from '$lib/components/ui/label'; + import * as Card from '$lib/components/ui/card'; + import * as Select from '$lib/components/ui/select'; + import * as Table from '$lib/components/ui/table'; import { getCapabilities, searchInstruments, createDataset } from '../lib/client'; import { extractStatusMessage } from '../lib/state'; import { adjustmentLabel, assetTypeLabel, itemSourceLabel } from '../lib/format'; @@ -180,17 +185,16 @@ } -
      +

      新建数据集

      {#if caps} -
      -

      1) 选择标的 最多 {maxSymbols} 个 · 日频 POC

      -
      - +

      1) 选择标的 最多 {maxSymbols} 个 · 日频 POC

      +
      + doSearch()}>重试 {/if} {#if searchItems.length > 0} - - - - - - {#each searchItems as inst (inst.market + '.' + inst.symbol + inst.asset_type + '.' + (inst.source ?? 'unknown'))} - - - - - - - - {/each} - -
      代码类型名称来源
      {inst.market}.{inst.symbol}{assetTypeLabel[inst.asset_type] ?? inst.asset_type}{inst.name ?? '—'}{itemSourceLabel(inst.source, searchSource)} - -
      +
      + + + 代码类型名称来源 + + + {#each searchItems as inst (inst.market + '.' + inst.symbol + inst.asset_type + '.' + (inst.source ?? 'unknown'))} + + {inst.market}.{inst.symbol} + {assetTypeLabel[inst.asset_type] ?? inst.asset_type} + {inst.name ?? '—'} + {itemSourceLabel(inst.source, searchSource)} + + + + + {/each} + + +
      {/if}
      手动录入标的（目录未收录时） -
      -

      仅接受确切标识，不会推断市场或类型。请与供应商页面核对后再录入。

      -
      - - - - + +

      仅接受确切标识，不会推断市场或类型。请与供应商页面核对后再录入。

      +
      +
      + + +
      +
      + + (market = v)}> + {market} + + {#each ['SH', 'SZ', 'BJ'] as m (m)} + {m} + {/each} + + +
      +
      + + (assetType = v)}> + {assetTypeLabel[assetType] ?? assetType} + + {#each caps.asset_types as t (t)} + {assetTypeLabel[t] ?? t} + {/each} + + +
      +
      + + +
      -
      - +
      +
      -
      +
      -

      2) 已选标的 {selected.length}/{maxSymbols}

      +

      2) 已选标的 {selected.length}/{maxSymbols}

      {#if selected.length === 0} -

      尚未选择标的。指数仅可作研究中枢，不可直接交易。

      +

      尚未选择标的。指数仅可作研究中枢，不可直接交易。

      {:else} -
        +
          {#each selected as s, i (s.market + '.' + s.symbol + s.asset_type)} -
        • - {s.market}.{s.symbol} - {#if s.name}{s.name}{/if} +
        • + {s.market}.{s.symbol} + {#if s.name}{s.name}{/if} {assetTypeLabel[s.asset_type] ?? s.asset_type}
          • @@ -285,67 +297,72 @@ {/if}
      -
      - - -