first commit

frontend/src/views/BacktestView.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import BacktestForm from '@/components/BacktestForm.vue';
+import KLineChart from '@/components/KLineChart.vue';
+import EquityChart from '@/components/EquityChart.vue';
+import MetricsPanel from '@/components/MetricsPanel.vue';
+import { useBacktestStore } from '@/stores/backtest';
+import type { BacktestRequest } from '@/api/types';
+
+const store = useBacktestStore();
+function onRun(req: BacktestRequest) {
+  store.run(req);
+}
+</script>
+
+<template>
+  <BacktestForm :loading="store.loading" @run="onRun" />
+
+  <div v-if="store.error" class="error-banner">{{ store.error }}</div>
+
+  <div v-if="store.loading && store.note" class="placeholder">{{ store.note }}</div>
+
+  <template v-if="store.result">
+    <MetricsPanel :metrics="store.result.metrics" />
+
+    <div class="panel">
+      <KLineChart
+        :candles="store.result.candles"
+        :indicators="store.result.indicators"
+        :signals="store.result.signals"
+        :symbol="store.result.symbol"
+        :timeframe="store.result.timeframe"
+        :strategy="store.result.strategy"
+      />
+    </div>
+
+    <div class="panel">
+      <div class="panel-title">净值曲线</div>
+      <EquityChart :equity="store.result.equity" />
+    </div>
+  </template>
+
+  <div v-else-if="!store.loading" class="placeholder">
+    选好周期与参数，点「开始回测」——先用 DEMO 合成数据跑通。
+  </div>
+</template>