From 61f5c545953bb4ee20b123bf9671ac35d7f1f3c1 Mon Sep 17 00:00:00 2001
From: "Somhairle H. Marisol" <muqiu-han@outlook.com>
Date: Fri, 18 Sep 2026 12:03:32 +0800
Subject: [变更性质] feat(frontend) [新增功能] round3 页面组件全量迁移
 shadcn-svelte（12 页面 + Modal/DatasetWizard/DatasetCard/Status） [实现方案]
 .btn→Button、.banner→Alert、table.data→Table.Root、.badge→Badge、.tabs→Tabs.Root、.metric-card/form.card→Card.Root；ProjectStrategyTab
 div 配对修复 [影响范围] src/pages/*.svelte、src/components/*.svelte
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/DatasetWizard.svelte | 31 +++++++++++++++-------------
 1 file changed, 17 insertions(+), 14 deletions(-)

(limited to 'frontend/src/components/DatasetWizard.svelte')

diff --git a/frontend/src/components/DatasetWizard.svelte b/frontend/src/components/DatasetWizard.svelte
index 1e61d92..d9e923a 100644
--- a/frontend/src/components/DatasetWizard.svelte
+++ b/frontend/src/components/DatasetWizard.svelte
@@ -1,5 +1,8 @@
 <script lang="ts">
   import Status from './Status.svelte';
+  import { Button } from '$lib/components/ui/button';
+  import { Badge } from '$lib/components/ui/badge';
+  import { Alert } from '$lib/components/ui/alert';
   import { getCapabilities, searchInstruments, createDataset } from '../lib/client';
   import { extractStatusMessage } from '../lib/state';
   import { adjustmentLabel, assetTypeLabel, itemSourceLabel } from '../lib/format';
@@ -196,13 +199,13 @@
           }}
           aria-label="标的搜索"
         />
-        <button class="btn" disabled={searchBusy || !query.trim()} onclick={() => doSearch()}>
+        <Button variant="outline" disabled={searchBusy || !query.trim()} onclick={() => doSearch()}>
           {searchBusy ? '搜索中…' : '搜索'}
-        </button>
+        </Button>
       </div>
       <Status busy={searchBusy} busyText="搜索中…" error={searchErr} empty={null} />
       {#if searchErr && !searchBusy}
-        <button class="btn small" onclick={() => doSearch()}>重试</button>
+        <Button variant="outline" size="sm" onclick={() => doSearch()}>重试</Button>
       {/if}
       {#if searchItems.length > 0}
         <table class="data">
@@ -217,9 +220,9 @@
                 <td>{inst.name ?? '—'}</td>
                 <td class="hint">{itemSourceLabel(inst.source, searchSource)}</td>
                 <td>
-                  <button class="btn small" onclick={() => addSelection(inst)} disabled={inst.asset_type === 'index' && selected.some((s) => sameInstrument(s, inst))}>
+                  <Button variant="outline" size="sm" onclick={() => addSelection(inst)} disabled={inst.asset_type === 'index' && selected.some((s) => sameInstrument(s, inst))}>
                     {inst.asset_type === 'index' ? '加入（基准研究）' : '加入'}
-                  </button>
+                  </Button>
                 </td>
               </tr>
             {/each}
@@ -258,7 +261,7 @@
             </label>
           </div>
           <div class="row">
-            <button class="btn" onclick={addManual}>加入所选</button>
+            <Button onclick={addManual}>加入所选</Button>
           </div>
         </div>
       </details>
@@ -274,8 +277,8 @@
             <li>
               <span class="num">{s.market}.{s.symbol}</span>
               {#if s.name}<span class="hint">{s.name}</span>{/if}
-              <span class="badge grey">{assetTypeLabel[s.asset_type] ?? s.asset_type}</span>
-              <button class="btn small ghost" aria-label={`移除 ${s.symbol}`} onclick={() => selected.splice(i, 1)}>✕</button>
+              <Badge variant="outline">{assetTypeLabel[s.asset_type] ?? s.asset_type}</Badge>
+              <Button variant="ghost" size="icon-sm" aria-label={`移除 ${s.symbol}`} onclick={() => selected.splice(i, 1)}>✕</Button>
             </li>
           {/each}
         </ul>
@@ -329,24 +332,24 @@
     </details>
 
     {#if formErr.length > 0}
-      <div class="banner error" role="alert">
+      <Alert variant="destructive" class="bg-[var(--danger-soft)] border-[#f2c7c7]" role="alert">
         <span aria-hidden="true">⚠</span>
         <ul class="err-list">
           {#each formErr as msg, i (i)}<li>{msg}</li>{/each}
         </ul>
-      </div>
+      </Alert>
     {/if}
     {#if submitErr}
-      <div class="banner error" role="alert">
+      <Alert variant="destructive" class="bg-[var(--danger-soft)] border-[#f2c7c7]" role="alert">
         <span aria-hidden="true">⚠</span>
         <span>数据请求提交失败：{submitErr}</span>
-      </div>
+      </Alert>
     {/if}
     <p class="hint formhint">数据请求会进入队列异步获取。配置仅保存你填写的请求，不预填演示数据。</p>
     <div>
-      <button class="btn primary" disabled={submitting || selected.length === 0} onclick={submit}>
+      <Button disabled={submitting || selected.length === 0} onclick={submit}>
         {submitting ? '提交中…' : '提交数据请求'}
-      </button>
+      </Button>
     </div>
   {/if}
 
-- 
cgit v1.2.3