diff --git a/frontend_vue/src/App.vue b/frontend_vue/src/App.vue
index f9d9e09..2112f0a 100644
--- a/frontend_vue/src/App.vue
+++ b/frontend_vue/src/App.vue
@@ -17,7 +17,7 @@ export default {
   },
   computed: {
     locale () {
-      // 只是为了切换语言时，更新标题
+      // Simply to update the title when switching languages
       const { title } = this.$route.meta
       title && (setDocumentTitle(`${i18nRender(title)} - ${domTitle}`))
 
diff --git a/frontend_vue/src/api/strategy.js b/frontend_vue/src/api/strategy.js
index fa96123..5889ea5 100644
--- a/frontend_vue/src/api/strategy.js
+++ b/frontend_vue/src/api/strategy.js
@@ -4,6 +4,9 @@ const api = {
   // Local Python backend
   strategies: '/api/strategies',
   strategyDetail: '/api/strategies/detail',
+  strategyBacktest: '/api/strategies/backtest',
+  strategyBacktestHistory: '/api/strategies/backtest/history',
+  strategyBacktestRun: '/api/strategies/backtest/get',
   createStrategy: '/api/strategies/create',
   batchCreateStrategies: '/api/strategies/batch-create',
   updateStrategy: '/api/strategies/update',
@@ -22,9 +25,9 @@ const api = {
 }
 
 /**
- * 获取策略列表
- * @param {Object} params - 查询参数
- * @param {number} params.user_id - 用户ID（可选）
+ * Get strategy list.
+ * @param {Object} params - Query parameters.
+ * @param {number} params.user_id - User ID (optional).
  */
 export function getStrategyList (params = {}) {
   return request({
@@ -35,8 +38,8 @@ export function getStrategyList (params = {}) {
 }
 
 /**
- * 获取策略详情
- * @param {number} id - 策略ID
+ * Get strategy detail.
+ * @param {number} id - Strategy ID.
  */
 export function getStrategyDetail (id) {
   return request({
@@ -47,14 +50,60 @@ export function getStrategyDetail (id) {
 }
 
 /**
- * 创建策略
- * @param {Object} data - 策略数据
- * @param {number} data.user_id - 用户ID
- * @param {string} data.strategy_name - 策略名称
- * @param {string} data.strategy_type - 策略类型
- * @param {Object} data.llm_model_config - LLM模型配置
- * @param {Object} data.exchange_config - 交易所配置
- * @param {Object} data.trading_config - 交易配置
+ * Run a strategy backtest.
+ * @param {Object} data - Backtest request payload.
+ * @param {number} data.strategyId - Strategy ID.
+ * @param {string} data.startDate - Start date in YYYY-MM-DD.
+ * @param {string} data.endDate - End date in YYYY-MM-DD.
+ * @param {Object} data.overrideConfig - Optional override config.
+ */
+export function runStrategyBacktest (data) {
+  return request({
+    url: api.strategyBacktest,
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * Get strategy backtest history.
+ * @param {Object} params - Query parameters.
+ * @param {number} params.strategyId - Strategy ID.
+ * @param {number} params.limit - Max record count (optional).
+ * @param {number} params.offset - Pagination offset (optional).
+ * @param {string} params.symbol - Symbol filter (optional).
+ * @param {string} params.market - Market filter (optional).
+ * @param {string} params.timeframe - Timeframe filter (optional).
+ */
+export function getStrategyBacktestHistory (params = {}) {
+  return request({
+    url: api.strategyBacktestHistory,
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * Get a single strategy backtest run.
+ * @param {number} runId - Backtest run ID.
+ */
+export function getStrategyBacktestRun (runId) {
+  return request({
+    url: api.strategyBacktestRun,
+    method: 'get',
+    params: { runId }
+  })
+}
+
+/**
+ * Create a strategy.
+ * @param {Object} data - Strategy payload.
+ * @param {number} data.user_id - User ID.
+ * @param {string} data.strategy_name - Strategy name.
+ * @param {string} data.strategy_type - Strategy type.
+ * @param {Object} data.llm_model_config - LLM model config.
+ * @param {Object} data.exchange_config - Exchange config.
+ * @param {Object} data.trading_config - Trading config.
  */
 export function createStrategy (data) {
   return request({
@@ -65,10 +114,10 @@ export function createStrategy (data) {
 }
 
 /**
- * 批量创建策略（多币种）
- * @param {Object} data - 策略数据
- * @param {string} data.strategy_name - 策略基础名称
- * @param {Array} data.symbols - 币种数组，如 ["Crypto:BTC/USDT", "Crypto:ETH/USDT"]
+ * Batch create strategies for multiple symbols.
+ * @param {Object} data - Strategy payload.
+ * @param {string} data.strategy_name - Base strategy name.
+ * @param {Array} data.symbols - Symbol list, for example ["Crypto:BTC/USDT", "Crypto:ETH/USDT"].
  */
 export function batchCreateStrategies (data) {
   return request({
@@ -79,13 +128,13 @@ export function batchCreateStrategies (data) {
 }
 
 /**
- * 更新策略
- * @param {number} id - 策略ID
- * @param {Object} data - 策略数据
- * @param {string} data.strategy_name - 策略名称（可选）
- * @param {Object} data.indicator_config - 技术指标配置（可选）
- * @param {Object} data.exchange_config - 交易所配置（可选）
- * @param {Object} data.trading_config - 交易配置（可选）
+ * Update a strategy.
+ * @param {number} id - Strategy ID.
+ * @param {Object} data - Strategy payload.
+ * @param {string} data.strategy_name - Strategy name (optional).
+ * @param {Object} data.indicator_config - Indicator config (optional).
+ * @param {Object} data.exchange_config - Exchange config (optional).
+ * @param {Object} data.trading_config - Trading config (optional).
  */
 export function updateStrategy (id, data) {
   return request({
@@ -97,8 +146,8 @@ export function updateStrategy (id, data) {
 }
 
 /**
- * 停止策略
- * @param {number} id - 策略ID
+ * Stop a strategy.
+ * @param {number} id - Strategy ID.
  */
 export function stopStrategy (id) {
   return request({
@@ -109,8 +158,8 @@ export function stopStrategy (id) {
 }
 
 /**
- * 启动策略
- * @param {number} id - 策略ID
+ * Start a strategy.
+ * @param {number} id - Strategy ID.
  */
 export function startStrategy (id) {
   return request({
@@ -121,8 +170,8 @@ export function startStrategy (id) {
 }
 
 /**
- * 删除策略
- * @param {number} id - 策略ID
+ * Delete a strategy.
+ * @param {number} id - Strategy ID.
  */
 export function deleteStrategy (id) {
   return request({
@@ -133,10 +182,10 @@ export function deleteStrategy (id) {
 }
 
 /**
- * 批量启动策略
+ * Batch start strategies.
  * @param {Object} data
- * @param {Array} data.strategy_ids - 策略ID数组
- * @param {string} data.strategy_group_id - 策略组ID（可选，与strategy_ids二选一）
+ * @param {Array} data.strategy_ids - Strategy ID list.
+ * @param {string} data.strategy_group_id - Strategy group ID (optional, mutually exclusive with strategy_ids).
  */
 export function batchStartStrategies (data) {
   return request({
@@ -147,10 +196,10 @@ export function batchStartStrategies (data) {
 }
 
 /**
- * 批量停止策略
+ * Batch stop strategies.
  * @param {Object} data
- * @param {Array} data.strategy_ids - 策略ID数组
- * @param {string} data.strategy_group_id - 策略组ID（可选，与strategy_ids二选一）
+ * @param {Array} data.strategy_ids - Strategy ID list.
+ * @param {string} data.strategy_group_id - Strategy group ID (optional, mutually exclusive with strategy_ids).
  */
 export function batchStopStrategies (data) {
   return request({
@@ -161,10 +210,10 @@ export function batchStopStrategies (data) {
 }
 
 /**
- * 批量删除策略
+ * Batch delete strategies.
  * @param {Object} data
- * @param {Array} data.strategy_ids - 策略ID数组
- * @param {string} data.strategy_group_id - 策略组ID（可选，与strategy_ids二选一）
+ * @param {Array} data.strategy_ids - Strategy ID list.
+ * @param {string} data.strategy_group_id - Strategy group ID (optional, mutually exclusive with strategy_ids).
  */
 export function batchDeleteStrategies (data) {
   return request({
@@ -175,8 +224,8 @@ export function batchDeleteStrategies (data) {
 }
 
 /**
- * 测试交易所连接
- * @param {Object} exchangeConfig - 交易所配置
+ * Test exchange connection.
+ * @param {Object} exchangeConfig - Exchange config.
  */
 export function testExchangeConnection (exchangeConfig) {
   return request({
@@ -187,8 +236,8 @@ export function testExchangeConnection (exchangeConfig) {
 }
 
 /**
- * 获取策略交易记录
- * @param {number} id - 策略ID
+ * Get strategy trade records.
+ * @param {number} id - Strategy ID.
  */
 export function getStrategyTrades (id) {
   return request({
@@ -199,8 +248,8 @@ export function getStrategyTrades (id) {
 }
 
 /**
- * 获取策略持仓记录
- * @param {number} id - 策略ID
+ * Get strategy position records.
+ * @param {number} id - Strategy ID.
  */
 export function getStrategyPositions (id) {
   return request({
@@ -211,8 +260,8 @@ export function getStrategyPositions (id) {
 }
 
 /**
- * 获取策略净值曲线
- * @param {number} id - 策略ID
+ * Get strategy equity curve.
+ * @param {number} id - Strategy ID.
  */
 export function getStrategyEquityCurve (id) {
   return request({
@@ -223,9 +272,9 @@ export function getStrategyEquityCurve (id) {
 }
 
 /**
- * 获取策略运行日志
- * @param {number} id - 策略ID
- * @param {number} limit - 最大日志条数
+ * Get strategy runtime logs.
+ * @param {number} id - Strategy ID.
+ * @param {number} limit - Maximum log count.
  */
 export function getStrategyLogs (id, limit = 200) {
   return request({
diff --git a/frontend_vue/src/components/MultiTab/MultiTab.vue b/frontend_vue/src/components/MultiTab/MultiTab.vue
index fe2c3f7..aafe70c 100644
--- a/frontend_vue/src/components/MultiTab/MultiTab.vue
+++ b/frontend_vue/src/components/MultiTab/MultiTab.vue
@@ -44,7 +44,7 @@ export default {
     remove (targetKey) {
       this.pages = this.pages.filter(page => page.fullPath !== targetKey)
       this.fullPathList = this.fullPathList.filter(path => path !== targetKey)
-      // 判断当前标签是否关闭，若关闭则跳转到最后一个还存在的标签页
+      // Check if current tab is closed; if so, navigate to the last remaining tab
       if (!this.fullPathList.includes(this.activeKey)) {
         this.selectedLastPath()
       }
@@ -55,11 +55,11 @@ export default {
 
     // content menu
     closeThat (e) {
-      // 判断是否为最后一个标签页，如果是最后一个，则无法被关闭
+      // Check if it is the last tab; if so, it cannot be closed
       if (this.fullPathList.length > 1) {
         this.remove(e)
       } else {
-        this.$message.info('这是最后一个标签了, 无法被关闭')
+        this.$message.info('This is the last tab and cannot be closed')
       }
     },
     closeLeft (e) {
@@ -71,7 +71,7 @@ export default {
           }
         })
       } else {
-        this.$message.info('左侧没有标签')
+        this.$message.info('No tabs on the left')
       }
     },
     closeRight (e) {
@@ -83,7 +83,7 @@ export default {
           }
         })
       } else {
-        this.$message.info('右侧没有标签')
+        this.$message.info('No tabs on the right')
       }
     },
     closeAll (e) {
@@ -100,10 +100,10 @@ export default {
     renderTabPaneMenu (e) {
       return (
         <a-menu {...{ on: { click: ({ key, item, domEvent }) => { this.closeMenuClick(key, e) } } }}>
-          <a-menu-item key="closeThat">关闭当前标签</a-menu-item>
-          <a-menu-item key="closeRight">关闭右侧</a-menu-item>
-          <a-menu-item key="closeLeft">关闭左侧</a-menu-item>
-          <a-menu-item key="closeAll">关闭全部</a-menu-item>
+          <a-menu-item key="closeThat">Close current tab</a-menu-item>
+          <a-menu-item key="closeRight">Close right</a-menu-item>
+          <a-menu-item key="closeLeft">Close left</a-menu-item>
+          <a-menu-item key="closeAll">Close all</a-menu-item>
         </a-menu>
       )
     },
diff --git a/frontend_vue/src/components/PolymarketAnalysisModal.vue b/frontend_vue/src/components/PolymarketAnalysisModal.vue
index c15d0ea..3f70323 100644
--- a/frontend_vue/src/components/PolymarketAnalysisModal.vue
+++ b/frontend_vue/src/components/PolymarketAnalysisModal.vue
@@ -2,197 +2,36 @@
   <a-modal
     :visible="visible"
     :title="tt('polymarket.analysis.title', 'Polymarket Analysis')"
-    :width="900"
+    :width="960"
     :footer="null"
+    :destroyOnClose="true"
     :wrap-class-name="isDarkTheme ? 'qd-dark-modal' : ''"
     :mask-closable="false"
     @cancel="handleClose"
   >
-    <div class="polymarket-analysis-modal" :class="{ 'theme-dark': isDarkTheme }">
-      <a-tabs v-model="activeTab" @change="handleTabChange">
-        <a-tab-pane key="analyze" :tab="tt('polymarket.analysis.tabAnalyze', 'Analyze')">
-          <div v-if="!analysisResult" class="input-section">
-            <a-alert
-              style="margin-bottom: 16px"
-              type="info"
-              show-icon
-              :message="tt('polymarket.analysis.inputHint', 'Paste a Polymarket URL or market title to start analysis.')"
-            />
-            <a-textarea
-              v-model="inputText"
-              :rows="3"
-              :disabled="analyzing"
-              :placeholder="tt('polymarket.analysis.inputPlaceholder', 'https://polymarket.com/... or a market title')"
-              @pressEnter="handleAnalyze"
-            />
-            <a-button
-              style="width: 100%; margin-top: 12px"
-              type="primary"
-              size="large"
-              icon="thunderbolt"
-              :loading="analyzing"
-              :disabled="!inputText.trim()"
-              @click="handleAnalyze"
-            >
-              {{ tt('polymarket.analysis.analyzeButton', 'Analyze') }}
-            </a-button>
-          </div>
-
-          <div v-if="analysisResult" class="result-section">
-            <div class="market-info">
-              <h3>{{ analysisResult.market.question }}</h3>
-              <div class="market-meta">
-                <a-tag :color="getStatusColor(analysisResult.market.status)">{{ analysisResult.market.status }}</a-tag>
-                <span class="meta-item"><a-icon type="percentage" /> {{ analysisResult.market.current_probability }}%</span>
-                <span v-if="analysisResult.market.volume_24h" class="meta-item"><a-icon type="dollar" /> {{ formatVolume(analysisResult.market.volume_24h) }}</span>
-                <a-button
-                  v-if="analysisResult.market.polymarket_url"
-                  type="link"
-                  size="small"
-                  icon="link"
-                  :href="analysisResult.market.polymarket_url"
-                  target="_blank"
-                >
-                  {{ tt('polymarket.analysis.viewOnPolymarket', 'Open on Polymarket') }}
-                </a-button>
-              </div>
-            </div>
-
-            <div class="analysis-result">
-              <a-divider>{{ tt('polymarket.analysis.aiAnalysis', 'AI Analysis') }}</a-divider>
-              <div class="probability-comparison">
-                <div class="prob-item">
-                  <div class="prob-label">{{ tt('polymarket.analysis.marketProbability', 'Market probability') }}</div>
-                  <div class="prob-value">{{ analysisResult.analysis.market_probability }}%</div>
-                </div>
-                <div class="prob-item">
-                  <div class="prob-label">{{ tt('polymarket.analysis.aiPredictedProbability', 'AI predicted probability') }}</div>
-                  <div class="prob-value ai-prob">{{ analysisResult.analysis.ai_predicted_probability }}%</div>
-                </div>
-                <div class="prob-item">
-                  <div class="prob-label">{{ tt('polymarket.analysis.divergence', 'Divergence') }}</div>
-                  <div class="prob-value" :class="getDivergenceClass(analysisResult.analysis.divergence)">
-                    {{ analysisResult.analysis.divergence >= 0 ? '+' : '' }}{{ Number(analysisResult.analysis.divergence || 0).toFixed(2) }}%
-                  </div>
-                </div>
-              </div>
-
-              <a-row :gutter="16" class="recommendation-section">
-                <a-col :span="8">
-                  <div class="rec-card">
-                    <div class="rec-label">{{ tt('polymarket.analysis.recommendation', 'Recommendation') }}</div>
-                    <a-tag :color="getRecommendationColor(analysisResult.analysis.recommendation)" style="font-size: 16px; padding: 4px 12px">
-                      {{ getRecommendationLabel(analysisResult.analysis.recommendation) }}
-                    </a-tag>
-                  </div>
-                </a-col>
-                <a-col :span="8">
-                  <div class="rec-card">
-                    <div class="rec-label">{{ tt('polymarket.analysis.confidenceScore', 'Confidence') }}</div>
-                    <div class="rec-value">{{ Number(analysisResult.analysis.confidence_score || 0).toFixed(0) }}</div>
-                  </div>
-                </a-col>
-                <a-col :span="8">
-                  <div class="rec-card">
-                    <div class="rec-label">{{ tt('polymarket.analysis.opportunityScore', 'Opportunity') }}</div>
-                    <div class="rec-value">{{ Number(analysisResult.analysis.opportunity_score || 0).toFixed(0) }}</div>
-                  </div>
-                </a-col>
-              </a-row>
-
-              <div v-if="analysisResult.analysis.reasoning" class="text-block">
-                <h4>{{ tt('polymarket.analysis.reasoning', 'Reasoning') }}</h4>
-                <p>{{ analysisResult.analysis.reasoning }}</p>
-              </div>
-
-              <div v-if="analysisResult.analysis.key_factors && analysisResult.analysis.key_factors.length > 0" class="text-block">
-                <h4>{{ tt('polymarket.analysis.keyFactors', 'Key factors') }}</h4>
-                <a-tag v-for="(factor, index) in analysisResult.analysis.key_factors" :key="index" color="blue" style="margin: 4px">
-                  {{ factor }}
-                </a-tag>
-              </div>
-
-              <div v-if="analysisResult.credits_charged > 0" class="billing-info">
-                <a-alert
-                  type="success"
-                  show-icon
-                  :message="tt('polymarket.analysis.creditsCharged', `Credits charged: ${analysisResult.credits_charged}`, { credits: analysisResult.credits_charged })"
-                />
-                <div v-if="analysisResult.remaining_credits !== undefined" class="remaining-credits">
-                  {{ tt('polymarket.analysis.remainingCredits', `Remaining credits: ${Number(analysisResult.remaining_credits).toFixed(0)}`, { credits: Number(analysisResult.remaining_credits).toFixed(0) }) }}
-                </div>
-              </div>
-            </div>
-
-            <div class="result-actions">
-              <a-button style="margin-right: 8px" @click="handleNewAnalysis">{{ tt('polymarket.analysis.newAnalysis', 'New analysis') }}</a-button>
-              <a-button type="primary" @click="handleClose">{{ tt('common.close', 'Close') }}</a-button>
-            </div>
-          </div>
-
-          <div v-if="analyzing" class="loading-section">
-            <a-spin size="large" />
-            <p>{{ tt('polymarket.analysis.analyzing', 'Analyzing...') }}</p>
-          </div>
-        </a-tab-pane>
-
-        <a-tab-pane key="history" :tab="tt('polymarket.analysis.tabHistory', 'History')">
-          <a-spin :spinning="historyLoading">
-            <a-table
-              size="small"
-              :columns="historyColumns"
-              :data-source="historyList"
-              :pagination="historyPagination"
-              :row-key="record => record.id"
-              @change="handleHistoryTableChange"
-            >
-              <template slot="market_title" slot-scope="text, record">
-                <a-button type="link" style="padding: 0" @click="viewHistoryItem(record)">{{ text }}</a-button>
-              </template>
-              <template slot="recommendation" slot-scope="text">
-                <a-tag :color="getRecommendationColor(text)">{{ getRecommendationLabel(text) }}</a-tag>
-              </template>
-              <template slot="created_at" slot-scope="text">
-                {{ formatDateTime(text) }}
-              </template>
-            </a-table>
-          </a-spin>
-        </a-tab-pane>
-      </a-tabs>
-    </div>
+    <polymarket-analysis-workspace
+      v-if="visible"
+      show-close-action
+      @close="handleClose"
+    />
   </a-modal>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import { analyzePolymarket, getPolymarketHistory } from '@/api/polymarket'
+import PolymarketAnalysisWorkspace from '@/components/PolymarketAnalysisWorkspace.vue'
 
 export default {
   name: 'PolymarketAnalysisModal',
+  components: {
+    PolymarketAnalysisWorkspace
+  },
   props: {
     visible: {
       type: Boolean,
       default: false
     }
   },
-  data () {
-    return {
-      inputText: '',
-      analyzing: false,
-      analysisResult: null,
-      activeTab: 'analyze',
-      historyLoading: false,
-      historyList: [],
-      historyPagination: {
-        current: 1,
-        pageSize: 20,
-        total: 0,
-        showSizeChanger: true,
-        showTotal: total => `Total ${total}`
-      },
-      historyColumns: []
-    }
-  },
   computed: {
     ...mapState({
       navTheme: state => state.app.theme
@@ -201,168 +40,14 @@ export default {
       return this.navTheme === 'dark' || this.navTheme === 'realdark'
     }
   },
-  mounted () {
-    this.historyColumns = [
-      { title: this.tt('polymarket.analysis.historyMarket', 'Market'), dataIndex: 'market_title', key: 'market_title', scopedSlots: { customRender: 'market_title' } },
-      { title: this.tt('polymarket.analysis.historyRecommendation', 'Recommendation'), dataIndex: 'recommendation', key: 'recommendation', width: 120, scopedSlots: { customRender: 'recommendation' } },
-      { title: this.tt('polymarket.analysis.historyOpportunityScore', 'Opportunity'), dataIndex: 'opportunity_score', key: 'opportunity_score', width: 120, align: 'right' },
-      { title: this.tt('polymarket.analysis.historyCreatedAt', 'Created at'), dataIndex: 'created_at', key: 'created_at', width: 180, scopedSlots: { customRender: 'created_at' } }
-    ]
-  },
   methods: {
     tt (key, fallback, params) {
       const translated = this.$t(key, params)
       return translated !== key ? translated : fallback
     },
-    async handleAnalyze () {
-      if (!this.inputText.trim()) {
-        this.$message.warning(this.tt('polymarket.analysis.inputRequired', 'Please enter a Polymarket URL or market title'))
-        return
-      }
-      this.analyzing = true
-      this.analysisResult = null
-      try {
-        const res = await analyzePolymarket({
-          input: this.inputText.trim(),
-          language: this.$i18n.locale || 'zh-CN'
-        })
-        if (res && res.code === 1) {
-          this.analysisResult = res.data
-          this.$message.success(this.tt('polymarket.analysis.success', 'Analysis completed'))
-        } else if (res && res.msg === 'Insufficient credits') {
-          this.$message.error(this.tt('polymarket.analysis.insufficientCredits', 'Insufficient credits'))
-          this.$router.push('/billing')
-        } else {
-          this.$message.error((res && res.msg) || this.tt('polymarket.analysis.failed', 'Analysis failed'))
-        }
-      } catch (error) {
-        const message = error && error.response && error.response.data && error.response.data.msg
-        if (message === 'Insufficient credits') {
-          this.$message.error(this.tt('polymarket.analysis.insufficientCredits', 'Insufficient credits'))
-          this.$router.push('/billing')
-        } else {
-          this.$message.error(message || this.tt('polymarket.analysis.failed', 'Analysis failed'))
-        }
-      } finally {
-        this.analyzing = false
-      }
-    },
-    handleNewAnalysis () {
-      this.inputText = ''
-      this.analysisResult = null
-    },
     handleClose () {
       this.$emit('close')
-      setTimeout(() => {
-        this.inputText = ''
-        this.analysisResult = null
-        this.analyzing = false
-      }, 300)
-    },
-    handleTabChange (key) {
-      this.activeTab = key
-      if (key === 'history' && this.historyList.length === 0) {
-        this.loadHistory()
-      }
-    },
-    async loadHistory () {
-      this.historyLoading = true
-      try {
-        const res = await getPolymarketHistory({
-          page: this.historyPagination.current,
-          page_size: this.historyPagination.pageSize
-        })
-        if (res && res.code === 1 && res.data) {
-          this.historyList = res.data.items || []
-          this.historyPagination.total = res.data.total || 0
-        }
-      } catch (error) {
-        this.$message.error(this.tt('polymarket.analysis.loadHistoryFailed', 'Failed to load history'))
-      } finally {
-        this.historyLoading = false
-      }
-    },
-    handleHistoryTableChange (pagination) {
-      this.historyPagination.current = pagination.current
-      this.historyPagination.pageSize = pagination.pageSize
-      this.loadHistory()
-    },
-    viewHistoryItem (record) {
-      this.activeTab = 'analyze'
-      this.analysisResult = {
-        market: {
-          question: record.market_title,
-          market_id: record.market_id,
-          polymarket_url: record.market_url,
-          current_probability: record.market_probability,
-          status: 'active'
-        },
-        analysis: {
-          ai_predicted_probability: record.ai_predicted_probability,
-          market_probability: record.market_probability,
-          recommendation: record.recommendation,
-          opportunity_score: record.opportunity_score,
-          confidence_score: record.confidence_score
-        }
-      }
-    },
-    getStatusColor (status) {
-      return { active: 'green', closed: 'default', resolved: 'blue' }[status] || 'default'
-    },
-    getRecommendationColor (value) {
-      return { YES: 'green', NO: 'red', HOLD: 'orange' }[value] || 'default'
-    },
-    getRecommendationLabel (value) {
-      const map = {
-        YES: this.tt('polymarket.analysis.recommendationYes', 'YES'),
-        NO: this.tt('polymarket.analysis.recommendationNo', 'NO'),
-        HOLD: this.tt('polymarket.analysis.recommendationHold', 'HOLD')
-      }
-      return map[value] || value
-    },
-    getDivergenceClass (value) {
-      if (value > 5) return 'divergence-positive'
-      if (value < -5) return 'divergence-negative'
-      return 'divergence-neutral'
-    },
-    formatVolume (value) {
-      const number = Number(value || 0)
-      if (number >= 1000000) return `$${(number / 1000000).toFixed(2)}M`
-      if (number >= 1000) return `$${(number / 1000).toFixed(2)}K`
-      return `$${number.toFixed(2)}`
-    },
-    formatDateTime (value) {
-      if (!value) return ''
-      const date = new Date(value)
-      if (Number.isNaN(date.getTime())) return value
-      return date.toLocaleString(this.$i18n.locale === 'zh-CN' ? 'zh-CN' : 'en-US')
     }
   }
 }
 </script>
-
-<style lang="less" scoped>
-.market-info h3, .text-block h4 { color: #0f172a; }
-.market-meta, .probability-comparison, .result-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
-.probability-comparison { margin-bottom: 16px; }
-.prob-item, .rec-card { flex: 1; min-width: 160px; padding: 16px; border-radius: 12px; background: #f8fafc; }
-.prob-label, .rec-label, .remaining-credits { color: rgba(15, 23, 42, 0.6); font-size: 12px; }
-.prob-value, .rec-value { color: #0f172a; font-size: 22px; font-weight: 700; margin-top: 8px; }
-.ai-prob { color: #1890ff; }
-.text-block { margin-top: 20px; }
-.text-block p { color: rgba(15, 23, 42, 0.75); line-height: 1.7; }
-.billing-info { margin-top: 16px; }
-.remaining-credits { margin-top: 8px; text-align: right; }
-.result-actions { justify-content: flex-end; margin-top: 20px; }
-.loading-section { padding: 36px 0; text-align: center; }
-.loading-section p { margin-top: 16px; color: rgba(15, 23, 42, 0.65); }
-.divergence-positive { color: #16a34a; }
-.divergence-negative { color: #dc2626; }
-.divergence-neutral { color: #475569; }
-.theme-dark {
-  .market-info h3, .text-block h4, .prob-value, .rec-value { color: #f8fafc; }
-  .prob-item, .rec-card { background: #111827; }
-  .prob-label, .rec-label, .remaining-credits, .text-block p, .loading-section p { color: rgba(248, 250, 252, 0.7); }
-  .divergence-neutral { color: #cbd5e1; }
-}
-</style>
diff --git a/frontend_vue/src/components/PolymarketAnalysisWorkspace.vue b/frontend_vue/src/components/PolymarketAnalysisWorkspace.vue
new file mode 100644
index 0000000..2b70f54
--- /dev/null
+++ b/frontend_vue/src/components/PolymarketAnalysisWorkspace.vue
@@ -0,0 +1,642 @@
+<template>
+  <div class="polymarket-workspace" :class="{ 'theme-dark': isDarkTheme, embedded }">
+    <a-tabs v-model="activeTab" @change="handleTabChange">
+      <a-tab-pane key="analyze" :tab="tt('polymarket.analysis.tabAnalyze', 'Analyze')">
+        <div v-if="!analysisResult && !analyzing" class="input-shell">
+          <div class="input-hero">
+            <div>
+              <div class="hero-eyebrow">{{ tt('polymarket.analysis.title', 'Polymarket Analysis') }}</div>
+              <h3 class="hero-title">{{ tt('polymarket.analysis.heroTitle', 'Compare market pricing with AI conviction') }}</h3>
+              <p class="hero-desc">
+                {{ tt('polymarket.analysis.description', 'Analyze a prediction market by URL or title and compare market pricing with AI probability.') }}
+              </p>
+            </div>
+            <div class="hero-stats">
+              <div class="hero-stat">
+                <span class="stat-label">{{ tt('polymarket.analysis.statInput', 'Input') }}</span>
+                <strong class="stat-value">{{ tt('polymarket.analysis.statInputValue', 'URL or title') }}</strong>
+              </div>
+              <div class="hero-stat">
+                <span class="stat-label">{{ tt('polymarket.analysis.statOutput', 'Output') }}</span>
+                <strong class="stat-value">{{ tt('polymarket.analysis.statOutputValue', 'Probability gap') }}</strong>
+              </div>
+            </div>
+          </div>
+
+          <a-alert
+            class="input-alert"
+            type="info"
+            show-icon
+            :message="tt('polymarket.analysis.inputHint', 'Paste a Polymarket URL or market title to start analysis.')"
+          />
+
+          <a-textarea
+            ref="inputTextarea"
+            v-model="inputText"
+            :rows="4"
+            :disabled="analyzing"
+            :placeholder="tt('polymarket.analysis.inputPlaceholder', 'https://polymarket.com/... or a market title')"
+            @pressEnter="handleAnalyze"
+          />
+
+          <div class="input-actions">
+            <a-button
+              type="primary"
+              size="large"
+              icon="thunderbolt"
+              :loading="analyzing"
+              :disabled="!inputText.trim()"
+              @click="handleAnalyze"
+            >
+              {{ tt('polymarket.analysis.analyzeButton', 'Analyze') }}
+            </a-button>
+            <a-button size="large" icon="history" @click="activeTab = 'history'">
+              {{ tt('polymarket.analysis.tabHistory', 'History') }}
+            </a-button>
+          </div>
+        </div>
+
+        <div v-if="analysisResult" class="result-section">
+          <div class="market-info">
+            <h3>{{ analysisResult.market.question }}</h3>
+            <div class="market-meta">
+              <a-tag :color="getStatusColor(analysisResult.market.status)">{{ analysisResult.market.status }}</a-tag>
+              <span class="meta-item"><a-icon type="percentage" /> {{ analysisResult.market.current_probability }}%</span>
+              <span v-if="analysisResult.market.volume_24h" class="meta-item"><a-icon type="dollar" /> {{ formatVolume(analysisResult.market.volume_24h) }}</span>
+              <a-button
+                v-if="analysisResult.market.polymarket_url"
+                type="link"
+                size="small"
+                icon="link"
+                :href="analysisResult.market.polymarket_url"
+                target="_blank"
+              >
+                {{ tt('polymarket.analysis.viewOnPolymarket', 'Open on Polymarket') }}
+              </a-button>
+            </div>
+          </div>
+
+          <div class="analysis-result">
+            <a-divider>{{ tt('polymarket.analysis.aiAnalysis', 'AI Analysis') }}</a-divider>
+            <div class="probability-comparison">
+              <div class="prob-item">
+                <div class="prob-label">{{ tt('polymarket.analysis.marketProbability', 'Market probability') }}</div>
+                <div class="prob-value">{{ analysisResult.analysis.market_probability }}%</div>
+              </div>
+              <div class="prob-item">
+                <div class="prob-label">{{ tt('polymarket.analysis.aiPredictedProbability', 'AI predicted probability') }}</div>
+                <div class="prob-value ai-prob">{{ analysisResult.analysis.ai_predicted_probability }}%</div>
+              </div>
+              <div class="prob-item">
+                <div class="prob-label">{{ tt('polymarket.analysis.divergence', 'Divergence') }}</div>
+                <div class="prob-value" :class="getDivergenceClass(analysisResult.analysis.divergence)">
+                  {{ analysisResult.analysis.divergence >= 0 ? '+' : '' }}{{ Number(analysisResult.analysis.divergence || 0).toFixed(2) }}%
+                </div>
+              </div>
+            </div>
+
+            <a-row :gutter="16" class="recommendation-section">
+              <a-col :span="8">
+                <div class="rec-card">
+                  <div class="rec-label">{{ tt('polymarket.analysis.recommendation', 'Recommendation') }}</div>
+                  <a-tag :color="getRecommendationColor(analysisResult.analysis.recommendation)" class="rec-tag">
+                    {{ getRecommendationLabel(analysisResult.analysis.recommendation) }}
+                  </a-tag>
+                </div>
+              </a-col>
+              <a-col :span="8">
+                <div class="rec-card">
+                  <div class="rec-label">{{ tt('polymarket.analysis.confidenceScore', 'Confidence') }}</div>
+                  <div class="rec-value">{{ Number(analysisResult.analysis.confidence_score || 0).toFixed(0) }}</div>
+                </div>
+              </a-col>
+              <a-col :span="8">
+                <div class="rec-card">
+                  <div class="rec-label">{{ tt('polymarket.analysis.opportunityScore', 'Opportunity') }}</div>
+                  <div class="rec-value">{{ Number(analysisResult.analysis.opportunity_score || 0).toFixed(0) }}</div>
+                </div>
+              </a-col>
+            </a-row>
+
+            <div v-if="analysisResult.analysis.reasoning" class="text-block">
+              <h4>{{ tt('polymarket.analysis.reasoning', 'Reasoning') }}</h4>
+              <p>{{ analysisResult.analysis.reasoning }}</p>
+            </div>
+
+            <div v-if="analysisResult.analysis.key_factors && analysisResult.analysis.key_factors.length > 0" class="text-block">
+              <h4>{{ tt('polymarket.analysis.keyFactors', 'Key factors') }}</h4>
+              <a-tag v-for="(factor, index) in analysisResult.analysis.key_factors" :key="index" color="blue" class="factor-tag">
+                {{ factor }}
+              </a-tag>
+            </div>
+
+            <div v-if="analysisResult.credits_charged > 0" class="billing-info">
+              <a-alert
+                type="success"
+                show-icon
+                :message="tt('polymarket.analysis.creditsCharged', `Credits charged: ${analysisResult.credits_charged}`, { credits: analysisResult.credits_charged })"
+              />
+              <div v-if="analysisResult.remaining_credits !== undefined" class="remaining-credits">
+                {{ tt('polymarket.analysis.remainingCredits', `Remaining credits: ${Number(analysisResult.remaining_credits).toFixed(0)}`, { credits: Number(analysisResult.remaining_credits).toFixed(0) }) }}
+              </div>
+            </div>
+          </div>
+
+          <div class="result-actions">
+            <a-button @click="handleNewAnalysis">{{ tt('polymarket.analysis.newAnalysis', 'New analysis') }}</a-button>
+            <a-button v-if="showCloseAction" type="primary" @click="$emit('close')">{{ tt('common.close', 'Close') }}</a-button>
+          </div>
+        </div>
+
+        <div v-if="analyzing" class="loading-section">
+          <a-spin size="large" />
+          <p>{{ tt('polymarket.analysis.analyzing', 'Analyzing...') }}</p>
+        </div>
+      </a-tab-pane>
+
+      <a-tab-pane key="history" :tab="tt('polymarket.analysis.tabHistory', 'History')">
+        <a-spin :spinning="historyLoading">
+          <a-table
+            size="small"
+            :columns="historyColumns"
+            :data-source="historyList"
+            :pagination="historyPagination"
+            :row-key="record => record.id"
+            @change="handleHistoryTableChange"
+          >
+            <template slot="market_title" slot-scope="text, record">
+              <a-button type="link" style="padding: 0" @click="viewHistoryItem(record)">{{ text }}</a-button>
+            </template>
+            <template slot="recommendation" slot-scope="text">
+              <a-tag :color="getRecommendationColor(text)">{{ getRecommendationLabel(text) }}</a-tag>
+            </template>
+            <template slot="created_at" slot-scope="text">
+              {{ formatDateTime(text) }}
+            </template>
+          </a-table>
+        </a-spin>
+      </a-tab-pane>
+    </a-tabs>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { analyzePolymarket, getPolymarketHistory } from '@/api/polymarket'
+
+export default {
+  name: 'PolymarketAnalysisWorkspace',
+  props: {
+    showCloseAction: {
+      type: Boolean,
+      default: false
+    },
+    embedded: {
+      type: Boolean,
+      default: false
+    },
+    initialInput: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      inputText: '',
+      analyzing: false,
+      analysisResult: null,
+      activeTab: 'analyze',
+      historyLoading: false,
+      historyList: [],
+      historyPagination: {
+        current: 1,
+        pageSize: 20,
+        total: 0,
+        showSizeChanger: true,
+        showTotal: total => `Total ${total}`
+      },
+      historyColumns: []
+    }
+  },
+  computed: {
+    ...mapState({
+      navTheme: state => state.app.theme
+    }),
+    isDarkTheme () {
+      return this.navTheme === 'dark' || this.navTheme === 'realdark'
+    }
+  },
+  watch: {
+    initialInput: {
+      immediate: true,
+      handler (value) {
+        if (value) {
+          this.inputText = String(value)
+        }
+      }
+    }
+  },
+  mounted () {
+    this.historyColumns = [
+      { title: this.tt('polymarket.analysis.historyMarket', 'Market'), dataIndex: 'market_title', key: 'market_title', scopedSlots: { customRender: 'market_title' } },
+      { title: this.tt('polymarket.analysis.historyRecommendation', 'Recommendation'), dataIndex: 'recommendation', key: 'recommendation', width: 120, scopedSlots: { customRender: 'recommendation' } },
+      { title: this.tt('polymarket.analysis.historyOpportunityScore', 'Opportunity'), dataIndex: 'opportunity_score', key: 'opportunity_score', width: 120, align: 'right' },
+      { title: this.tt('polymarket.analysis.historyCreatedAt', 'Created at'), dataIndex: 'created_at', key: 'created_at', width: 180, scopedSlots: { customRender: 'created_at' } }
+    ]
+  },
+  methods: {
+    tt (key, fallback, params) {
+      const translated = this.$t(key, params)
+      return translated !== key ? translated : fallback
+    },
+    focusInput () {
+      this.$nextTick(() => {
+        const textarea = this.$refs.inputTextarea
+        if (textarea && textarea.focus) {
+          textarea.focus()
+        }
+      })
+    },
+    setInput (value) {
+      this.inputText = value ? String(value) : ''
+      this.activeTab = 'analyze'
+      this.focusInput()
+    },
+    async startFromInput (value) {
+      this.inputText = value ? String(value) : ''
+      this.activeTab = 'analyze'
+      await this.handleAnalyze()
+    },
+    resetWorkspace () {
+      this.inputText = ''
+      this.analysisResult = null
+      this.analyzing = false
+      this.activeTab = 'analyze'
+      this.focusInput()
+    },
+    async handleAnalyze () {
+      if (!this.inputText.trim()) {
+        this.$message.warning(this.tt('polymarket.analysis.inputRequired', 'Please enter a Polymarket URL or market title'))
+        return
+      }
+      this.analyzing = true
+      this.analysisResult = null
+      try {
+        const res = await analyzePolymarket({
+          input: this.inputText.trim(),
+          language: this.$i18n.locale || 'zh-CN'
+        })
+        if (res && res.code === 1) {
+          this.analysisResult = res.data
+          this.$message.success(this.tt('polymarket.analysis.success', 'Analysis completed'))
+        } else if (res && res.msg === 'Insufficient credits') {
+          this.$message.error(this.tt('polymarket.analysis.insufficientCredits', 'Insufficient credits'))
+          this.$router.push('/billing')
+        } else {
+          this.$message.error((res && res.msg) || this.tt('polymarket.analysis.failed', 'Analysis failed'))
+        }
+      } catch (error) {
+        const message = error && error.response && error.response.data && error.response.data.msg
+        if (message === 'Insufficient credits') {
+          this.$message.error(this.tt('polymarket.analysis.insufficientCredits', 'Insufficient credits'))
+          this.$router.push('/billing')
+        } else {
+          this.$message.error(message || this.tt('polymarket.analysis.failed', 'Analysis failed'))
+        }
+      } finally {
+        this.analyzing = false
+      }
+    },
+    handleNewAnalysis () {
+      this.inputText = ''
+      this.analysisResult = null
+      this.focusInput()
+    },
+    handleTabChange (key) {
+      this.activeTab = key
+      if (key === 'history' && this.historyList.length === 0) {
+        this.loadHistory()
+      }
+    },
+    async loadHistory () {
+      this.historyLoading = true
+      try {
+        const res = await getPolymarketHistory({
+          page: this.historyPagination.current,
+          page_size: this.historyPagination.pageSize
+        })
+        if (res && res.code === 1 && res.data) {
+          this.historyList = res.data.items || []
+          this.historyPagination.total = res.data.total || 0
+        }
+      } catch (error) {
+        this.$message.error(this.tt('polymarket.analysis.loadHistoryFailed', 'Failed to load history'))
+      } finally {
+        this.historyLoading = false
+      }
+    },
+    handleHistoryTableChange (pagination) {
+      this.historyPagination.current = pagination.current
+      this.historyPagination.pageSize = pagination.pageSize
+      this.loadHistory()
+    },
+    viewHistoryItem (record) {
+      this.activeTab = 'analyze'
+      this.analysisResult = {
+        market: {
+          question: record.market_title,
+          market_id: record.market_id,
+          polymarket_url: record.market_url,
+          current_probability: record.market_probability,
+          status: 'active'
+        },
+        analysis: {
+          ai_predicted_probability: record.ai_predicted_probability,
+          market_probability: record.market_probability,
+          recommendation: record.recommendation,
+          opportunity_score: record.opportunity_score,
+          confidence_score: record.confidence_score
+        }
+      }
+    },
+    getStatusColor (status) {
+      return { active: 'green', closed: 'default', resolved: 'blue' }[status] || 'default'
+    },
+    getRecommendationColor (value) {
+      return { YES: 'green', NO: 'red', HOLD: 'orange' }[value] || 'default'
+    },
+    getRecommendationLabel (value) {
+      const map = {
+        YES: this.tt('polymarket.analysis.recommendationYes', 'YES'),
+        NO: this.tt('polymarket.analysis.recommendationNo', 'NO'),
+        HOLD: this.tt('polymarket.analysis.recommendationHold', 'HOLD')
+      }
+      return map[value] || value
+    },
+    getDivergenceClass (value) {
+      if (value > 5) return 'divergence-positive'
+      if (value < -5) return 'divergence-negative'
+      return 'divergence-neutral'
+    },
+    formatVolume (value) {
+      const number = Number(value || 0)
+      if (number >= 1000000) return `$${(number / 1000000).toFixed(2)}M`
+      if (number >= 1000) return `$${(number / 1000).toFixed(2)}K`
+      return `$${number.toFixed(2)}`
+    },
+    formatDateTime (value) {
+      if (!value) return ''
+      const date = new Date(value)
+      if (Number.isNaN(date.getTime())) return value
+      return date.toLocaleString(this.$i18n.locale === 'zh-CN' ? 'zh-CN' : 'en-US')
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.polymarket-workspace {
+  padding: 8px 0 0;
+}
+
+.input-shell,
+.result-section {
+  border-radius: 20px;
+  border: 1px solid #e5edf5;
+  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
+  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
+}
+
+.input-shell {
+  padding: 24px;
+}
+
+.input-hero {
+  display: flex;
+  justify-content: space-between;
+  gap: 20px;
+  margin-bottom: 18px;
+}
+
+.hero-eyebrow {
+  color: #2563eb;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.hero-title {
+  margin: 8px 0 10px;
+  color: #0f172a;
+  font-size: 26px;
+  font-weight: 700;
+}
+
+.hero-desc {
+  max-width: 620px;
+  margin: 0;
+  color: rgba(15, 23, 42, 0.7);
+  line-height: 1.7;
+}
+
+.hero-stats {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(120px, 1fr));
+  gap: 12px;
+  min-width: 260px;
+}
+
+.hero-stat,
+.prob-item,
+.rec-card {
+  padding: 16px;
+  border-radius: 14px;
+  background: #f8fafc;
+}
+
+.stat-label,
+.prob-label,
+.rec-label,
+.remaining-credits {
+  color: rgba(15, 23, 42, 0.6);
+  font-size: 12px;
+}
+
+.stat-value,
+.prob-value,
+.rec-value {
+  display: block;
+  margin-top: 8px;
+  color: #0f172a;
+  font-size: 22px;
+  font-weight: 700;
+}
+
+.input-alert {
+  margin-bottom: 16px;
+}
+
+.input-actions,
+.market-meta,
+.probability-comparison,
+.result-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  align-items: center;
+}
+
+.input-actions {
+  margin-top: 16px;
+}
+
+.result-section {
+  padding: 24px;
+}
+
+.market-info h3,
+.text-block h4 {
+  color: #0f172a;
+}
+
+.probability-comparison {
+  margin-bottom: 16px;
+}
+
+.ai-prob {
+  color: #1890ff;
+}
+
+.rec-tag {
+  font-size: 16px;
+  padding: 4px 12px;
+}
+
+.text-block {
+  margin-top: 20px;
+}
+
+.text-block p {
+  color: rgba(15, 23, 42, 0.75);
+  line-height: 1.7;
+}
+
+.factor-tag {
+  margin: 4px;
+}
+
+.billing-info {
+  margin-top: 16px;
+}
+
+.remaining-credits {
+  margin-top: 8px;
+  text-align: right;
+}
+
+.result-actions {
+  justify-content: flex-end;
+  margin-top: 20px;
+}
+
+.loading-section {
+  padding: 48px 0;
+  text-align: center;
+}
+
+.loading-section p {
+  margin-top: 16px;
+  color: rgba(15, 23, 42, 0.65);
+}
+
+.divergence-positive {
+  color: #16a34a;
+}
+
+.divergence-negative {
+  color: #dc2626;
+}
+
+.divergence-neutral {
+  color: #475569;
+}
+
+.theme-dark {
+  .input-shell,
+  .result-section {
+    border-color: rgba(59, 130, 246, 0.16);
+    background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
+    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
+  }
+
+  .hero-eyebrow {
+    color: #60a5fa;
+  }
+
+  .hero-title,
+  .market-info h3,
+  .text-block h4,
+  .stat-value,
+  .prob-value,
+  .rec-value {
+    color: #f8fafc;
+  }
+
+  .hero-desc,
+  .text-block p,
+  .loading-section p,
+  .stat-label,
+  .prob-label,
+  .rec-label,
+  .remaining-credits {
+    color: rgba(248, 250, 252, 0.72);
+  }
+
+  .hero-stat,
+  .prob-item,
+  .rec-card {
+    background: rgba(15, 23, 42, 0.72);
+  }
+
+  .divergence-neutral {
+    color: #cbd5e1;
+  }
+}
+
+@media (max-width: 900px) {
+  .input-hero {
+    flex-direction: column;
+  }
+
+  .hero-stats {
+    min-width: 0;
+  }
+}
+
+@media (max-width: 768px) {
+  .input-shell,
+  .result-section {
+    padding: 18px;
+  }
+
+  .hero-title {
+    font-size: 22px;
+  }
+
+  .hero-stats {
+    grid-template-columns: 1fr;
+  }
+
+  .probability-comparison {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .recommendation-section /deep/ .ant-col {
+    width: 100%;
+    max-width: 100%;
+    flex: 0 0 100%;
+  }
+}
+</style>
diff --git a/frontend_vue/src/components/Trend/Trend.vue b/frontend_vue/src/components/Trend/Trend.vue
index 526e1cc..42b83a2 100644
--- a/frontend_vue/src/components/Trend/Trend.vue
+++ b/frontend_vue/src/components/Trend/Trend.vue
@@ -19,14 +19,14 @@ export default {
       default: 'ant-pro-trend'
     },
     /**
-       * 上升下降标识：up|down
+       * Trend direction indicator: up|down
        */
     flag: {
       type: String,
       required: true
     },
     /**
-       * 颜色反转
+       * Reverse color
        */
     reverseColor: {
       type: Boolean,
diff --git a/frontend_vue/src/components/tools/TwoStepCaptcha.vue b/frontend_vue/src/components/tools/TwoStepCaptcha.vue
index 638489c..ab12ee8 100644
--- a/frontend_vue/src/components/tools/TwoStepCaptcha.vue
+++ b/frontend_vue/src/components/tools/TwoStepCaptcha.vue
@@ -1,5 +1,5 @@
 <template>
-  <!-- 两步验证 -->
+  <!-- Two-step verification -->
   <a-modal
     centered
     :visible="localVisible"
@@ -7,12 +7,12 @@
     @update:visible="localVisible = $event"
     :maskClosable="false"
   >
-    <div slot="title" :style="{ textAlign: 'center' }">两步验证</div>
+    <div slot="title" :style="{ textAlign: 'center' }">Two-Step Verification</div>
     <template slot="footer">
       <div :style="{ textAlign: 'center' }">
-        <a-button key="back" @click="handleCancel">返回</a-button>
+        <a-button key="back" @click="handleCancel">Back</a-button>
         <a-button key="submit" type="primary" :loading="stepLoading" @click="handleStepOk">
-          继续
+          Continue
         </a-button>
       </div>
     </template>
@@ -20,18 +20,18 @@
     <a-spin :spinning="stepLoading">
       <a-form layout="vertical" :auto-form-create="(form)=>{this.form = form}">
         <div class="step-form-wrapper">
-          <p style="text-align: center" v-if="!stepLoading">请在手机中打开 Google Authenticator 或两步验证 APP<br />输入 6 位动态码</p>
-          <p style="text-align: center" v-else>正在验证..<br/>请稍后</p>
+          <p style="text-align: center" v-if="!stepLoading">Please open Google Authenticator or your two-step verification app on your phone<br />and enter the 6-digit code</p>
+          <p style="text-align: center" v-else>Verifying..<br/>Please wait</p>
           <a-form-item
             :style="{ textAlign: 'center' }"
             hasFeedback
             fieldDecoratorId="stepCode"
-            :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入 6 位动态码!', pattern: /^\d{6}$/, len: 6 }]}"
+            :fieldDecoratorOptions="{rules: [{ required: true, message: 'Please enter the 6-digit code!', pattern: /^\d{6}$/, len: 6 }]}"
           >
             <a-input :style="{ textAlign: 'center' }" @keyup.enter.native="handleStepOk" placeholder="000000" />
           </a-form-item>
           <p style="text-align: center">
-            <a @click="onForgeStepCode">遗失手机?</a>
+            <a @click="onForgeStepCode">Lost your phone?</a>
           </p>
         </div>
       </a-form>
diff --git a/frontend_vue/src/config/router.config.js b/frontend_vue/src/config/router.config.js
index 88a8ff9..a7c1506 100644
--- a/frontend_vue/src/config/router.config.js
+++ b/frontend_vue/src/config/router.config.js
@@ -9,14 +9,14 @@ export const asyncRouterMap = [
     meta: { title: 'menu.home' },
     redirect: '/ai-asset-analysis',
     children: [
-      // 仪表盘
+      // Dashboard
       {
         path: '/dashboard',
         name: 'Dashboard',
         component: () => import('@/views/dashboard'),
         meta: { title: 'menu.dashboard', keepAlive: true, icon: 'dashboard', permission: ['dashboard'] }
       },
-      // AI 分析
+      // AI analysis
       {
         path: '/ai-analysis/:pageNo([1-9]\\d*)?',
         name: 'Analysis',
@@ -24,35 +24,49 @@ export const asyncRouterMap = [
         hidden: true,
         meta: { title: 'menu.dashboard.analysis', keepAlive: false, icon: 'thunderbolt', permission: ['dashboard'] }
       },
-      // AI资产分析（统一入口）
+      // AI asset analysis (unified entry)
       {
         path: '/ai-asset-analysis',
         name: 'AIAssetAnalysis',
         component: () => import('@/views/ai-asset-analysis'),
         meta: { title: 'menu.dashboard.aiAssetAnalysis', keepAlive: false, icon: 'appstore', permission: ['dashboard'] }
       },
-      // 指标分析
+      // Polymarket analysis
+      {
+        path: '/polymarket',
+        name: 'Polymarket',
+        component: () => import('@/views/polymarket'),
+        meta: { title: 'Polymarket', keepAlive: false, icon: 'radar-chart', permission: ['dashboard'] }
+      },
+      // Indicator analysis
       {
         path: '/indicator-analysis',
         name: 'Indicator',
         component: () => import('@/views/indicator-analysis'),
         meta: { title: 'menu.dashboard.indicator', keepAlive: true, icon: 'line-chart', permission: ['dashboard'] }
       },
-      // 指标市场（放在指标分析下面）
+      // Indicator marketplace
       {
         path: '/indicator-community',
         name: 'IndicatorCommunity',
         component: () => import('@/views/indicator-community'),
         meta: { title: 'menu.dashboard.community', keepAlive: false, icon: 'shop', permission: ['dashboard'] }
       },
-      // 交易助手
+      // Trading assistant
       {
         path: '/trading-assistant',
         name: 'TradingAssistant',
         component: () => import('@/views/trading-assistant'),
         meta: { title: 'menu.dashboard.tradingAssistant', keepAlive: true, icon: 'robot', permission: ['dashboard'] }
       },
-      // 资产监测
+      // Backtest center
+      {
+        path: '/backtest-center',
+        name: 'BacktestCenter',
+        component: () => import('@/views/backtest-center'),
+        meta: { title: 'Backtest Center', keepAlive: true, icon: 'experiment', permission: ['dashboard'] }
+      },
+      // Portfolio monitor
       {
         path: '/portfolio',
         name: 'Portfolio',
@@ -60,28 +74,28 @@ export const asyncRouterMap = [
         hidden: true,
         meta: { title: 'menu.dashboard.portfolio', keepAlive: true, icon: 'fund', permission: ['dashboard'] }
       },
-      // 用户管理 (admin only)
+      // User management (admin only)
       {
         path: '/user-manage',
         name: 'UserManage',
         component: () => import('@/views/user-manage'),
         meta: { title: 'menu.userManage', keepAlive: false, icon: 'team', permission: ['admin'] }
       },
-      // 个人中心
+      // Profile
       {
         path: '/profile',
         name: 'Profile',
         component: () => import('@/views/profile'),
         meta: { title: 'menu.myProfile', keepAlive: false, icon: 'user', permission: ['dashboard'] }
       },
-      // 会员/充值
+      // Billing
       {
         path: '/billing',
         name: 'Billing',
         component: () => import('@/views/billing'),
         meta: { title: 'menu.billing', keepAlive: false, icon: 'wallet', permission: ['dashboard'] }
       },
-      // 系统设置 (admin only) - 放在最后
+      // Settings (admin only) - keep last
       {
         path: '/settings',
         name: 'Settings',
@@ -95,7 +109,7 @@ export const asyncRouterMap = [
         path: '/other',
         name: 'otherPage',
         component: PageView,
-        meta: { title: '其他组件', icon: 'slack', permission: [ 'dashboard' ] },
+        meta: { title: 'Other Components', icon: 'slack', permission: [ 'dashboard' ] },
         redirect: '/other/icon-selector',
         children: [
           {
@@ -107,44 +121,44 @@ export const asyncRouterMap = [
           {
             path: '/other/list',
             component: RouteView,
-            meta: { title: '业务布局', icon: 'layout', permission: [ 'support' ] },
+            meta: { title: 'Business Layout', icon: 'layout', permission: [ 'support' ] },
             redirect: '/other/list/tree-list',
             children: [
               {
                 path: '/other/list/tree-list',
                 name: 'TreeList',
                 component: () => import('@/views/other/TreeList'),
-                meta: { title: '树目录表格', keepAlive: true }
+                meta: { title: 'Tree Table', keepAlive: true }
               },
               {
                 path: '/other/list/edit-table',
                 name: 'EditList',
                 component: () => import('@/views/other/TableInnerEditList'),
-                meta: { title: '内联编辑表格', keepAlive: true }
+                meta: { title: 'Inline Edit Table', keepAlive: true }
               },
               {
                 path: '/other/list/user-list',
                 name: 'UserList',
                 component: () => import('@/views/other/UserList'),
-                meta: { title: '用户列表', keepAlive: true }
+                meta: { title: 'User List', keepAlive: true }
               },
               {
                 path: '/other/list/role-list',
                 name: 'RoleList',
                 component: () => import('@/views/other/RoleList'),
-                meta: { title: '角色列表', keepAlive: true }
+                meta: { title: 'Role List', keepAlive: true }
               },
               {
                 path: '/other/list/system-role',
                 name: 'SystemRole',
                 component: () => import('@/views/role/RoleList'),
-                meta: { title: '角色列表2', keepAlive: true }
+                meta: { title: 'Role List 2', keepAlive: true }
               },
               {
                 path: '/other/list/permission-list',
                 name: 'PermissionList',
                 component: () => import('@/views/other/PermissionList'),
-                meta: { title: '权限列表', keepAlive: true }
+                meta: { title: 'Permission List', keepAlive: true }
               }
             ]
           }
@@ -161,7 +175,7 @@ export const asyncRouterMap = [
 ]
 
 /**
- * 基础路由
+ * Base routes
  * @type { *[] }
  */
 export const constantRouterMap = [
diff --git a/frontend_vue/src/store/index.js b/frontend_vue/src/store/index.js
index d8f8e9a..1e9881b 100644
--- a/frontend_vue/src/store/index.js
+++ b/frontend_vue/src/store/index.js
@@ -5,11 +5,11 @@ import app from './modules/app'
 import user from './modules/user'
 
 // dynamic router permission control
-// 动态路由模式（支持基于角色的菜单过滤）
+// Dynamic router mode (supports role-based menu filtering)
 import permission from './modules/async-router'
 
 // static router permission control (NO filtering)
-// 静态路由模式（不过滤菜单，已弃用）
+// Static router mode (no menu filtering, deprecated)
 // import permission from './modules/static-router'
 
 import getters from './getters'
diff --git a/frontend_vue/src/store/modules/app.js b/frontend_vue/src/store/modules/app.js
index 68f45a2..d53f197 100644
--- a/frontend_vue/src/store/modules/app.js
+++ b/frontend_vue/src/store/modules/app.js
@@ -20,13 +20,13 @@ const app = {
   state: {
     sideCollapsed: false,
     isMobile: false,
-    theme: storage.get(TOGGLE_NAV_THEME, 'light'), // 从 localStorage 读取主题，默认 'light'
+    theme: storage.get(TOGGLE_NAV_THEME, 'light'), // Read theme from localStorage, default 'light'
     layout: '',
     contentWidth: '',
     fixedHeader: false,
     fixedSidebar: false,
     autoHideHeader: false,
-    color: storage.get(TOGGLE_COLOR, '#13C2C2'), // 从 localStorage 读取主题色，默认 '#13C2C2'
+    color: storage.get(TOGGLE_COLOR, '#13C2C2'), // Read theme color from localStorage, default '#13C2C2'
     weak: false,
     multiTab: true,
     lang: 'en-US',
diff --git a/frontend_vue/src/store/modules/async-router.js b/frontend_vue/src/store/modules/async-router.js
index 7eece42..dadd007 100644
--- a/frontend_vue/src/store/modules/async-router.js
+++ b/frontend_vue/src/store/modules/async-router.js
@@ -1,5 +1,5 @@
 /**
- * 向后端请求用户的菜单，动态生成路由
+ * Request user menu from backend, dynamically generate routes
  */
 import { constantRouterMap } from '@/config/router.config'
 import { generatorDynamicRouter } from '@/router/generator-routers'
diff --git a/frontend_vue/src/store/modules/static-router.js b/frontend_vue/src/store/modules/static-router.js
index 874e4fc..da6ed9a 100644
--- a/frontend_vue/src/store/modules/static-router.js
+++ b/frontend_vue/src/store/modules/static-router.js
@@ -2,7 +2,7 @@ import { asyncRouterMap, constantRouterMap } from '@/config/router.config'
 import cloneDeep from 'lodash.clonedeep'
 
 /**
- * 单账户多角色时，使用该方法可过滤角色不存在的菜单
+ * Filter menus that do not exist for the role in case of single account with multiple roles
  *
  * @param roles
  * @param route
@@ -18,7 +18,7 @@ function hasRole(roles, route) {
 }
 
 function filterAsyncRouter (routerMap, role) {
-  // 不进行权限过滤，直接返回所有路由（后端会验证token）
+  // Do not perform permission filtering, return all routes directly (backend will verify token)
   return routerMap.map(route => {
     if (route.children && route.children.length) {
       route.children = filterAsyncRouter(route.children, role)
@@ -42,7 +42,7 @@ const permission = {
     GenerateRoutes ({ commit }, data) {
       return new Promise(resolve => {
         const routerMap = cloneDeep(asyncRouterMap)
-        // 不进行权限过滤，直接返回所有路由（后端会验证token）
+        // Do not perform permission filtering, return all routes directly (backend will verify token)
         const accessedRouters = filterAsyncRouter(routerMap, null)
         commit('SET_ROUTERS', accessedRouters)
         resolve()
diff --git a/frontend_vue/src/store/modules/user.js b/frontend_vue/src/store/modules/user.js
index 661a23e..2b45e88 100644
--- a/frontend_vue/src/store/modules/user.js
+++ b/frontend_vue/src/store/modules/user.js
@@ -69,11 +69,11 @@ const user = {
   },
 
   actions: {
-    // 登录
+    // Login
     Login ({ commit, dispatch }, userInfo) {
       return new Promise((resolve, reject) => {
         login(userInfo).then(response => {
-          // 适配 Python 后端响应格式
+          // Adapt to Python backend response format
           if (response && response.code === 1 && response.data) {
             const result = response.data
             const token = result.token
@@ -85,12 +85,12 @@ const user = {
             commit('SET_INFO', info)
             storage.set(USER_INFO, info, expiresAt)
 
-            // 设置基本信息
+            // Set basic information
             const name = info.nickname || info.username || 'User'
             commit('SET_NAME', { name: name, welcome: welcome() })
             commit('SET_AVATAR', info.avatar || '/avatar2.jpg')
 
-            // 从服务器返回的角色信息设置角色
+            // Set roles based on role information returned from the server
             let roles = [DEFAULT_ROLE]
             if (info.role) {
               // role: { id: 'admin', permissions: [...] }
@@ -104,7 +104,7 @@ const user = {
             commit('SET_ROLES', roles)
             storage.set(USER_ROLES, roles, expiresAt)
 
-            // 重置路由，强制重新生成（根据新用户的角色）
+            // Reset routes, force regeneration (based on new user's roles)
             dispatch('ResetRoutes')
 
             resolve(response)
@@ -117,13 +117,13 @@ const user = {
       })
     },
 
-    // Web3 登录完成后的统一处理
+    // Unified processing after Web3 login is completed
     Web3LoginFinalize ({ commit }, payload) {
       return new Promise((resolve, reject) => {
         try {
           const { token, userInfo } = payload
           if (!token || !userInfo) {
-            reject(new Error('登录数据异常'))
+            reject(new Error('Login data exception'))
             return
           }
           storage.set(ACCESS_TOKEN, token, new Date().getTime() + 7 * 24 * 60 * 60 * 1000)
@@ -155,7 +155,7 @@ const user = {
       })
     },
 
-    // 刷新用户信息
+    // Refresh user info
     FetchUserInfo ({ commit }) {
       return new Promise((resolve, reject) => {
         getUserInfo().then(res => {
@@ -172,19 +172,19 @@ const user = {
             }
             resolve(info)
           } else {
-            reject(new Error((res && res.msg) || '获取用户信息失败'))
+            reject(new Error((res && res.msg) || 'Failed to fetch user info'))
           }
         }).catch(err => reject(err))
       })
     },
 
-    // 获取用户信息（从 store 中获取，不再请求接口）
+    // Get user info (get from store, no longer request interface)
     GetInfo ({ commit, state }) {
       return new Promise((resolve, reject) => {
-        // 用户信息已经在登录时保存到 store 中，直接返回
-        // 增加 check: 必须包含 is_demo 字段，否则视为过期缓存，强制刷新
+        // User info is already saved in store during login, return directly
+        // Add check: must include is_demo field; otherwise regarded as stale cache, force refresh
         if (state.info && Object.keys(state.info).length > 0 && typeof state.info.is_demo !== 'undefined') {
-          // 补全 Roles
+          // Complete Roles
           const info = state.info
           if (info.role) {
             const roles = normalizeRoles(info.role)
@@ -200,7 +200,7 @@ const user = {
           }
           resolve(state.info)
         } else {
-          // 尝试主动拉取一次
+          // Attempt to actively pull once
           getUserInfo().then(res => {
             if (res && res.code === 1 && res.data) {
               const info = res.data
@@ -214,7 +214,7 @@ const user = {
               if (info.avatar) {
                 commit('SET_AVATAR', info.avatar)
               }
-              // 关键修复：设置角色，防止路由守卫死循环
+              // Critical fix: set roles to prevent infinite loop in route guard
               if (info.role) {
                 const roles = normalizeRoles(info.role)
                 commit('SET_ROLES', roles)
@@ -229,14 +229,14 @@ const user = {
               }
               resolve(info)
             } else {
-              reject(new Error((res && res.msg) || '用户信息不存在'))
+              reject(new Error((res && res.msg) || 'User info does not exist'))
             }
           }).catch(err => reject(err))
         }
       })
     },
 
-    // 登出
+    // Logout
     Logout ({ commit, dispatch }) {
       return new Promise((resolve) => {
         logout().then(() => {
@@ -248,15 +248,15 @@ const user = {
           storage.remove(ACCESS_TOKEN)
           storage.remove(USER_INFO)
           storage.remove(USER_ROLES)
-          // 重置路由
+          // Reset routes
           dispatch('ResetRoutes')
           resolve()
         }).catch(() => {
-          // 登出失败时也继续执行，确保清理本地状态
+          // Continue even if logout fails to ensure local state is cleared
           storage.remove(ACCESS_TOKEN)
           storage.remove(USER_INFO)
           storage.remove(USER_ROLES)
-          // 重置路由
+          // Reset routes
           dispatch('ResetRoutes')
           resolve()
         }).finally(() => {
diff --git a/frontend_vue/src/utils/codeDecrypt.js b/frontend_vue/src/utils/codeDecrypt.js
index 2faaab8..8201770 100644
--- a/frontend_vue/src/utils/codeDecrypt.js
+++ b/frontend_vue/src/utils/codeDecrypt.js
@@ -1,19 +1,19 @@
 /**
- * 指标代码解密工具
- * 用于解密用户购买的加密指标代码
+ * Indicator code decryption tool
+ * Used to decrypt encrypted indicator code purchased by users
  */
 
 import CryptoJS from 'crypto-js'
 import request from '@/utils/request'
 
 /**
- * 解密指标代码
+ * Decrypt indicator code
  *
- * @param {string} encryptedCode - base64编码的加密代码
- * @param {number} userId - 用户ID
- * @param {number} indicatorId - 指标ID
- * @param {string} serverSecret - 服务器密钥（需要从后端获取或配置）
- * @returns {string} - 解密后的代码
+ * @param {string} encryptedCode - base64 encoded encrypted code
+ * @param {number} userId - User ID
+ * @param {number} indicatorId - Indicator ID
+ * @param {string} serverSecret - Server secret (needs to be from backend or config)
+ * @returns {string} - Decrypted code
  */
 export function decryptCode (encryptedCode, userId, indicatorId, encryptedKey) {
   if (!encryptedCode || !userId || !indicatorId || !encryptedKey) {
@@ -21,18 +21,18 @@ export function decryptCode (encryptedCode, userId, indicatorId, encryptedKey) {
   }
 
   try {
-    // 解码base64加密代码
+    // Decode base64 encrypted code
     const combined = CryptoJS.enc.Base64.parse(encryptedCode)
 
-    // 提取IV（前16字节）和加密数据
-    const ivWords = CryptoJS.lib.WordArray.create(combined.words.slice(0, 4)) // 前16字节（4个word）
-    const encryptedWords = CryptoJS.lib.WordArray.create(combined.words.slice(4)) // 剩余部分
+    // Extract IV (first 16 bytes) and encrypted data
+    const ivWords = CryptoJS.lib.WordArray.create(combined.words.slice(0, 4)) // First 16 bytes (4 words)
+    const encryptedWords = CryptoJS.lib.WordArray.create(combined.words.slice(4)) // Remaining part
 
-    // 解密密钥（从后端获取的base64编码密钥）
-    // encryptedKey 是从后端获取的 base64 编码的密钥，直接解码使用
+    // Decryption key (base64 encoded key from backend)
+    // encryptedKey is the base64 encoded key from backend, decode directly for use
     const key = CryptoJS.enc.Base64.parse(encryptedKey)
 
-    // 解密
+    // Decrypt
     const decrypted = CryptoJS.AES.decrypt(
       { ciphertext: encryptedWords },
       key,
@@ -43,7 +43,7 @@ export function decryptCode (encryptedCode, userId, indicatorId, encryptedKey) {
       }
     )
 
-    // 转换为字符串
+    // Convert to string
     const decryptedText = decrypted.toString(CryptoJS.enc.Utf8)
 
     if (!decryptedText) {
@@ -52,25 +52,25 @@ export function decryptCode (encryptedCode, userId, indicatorId, encryptedKey) {
 
     return decryptedText
   } catch (error) {
-    // 解密失败，返回原代码（向后兼容）
+    // Decryption failed, return original code (backward compatibility)
     return encryptedCode
   }
 }
 
 /**
- * 从后端获取解密密钥（动态密钥）
+ * Get decryption key from backend (dynamic key)
  *
- * @param {number} userId - 用户ID
- * @param {number} indicatorId - 指标ID
- * @returns {Promise<string>} - 解密密钥（base64编码）
+ * @param {number} userId - User ID
+ * @param {number} indicatorId - Indicator ID
+ * @returns {Promise<string>} - Decryption key (base64 encoded)
  */
 export async function getDecryptKey (userId, indicatorId) {
   if (!userId || !indicatorId) {
-    throw new Error('用户ID和指标ID不能为空')
+    throw new Error('User ID and Indicator ID cannot be empty')
   }
 
   try {
-    // 动态请求方式：从后端API获取
+    // Dynamic request: get from backend API
     const response = await request({
       url: '/api/indicator/getDecryptKey',
       method: 'post',
@@ -81,56 +81,56 @@ export async function getDecryptKey (userId, indicatorId) {
     })
 
     if (response.code === 1 && response.data && response.data.key) {
-      // 返回base64编码的密钥
+      // Return base64 encoded key
       return response.data.key
     } else {
-      throw new Error(response.msg || '获取解密密钥失败')
+      throw new Error(response.msg || 'Failed to get decryption key')
     }
   } catch (error) {
-    // 如果后端接口失败，抛出错误，不使用备用密钥（更安全）
-    throw new Error('无法获取解密密钥，请检查网络连接或联系管理员: ' + (error.message || '未知错误'))
+    // If backend fails, throw error instead of using backup key (more secure)
+    throw new Error('Cannot get decryption key, please check network or contact admin: ' + (error.message || 'Unknown error'))
   }
 }
 
 /**
- * 智能解密代码（自动获取密钥）
+ * Smart code decryption (auto-fetch key)
  *
- * @param {string} encryptedCode - 加密的代码
- * @param {number} userId - 用户ID
- * @param {number} indicatorId - 指标ID
- * @returns {Promise<string>} - 解密后的代码
+ * @param {string} encryptedCode - Encrypted code
+ * @param {number} userId - User ID
+ * @param {number} indicatorId - Indicator ID
+ * @returns {Promise<string>} - Decrypted code
  */
 export async function decryptCodeAuto (encryptedCode, userId, indicatorId) {
-  // 从后端动态获取解密密钥（base64编码）
+  // Dynamically get decryption key from backend (base64 encoded)
   const encryptedKey = await getDecryptKey(userId, indicatorId)
-  // 使用获取的密钥解密
+  // Decrypt using the fetched key
   return decryptCode(encryptedCode, userId, indicatorId, encryptedKey)
 }
 
 /**
- * 检查代码是否需要解密
+ * Check if code needs decryption
  *
- * @param {string} code - 代码
- * @param {number} isEncrypted - 是否加密标记
+ * @param {string} code - The code
+ * @param {number} isEncrypted - Encryption flag
  * @returns {boolean}
  */
 export function needsDecrypt (code, isEncrypted) {
-  // 如果明确标记为加密，或者代码长度很长且符合base64格式，可能需要解密
+  // If explicitly marked as encrypted, or code is long and base64 formatted, it might need decryption
   if (isEncrypted === 1 || isEncrypted === true) {
     return true
   }
 
-  // 简单检查：加密代码通常较长（base64编码会增大约33%）
+  // Simple check: encrypted code is usually long (base64 increases size by ~33%)
   if (code && code.length > 100) {
-    // 尝试base64解码检查
+    // Attempt base64 decode check
     try {
       const decoded = atob(code)
-      // 如果解码后的长度合理，可能是加密的
+      // If decoded length is reasonable, it might be encrypted
       if (decoded.length > 50) {
         return true
       }
     } catch (e) {
-      // 不是base64，不需要解密
+      // Not base64, no decryption needed
     }
   }
 
diff --git a/frontend_vue/src/utils/filter.js b/frontend_vue/src/utils/filter.js
index 45702c6..425b38a 100644
--- a/frontend_vue/src/utils/filter.js
+++ b/frontend_vue/src/utils/filter.js
@@ -1,13 +1,13 @@
 import Vue from 'vue'
 import moment from 'moment'
-import 'moment/locale/zh-cn'
-moment.locale('zh-cn')
+import 'moment/locale/eu'
+moment.locale('en-us')
 
 Vue.filter('NumberFormat', function (value) {
   if (!value) {
     return '0'
   }
-  const intPartFormat = value.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
+  const intPartFormat = value.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // Format integer part with thousands separators
   return intPartFormat
 })
 
diff --git a/frontend_vue/src/utils/request.js b/frontend_vue/src/utils/request.js
index b1d05cd..7387ba7 100644
--- a/frontend_vue/src/utils/request.js
+++ b/frontend_vue/src/utils/request.js
@@ -5,7 +5,7 @@ import notification from 'ant-design-vue/es/notification'
 import { VueAxios } from './axios'
 import { ACCESS_TOKEN, USER_INFO, USER_ROLES } from '@/store/mutation-types'
 
-// PHPSESSID 存储键名
+// PHPSESSID storage key name
 const PHPSESSID_KEY = 'PHPSESSID'
 // Locale storage key used by vue-i18n (see src/locales/index.js)
 const LOCALE_KEY = 'lang'
@@ -14,7 +14,7 @@ const LOCALE_KEY = 'lang'
 let isRedirectingToLogin = false
 
 /**
- * 获取 token，处理 token 可能是字符串或对象的情况
+ * Get token, handle case where token might be a string or an object
  */
 function getToken () {
   let token = storage.get(ACCESS_TOKEN)
@@ -22,30 +22,30 @@ function getToken () {
     return null
   }
   if (typeof token !== 'string') {
-    // 如果是对象，尝试获取 token 属性
+    // If it is an object, try to get the token property
     if (token && typeof token === 'object') {
       token = token.token || token.value || null
     } else {
       token = null
     }
   }
-  // 确保 token 是字符串且不为空
+  // Ensure token is a string and not empty
   return (typeof token === 'string' && token.length > 0) ? token : null
 }
 
-// 创建 axios 实例
+// Create axios instance
 const request = axios.create({
-  // API 请求的默认前缀
-  // 生产环境应由 Nginx 处理，开发环境由 devServer proxy 处理
+  // API request default prefix
+  // Production environment should be handled by Nginx, development environment by devServer proxy
   baseURL: '/',
   timeout: 30000, // Default request timeout 30s
-  withCredentials: true // 允许携带 cookies
+  withCredentials: true // Allow cookies with request
 })
 
 // Extended timeout for long-running AI analysis APIs
 export const ANALYSIS_TIMEOUT = 180000 // 3 minutes for AI analysis
 
-// 异常拦截处理器
+// Exception interceptor handler
 const errorHandler = (error) => {
   if (error.response) {
     const data = error.response.data
@@ -72,7 +72,7 @@ const errorHandler = (error) => {
           description: data.msg || data.message || 'Token invalid or expired, please login again.'
         })
 
-        // 项目使用 hash 模式，需要跳转到 /#/user/login
+        // Project uses hash mode, needs to redirect to /#/user/login
         const curHash = window.location.hash || ''
         if (!curHash.includes('/user/login')) {
           const redirect = encodeURIComponent(curHash.replace('#', '') || '/')
@@ -86,7 +86,7 @@ const errorHandler = (error) => {
 
 // request interceptor
 request.interceptors.request.use(config => {
-  // 使用统一的 token 获取函数
+  // Use unified token acquisition function
   const token = getToken()
   const lang = storage.get(LOCALE_KEY) || 'en-US'
 
@@ -95,16 +95,16 @@ request.interceptors.request.use(config => {
   config.headers['X-App-Lang'] = lang
   config.headers['Accept-Language'] = lang
 
-  // 如果 token 存在，将 token 添加到请求头
+  // If token exists, add it to request header
   if (token) {
-    // 使用 Authorization header，格式为 Bearer {token}
+    // Use Authorization header, format: Bearer {token}
     config.headers['Authorization'] = `Bearer ${token}`
-    // 同时保留原有的 Access-Token header（如果后端需要）
+    // Keep original Access-Token header for backward compatibility
     config.headers[ACCESS_TOKEN] = token
-    // 兼容后端要求的 token 头
+    // Compatible with backend expected token header
     config.headers['token'] = token
   } else {
-    // 调试：如果 token 不存在，记录日志
+    // Debug: if token doesn't exist, log it
     if (config.url && config.url.includes('/api/auth/info')) {
       const rawToken = storage.get(ACCESS_TOKEN)
       console.warn('Token missing for /api/auth/info request')
@@ -114,42 +114,42 @@ request.interceptors.request.use(config => {
     }
   }
 
-  // 防止缓存导致的 304：为请求添加禁止缓存的头
+  // Prevent 304 cache issues: add cache control headers
   config.headers['Cache-Control'] = 'no-cache'
   config.headers['Pragma'] = 'no-cache'
   config.headers['If-Modified-Since'] = '0'
 
-  // 为 GET 请求添加时间戳参数，避免缓存
+  // Add timestamp to GET requests to avoid caching
   if ((config.method || 'get').toLowerCase() === 'get') {
     const ts = Date.now()
     config.params = Object.assign({}, config.params || {}, { _t: ts })
   }
 
-  // 手动设置 PHPSESSID cookie，确保每次请求使用相同的 session
-  // 注意：浏览器不允许手动设置 Cookie 请求头，需要通过 document.cookie 设置
-  // 但由于跨域限制，可能无法直接设置 cookie，主要依赖 withCredentials: true
+  // Manually set PHPSESSID cookie to ensure same session for all requests
+  // Note: browser doesn't allow manual setting of Cookie header, must set via document.cookie
+  // Due to CORS, direct cookie setting might fail; rely on withCredentials: true
   const phpsessid = storage.get(PHPSESSID_KEY)
   if (phpsessid && typeof document !== 'undefined') {
-    // 检查当前 document.cookie 中的 PHPSESSID
+    // Check PHPSESSID in current document.cookie
     const currentCookies = document.cookie
     const currentPhpsessidMatch = currentCookies.match(/PHPSESSID=([^;]+)/i)
     const currentPhpsessid = currentPhpsessidMatch ? currentPhpsessidMatch[1].trim() : null
 
-    // 如果当前 cookie 中的 PHPSESSID 与保存的不一致，尝试更新
-    // 注意：跨域情况下可能无法设置 cookie，这取决于 CORS 配置
+    // If current PHPSESSID doesn't match saved value, try to update it
+    // Note: CORS might prevent cookie setting depending on configuration
     if (!currentPhpsessid || currentPhpsessid !== phpsessid) {
-      // 尝试设置 cookie（可能因为跨域而失败，但不影响 withCredentials 的工作）
+      // Attempt to set cookie (might fail due to CORS, but withCredentials still works)
       try {
-        // 尝试设置带 domain 的 cookie（仅当在相同域名下时有效）
+        // Attempt to set cookie with domain (valid only on same domain)
         if (window.location.hostname.includes('quantdinger.com')) {
           document.cookie = `PHPSESSID=${phpsessid}; path=/; domain=.quantdinger.com; SameSite=None; Secure`
         } else {
-          // 跨域情况下，只能依赖 withCredentials: true 和服务器设置
-          // 这里尝试设置，但可能不会成功
+          // In CORS cases, rely on withCredentials: true and server settings
+          // Attempt setting here, but it might not succeed
           document.cookie = `PHPSESSID=${phpsessid}; path=/; SameSite=None; Secure`
         }
       } catch (e) {
-        // 设置失败是正常的（跨域限制），主要依赖 withCredentials
+        // Setting failure is expected (CORS limits); mainly rely on withCredentials
       }
     }
   }
@@ -159,18 +159,18 @@ request.interceptors.request.use(config => {
 
 // response interceptor
 request.interceptors.response.use((response) => {
-  // 从响应中提取 PHPSESSID 并保存
-  // 由于浏览器安全限制，无法直接读取 set-cookie 头，需要通过 document.cookie 获取
+  // Extract PHPSESSID from response and save it
+  // Browser security prevents reading set-cookie header directly; use document.cookie
   try {
     if (typeof document !== 'undefined') {
-      // 从 document.cookie 获取 PHPSESSID（浏览器自动设置的）
+      // Get PHPSESSID from document.cookie (set automatically by browser)
       const cookies = document.cookie
       const phpsessidMatch = cookies.match(/PHPSESSID=([^;]+)/i)
       if (phpsessidMatch && phpsessidMatch[1]) {
         const phpsessid = phpsessidMatch[1].trim()
-        // 保存 PHPSESSID 到 storage，有效期 24 小时
+        // Save PHPSESSID to storage, valid for 24 hours
         const savedPhpsessid = storage.get(PHPSESSID_KEY)
-        // 如果 PHPSESSID 发生变化，更新保存的值
+        // If PHPSESSID changes, update the saved value
         if (!savedPhpsessid || savedPhpsessid !== phpsessid) {
           storage.set(PHPSESSID_KEY, phpsessid, new Date().getTime() + 24 * 60 * 60 * 1000)
         }
diff --git a/frontend_vue/src/utils/routeConvert.js b/frontend_vue/src/utils/routeConvert.js
index e88b0d6..650e943 100644
--- a/frontend_vue/src/utils/routeConvert.js
+++ b/frontend_vue/src/utils/routeConvert.js
@@ -16,7 +16,7 @@ export function convertRoutes (nodes) {
       if (!node.children || !node.children.length) continue
 
       node.children.forEach(child => {
-        // 转化相对路径
+        // Convert relative path
         if (child.path[0] !== '/' && !child.path.startsWith('http')) {
           child.path = node.path.replace(/(\w*)[/]*$/, `$1/${child.path}`)
         }
diff --git a/frontend_vue/src/utils/util.js b/frontend_vue/src/utils/util.js
index 2b77158..50b522d 100644
--- a/frontend_vue/src/utils/util.js
+++ b/frontend_vue/src/utils/util.js
@@ -5,13 +5,13 @@ export function timeFix () {
 }
 
 export function welcome () {
-  const arr = ['休息一会儿吧', '准备吃什么呢?', '要不要打一把 DOTA', '我猜你可能累了']
+  const arr = ['Take a break', 'What are you going to eat?', 'How about a game of DOTA?', 'I guess you might be tired']
   const index = Math.floor(Math.random() * arr.length)
   return arr[index]
 }
 
 /**
- * 触发 window.resize
+ * Trigger window.resize event
  */
 export function triggerWindowResizeEvent () {
   const event = document.createEvent('HTMLEvents')
diff --git a/frontend_vue/src/views/ai-asset-analysis/index.vue b/frontend_vue/src/views/ai-asset-analysis/index.vue
index 39fc1e0..62c7096 100644
--- a/frontend_vue/src/views/ai-asset-analysis/index.vue
+++ b/frontend_vue/src/views/ai-asset-analysis/index.vue
@@ -30,31 +30,31 @@
             <div class="rc-metrics">
               <template v-if="opp.market !== 'PredictionMarket'">
                 <div class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '当前价格' : 'Price' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.price', 'Price') }}</span>
                   <span class="rc-metric-value">${{ formatOppPrice(opp.price) }}</span>
                 </div>
                 <div class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '24h涨跌' : '24h Change' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.change24h', '24h Change') }}</span>
                   <span class="rc-metric-value" :class="Number(opp.change_24h) >= 0 ? 'rc-up' : 'rc-down'">
                     {{ Number(opp.change_24h) >= 0 ? '+' : '' }}{{ Number(opp.change_24h || 0).toFixed(2) }}%
                   </span>
                 </div>
                 <div class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '信号' : 'Signal' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.signal', 'Signal') }}</span>
                   <span class="rc-metric-value rc-signal-val" :class="`rc-signal-${opp.signal || ''}`">{{ getSignalLabel(opp.signal) }}</span>
                 </div>
               </template>
               <template v-else>
                 <div class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '市场概率' : 'Probability' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.probability', 'Probability') }}</span>
                   <span class="rc-metric-value">{{ Number(opp.price || 0).toFixed(1) }}%</span>
                 </div>
                 <div v-if="opp.ai_analysis" class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '机会评分' : 'Score' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.score', 'Score') }}</span>
                   <span class="rc-metric-value rc-up">{{ Number(opp.ai_analysis.opportunity_score || 0).toFixed(0) }}</span>
                 </div>
                 <div v-if="opp.ai_analysis" class="rc-metric">
-                  <span class="rc-metric-label">{{ isZhLocale ? '建议' : 'Rec.' }}</span>
+                  <span class="rc-metric-label">{{ tt('aiAssetAnalysis.opportunities.metric.recommendation', 'Rec.') }}</span>
                   <span class="rc-metric-value" :class="getRecommendationClass(opp.ai_analysis.recommendation)">
                     {{ getRecommendationLabel(opp.ai_analysis.recommendation) }}
                   </span>
@@ -114,21 +114,27 @@
           <span slot="tab"><a-icon type="radar-chart" /> {{ tt('aiAssetAnalysis.tabs.polymarket', 'Polymarket') }}</span>
           <div class="tab-body">
             <div class="polymarket-tab-content">
-              <div class="polymarket-placeholder">
-                <div class="placeholder-icon"><a-icon type="radar-chart" /></div>
-                <h3>{{ tt('polymarket.analysis.title', 'Polymarket Analysis') }}</h3>
-                <p>{{ tt('polymarket.analysis.description', 'Analyze a prediction market by URL or title and compare market pricing with AI probability.') }}</p>
-                <a-button style="margin-top: 16px" type="primary" size="large" icon="thunderbolt" @click="showPolymarketModal = true">
-                  {{ tt('polymarket.analysis.startAnalysis', 'Start analysis') }}
-                </a-button>
+              <div class="polymarket-hero">
+                <div class="polymarket-hero-copy">
+                  <div class="polymarket-hero-eyebrow">{{ tt('polymarket.analysis.title', 'Polymarket Analysis') }}</div>
+                  <h3>{{ tt('polymarket.analysis.heroTitle', 'Compare market pricing with AI conviction') }}</h3>
+                  <p>{{ tt('polymarket.analysis.description', 'Analyze a prediction market by URL or title and compare market pricing with AI probability.') }}</p>
+                </div>
+                <div class="polymarket-hero-actions">
+                  <a-button type="primary" size="large" icon="thunderbolt" @click="focusPolymarketWorkspace">
+                    {{ tt('polymarket.analysis.startAnalysis', 'Start analysis') }}
+                  </a-button>
+                  <a-button size="large" icon="export" @click="openPolymarketStandalone">
+                    {{ tt('polymarket.analysis.openStandalone', 'Open standalone page') }}
+                  </a-button>
+                </div>
               </div>
+              <polymarket-analysis-workspace ref="polymarketWorkspace" embedded />
             </div>
           </div>
         </a-tab-pane>
       </a-tabs>
     </a-card>
-
-    <polymarket-analysis-modal :visible="showPolymarketModal" @close="showPolymarketModal = false" />
   </div>
 </template>
 
@@ -137,14 +143,14 @@ import { mapState } from 'vuex'
 import AnalysisView from '@/views/ai-analysis'
 import { getTradingOpportunities } from '@/api/global-market'
 import QuickTradePanel from '@/components/QuickTradePanel.vue'
-import PolymarketAnalysisModal from '@/components/PolymarketAnalysisModal.vue'
+import PolymarketAnalysisWorkspace from '@/components/PolymarketAnalysisWorkspace.vue'
 
 export default {
   name: 'AIAssetAnalysis',
   components: {
     AnalysisView,
     QuickTradePanel,
-    PolymarketAnalysisModal
+    PolymarketAnalysisWorkspace
   },
   data () {
     return {
@@ -160,8 +166,7 @@ export default {
       qtPrice: 0,
       qtSource: 'ai_radar',
       currentAnalysisSymbol: '',
-      currentAnalysisMarket: '',
-      showPolymarketModal: false
+      currentAnalysisMarket: ''
     }
   },
   computed: {
@@ -171,9 +176,6 @@ export default {
     isDarkTheme () {
       return this.navTheme === 'dark' || this.navTheme === 'realdark'
     },
-    isZhLocale () {
-      return this.$i18n && this.$i18n.locale === 'zh-CN'
-    },
     carouselItems () {
       return this.opportunities.length === 0 ? [] : [...this.opportunities, ...this.opportunities]
     },
@@ -185,8 +187,20 @@ export default {
   },
   created () {
     this.loadOpportunities()
+    this.applyRouteState()
+  },
+  watch: {
+    '$route.query.tab' () {
+      this.applyRouteState()
+    }
   },
   methods: {
+    applyRouteState () {
+      const query = (this.$route && this.$route.query) || {}
+      if (query.tab === 'polymarket' || query.tab === 'quick') {
+        this.activeTab = query.tab
+      }
+    },
     tt (key, fallback, params) {
       const translated = this.$t(key, params)
       return translated !== key ? translated : fallback
@@ -238,7 +252,15 @@ export default {
     analyzeOpportunity (opp) {
       if (opp.market === 'PredictionMarket') {
         this.activeTab = 'polymarket'
-        this.showPolymarketModal = true
+        this.$nextTick(() => {
+          const workspace = this.$refs.polymarketWorkspace
+          const input = opp.market_url || opp.name || opp.symbol
+          if (workspace && input && workspace.startFromInput) {
+            workspace.startFromInput(input)
+          } else if (workspace && workspace.focusInput) {
+            workspace.focusInput()
+          }
+        })
         return
       }
       this.activeTab = 'quick'
@@ -283,6 +305,18 @@ export default {
     handleQuickTradeSymbolChange (symbol) {
       this.qtSymbol = symbol
     },
+    focusPolymarketWorkspace () {
+      this.activeTab = 'polymarket'
+      this.$nextTick(() => {
+        const workspace = this.$refs.polymarketWorkspace
+        if (workspace && workspace.focusInput) {
+          workspace.focusInput()
+        }
+      })
+    },
+    openPolymarketStandalone () {
+      this.$router.push('/polymarket')
+    },
     onAnalysisSymbolChange (value) {
       if (!value) {
         this.currentAnalysisSymbol = ''
@@ -348,16 +382,19 @@ export default {
 .qt-floating-btn { position: fixed; right: 26px; bottom: 28px; z-index: 9; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg, #0ea5e9, #2563eb); color: #fff; font-size: 22px; box-shadow: 0 16px 30px rgba(37, 99, 235, 0.35); cursor: pointer; }
 .workspace-card { background: #fff; }
 .tab-body { min-height: 720px; }
-.polymarket-tab-content { display: flex; align-items: center; justify-content: center; min-height: 520px; padding: 24px; }
-.polymarket-placeholder { max-width: 560px; padding: 36px; border-radius: 24px; text-align: center; background: linear-gradient(180deg, #f8fafc, #eff6ff); }
-.placeholder-icon { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin-bottom: 18px; border-radius: 50%; background: linear-gradient(135deg, #0ea5e9, #2563eb); color: #fff; font-size: 28px; }
-.polymarket-placeholder h3 { margin-bottom: 12px; color: #0f172a; font-size: 24px; }
-.polymarket-placeholder p { margin: 0; color: rgba(15, 23, 42, 0.66); line-height: 1.7; }
+.polymarket-tab-content { min-height: 520px; padding: 24px; }
+.polymarket-hero { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 24px; border-radius: 24px; background: linear-gradient(135deg, #eff6ff 0%, #f8fafc 55%, #ffffff 100%); border: 1px solid #dbe7f5; }
+.polymarket-hero-copy { max-width: 720px; }
+.polymarket-hero-eyebrow { color: #2563eb; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
+.polymarket-hero h3 { margin: 10px 0 12px; color: #0f172a; font-size: 28px; font-weight: 700; }
+.polymarket-hero p { margin: 0; color: rgba(15, 23, 42, 0.66); line-height: 1.7; }
+.polymarket-hero-actions { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
 .theme-dark.ai-asset-analysis-page { background: #0b1220; }
 .theme-dark .workspace-card { background: #111827; }
-.theme-dark .polymarket-placeholder { background: linear-gradient(180deg, #111827, #1f2937); }
-.theme-dark .polymarket-placeholder h3 { color: #f8fafc; }
-.theme-dark .polymarket-placeholder p { color: rgba(248, 250, 252, 0.72); }
+.theme-dark .polymarket-hero { border-color: rgba(59, 130, 246, 0.16); background: linear-gradient(135deg, #111827 0%, #0f172a 60%, #161b22 100%); }
+.theme-dark .polymarket-hero-eyebrow { color: #60a5fa; }
+.theme-dark .polymarket-hero h3 { color: #f8fafc; }
+.theme-dark .polymarket-hero p { color: rgba(248, 250, 252, 0.72); }
 @keyframes radar-scroll {
   from { transform: translateX(0); }
   to { transform: translateX(calc(-50% - 7px)); }
@@ -368,5 +405,6 @@ export default {
   .radar-card.is-prediction { width: 280px; }
   .rc-metrics { grid-template-columns: 1fr; }
   .tab-body { min-height: auto; }
+  .polymarket-hero { flex-direction: column; }
 }
 </style>
diff --git a/frontend_vue/src/views/backtest-center/components/BacktestHistoryDrawer.vue b/frontend_vue/src/views/backtest-center/components/BacktestHistoryDrawer.vue
new file mode 100644
index 0000000..56a9278
--- /dev/null
+++ b/frontend_vue/src/views/backtest-center/components/BacktestHistoryDrawer.vue
@@ -0,0 +1,339 @@
+<template>
+  <a-drawer
+    class="backtest-history-drawer"
+    :title="drawerTitle"
+    :visible="visible"
+    :width="isMobile ? '100%' : 1080"
+    :maskClosable="true"
+    @close="$emit('cancel')"
+  >
+    <div class="drawer-toolbar">
+      <div class="toolbar-left">
+        <a-button type="primary" icon="reload" size="small" :loading="loading" @click="loadRuns">
+          {{ tt('dashboard.indicator.backtest.historyRefresh', 'Refresh') }}
+        </a-button>
+        <a-button
+          v-if="canAIAnalyze"
+          type="primary"
+          ghost
+          size="small"
+          :disabled="selectedRowKeys.length === 0"
+          :loading="analyzing"
+          @click="handleAIAnalyze"
+        >
+          <a-icon type="bulb" />
+          {{ tt('dashboard.indicator.backtest.historyAISuggest', 'AI suggestions') }}
+        </a-button>
+        <span v-if="canAIAnalyze && selectedRowKeys.length" class="selected-tip">
+          {{ tt('dashboard.indicator.backtest.historySelectedCount', `${selectedRowKeys.length} runs selected`, { count: selectedRowKeys.length }) }}
+        </span>
+      </div>
+
+      <div class="toolbar-right">
+        <a-input
+          v-model="filterSymbol"
+          size="small"
+          allow-clear
+          :placeholder="tt('dashboard.indicator.backtest.historyFilterSymbol', 'Filter by symbol')"
+          style="width: 170px;"
+          @change="debouncedLoad"
+        />
+        <a-select
+          v-model="filterTimeframe"
+          size="small"
+          allow-clear
+          :placeholder="tt('dashboard.indicator.backtest.historyFilterTimeframe', 'Timeframe')"
+          style="width: 110px;"
+          @change="loadRuns"
+        >
+          <a-select-option v-for="tf in timeframes" :key="tf" :value="tf">{{ tf }}</a-select-option>
+        </a-select>
+      </div>
+    </div>
+
+    <a-table
+      :columns="columns"
+      :data-source="runs"
+      :loading="loading"
+      size="small"
+      :pagination="{ pageSize: 15, size: 'small' }"
+      rowKey="id"
+      :scroll="{ x: 1000 }"
+      :rowSelection="canAIAnalyze ? { selectedRowKeys, onChange: onRowSelectionChange } : null"
+    >
+      <template slot="symbol" slot-scope="text, record">
+        <span class="symbol-cell">
+          <strong>{{ record.symbol || '-' }}</strong>
+          <a-tag v-if="record.market" size="small">{{ record.market }}</a-tag>
+        </span>
+      </template>
+      <template slot="range" slot-scope="text, record">
+        <span>{{ formatRange(record) }}</span>
+      </template>
+      <template slot="returnPct" slot-scope="text">
+        <span v-if="text !== null && text !== undefined" :class="Number(text) >= 0 ? 'positive' : 'negative'">
+          {{ Number(text) >= 0 ? '+' : '' }}{{ Number(text).toFixed(2) }}%
+        </span>
+        <span v-else>-</span>
+      </template>
+      <template slot="createdAt" slot-scope="text">
+        <span>{{ formatLocalDateTime(text) }}</span>
+      </template>
+      <template slot="status" slot-scope="text">
+        <a-tag :color="text === 'success' ? 'green' : text === 'failed' ? 'red' : 'blue'">
+          {{ text === 'success' ? tt('dashboard.indicator.backtest.historyStatusSuccess', 'Success') : text === 'failed' ? tt('dashboard.indicator.backtest.historyStatusFailed', 'Failed') : text }}
+        </a-tag>
+      </template>
+      <template slot="actions" slot-scope="text, record">
+        <a-button type="link" size="small" :loading="detailLoadingId === record.id" @click="viewRun(record)">
+          {{ tt('dashboard.indicator.backtest.historyView', 'View') }}
+        </a-button>
+      </template>
+    </a-table>
+
+    <a-empty v-if="!loading && runs.length === 0" :description="tt('dashboard.indicator.backtest.historyNoData', 'No backtest runs yet')" />
+
+    <a-modal
+      :title="tt('dashboard.indicator.backtest.historyAIAnalyzeTitle', 'AI suggestions')"
+      :visible="showAIResult"
+      :footer="null"
+      :width="isMobile ? '100%' : 900"
+      @cancel="showAIResult = false"
+    >
+      <div v-if="analyzing" class="ai-result-loading">
+        <a-spin />
+      </div>
+      <div v-else class="ai-result-text">
+        {{ aiResult || tt('dashboard.indicator.backtest.historyNoAIResult', 'No AI result available.') }}
+      </div>
+    </a-modal>
+  </a-drawer>
+</template>
+
+<script>
+import request from '@/utils/request'
+import { getStrategyBacktestHistory, getStrategyBacktestRun } from '@/api/strategy'
+
+export default {
+  name: 'BacktestHistoryDrawer',
+  props: {
+    visible: { type: Boolean, default: false },
+    userId: { type: [Number, String], default: 1 },
+    indicatorId: { type: [Number, String], default: null },
+    strategyId: { type: [Number, String], default: null },
+    runType: { type: String, default: 'indicator' },
+    symbol: { type: String, default: '' },
+    market: { type: String, default: '' },
+    timeframe: { type: String, default: '' },
+    isMobile: { type: Boolean, default: false }
+  },
+  data () {
+    return {
+      loading: false,
+      detailLoadingId: null,
+      analyzing: false,
+      showAIResult: false,
+      aiResult: '',
+      selectedRowKeys: [],
+      filterSymbol: '',
+      filterTimeframe: '',
+      searchTimer: null,
+      runs: [],
+      timeframes: ['1m', '5m', '15m', '30m', '1H', '4H', '1D', '1W']
+    }
+  },
+  computed: {
+    canAIAnalyze () {
+      return this.runType === 'indicator'
+    },
+    drawerTitle () {
+      return this.runType === 'strategy'
+        ? this.tt('backtest-center.strategy.history', 'Strategy backtest history')
+        : this.tt('backtest-center.indicator.history', 'Indicator backtest history')
+    },
+    columns () {
+      return [
+        { title: this.tt('dashboard.indicator.backtest.historyRunId', 'Run ID'), dataIndex: 'id', key: 'id', width: 86 },
+        { title: this.tt('dashboard.indicator.backtest.symbol', 'Symbol'), key: 'symbol', width: 180, scopedSlots: { customRender: 'symbol' } },
+        { title: this.tt('dashboard.indicator.backtest.timeframe', 'Timeframe'), dataIndex: 'timeframe', key: 'timeframe', width: 96 },
+        { title: this.tt('dashboard.indicator.backtest.historyRange', 'Date range'), key: 'range', width: 220, scopedSlots: { customRender: 'range' } },
+        { title: this.tt('dashboard.indicator.backtest.totalReturn', 'Total return'), dataIndex: 'total_return', key: 'total_return', width: 120, scopedSlots: { customRender: 'returnPct' } },
+        { title: this.tt('dashboard.indicator.backtest.historyCreatedAt', 'Created at'), dataIndex: 'created_at', key: 'created_at', width: 170, scopedSlots: { customRender: 'createdAt' } },
+        { title: this.tt('dashboard.indicator.backtest.historyStatus', 'Status'), dataIndex: 'status', key: 'status', width: 100, scopedSlots: { customRender: 'status' } },
+        { title: this.tt('dashboard.indicator.backtest.historyActions', 'Actions'), key: 'actions', width: 90, scopedSlots: { customRender: 'actions' } }
+      ]
+    }
+  },
+  watch: {
+    visible (value) {
+      if (!value) return
+      this.filterSymbol = this.symbol || ''
+      this.filterTimeframe = this.timeframe || ''
+      this.selectedRowKeys = []
+      this.aiResult = ''
+      this.showAIResult = false
+      this.loadRuns()
+    }
+  },
+  beforeDestroy () {
+    if (this.searchTimer) {
+      clearTimeout(this.searchTimer)
+      this.searchTimer = null
+    }
+  },
+  methods: {
+    tt (key, fallback, params) {
+      const translated = this.$t(key, params)
+      return translated !== key ? translated : fallback
+    },
+    onRowSelectionChange (keys) {
+      this.selectedRowKeys = keys || []
+    },
+    formatRange (record) {
+      const start = (record && record.start_date) ? String(record.start_date).slice(0, 10) : ''
+      const end = (record && record.end_date) ? String(record.end_date).slice(0, 10) : ''
+      return `${start} ~ ${end}`
+    },
+    formatLocalDateTime (value) {
+      if (!value) return '-'
+      const date = new Date(value)
+      if (Number.isNaN(date.getTime())) return String(value)
+      return date.toLocaleString()
+    },
+    debouncedLoad () {
+      if (this.searchTimer) {
+        clearTimeout(this.searchTimer)
+      }
+      this.searchTimer = setTimeout(() => {
+        this.loadRuns()
+      }, 350)
+    },
+    async loadRuns () {
+      this.loading = true
+      try {
+        const params = {
+          limit: 100,
+          offset: 0,
+          symbol: (this.filterSymbol || '').trim(),
+          market: this.market || '',
+          timeframe: this.filterTimeframe || ''
+        }
+
+        let res
+        if (this.runType === 'strategy') {
+          res = await getStrategyBacktestHistory({
+            ...params,
+            strategyId: this.strategyId
+          })
+        } else {
+          res = await request({
+            url: '/api/indicator/backtest/history',
+            method: 'get',
+            params: {
+              ...params,
+              userid: this.userId,
+              indicatorId: this.indicatorId
+            }
+          })
+        }
+
+        this.runs = res && res.code === 1 && Array.isArray(res.data) ? res.data : []
+      } finally {
+        this.loading = false
+      }
+    },
+    async viewRun (record) {
+      if (!record || !record.id) return
+      this.detailLoadingId = record.id
+      try {
+        let res
+        if (this.runType === 'strategy') {
+          res = await getStrategyBacktestRun(record.id)
+        } else {
+          res = await request({
+            url: '/api/indicator/backtest/get',
+            method: 'get',
+            params: { userid: this.userId, runId: record.id }
+          })
+        }
+
+        if (res && res.code === 1 && res.data) {
+          this.$emit('view', res.data)
+        }
+      } finally {
+        this.detailLoadingId = null
+      }
+    },
+    async handleAIAnalyze () {
+      if (!this.canAIAnalyze || !this.selectedRowKeys.length) return
+      this.analyzing = true
+      this.showAIResult = true
+      this.aiResult = ''
+      try {
+        const lang = (this.$i18n && this.$i18n.locale) ? this.$i18n.locale : 'en-US'
+        const res = await request({
+          url: '/api/indicator/backtest/aiAnalyze',
+          method: 'post',
+          data: {
+            userid: this.userId,
+            runIds: this.selectedRowKeys,
+            lang
+          }
+        })
+        if (res && res.code === 1 && res.data && res.data.analysis) {
+          this.aiResult = res.data.analysis
+        } else {
+          this.aiResult = (res && res.msg) || this.tt('dashboard.indicator.backtest.historyNoAIResult', 'No AI result available.')
+        }
+      } finally {
+        this.analyzing = false
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.drawer-toolbar {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  align-items: center;
+  margin-bottom: 12px;
+  flex-wrap: wrap;
+}
+
+.toolbar-left,
+.toolbar-right,
+.symbol-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+
+.selected-tip {
+  color: #64748b;
+  font-size: 12px;
+}
+
+.ai-result-loading {
+  padding: 16px 0;
+}
+
+.ai-result-text {
+  white-space: pre-wrap;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+  line-height: 1.6;
+}
+
+.positive {
+  color: #16a34a;
+  font-weight: 600;
+}
+
+.negative {
+  color: #dc2626;
+  font-weight: 600;
+}
+</style>
diff --git a/frontend_vue/src/views/backtest-center/components/ResultView.vue b/frontend_vue/src/views/backtest-center/components/ResultView.vue
new file mode 100644
index 0000000..3fc306a
--- /dev/null
+++ b/frontend_vue/src/views/backtest-center/components/ResultView.vue
@@ -0,0 +1,489 @@
+<template>
+  <div class="result-view" :class="{ 'theme-dark': isDark }">
+    <div v-if="running" class="result-state result-state--loading">
+      <a-spin size="large" />
+      <div class="result-state-title">{{ tt('backtest-center.running', 'Running backtest...') }}</div>
+      <div class="result-state-desc">{{ runTip || tt('backtest-center.runningDesc', 'This can take longer for larger time ranges and lower timeframes.') }}</div>
+    </div>
+
+    <div v-else-if="!hasResult || !safeResult" class="result-state">
+      <div class="result-state-icon">
+        <a-icon type="line-chart" />
+      </div>
+      <div class="result-state-title">{{ tt('backtest-center.result.placeholderTitle', 'Your backtest results will appear here') }}</div>
+      <div class="result-state-desc">{{ tt('backtest-center.result.placeholderDesc', 'Configure the left panel, run a backtest, then inspect equity, trades, and risk metrics in one place.') }}</div>
+    </div>
+
+    <div v-else class="result-body">
+      <div class="result-meta" v-if="symbol || timeframe || market">
+        <a-tag v-if="market" size="small">{{ market }}</a-tag>
+        <a-tag v-if="symbol" size="small">{{ symbol }}</a-tag>
+        <a-tag v-if="timeframe" size="small">{{ timeframe }}</a-tag>
+        <a-tag v-if="backtestRunId" color="blue" size="small">Run #{{ backtestRunId }}</a-tag>
+      </div>
+
+      <div class="metrics-grid">
+        <div class="metric-card" :class="{ positive: metricValue('totalReturn') > 0, negative: metricValue('totalReturn') < 0 }">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.totalReturn', 'Total return') }}</div>
+          <div class="metric-value">{{ formatPercent(safeResult.totalReturn) }}</div>
+          <div class="metric-sub">{{ formatMoney(safeResult.totalProfit) }}</div>
+        </div>
+        <div class="metric-card" :class="{ positive: metricValue('annualReturn') > 0, negative: metricValue('annualReturn') < 0 }">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.annualReturn', 'Annual return') }}</div>
+          <div class="metric-value">{{ formatPercent(safeResult.annualReturn) }}</div>
+        </div>
+        <div class="metric-card negative">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.maxDrawdown', 'Max drawdown') }}</div>
+          <div class="metric-value">{{ formatPercent(safeResult.maxDrawdown) }}</div>
+        </div>
+        <div class="metric-card">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.sharpeRatio', 'Sharpe ratio') }}</div>
+          <div class="metric-value">{{ formatNumber(safeResult.sharpeRatio, 2) }}</div>
+        </div>
+        <div class="metric-card">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.winRate', 'Win rate') }}</div>
+          <div class="metric-value">{{ formatPercent(safeResult.winRate) }}</div>
+        </div>
+        <div class="metric-card" :class="{ positive: metricValue('profitFactor') >= 1.5, negative: metricValue('profitFactor') > 0 && metricValue('profitFactor') < 1 }">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.profitFactor', 'Profit factor') }}</div>
+          <div class="metric-value">{{ formatNumber(safeResult.profitFactor, 2) }}</div>
+        </div>
+        <div class="metric-card">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.totalTrades', 'Total trades') }}</div>
+          <div class="metric-value">{{ metricInteger('totalTrades') }}</div>
+        </div>
+        <div class="metric-card negative">
+          <div class="metric-label">{{ tt('dashboard.indicator.backtest.totalCommission', 'Total commission') }}</div>
+          <div class="metric-value">{{ formatMoney(-(Number(safeResult.totalCommission) || 0)) }}</div>
+        </div>
+      </div>
+
+      <div class="panel-card">
+        <div class="panel-title">{{ tt('dashboard.indicator.backtest.equityCurve', 'Equity curve') }}</div>
+        <div ref="equityChartRef" class="equity-chart"></div>
+      </div>
+
+      <div class="panel-card">
+        <div class="panel-title">{{ tt('dashboard.indicator.backtest.tradeHistory', 'Trade history') }}</div>
+        <a-table
+          :columns="tradeColumns"
+          :data-source="safeResult.trades || []"
+          :pagination="{ pageSize: 10, size: 'small' }"
+          size="small"
+          :scroll="{ x: 820 }"
+          :rowKey="rowKey"
+        >
+          <template slot="type" slot-scope="text">
+            <a-tag :color="getTradeTypeColor(text)">
+              {{ getTradeTypeText(text) }}
+            </a-tag>
+          </template>
+          <template slot="balance" slot-scope="text">
+            <span class="money-emphasis">
+              {{ formatMoney(text, false) }}
+            </span>
+          </template>
+          <template slot="profit" slot-scope="text">
+            <span :class="text > 0 ? 'positive' : text < 0 ? 'negative' : 'muted'">
+              {{ formatMoney(text) }}
+            </span>
+          </template>
+        </a-table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+
+export default {
+  name: 'BacktestResultView',
+  props: {
+    running: { type: Boolean, default: false },
+    runTip: { type: String, default: '' },
+    hasResult: { type: Boolean, default: false },
+    result: { type: Object, default: null },
+    backtestRunId: { type: [Number, String], default: null },
+    symbol: { type: String, default: '' },
+    market: { type: String, default: '' },
+    timeframe: { type: String, default: '' },
+    isDark: { type: Boolean, default: false }
+  },
+  data () {
+    return {
+      equityChart: null
+    }
+  },
+  computed: {
+    safeResult () {
+      if (!this.result) return null
+      return this.result.result || this.result
+    },
+    tradeColumns () {
+      return [
+        { title: this.tt('dashboard.indicator.backtest.tradeTime', 'Trade time'), dataIndex: 'time', key: 'time', width: 170 },
+        { title: this.tt('dashboard.indicator.backtest.tradeType', 'Trade type'), dataIndex: 'type', key: 'type', width: 150, scopedSlots: { customRender: 'type' } },
+        { title: this.tt('dashboard.indicator.backtest.price', 'Price'), dataIndex: 'price', key: 'price', width: 120 },
+        { title: this.tt('dashboard.indicator.backtest.amount', 'Amount'), dataIndex: 'amount', key: 'amount', width: 110 },
+        { title: this.tt('dashboard.indicator.backtest.profit', 'Profit'), dataIndex: 'profit', key: 'profit', width: 120, scopedSlots: { customRender: 'profit' } },
+        { title: this.tt('dashboard.indicator.backtest.balance', 'Balance'), dataIndex: 'balance', key: 'balance', width: 140, scopedSlots: { customRender: 'balance' } }
+      ]
+    }
+  },
+  watch: {
+    result: {
+      deep: true,
+      handler () {
+        this.$nextTick(() => {
+          this.renderEquityChart()
+        })
+      }
+    },
+    isDark () {
+      this.$nextTick(() => {
+        this.renderEquityChart()
+      })
+    }
+  },
+  mounted () {
+    window.addEventListener('resize', this.handleResize)
+    this.$nextTick(() => {
+      this.renderEquityChart()
+    })
+  },
+  beforeDestroy () {
+    window.removeEventListener('resize', this.handleResize)
+    this.disposeChart()
+  },
+  methods: {
+    tt (key, fallback, params) {
+      const translated = this.$t(key, params)
+      return translated !== key ? translated : fallback
+    },
+    rowKey (record, index) {
+      return (record && record.id) || index
+    },
+    metricValue (key) {
+      return Number(this.safeResult && this.safeResult[key]) || 0
+    },
+    metricInteger (key) {
+      return Number(this.safeResult && this.safeResult[key]) || 0
+    },
+    formatNumber (value, precision = 2) {
+      const number = Number(value)
+      if (!Number.isFinite(number)) return '--'
+      return number.toFixed(precision)
+    },
+    formatPercent (value) {
+      const number = Number(value)
+      if (!Number.isFinite(number)) return '--'
+      const sign = number >= 0 ? '+' : ''
+      return `${sign}${number.toFixed(2)}%`
+    },
+    formatMoney (value, signed = true) {
+      const number = Number(value)
+      if (!Number.isFinite(number)) return '--'
+      const abs = Math.abs(number).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
+      if (!signed) return `$${abs}`
+      const sign = number >= 0 ? '+' : '-'
+      return `${sign}$${abs}`
+    },
+    getTradeTypeColor (type) {
+      const colorMap = {
+        buy: 'green',
+        sell: 'red',
+        liquidation: 'orange',
+        open_long: 'green',
+        add_long: 'cyan',
+        close_long: 'orange',
+        close_long_stop: 'red',
+        close_long_profit: 'lime',
+        close_long_trailing: 'gold',
+        reduce_long: 'volcano',
+        open_short: 'red',
+        add_short: 'magenta',
+        close_short: 'blue',
+        close_short_stop: 'red',
+        close_short_profit: 'cyan',
+        close_short_trailing: 'gold',
+        reduce_short: 'volcano'
+      }
+      return colorMap[type] || 'default'
+    },
+    getTradeTypeText (type) {
+      const map = {
+        open_long: this.tt('dashboard.indicator.backtest.openLong', 'Open long'),
+        add_long: this.tt('dashboard.indicator.backtest.addLong', 'Add long'),
+        close_long: this.tt('dashboard.indicator.backtest.closeLong', 'Close long'),
+        close_long_stop: this.tt('dashboard.indicator.backtest.closeLongStop', 'Close long stop'),
+        close_long_profit: this.tt('dashboard.indicator.backtest.closeLongProfit', 'Close long take-profit'),
+        close_long_trailing: this.tt('dashboard.indicator.backtest.closeLongTrailing', 'Close long trailing'),
+        reduce_long: this.tt('dashboard.indicator.backtest.reduceLong', 'Reduce long'),
+        open_short: this.tt('dashboard.indicator.backtest.openShort', 'Open short'),
+        add_short: this.tt('dashboard.indicator.backtest.addShort', 'Add short'),
+        close_short: this.tt('dashboard.indicator.backtest.closeShort', 'Close short'),
+        close_short_stop: this.tt('dashboard.indicator.backtest.closeShortStop', 'Close short stop'),
+        close_short_profit: this.tt('dashboard.indicator.backtest.closeShortProfit', 'Close short take-profit'),
+        close_short_trailing: this.tt('dashboard.indicator.backtest.closeShortTrailing', 'Close short trailing'),
+        reduce_short: this.tt('dashboard.indicator.backtest.reduceShort', 'Reduce short'),
+        liquidation: this.tt('dashboard.indicator.backtest.liquidation', 'Liquidation')
+      }
+      return map[type] || type
+    },
+    disposeChart () {
+      if (this.equityChart) {
+        this.equityChart.dispose()
+        this.equityChart = null
+      }
+    },
+    handleResize () {
+      if (this.equityChart) {
+        this.equityChart.resize()
+      }
+    },
+    renderEquityChart () {
+      if (!this.$refs.equityChartRef || !this.safeResult || !Array.isArray(this.safeResult.equityCurve)) {
+        this.disposeChart()
+        return
+      }
+
+      const data = this.safeResult.equityCurve || []
+      if (!data.length) {
+        this.disposeChart()
+        return
+      }
+
+      if (this.equityChart) {
+        this.equityChart.dispose()
+      }
+      this.equityChart = echarts.init(this.$refs.equityChartRef)
+
+      const dates = data.map(item => item.time || item.date)
+      const equity = data.map(item => item.value !== undefined ? item.value : item.equity)
+      const initialValue = equity[0] || 0
+      const finalValue = equity[equity.length - 1] || initialValue
+      const positive = finalValue >= initialValue
+      const lineColor = positive ? '#22c55e' : '#ef4444'
+      const axisColor = this.isDark ? '#94a3b8' : '#64748b'
+      const splitColor = this.isDark ? 'rgba(148, 163, 184, 0.14)' : 'rgba(148, 163, 184, 0.18)'
+      const areaStops = positive
+        ? [{ offset: 0, color: 'rgba(34, 197, 94, 0.30)' }, { offset: 1, color: 'rgba(34, 197, 94, 0.02)' }]
+        : [{ offset: 0, color: 'rgba(239, 68, 68, 0.30)' }, { offset: 1, color: 'rgba(239, 68, 68, 0.02)' }]
+
+      this.equityChart.setOption({
+        backgroundColor: 'transparent',
+        tooltip: {
+          trigger: 'axis',
+          valueFormatter: value => (Number.isFinite(Number(value)) ? `$${Number(value).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}` : value)
+        },
+        grid: { left: 20, right: 20, bottom: 24, top: 16, containLabel: true },
+        xAxis: {
+          type: 'category',
+          data: dates,
+          boundaryGap: false,
+          axisLabel: { color: axisColor },
+          axisLine: { lineStyle: { color: splitColor } }
+        },
+        yAxis: {
+          type: 'value',
+          axisLabel: {
+            color: axisColor,
+            formatter: value => `$${Number(value).toLocaleString('en-US', { maximumFractionDigits: 0 })}`
+          },
+          splitLine: { lineStyle: { color: splitColor } }
+        },
+        series: [
+          {
+            name: this.tt('dashboard.indicator.backtest.strategy', 'Strategy'),
+            type: 'line',
+            data: equity,
+            smooth: 0.35,
+            symbol: 'none',
+            sampling: 'lttb',
+            lineStyle: { width: 2.5, color: lineColor },
+            areaStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, areaStops)
+            }
+          }
+        ]
+      })
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.result-view {
+  min-height: 560px;
+}
+
+.result-state {
+  min-height: 560px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  padding: 32px 24px;
+  border: 1px dashed #cbd5e1;
+  border-radius: 24px;
+  background: linear-gradient(180deg, rgba(248, 250, 252, 0.92), rgba(255, 255, 255, 0.96));
+
+  &--loading {
+    border-style: solid;
+  }
+}
+
+.result-state-icon {
+  width: 64px;
+  height: 64px;
+  border-radius: 20px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 28px;
+  color: #2563eb;
+  background: rgba(37, 99, 235, 0.12);
+  margin-bottom: 16px;
+}
+
+.result-state-title {
+  font-size: 20px;
+  font-weight: 700;
+  color: #0f172a;
+  margin-top: 14px;
+}
+
+.result-state-desc {
+  color: #64748b;
+  margin-top: 8px;
+  max-width: 520px;
+}
+
+.result-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 14px;
+}
+
+.metrics-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 12px;
+}
+
+.metric-card {
+  border-radius: 18px;
+  border: 1px solid #e2e8f0;
+  background: #fff;
+  padding: 16px;
+}
+
+.metric-label {
+  font-size: 12px;
+  font-weight: 600;
+  color: #64748b;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+.metric-value {
+  margin-top: 8px;
+  font-size: 24px;
+  font-weight: 700;
+  color: #0f172a;
+}
+
+.metric-sub {
+  margin-top: 6px;
+  color: #64748b;
+  font-size: 13px;
+}
+
+.metric-card.positive .metric-value,
+.positive {
+  color: #16a34a;
+}
+
+.metric-card.negative .metric-value,
+.negative {
+  color: #dc2626;
+}
+
+.muted {
+  color: #64748b;
+}
+
+.panel-card {
+  margin-top: 14px;
+  border-radius: 22px;
+  border: 1px solid #e2e8f0;
+  background: #fff;
+  padding: 16px;
+}
+
+.panel-title {
+  font-size: 15px;
+  font-weight: 700;
+  color: #0f172a;
+  margin-bottom: 12px;
+}
+
+.equity-chart {
+  height: 320px;
+}
+
+.money-emphasis {
+  font-weight: 600;
+  color: #2563eb;
+}
+
+.theme-dark {
+  .result-state {
+    border-color: rgba(148, 163, 184, 0.2);
+    background: linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.96));
+  }
+
+  .result-state-title,
+  .metric-value,
+  .panel-title {
+    color: #e2e8f0;
+  }
+
+  .result-state-desc,
+  .metric-label,
+  .metric-sub,
+  .muted {
+    color: #94a3b8;
+  }
+
+  .metric-card,
+  .panel-card {
+    border-color: rgba(148, 163, 184, 0.16);
+    background: rgba(15, 23, 42, 0.86);
+  }
+}
+
+@media (max-width: 1200px) {
+  .metrics-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 767px) {
+  .result-view,
+  .result-state {
+    min-height: 420px;
+  }
+
+  .metrics-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .equity-chart {
+    height: 260px;
+  }
+}
+</style>
diff --git a/frontend_vue/src/views/backtest-center/index.vue b/frontend_vue/src/views/backtest-center/index.vue
new file mode 100644
index 0000000..547819e
--- /dev/null
+++ b/frontend_vue/src/views/backtest-center/index.vue
@@ -0,0 +1,1519 @@
+<template>
+  <div class="backtest-center" :class="{ 'theme-dark': isDarkTheme }">
+    <div class="page-header">
+      <h2 class="page-title">
+        <a-icon class="title-icon" type="experiment" />
+        {{ tt('backtest-center.title', 'Backtest Center') }}
+      </h2>
+      <p class="page-subtitle">
+        {{ tt('backtest-center.subtitle', 'Replay indicator and strategy logic with current frontend controls, then inspect risk, trades, and equity before going live.') }}
+      </p>
+    </div>
+
+    <a-tabs v-model="activeTab" class="main-tabs" :animated="false">
+      <a-tab-pane key="indicator" :tab="tt('backtest-center.tabs.indicator', 'Indicator')">
+        <a-row class="workspace" :gutter="20">
+          <a-col :xs="24" :md="9" :lg="8" class="config-col">
+            <div class="config-panel">
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.indicator.selectIndicator', 'Select indicator') }}</div>
+                <a-select
+                  v-model="selectedIndicatorId"
+                  style="width: 100%;"
+                  show-search
+                  allow-clear
+                  optionFilterProp="label"
+                  :placeholder="tt('backtest-center.indicator.selectIndicatorPlaceholder', 'Choose an indicator from your library')"
+                  :loading="loadingIndicators"
+                  @change="handleIndicatorChange"
+                >
+                  <a-select-option
+                    v-for="indicator in indicators"
+                    :key="String(indicator.id)"
+                    :value="String(indicator.id)"
+                    :label="indicator.name"
+                  >
+                    {{ indicator.name || `Indicator #${indicator.id}` }}
+                  </a-select-option>
+                </a-select>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.symbol', 'Symbol') }}</div>
+                <a-select
+                  v-model="indicatorForm.selectedWatchlistKey"
+                  style="width: 100%;"
+                  show-search
+                  allow-clear
+                  optionFilterProp="label"
+                  :placeholder="tt('backtest-center.config.watchlistPlaceholder', 'Select from watchlist or add a symbol')"
+                  @change="handleIndicatorWatchlistChange"
+                >
+                  <a-select-option
+                    v-for="item in watchlist"
+                    :key="buildWatchlistKey(item)"
+                    :value="buildWatchlistKey(item)"
+                    :label="getWatchlistOptionLabel(item)"
+                  >
+                    <a-tag :color="getMarketColor(item.market)" size="small">{{ item.market }}</a-tag>
+                    <strong style="margin-left: 4px;">{{ item.symbol }}</strong>
+                    <span v-if="item.name" class="watchlist-option-name">{{ item.name }}</span>
+                  </a-select-option>
+                  <a-select-option
+                    key="__add__"
+                    value="__add__"
+                    :label="tt('backtest-center.config.addSymbol', 'Add symbol')"
+                  >
+                    <div class="add-option">
+                      <a-icon type="plus" />
+                      {{ tt('backtest-center.config.addSymbol', 'Add symbol') }}
+                    </div>
+                  </a-select-option>
+                </a-select>
+              </div>
+
+              <div class="section">
+                <div class="section-title">
+                  {{ tt('backtest-center.config.timeframe', 'Timeframe') }}
+                  <span class="hint">{{ indicatorTfLimitHint }}</span>
+                </div>
+                <a-radio-group v-model="indicatorForm.timeframe" size="small" button-style="solid">
+                  <a-radio-button v-for="tf in timeframes" :key="`indicator-${tf}`" :value="tf">{{ tf }}</a-radio-button>
+                </a-radio-group>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.dateRange', 'Date range') }}</div>
+                <div class="date-presets">
+                  <a-button
+                    v-for="preset in indicatorDatePresets"
+                    :key="preset.key"
+                    size="small"
+                    :type="indicatorForm.datePreset === preset.key ? 'primary' : 'default'"
+                    @click="applyIndicatorDatePreset(preset)"
+                  >
+                    {{ preset.label }}
+                  </a-button>
+                </div>
+                <a-row style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <a-date-picker
+                      v-model="indicatorForm.startDate"
+                      size="small"
+                      style="width: 100%;"
+                      :placeholder="tt('backtest-center.config.startDate', 'Start date')"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <a-date-picker
+                      v-model="indicatorForm.endDate"
+                      size="small"
+                      style="width: 100%;"
+                      :placeholder="tt('backtest-center.config.endDate', 'End date')"
+                    />
+                  </a-col>
+                </a-row>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.capital', 'Capital and execution') }}</div>
+                <a-row :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.initialCapital', 'Initial capital') }}</div>
+                    <a-input-number
+                      v-model="indicatorForm.initialCapital"
+                      size="small"
+                      :min="1000"
+                      :step="1000"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.leverage', 'Leverage') }}</div>
+                    <a-input-number
+                      v-model="indicatorForm.leverage"
+                      size="small"
+                      :min="1"
+                      :max="125"
+                      :step="1"
+                      :precision="0"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+                <a-row style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.commission', 'Commission') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.commission"
+                      size="small"
+                      :min="0"
+                      :max="10"
+                      :step="0.01"
+                      :precision="4"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.slippage', 'Slippage') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.slippage"
+                      size="small"
+                      :min="0"
+                      :max="10"
+                      :step="0.01"
+                      :precision="4"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.direction', 'Trade direction') }}</div>
+                <a-radio-group v-model="indicatorForm.tradeDirection" size="small" button-style="solid">
+                  <a-radio-button value="long">{{ tt('backtest-center.config.long', 'Long') }}</a-radio-button>
+                  <a-radio-button value="short">{{ tt('backtest-center.config.short', 'Short') }}</a-radio-button>
+                  <a-radio-button value="both">{{ tt('backtest-center.config.both', 'Both') }}</a-radio-button>
+                </a-radio-group>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.riskPanel', 'Risk panel') }}</div>
+                <a-row :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.stopLoss', 'Stop loss') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.stopLossPct"
+                      size="small"
+                      :min="0"
+                      :max="100"
+                      :step="0.5"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.takeProfit', 'Take profit') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.takeProfitPct"
+                      size="small"
+                      :min="0"
+                      :max="1000"
+                      :step="0.5"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+                <a-row style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.entryPct', 'Entry size') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.entryPct"
+                      size="small"
+                      :min="0"
+                      :max="100"
+                      :step="5"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <a-checkbox v-model="indicatorForm.trailingEnabled" style="margin-top: 24px;">
+                      {{ tt('backtest-center.config.trailing', 'Enable trailing stop') }}
+                    </a-checkbox>
+                  </a-col>
+                </a-row>
+                <a-row v-if="indicatorForm.trailingEnabled" style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.trailingPct', 'Trailing stop') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.trailingStopPct"
+                      size="small"
+                      :min="0"
+                      :max="100"
+                      :step="0.5"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.trailingActivation', 'Trailing activation') }} (%)</div>
+                    <a-input-number
+                      v-model="indicatorForm.trailingActivationPct"
+                      size="small"
+                      :min="0"
+                      :max="1000"
+                      :step="0.5"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+              </div>
+
+              <div class="run-section">
+                <a-button type="primary" block size="large" :loading="indicatorRunning" :disabled="!canRunIndicator" @click="runIndicatorBacktest">
+                  <a-icon v-if="!indicatorRunning" type="thunderbolt" />
+                  {{ indicatorRunning ? tt('backtest-center.running', 'Running backtest...') : tt('backtest-center.indicator.runBacktest', 'Run indicator backtest') }}
+                </a-button>
+                <a-button block style="margin-top: 8px;" :disabled="!selectedIndicatorId" @click="openHistory('indicator')">
+                  <a-icon type="history" />
+                  {{ tt('backtest-center.indicator.history', 'Backtest history') }}
+                </a-button>
+              </div>
+            </div>
+          </a-col>
+
+          <a-col :xs="24" :md="15" :lg="16" class="result-col">
+            <div class="result-panel">
+              <result-view
+                :running="indicatorRunning"
+                :run-tip="tt('backtest-center.runningDesc', 'This can take longer for larger time ranges and lower timeframes.')"
+                :has-result="indicatorHasResult"
+                :result="indicatorResult"
+                :backtestRunId="indicatorBacktestRunId"
+                :symbol="indicatorForm.symbol"
+                :market="indicatorForm.market"
+                :timeframe="indicatorForm.timeframe"
+                :is-dark="isDarkTheme"
+              />
+            </div>
+          </a-col>
+        </a-row>
+      </a-tab-pane>
+
+      <a-tab-pane key="strategy" :tab="tt('backtest-center.tabs.strategy', 'Strategy')">
+        <a-row class="workspace" :gutter="20">
+          <a-col :xs="24" :md="9" :lg="8" class="config-col">
+            <div class="config-panel">
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.strategy.selectStrategy', 'Select strategy') }}</div>
+                <a-select
+                  v-model="selectedStrategyId"
+                  style="width: 100%;"
+                  show-search
+                  allow-clear
+                  optionFilterProp="label"
+                  :placeholder="tt('backtest-center.strategy.selectStrategyPlaceholder', 'Choose a strategy from trading assistant')"
+                  :loading="loadingStrategies"
+                  @change="handleStrategyChange"
+                >
+                  <a-select-option
+                    v-for="strategy in strategies"
+                    :key="String(strategy.id)"
+                    :value="String(strategy.id)"
+                    :label="strategy.strategy_name"
+                  >
+                    {{ strategy.strategy_name || `Strategy #${strategy.id}` }}
+                  </a-select-option>
+                </a-select>
+
+                <div v-if="selectedStrategyObj" class="strategy-summary-card">
+                  <div class="strategy-summary-head">
+                    <div class="strategy-summary-title">{{ selectedStrategyObj.strategy_name || `Strategy #${selectedStrategyObj.id}` }}</div>
+                    <a-tag size="small" :color="strategyTypeColor(selectedStrategyObj)">{{ strategyTypeLabel(selectedStrategyObj) }}</a-tag>
+                  </div>
+                  <div class="strategy-summary-meta">
+                    <a-tag v-if="selectedStrategyMarket" size="small">{{ selectedStrategyMarket }}</a-tag>
+                    <a-tag v-if="selectedStrategySymbol" size="small">{{ selectedStrategySymbol }}</a-tag>
+                    <a-tag v-if="strategyForm.timeframe" size="small">{{ strategyForm.timeframe }}</a-tag>
+                  </div>
+                  <div class="strategy-summary-text">{{ strategySummaryText(selectedStrategyObj) }}</div>
+                  <a-alert
+                    v-if="selectedStrategyIsCrossSectional"
+                    type="warning"
+                    show-icon
+                    :message="tt('backtest-center.strategy.crossSectionalBlocked', 'Cross-sectional strategies are not supported in strategy backtest yet.')"
+                    style="margin-top: 10px;"
+                  />
+                  <a-button type="link" size="small" style="padding-left: 0;" @click="goToStrategyAssistant">
+                    {{ tt('backtest-center.strategy.goToAssistant', 'Open in trading assistant') }}
+                  </a-button>
+                </div>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.symbol', 'Symbol') }}</div>
+                <a-select
+                  v-model="strategyForm.selectedWatchlistKey"
+                  style="width: 100%;"
+                  show-search
+                  allow-clear
+                  optionFilterProp="label"
+                  :placeholder="tt('backtest-center.config.watchlistPlaceholder', 'Select from watchlist or add a symbol')"
+                  @change="handleStrategyWatchlistChange"
+                >
+                  <a-select-option
+                    v-for="item in watchlist"
+                    :key="`strategy-${buildWatchlistKey(item)}`"
+                    :value="buildWatchlistKey(item)"
+                    :label="getWatchlistOptionLabel(item)"
+                  >
+                    <a-tag :color="getMarketColor(item.market)" size="small">{{ item.market }}</a-tag>
+                    <strong style="margin-left: 4px;">{{ item.symbol }}</strong>
+                    <span v-if="item.name" class="watchlist-option-name">{{ item.name }}</span>
+                  </a-select-option>
+                  <a-select-option
+                    key="strategy-add"
+                    value="__add__"
+                    :label="tt('backtest-center.config.addSymbol', 'Add symbol')"
+                  >
+                    <div class="add-option">
+                      <a-icon type="plus" />
+                      {{ tt('backtest-center.config.addSymbol', 'Add symbol') }}
+                    </div>
+                  </a-select-option>
+                </a-select>
+              </div>
+
+              <div class="section">
+                <div class="section-title">
+                  {{ tt('backtest-center.config.timeframe', 'Timeframe') }}
+                  <span class="hint">{{ strategyTfLimitHint }}</span>
+                </div>
+                <a-radio-group v-model="strategyForm.timeframe" size="small" button-style="solid">
+                  <a-radio-button v-for="tf in timeframes" :key="`strategy-${tf}`" :value="tf">{{ tf }}</a-radio-button>
+                </a-radio-group>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.dateRange', 'Date range') }}</div>
+                <div class="date-presets">
+                  <a-button
+                    v-for="preset in strategyDatePresets"
+                    :key="`strategy-${preset.key}`"
+                    size="small"
+                    :type="strategyForm.datePreset === preset.key ? 'primary' : 'default'"
+                    @click="applyStrategyDatePreset(preset)"
+                  >
+                    {{ preset.label }}
+                  </a-button>
+                </div>
+                <a-row style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <a-date-picker
+                      v-model="strategyForm.startDate"
+                      size="small"
+                      style="width: 100%;"
+                      :placeholder="tt('backtest-center.config.startDate', 'Start date')"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <a-date-picker
+                      v-model="strategyForm.endDate"
+                      size="small"
+                      style="width: 100%;"
+                      :placeholder="tt('backtest-center.config.endDate', 'End date')"
+                    />
+                  </a-col>
+                </a-row>
+              </div>
+
+              <div class="section">
+                <div class="section-title">{{ tt('backtest-center.config.capital', 'Capital and execution') }}</div>
+                <a-row :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.initialCapital', 'Initial capital') }}</div>
+                    <a-input-number
+                      v-model="strategyForm.initialCapital"
+                      size="small"
+                      :min="1000"
+                      :step="1000"
+                      :precision="2"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.leverage', 'Leverage') }}</div>
+                    <a-input-number
+                      v-model="strategyForm.leverage"
+                      size="small"
+                      :min="1"
+                      :max="125"
+                      :step="1"
+                      :precision="0"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+                <a-row style="margin-top: 8px;" :gutter="8">
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.commission', 'Commission') }} (%)</div>
+                    <a-input-number
+                      v-model="strategyForm.commission"
+                      size="small"
+                      :min="0"
+                      :max="10"
+                      :step="0.01"
+                      :precision="4"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                  <a-col :span="12">
+                    <div class="field-label">{{ tt('backtest-center.config.slippage', 'Slippage') }} (%)</div>
+                    <a-input-number
+                      v-model="strategyForm.slippage"
+                      size="small"
+                      :min="0"
+                      :max="10"
+                      :step="0.01"
+                      :precision="4"
+                      style="width: 100%;"
+                    />
+                  </a-col>
+                </a-row>
+              </div>
+
+              <div class="run-section">
+                <a-button type="primary" block size="large" :loading="strategyRunning" :disabled="!canRunStrategy" @click="runStrategyBacktest">
+                  <a-icon v-if="!strategyRunning" type="thunderbolt" />
+                  {{ strategyRunning ? tt('backtest-center.running', 'Running backtest...') : tt('backtest-center.strategy.runBacktest', 'Run strategy backtest') }}
+                </a-button>
+                <a-button block style="margin-top: 8px;" :disabled="!selectedStrategyId" @click="openHistory('strategy')">
+                  <a-icon type="history" />
+                  {{ tt('backtest-center.strategy.history', 'Backtest history') }}
+                </a-button>
+              </div>
+            </div>
+          </a-col>
+
+          <a-col :xs="24" :md="15" :lg="16" class="result-col">
+            <div class="result-panel">
+              <result-view
+                :running="strategyRunning"
+                :run-tip="tt('backtest-center.runningDesc', 'This can take longer for larger time ranges and lower timeframes.')"
+                :has-result="strategyHasResult"
+                :result="strategyResult"
+                :backtestRunId="strategyBacktestRunId"
+                :symbol="strategyForm.symbol"
+                :market="strategyForm.market"
+                :timeframe="strategyForm.timeframe"
+                :is-dark="isDarkTheme"
+              />
+            </div>
+          </a-col>
+        </a-row>
+      </a-tab-pane>
+    </a-tabs>
+
+    <a-modal
+      :title="tt('dashboard.analysis.modal.addStock.title', 'Add symbol')"
+      :visible="showAddModal"
+      :confirmLoading="addingStock"
+      :width="isMobile ? '95%' : 560"
+      :wrapClassName="isDarkTheme ? 'bc-modal-wrap bc-modal-wrap--dark' : 'bc-modal-wrap'"
+      @ok="handleAddStock"
+      @cancel="showAddModal = false"
+    >
+      <a-tabs size="small" :activeKey="addMarketTab" @change="onAddMarketTabChange">
+        <a-tab-pane key="Crypto" tab="Crypto" />
+        <a-tab-pane key="USStock" tab="US Stock" />
+        <a-tab-pane key="HKStock" tab="HK Stock" />
+        <a-tab-pane key="Forex" tab="Forex" />
+        <a-tab-pane key="Futures" tab="Futures" />
+      </a-tabs>
+
+      <a-input-search
+        v-model="addSearchKeyword"
+        size="large"
+        allow-clear
+        :loading="addSearching"
+        :placeholder="tt('backtest-center.config.symbolPlaceholder', 'Search by symbol or company name')"
+        style="margin: 12px 0;"
+        @search="doAddSearch"
+        @change="onAddSearchInput"
+      />
+
+      <a-list
+        v-if="addSearchResults.length > 0"
+        :data-source="addSearchResults"
+        size="small"
+        class="add-search-results"
+      >
+        <a-list-item
+          slot="renderItem"
+          slot-scope="item"
+          :class="{ 'add-item-active': addSelectedItem && addSelectedItem.symbol === item.symbol }"
+          @click="addSelectedItem = item"
+        >
+          <strong>{{ item.symbol }}</strong>
+          <span v-if="item.name" class="search-result-name">{{ item.name }}</span>
+          <a-icon v-if="addSelectedItem && addSelectedItem.symbol === item.symbol" type="check-circle" theme="filled" class="search-result-check" />
+        </a-list-item>
+      </a-list>
+
+      <div v-else-if="addSearchKeyword && addSearched" class="no-search-result">
+        {{ tt('backtest-center.config.noSearchResult', 'No search result. You can still add the typed symbol directly.') }}
+      </div>
+    </a-modal>
+
+    <backtest-history-drawer
+      :visible="showHistoryDrawer"
+      :userId="userId"
+      :indicatorId="historyContext.indicatorId"
+      :strategyId="historyContext.strategyId"
+      :runType="historyContext.runType"
+      :symbol="historyContext.symbol"
+      :market="historyContext.market"
+      :timeframe="historyContext.timeframe"
+      :isMobile="isMobile"
+      @cancel="showHistoryDrawer = false"
+      @view="handleViewRun"
+    />
+
+    <backtest-run-viewer
+      :visible="showRunViewer"
+      :run="selectedRun"
+      @cancel="handleCloseRunViewer"
+    />
+  </div>
+</template>
+
+<script>
+import moment from 'moment'
+import request from '@/utils/request'
+import { getUserInfo } from '@/api/auth'
+import { getStrategyList, runStrategyBacktest as runStrategyBacktestRequest } from '@/api/strategy'
+import { getWatchlist, addWatchlist, searchSymbols, getHotSymbols } from '@/api/market'
+import { baseMixin } from '@/store/app-mixin'
+import ResultView from './components/ResultView.vue'
+import BacktestHistoryDrawer from './components/BacktestHistoryDrawer.vue'
+import BacktestRunViewer from '@/views/indicator-analysis/components/BacktestRunViewer.vue'
+
+const TIMEFRAMES = ['1m', '5m', '15m', '1H', '4H', '1D', '1W']
+
+const DATE_PRESETS = [
+  { key: '7d', label: '7D', days: 7 },
+  { key: '30d', label: '30D', days: 30 },
+  { key: '90d', label: '90D', days: 90 },
+  { key: '180d', label: '180D', days: 180 },
+  { key: '1y', label: '1Y', days: 365 },
+  { key: '3y', label: '3Y', days: 1095 }
+]
+
+function buildDateRangeState (days = 180, key = '180d') {
+  const endDate = moment().startOf('day')
+  const startDate = endDate.clone().subtract(days, 'days')
+  return {
+    datePreset: key,
+    startDate,
+    endDate
+  }
+}
+
+function createIndicatorForm () {
+  return {
+    selectedWatchlistKey: undefined,
+    symbol: '',
+    market: 'Crypto',
+    timeframe: '1D',
+    initialCapital: 10000,
+    leverage: 1,
+    commission: 0.02,
+    slippage: 0,
+    tradeDirection: 'long',
+    stopLossPct: 0,
+    takeProfitPct: 0,
+    entryPct: 100,
+    trailingEnabled: false,
+    trailingStopPct: 0,
+    trailingActivationPct: 0,
+    ...buildDateRangeState()
+  }
+}
+
+function createStrategyForm () {
+  return {
+    selectedWatchlistKey: undefined,
+    symbol: '',
+    market: 'Crypto',
+    timeframe: '1D',
+    initialCapital: 10000,
+    leverage: 1,
+    commission: 0,
+    slippage: 0,
+    tradeDirection: 'long',
+    ...buildDateRangeState()
+  }
+}
+
+export default {
+  name: 'BacktestCenter',
+  mixins: [baseMixin],
+  components: {
+    ResultView,
+    BacktestHistoryDrawer,
+    BacktestRunViewer
+  },
+  data () {
+    return {
+      userId: 1,
+      activeTab: 'indicator',
+      timeframes: TIMEFRAMES,
+      indicators: [],
+      loadingIndicators: false,
+      selectedIndicatorId: undefined,
+      selectedIndicatorObj: null,
+      strategies: [],
+      loadingStrategies: false,
+      selectedStrategyId: undefined,
+      selectedStrategyObj: null,
+      watchlist: [],
+      loadingWatchlist: false,
+      indicatorForm: createIndicatorForm(),
+      strategyForm: createStrategyForm(),
+      indicatorRunning: false,
+      strategyRunning: false,
+      indicatorResult: null,
+      strategyResult: null,
+      indicatorHasResult: false,
+      strategyHasResult: false,
+      indicatorBacktestRunId: null,
+      strategyBacktestRunId: null,
+      showHistoryDrawer: false,
+      historyContext: {
+        runType: 'indicator',
+        indicatorId: null,
+        strategyId: null,
+        symbol: '',
+        market: '',
+        timeframe: ''
+      },
+      selectedRun: null,
+      showRunViewer: false,
+      showAddModal: false,
+      addSymbolTarget: 'indicator',
+      addMarketTab: 'Crypto',
+      addSearchKeyword: '',
+      addSearchResults: [],
+      addSelectedItem: null,
+      addSearching: false,
+      addSearched: false,
+      addingStock: false,
+      addSearchTimer: null
+    }
+  },
+  computed: {
+    isDarkTheme () {
+      return this.navTheme === 'dark' || this.navTheme === 'realdark'
+    },
+    indicatorDatePresets () {
+      return this.getAllowedDatePresets(this.indicatorForm.timeframe)
+    },
+    strategyDatePresets () {
+      return this.getAllowedDatePresets(this.strategyForm.timeframe)
+    },
+    indicatorTfLimitHint () {
+      return this.getTimeframeLimitHint(this.indicatorForm.timeframe)
+    },
+    strategyTfLimitHint () {
+      return this.getTimeframeLimitHint(this.strategyForm.timeframe)
+    },
+    canRunIndicator () {
+      return Boolean(this.selectedIndicatorId && this.indicatorForm.symbol && this.indicatorForm.startDate && this.indicatorForm.endDate)
+    },
+    canRunStrategy () {
+      return Boolean(this.selectedStrategyId && this.strategyForm.symbol && this.strategyForm.startDate && this.strategyForm.endDate && !this.selectedStrategyIsCrossSectional)
+    },
+    selectedStrategyIsCrossSectional () {
+      if (!this.selectedStrategyObj) return false
+      const tradingConfig = this.parseTradingConfig(this.selectedStrategyObj)
+      const csType = String(tradingConfig.cs_strategy_type || tradingConfig.strategy_type || 'single').trim().toLowerCase()
+      return csType === 'cross_sectional'
+    },
+    selectedStrategySymbol () {
+      return this.strategyForm.symbol || ''
+    },
+    selectedStrategyMarket () {
+      return this.strategyForm.market || ''
+    }
+  },
+  watch: {
+    activeTab (value) {
+      this.setRouteQuery({ tab: value })
+    },
+    '$route.query': {
+      deep: true,
+      handler () {
+        this.syncFromRoute()
+      }
+    },
+    'indicatorForm.timeframe' (value) {
+      this.enforceDateRangeLimit(this.indicatorForm, value)
+    },
+    'strategyForm.timeframe' (value) {
+      this.enforceDateRangeLimit(this.strategyForm, value)
+    }
+  },
+  async created () {
+    await this.bootstrap()
+  },
+  beforeDestroy () {
+    if (this.addSearchTimer) {
+      clearTimeout(this.addSearchTimer)
+      this.addSearchTimer = null
+    }
+  },
+  methods: {
+    tt (key, fallback, params) {
+      const translated = this.$t(key, params)
+      return translated !== key ? translated : fallback
+    },
+    async bootstrap () {
+      await this.resolveUserId()
+      await Promise.all([
+        this.loadWatchlist(),
+        this.loadIndicators(),
+        this.loadStrategies()
+      ])
+      this.syncFromRoute()
+      this.applyInitialDefaults()
+    },
+    async resolveUserId () {
+      const storeUserInfo = (this.$store && this.$store.getters && this.$store.getters.userInfo) || {}
+      if (storeUserInfo.id) {
+        this.userId = storeUserInfo.id
+        return
+      }
+      try {
+        const res = await getUserInfo()
+        if (res && res.code === 1 && res.data && res.data.id) {
+          this.userId = res.data.id
+          return
+        }
+      } catch (error) {
+      }
+      this.userId = 1
+    },
+    applyInitialDefaults () {
+      if (!this.indicatorForm.symbol && this.watchlist.length > 0) {
+        const first = this.watchlist[0]
+        this.assignWatchlistSelection(this.indicatorForm, first)
+      }
+      if (!this.strategyForm.symbol && this.watchlist.length > 0 && !this.selectedStrategyObj) {
+        const first = this.watchlist[0]
+        this.assignWatchlistSelection(this.strategyForm, first)
+      }
+    },
+    getAllowedDatePresets (timeframe) {
+      const limitDays = this.getTimeframeLimitDays(timeframe)
+      return DATE_PRESETS.filter(preset => preset.days <= limitDays)
+    },
+    getTimeframeLimitDays (timeframe) {
+      if (timeframe === '1m') return 30
+      if (timeframe === '5m') return 180
+      if (timeframe === '15m' || timeframe === '30m') return 365
+      return 1095
+    },
+    getTimeframeLimitHint (timeframe) {
+      const days = this.getTimeframeLimitDays(timeframe)
+      if (days === 30) return this.tt('backtest-center.config.limit30d', 'Max 30D')
+      if (days === 180) return this.tt('backtest-center.config.limit180d', 'Max 180D')
+      if (days === 365) return this.tt('backtest-center.config.limit1y', 'Max 1Y')
+      return this.tt('backtest-center.config.limit3y', 'Max 3Y')
+    },
+    enforceDateRangeLimit (form, timeframe) {
+      if (!form.startDate || !form.endDate) return
+      const maxDays = this.getTimeframeLimitDays(timeframe)
+      const diff = form.endDate.diff(form.startDate, 'days')
+      if (diff <= maxDays) return
+      const preset = this.getAllowedDatePresets(timeframe).slice(-1)[0]
+      if (form === this.indicatorForm && preset) {
+        this.applyIndicatorDatePreset(preset)
+      }
+      if (form === this.strategyForm && preset) {
+        this.applyStrategyDatePreset(preset)
+      }
+    },
+    applyIndicatorDatePreset (preset) {
+      this.indicatorForm.datePreset = preset.key
+      this.indicatorForm.endDate = moment().startOf('day')
+      this.indicatorForm.startDate = this.indicatorForm.endDate.clone().subtract(preset.days, 'days')
+    },
+    applyStrategyDatePreset (preset) {
+      this.strategyForm.datePreset = preset.key
+      this.strategyForm.endDate = moment().startOf('day')
+      this.strategyForm.startDate = this.strategyForm.endDate.clone().subtract(preset.days, 'days')
+    },
+    async loadIndicators () {
+      this.loadingIndicators = true
+      try {
+        const res = await request({
+          url: '/api/indicator/getIndicators',
+          method: 'get',
+          params: { userid: this.userId }
+        })
+        this.indicators = res && res.code === 1 && Array.isArray(res.data) ? res.data : []
+      } finally {
+        this.loadingIndicators = false
+      }
+    },
+    async loadStrategies () {
+      this.loadingStrategies = true
+      try {
+        const res = await getStrategyList()
+        this.strategies = res && res.code === 1 && res.data && Array.isArray(res.data.strategies) ? res.data.strategies : []
+      } finally {
+        this.loadingStrategies = false
+      }
+    },
+    async loadWatchlist () {
+      this.loadingWatchlist = true
+      try {
+        const res = await getWatchlist({ userid: this.userId })
+        this.watchlist = res && res.code === 1 && Array.isArray(res.data) ? res.data : []
+      } finally {
+        this.loadingWatchlist = false
+      }
+    },
+    syncFromRoute () {
+      const tab = String(this.$route.query.tab || '').trim()
+      if (tab === 'indicator' || tab === 'strategy') {
+        this.activeTab = tab
+      }
+
+      const indicatorId = this.$route.query.indicator_id
+      if (indicatorId && this.indicators.length) {
+        const exists = this.indicators.find(item => String(item.id) === String(indicatorId))
+        if (exists && String(this.selectedIndicatorId || '') !== String(indicatorId)) {
+          this.selectedIndicatorId = String(indicatorId)
+          this.selectedIndicatorObj = exists
+        }
+      }
+
+      const strategyId = this.$route.query.strategy_id
+      if (strategyId && this.strategies.length) {
+        const exists = this.strategies.find(item => String(item.id) === String(strategyId))
+        if (exists && String(this.selectedStrategyId || '') !== String(strategyId)) {
+          this.selectedStrategyId = String(strategyId)
+          this.selectedStrategyObj = exists
+          this.applyStrategyDefaults(exists)
+        }
+      }
+    },
+    setRouteQuery (patch) {
+      const current = { ...this.$route.query }
+      const next = { ...current }
+      Object.keys(patch).forEach(key => {
+        if (patch[key] === undefined || patch[key] === null || patch[key] === '') {
+          delete next[key]
+        } else {
+          next[key] = patch[key]
+        }
+      })
+      if (JSON.stringify(current) === JSON.stringify(next)) return
+      this.$router.replace({ path: this.$route.path, query: next })
+    },
+    buildWatchlistKey (item) {
+      const market = item && item.market ? item.market : ''
+      const symbol = item && item.symbol ? item.symbol : ''
+      return `${market}:${symbol}`
+    },
+    getWatchlistOptionLabel (item) {
+      const base = `${item.market}:${item.symbol}`
+      return item.name ? `${base} ${item.name}` : base
+    },
+    getMarketColor (market) {
+      const colorMap = {
+        Crypto: 'gold',
+        USStock: 'blue',
+        HKStock: 'geekblue',
+        Forex: 'green',
+        Futures: 'purple'
+      }
+      return colorMap[market] || 'default'
+    },
+    assignWatchlistSelection (form, item) {
+      if (!item) return
+      form.selectedWatchlistKey = this.buildWatchlistKey(item)
+      form.market = item.market
+      form.symbol = item.symbol
+    },
+    handleIndicatorWatchlistChange (value) {
+      if (value === '__add__') {
+        this.openAddModal('indicator')
+        return
+      }
+      const item = this.watchlist.find(entry => this.buildWatchlistKey(entry) === value)
+      if (item) {
+        this.assignWatchlistSelection(this.indicatorForm, item)
+      } else {
+        this.indicatorForm.symbol = ''
+      }
+    },
+    handleStrategyWatchlistChange (value) {
+      if (value === '__add__') {
+        this.openAddModal('strategy')
+        return
+      }
+      const item = this.watchlist.find(entry => this.buildWatchlistKey(entry) === value)
+      if (item) {
+        this.assignWatchlistSelection(this.strategyForm, item)
+      } else {
+        this.strategyForm.symbol = ''
+      }
+    },
+    handleIndicatorChange (value) {
+      this.selectedIndicatorId = value || undefined
+      this.selectedIndicatorObj = this.indicators.find(item => String(item.id) === String(value)) || null
+      this.setRouteQuery({
+        tab: 'indicator',
+        indicator_id: value || undefined,
+        strategy_id: undefined
+      })
+    },
+    handleStrategyChange (value) {
+      this.selectedStrategyId = value || undefined
+      this.selectedStrategyObj = this.strategies.find(item => String(item.id) === String(value)) || null
+      if (this.selectedStrategyObj) {
+        this.applyStrategyDefaults(this.selectedStrategyObj)
+      }
+      this.setRouteQuery({
+        tab: 'strategy',
+        strategy_id: value || undefined,
+        indicator_id: undefined
+      })
+    },
+    parseTradingConfig (strategy) {
+      const value = strategy && strategy.trading_config
+      if (!value) return {}
+      if (typeof value === 'object') return value
+      try {
+        return JSON.parse(value)
+      } catch (error) {
+        return {}
+      }
+    },
+    applyStrategyDefaults (strategy) {
+      const tradingConfig = this.parseTradingConfig(strategy)
+      const rawSymbol = String(tradingConfig.symbol || strategy.symbol || '').trim()
+      let market = String(strategy.market_category || tradingConfig.market_category || 'Crypto').trim() || 'Crypto'
+      let symbol = rawSymbol
+      if (rawSymbol.includes(':')) {
+        const parts = rawSymbol.split(':')
+        market = parts[0] || market
+        symbol = parts[1] || symbol
+      }
+
+      this.strategyForm.market = market
+      this.strategyForm.symbol = symbol
+      this.strategyForm.timeframe = String(tradingConfig.timeframe || strategy.timeframe || '1D').trim() || '1D'
+      this.strategyForm.initialCapital = Number(tradingConfig.initial_capital || strategy.initial_capital || 10000) || 10000
+      this.strategyForm.leverage = Number(tradingConfig.leverage || strategy.leverage || 1) || 1
+      this.strategyForm.commission = Number(tradingConfig.commission || 0) || 0
+      this.strategyForm.slippage = Number(tradingConfig.slippage || 0) || 0
+      this.strategyForm.tradeDirection = String(tradingConfig.trade_direction || 'long')
+
+      const matchedWatchlist = this.watchlist.find(item => item.market === market && item.symbol === symbol)
+      if (matchedWatchlist) {
+        this.strategyForm.selectedWatchlistKey = this.buildWatchlistKey(matchedWatchlist)
+      } else if (symbol) {
+        this.strategyForm.selectedWatchlistKey = `${market}:${symbol}`
+      }
+    },
+    strategyTypeLabel (strategy) {
+      const mode = String(strategy.strategy_mode || '').trim()
+      if (mode === 'script' || strategy.strategy_type === 'ScriptStrategy') {
+        return this.tt('trading-assistant.strategyMode.script', 'Script')
+      }
+      return this.tt('trading-assistant.strategyMode.signal', 'Indicator')
+    },
+    strategyTypeColor (strategy) {
+      const mode = String(strategy.strategy_mode || '').trim()
+      return mode === 'script' || strategy.strategy_type === 'ScriptStrategy' ? 'green' : 'blue'
+    },
+    strategySummaryText (strategy) {
+      const tradingConfig = this.parseTradingConfig(strategy)
+      const symbol = this.strategyForm.symbol || tradingConfig.symbol || strategy.symbol || this.tt('backtest-center.strategy.anySymbol', 'No symbol')
+      const timeframe = this.strategyForm.timeframe || tradingConfig.timeframe || strategy.timeframe || '1D'
+      const mode = this.strategyTypeLabel(strategy)
+      return `${mode} strategy prepared for ${symbol} on ${timeframe}. Override symbol, timeframe, or capital below before running a fresh backtest snapshot.`
+    },
+    goToStrategyAssistant () {
+      if (this.selectedStrategyId) {
+        this.$router.push(`/trading-assistant?tab=strategy&strategy_id=${this.selectedStrategyId}`)
+        return
+      }
+      this.$router.push('/trading-assistant?tab=strategy')
+    },
+    validateDateRange (form) {
+      if (!form.startDate || !form.endDate) {
+        this.$message.warning(this.tt('backtest-center.validation.dateRange', 'Please select a valid date range.'))
+        return false
+      }
+      if (form.endDate.isBefore(form.startDate, 'day')) {
+        this.$message.warning(this.tt('backtest-center.validation.dateOrder', 'End date must be after start date.'))
+        return false
+      }
+      const maxDays = this.getTimeframeLimitDays(form.timeframe)
+      const diff = form.endDate.diff(form.startDate, 'days')
+      if (diff > maxDays) {
+        this.$message.warning(this.tt('backtest-center.validation.rangeExceeded', `This timeframe supports up to ${this.getTimeframeLimitHint(form.timeframe)}.`))
+        return false
+      }
+      return true
+    },
+    buildIndicatorStrategyConfig () {
+      const pct = value => Number(value || 0) / 100
+      return {
+        risk: {
+          stopLossPct: pct(this.indicatorForm.stopLossPct),
+          takeProfitPct: pct(this.indicatorForm.takeProfitPct),
+          trailing: {
+            enabled: !!this.indicatorForm.trailingEnabled,
+            pct: pct(this.indicatorForm.trailingStopPct),
+            activationPct: pct(this.indicatorForm.trailingActivationPct)
+          }
+        },
+        position: {
+          entryPct: pct(this.indicatorForm.entryPct)
+        }
+      }
+    },
+    async runIndicatorBacktest () {
+      if (!this.canRunIndicator) return
+      if (!this.validateDateRange(this.indicatorForm)) return
+
+      this.indicatorRunning = true
+      this.indicatorHasResult = false
+      try {
+        const pct = value => Number(value || 0) / 100
+        const res = await request({
+          url: '/api/indicator/backtest',
+          method: 'post',
+          data: {
+            userid: this.userId,
+            indicatorId: this.selectedIndicatorId,
+            symbol: this.indicatorForm.symbol,
+            market: this.indicatorForm.market,
+            timeframe: this.indicatorForm.timeframe,
+            startDate: this.indicatorForm.startDate.format('YYYY-MM-DD'),
+            endDate: this.indicatorForm.endDate.format('YYYY-MM-DD'),
+            initialCapital: this.indicatorForm.initialCapital,
+            commission: pct(this.indicatorForm.commission),
+            slippage: pct(this.indicatorForm.slippage),
+            leverage: this.indicatorForm.leverage,
+            tradeDirection: this.indicatorForm.tradeDirection,
+            strategyConfig: this.buildIndicatorStrategyConfig(),
+            enableMtf: String(this.indicatorForm.market || '').toLowerCase() === 'crypto'
+          }
+        })
+
+        if (res && res.code === 1 && res.data) {
+          this.indicatorResult = res.data.result || res.data
+          this.indicatorBacktestRunId = res.data.runId || null
+          this.indicatorHasResult = true
+        } else {
+          this.$message.error((res && res.msg) || this.tt('backtest-center.runFailed', 'Backtest failed.'))
+        }
+      } catch (error) {
+        this.$message.error(this.tt('backtest-center.runFailed', 'Backtest failed.'))
+      } finally {
+        this.indicatorRunning = false
+      }
+    },
+    async runStrategyBacktest () {
+      if (!this.canRunStrategy) return
+      if (!this.validateDateRange(this.strategyForm)) return
+      if (this.selectedStrategyIsCrossSectional) {
+        this.$message.warning(this.tt('backtest-center.strategy.crossSectionalBlocked', 'Cross-sectional strategies are not supported in strategy backtest yet.'))
+        return
+      }
+
+      this.strategyRunning = true
+      this.strategyHasResult = false
+      try {
+        const res = await runStrategyBacktestRequest({
+          strategyId: Number(this.selectedStrategyId),
+          startDate: this.strategyForm.startDate.format('YYYY-MM-DD'),
+          endDate: this.strategyForm.endDate.format('YYYY-MM-DD'),
+          overrideConfig: {
+            symbol: this.strategyForm.symbol,
+            market: this.strategyForm.market,
+            timeframe: this.strategyForm.timeframe,
+            initialCapital: this.strategyForm.initialCapital,
+            leverage: this.strategyForm.leverage,
+            commission: this.strategyForm.commission,
+            slippage: this.strategyForm.slippage
+          }
+        })
+
+        if (res && res.code === 1 && res.data) {
+          this.strategyResult = res.data.result || res.data
+          this.strategyBacktestRunId = res.data.runId || null
+          this.strategyHasResult = true
+        } else {
+          this.$message.error((res && res.msg) || this.tt('backtest-center.runFailed', 'Backtest failed.'))
+        }
+      } catch (error) {
+        this.$message.error(this.tt('backtest-center.runFailed', 'Backtest failed.'))
+      } finally {
+        this.strategyRunning = false
+      }
+    },
+    openHistory (runType) {
+      if (runType === 'strategy') {
+        this.historyContext = {
+          runType: 'strategy',
+          indicatorId: null,
+          strategyId: this.selectedStrategyId,
+          symbol: this.strategyForm.symbol,
+          market: this.strategyForm.market,
+          timeframe: this.strategyForm.timeframe
+        }
+      } else {
+        this.historyContext = {
+          runType: 'indicator',
+          indicatorId: this.selectedIndicatorId,
+          strategyId: null,
+          symbol: this.indicatorForm.symbol,
+          market: this.indicatorForm.market,
+          timeframe: this.indicatorForm.timeframe
+        }
+      }
+      this.showHistoryDrawer = true
+    },
+    handleViewRun (run) {
+      this.selectedRun = run
+      this.showRunViewer = true
+    },
+    handleCloseRunViewer () {
+      this.showRunViewer = false
+      this.selectedRun = null
+    },
+    openAddModal (target) {
+      this.addSymbolTarget = target
+      this.showAddModal = true
+      this.addMarketTab = target === 'strategy' ? (this.strategyForm.market || 'Crypto') : (this.indicatorForm.market || 'Crypto')
+      this.addSearchKeyword = ''
+      this.addSearchResults = []
+      this.addSelectedItem = null
+      this.addSearched = false
+      this.loadHotSymbols(this.addMarketTab)
+    },
+    onAddMarketTabChange (market) {
+      this.addMarketTab = market
+      this.addSearchKeyword = ''
+      this.addSearchResults = []
+      this.addSelectedItem = null
+      this.addSearched = false
+      this.loadHotSymbols(market)
+    },
+    onAddSearchInput () {
+      if (this.addSearchTimer) {
+        clearTimeout(this.addSearchTimer)
+      }
+      if (!this.addSearchKeyword || !this.addSearchKeyword.trim()) {
+        this.addSelectedItem = null
+        this.addSearched = false
+        this.loadHotSymbols(this.addMarketTab)
+        return
+      }
+      this.addSearchTimer = setTimeout(() => {
+        this.searchSymbolsInModal(this.addSearchKeyword)
+      }, 350)
+    },
+    doAddSearch (keyword) {
+      if (!keyword || !keyword.trim()) {
+        this.loadHotSymbols(this.addMarketTab)
+        return
+      }
+      this.searchSymbolsInModal(keyword)
+    },
+    async loadHotSymbols (market) {
+      this.addSearching = true
+      try {
+        const res = await getHotSymbols({ market, limit: 20 })
+        this.addSearchResults = res && res.code === 1 && Array.isArray(res.data) ? res.data : []
+      } finally {
+        this.addSearching = false
+      }
+    },
+    async searchSymbolsInModal (keyword) {
+      this.addSearching = true
+      this.addSearched = true
+      try {
+        const res = await searchSymbols({
+          market: this.addMarketTab,
+          keyword: keyword.trim(),
+          limit: 20
+        })
+        this.addSearchResults = res && res.code === 1 && Array.isArray(res.data) ? res.data : []
+      } finally {
+        this.addSearching = false
+      }
+    },
+    async handleAddStock () {
+      const symbol = (this.addSelectedItem && this.addSelectedItem.symbol) || (this.addSearchKeyword || '').trim()
+      if (!symbol) {
+        this.$message.warning(this.tt('backtest-center.validation.symbol', 'Please choose a symbol first.'))
+        return
+      }
+
+      this.addingStock = true
+      try {
+        const res = await addWatchlist({
+          userid: this.userId,
+          market: this.addMarketTab,
+          symbol
+        })
+        if (res && res.code === 1) {
+          await this.loadWatchlist()
+          const added = this.watchlist.find(item => item.market === this.addMarketTab && item.symbol === symbol) || {
+            market: this.addMarketTab,
+            symbol
+          }
+          if (this.addSymbolTarget === 'strategy') {
+            this.assignWatchlistSelection(this.strategyForm, added)
+          } else {
+            this.assignWatchlistSelection(this.indicatorForm, added)
+          }
+          this.showAddModal = false
+          this.$message.success(this.tt('backtest-center.addSymbolSuccess', 'Symbol added to watchlist.'))
+        } else {
+          this.$message.error((res && res.msg) || this.tt('backtest-center.addSymbolFailed', 'Failed to add symbol.'))
+        }
+      } catch (error) {
+        this.$message.error(this.tt('backtest-center.addSymbolFailed', 'Failed to add symbol.'))
+      } finally {
+        this.addingStock = false
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.backtest-center {
+  padding: 24px;
+  min-height: 100%;
+  background:
+    radial-gradient(circle at top left, rgba(37, 99, 235, 0.08), transparent 30%),
+    linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
+}
+
+.page-header {
+  margin-bottom: 18px;
+}
+
+.page-title {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin: 0;
+  font-size: 28px;
+  font-weight: 800;
+  color: #0f172a;
+}
+
+.title-icon {
+  color: #2563eb;
+}
+
+.page-subtitle {
+  margin: 8px 0 0;
+  max-width: 880px;
+  color: #475569;
+  font-size: 14px;
+}
+
+.workspace {
+  margin-top: 4px;
+}
+
+.config-panel,
+.result-panel {
+  border-radius: 24px;
+  border: 1px solid rgba(148, 163, 184, 0.18);
+  background: rgba(255, 255, 255, 0.92);
+  backdrop-filter: blur(12px);
+  padding: 18px;
+}
+
+.section + .section {
+  margin-top: 16px;
+}
+
+.section-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  margin-bottom: 8px;
+  font-size: 13px;
+  font-weight: 700;
+  color: #0f172a;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+.hint {
+  font-size: 12px;
+  color: #64748b;
+  text-transform: none;
+  letter-spacing: normal;
+}
+
+.field-label {
+  margin-bottom: 6px;
+  font-size: 12px;
+  font-weight: 600;
+  color: #64748b;
+}
+
+.date-presets {
+  display: flex;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+
+.run-section {
+  margin-top: 18px;
+}
+
+.strategy-summary-card {
+  margin-top: 12px;
+  padding: 14px;
+  border-radius: 18px;
+  border: 1px solid #dbeafe;
+  background: linear-gradient(180deg, rgba(239, 246, 255, 0.92), rgba(248, 250, 252, 0.96));
+}
+
+.strategy-summary-head,
+.strategy-summary-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+
+.strategy-summary-title {
+  font-size: 16px;
+  font-weight: 700;
+  color: #0f172a;
+}
+
+.strategy-summary-meta {
+  margin-top: 8px;
+}
+
+.strategy-summary-text {
+  margin-top: 10px;
+  color: #475569;
+  font-size: 13px;
+  line-height: 1.6;
+}
+
+.watchlist-option-name {
+  margin-left: 6px;
+  color: #64748b;
+  font-size: 12px;
+}
+
+.add-option {
+  text-align: center;
+  color: #2563eb;
+}
+
+.add-search-results {
+  max-height: 260px;
+  overflow-y: auto;
+}
+
+.add-search-results :deep(.ant-list-item) {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.add-item-active {
+  background: rgba(37, 99, 235, 0.08);
+}
+
+.search-result-name {
+  color: #64748b;
+}
+
+.search-result-check {
+  margin-left: auto;
+  color: #16a34a;
+}
+
+.no-search-result {
+  padding: 16px 0;
+  text-align: center;
+  color: #64748b;
+}
+
+.theme-dark {
+  background:
+    radial-gradient(circle at top left, rgba(59, 130, 246, 0.14), transparent 30%),
+    linear-gradient(180deg, #020617 0%, #0f172a 100%);
+
+  .page-title,
+  .section-title,
+  .strategy-summary-title {
+    color: #e2e8f0;
+  }
+
+  .page-subtitle,
+  .field-label,
+  .hint,
+  .strategy-summary-text,
+  .watchlist-option-name,
+  .search-result-name,
+  .no-search-result {
+    color: #94a3b8;
+  }
+
+  .config-panel,
+  .result-panel {
+    border-color: rgba(148, 163, 184, 0.16);
+    background: rgba(15, 23, 42, 0.88);
+  }
+
+  .strategy-summary-card {
+    border-color: rgba(59, 130, 246, 0.22);
+    background: linear-gradient(180deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.96));
+  }
+}
+
+@media (max-width: 991px) {
+  .backtest-center {
+    padding: 16px;
+  }
+
+  .config-col {
+    margin-bottom: 16px;
+  }
+}
+
+@media (max-width: 767px) {
+  .backtest-center {
+    padding: 12px;
+  }
+
+  .page-title {
+    font-size: 22px;
+  }
+
+  .config-panel,
+  .result-panel {
+    padding: 14px;
+    border-radius: 20px;
+  }
+
+  .section-title {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+
+  .date-presets {
+    gap: 6px;
+  }
+}
+</style>
diff --git a/frontend_vue/src/views/indicator-analysis/components/BacktestHistoryDrawer.vue b/frontend_vue/src/views/indicator-analysis/components/BacktestHistoryDrawer.vue
index f776874..59a598e 100644
--- a/frontend_vue/src/views/indicator-analysis/components/BacktestHistoryDrawer.vue
+++ b/frontend_vue/src/views/indicator-analysis/components/BacktestHistoryDrawer.vue
@@ -201,7 +201,7 @@ export default {
       this.showAIResult = true
       this.aiResult = ''
       try {
-        const lang = (this.$i18n && this.$i18n.locale) ? this.$i18n.locale : 'zh-CN'
+        const lang = (this.$i18n && this.$i18n.locale) ? this.$i18n.locale : 'en-US'
         const res = await request({
           url: '/api/indicator/backtest/aiAnalyze',
           method: 'post',
diff --git a/frontend_vue/src/views/indicator-analysis/components/BacktestModal.vue b/frontend_vue/src/views/indicator-analysis/components/BacktestModal.vue
index 0bd6c47..e103cae 100644
--- a/frontend_vue/src/views/indicator-analysis/components/BacktestModal.vue
+++ b/frontend_vue/src/views/indicator-analysis/components/BacktestModal.vue
@@ -309,7 +309,7 @@
 
           <!-- Step 2: trading settings -->
           <div v-show="currentStep === 1">
-            <!-- 合并的信息提示：交易对信息 + 精度信息 -->
+            <!-- Merged info tips: Symbol information + Precision information -->
             <a-alert
               :type="combinedAlertType"
               show-icon
@@ -317,7 +317,7 @@
             >
               <template slot="message">
                 <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
-                  <!-- 基本信息 -->
+                  <!-- Basic info -->
                   <span>
                     <strong>Symbol:</strong> {{ symbol || '-' }}
                     <span style="color: #999; margin: 0 6px;">|</span>
@@ -325,7 +325,7 @@
                     <span style="color: #999; margin: 0 6px;">|</span>
                     <strong>Timeframe:</strong> {{ selectedTimeframe || timeframe || '-' }}
                   </span>
-                  <!-- 精度信息 -->
+                  <!-- Precision info -->
                   <span v-if="precisionInfo && precisionInfo.enabled" style="margin-left: 12px; border-left: 1px solid #d9d9d9; padding-left: 12px;">
                     <a-icon :type="precisionInfo.precision === 'high' ? 'thunderbolt' : 'clock-circle'" style="margin-right: 4px;" />
                     {{ $t('dashboard.indicator.backtest.precisionMode') }}:
@@ -352,9 +352,9 @@
               </template>
             </a-alert>
 
-            <!-- 快捷日期选择按钮 -->
+            <!-- Quick date selection buttons -->
             <div class="date-quick-select" style="margin-bottom: 12px;">
-              <span style="margin-right: 8px; color: #666; font-size: 13px;">{{ $t('dashboard.indicator.backtest.quickSelect') || '快速选择' }}:</span>
+              <span style="margin-right: 8px; color: #666; font-size: 13px;">{{ $t('dashboard.indicator.backtest.quickSelect') || 'Quick Select' }}:</span>
               <a-button-group size="small">
                 <a-button
                   v-for="preset in datePresets"
@@ -487,7 +487,7 @@
         </a-form>
       </div>
 
-      <!-- 回测结果区域 -->
+      <!-- Backtest results area -->
       <div v-show="currentStep === 2 && hasResult" class="result-section">
         <a-alert
           v-if="backtestRunId"
@@ -497,7 +497,7 @@
           :message="$t('dashboard.indicator.backtest.savedRunId', { id: backtestRunId })"
         />
 
-        <!-- 关键指标卡片 -->
+        <!-- Key metrics cards -->
         <div class="metrics-cards">
           <div class="metric-card" :class="{ positive: result.totalReturn > 0, negative: result.totalReturn < 0 }">
             <div class="metric-label">{{ $t('dashboard.indicator.backtest.totalReturn') }}</div>
@@ -534,13 +534,13 @@
           </div>
         </div>
 
-        <!-- 收益曲线图表 -->
+        <!-- Equity curve chart -->
         <div class="chart-section">
           <div class="chart-title">{{ $t('dashboard.indicator.backtest.equityCurve') }}</div>
           <div ref="equityChartRef" class="equity-chart"></div>
         </div>
 
-        <!-- 交易记录表格 -->
+        <!-- Trade history table -->
         <div class="trades-section">
           <div class="chart-title">{{ $t('dashboard.indicator.backtest.tradeHistory') }}</div>
           <a-table
@@ -569,7 +569,7 @@
         </div>
       </div>
 
-      <!-- 加载状态 - 增强版动画 -->
+      <!-- Loading state - Enhanced animation -->
       <div v-if="loading" class="loading-overlay">
         <div class="loading-content">
           <div class="loading-animation">
@@ -667,9 +667,9 @@ export default {
       // Step1 UI state (Ant Form getFieldValue is not reactive)
       trailingEnabledUi: false,
       entryPctMaxUi: 100,
-      precisionInfo: null, // 回测精度信息
-      selectedDatePreset: null, // 当前选中的快捷日期
-      selectedTimeframe: '1D', // 用户选择的时间周期（默认使用props传入的值）
+      precisionInfo: null, // Backtest precision info
+      selectedDatePreset: null, // Currently selected quick date
+      selectedTimeframe: '1D', // User selected timeframe (defaulting to prop value)
       result: {
         totalReturn: 0,
         annualReturn: 0,
@@ -688,29 +688,29 @@ export default {
     }
   },
   computed: {
-    // 根据周期计算最大回测时间范围
+    // Calculate max backtest time range based on timeframe
     maxBacktestRange () {
-      // 1分钟线：最多1个月
+      // 1 minute: max 1 month
       const tf = this.selectedTimeframe || this.timeframe || '1D'
       if (tf === '1m') {
-        return { days: 30, label: '1个月' }
+        return { days: 30, label: '1 month' }
       }
-      // 5分钟线：最多6个月
+      // 5 minutes: max 6 months
       if (tf === '5m') {
-        return { days: 180, label: '6个月' }
+        return { days: 180, label: '6 months' }
       }
-      // 15分钟和30分钟：最多1年
+      // 15 and 30 minutes: max 1 year
       if (['15m', '30m'].includes(tf)) {
-        return { days: 365, label: '1年' }
+        return { days: 365, label: '1 year' }
       }
-      // 1小时及以上：最多3年
-      return { days: 1095, label: '3年' }
+      // 1 hour and above: max 3 years
+      return { days: 1095, label: '3 years' }
     },
-    // 根据时间周期推荐的默认日期范围 - 统一默认30天
+    // Recommended default date range - consistent 30 days
     recommendedRange () {
-      return { days: 30, label: '30天', key: '30d' }
+      return { days: 30, label: '30 days', key: '30d' }
     },
-    // 合并提示框的类型
+    // Combined alert type
     combinedAlertType () {
       if (this.precisionInfo && this.precisionInfo.enabled) {
         return this.precisionInfo.precision === 'high' ? 'success' : 'info'
@@ -720,12 +720,12 @@ export default {
       }
       return 'info'
     },
-    // 快捷日期选项 - 所有周期都包含30天作为默认选项
+    // Quick date options - all periods include 30 days as default
     datePresets () {
       const presets = []
       const tf = this.selectedTimeframe || this.timeframe || '1D'
-      // 根据时间周期动态生成合理的快捷选项
-      // 使用国际通用格式：7D, 14D, 30D, 3M, 6M, 1Y
+      // Dynamically generate reasonable quick options based on timeframe
+      // Use international standard format: 7D, 14D, 30D, 3M, 6M, 1Y
       if (tf === '1m') {
         presets.push({ key: '7d', days: 7, label: '7D' })
         presets.push({ key: '14d', days: 14, label: '14D' })
@@ -750,14 +750,14 @@ export default {
       return presets
     },
     defaultStartDate () {
-      // 默认开始日期：使用推荐范围
+      // Default start date: use recommended range
       return moment().subtract(this.recommendedRange.days, 'days')
     },
     defaultEndDate () {
-      // 默认结束日期：今天
+      // Default end date: today
       return moment()
     },
-    // 最早可选日期
+    // Earliest selectable date
     earliestDate () {
       return moment().subtract(this.maxBacktestRange.days, 'days')
     },
@@ -775,7 +775,7 @@ export default {
   watch: {
     visible (val) {
       if (val) {
-        // 弹窗打开时重置状态
+        // Reset state when modal opens
         this.currentStep = 0
         this.hasResult = false
         this.backtestRunId = null
@@ -784,7 +784,7 @@ export default {
         this.entryPctMaxUi = 100
         this.precisionInfo = null
         this.selectedDatePreset = null
-        this.selectedTimeframe = this.timeframe || '1D' // 初始化为props传入的时间周期
+        this.selectedTimeframe = this.timeframe || '1D' // Initialize from prop value
         this.result = {
           totalReturn: 0,
           annualReturn: 0,
@@ -804,14 +804,14 @@ export default {
             // Sync non-reactive form values into UI state
             this.trailingEnabledUi = !!this.form.getFieldValue('trailingEnabled')
             this.recalcEntryPctMaxUi()
-            // 默认选中30天
+            // Default select 30 days
             this.selectedDatePreset = '30d'
-            // 弹窗打开时立即获取精度信息（使用默认日期范围）
+            // Get precision info immediately on modal open (using default range)
             this.fetchPrecisionInfo()
           }
         })
       } else {
-        // 弹窗关闭时销毁图表
+        // Destroy chart when modal closes
         if (this.equityChart) {
           this.equityChart.dispose()
           this.equityChart = null
@@ -820,7 +820,7 @@ export default {
     }
   },
   created () {
-    // 初始化表格列（需要在created中初始化才能使用$t）
+    // Initialize table columns (needs created hook for $t)
     this.tradeColumns = [
       {
         title: this.$t('dashboard.indicator.backtest.tradeTime'),
@@ -930,14 +930,14 @@ export default {
         this.form.setFieldsValue({ trailingStopPct: 0, trailingActivationPct: 0 })
       }
     },
-    // 获取交易类型颜色
+    // Get trade type color
     getTradeTypeColor (type) {
       const colorMap = {
-        // 旧格式
+        // Old format
         'buy': 'green',
         'sell': 'red',
         'liquidation': 'orange',
-        // 新格式 - 做多
+        // New format - Long
         'open_long': 'green',
         'add_long': 'cyan',
         'close_long': 'orange',
@@ -945,7 +945,7 @@ export default {
         'close_long_profit': 'lime',
         'close_long_trailing': 'gold',
         'reduce_long': 'volcano',
-        // 新格式 - 做空
+        // New format - Short
         'open_short': 'red',
         'add_short': 'magenta',
         'close_short': 'blue',
@@ -956,14 +956,14 @@ export default {
       }
       return colorMap[type] || 'default'
     },
-    // 获取交易类型文本
+    // Get trade type text
     getTradeTypeText (type) {
       const textMap = {
-        // 旧格式
+        // Old format
         'buy': this.$t('dashboard.indicator.backtest.buy'),
         'sell': this.$t('dashboard.indicator.backtest.sell'),
         'liquidation': this.$t('dashboard.indicator.backtest.liquidation'),
-        // 新格式 - 做多
+        // New format - Long
         'open_long': this.$t('dashboard.indicator.backtest.openLong'),
         'add_long': this.$t('dashboard.indicator.backtest.addLong'),
         'close_long': this.$t('dashboard.indicator.backtest.closeLong'),
@@ -971,7 +971,7 @@ export default {
         'close_long_profit': this.$t('dashboard.indicator.backtest.closeLongProfit'),
         'close_long_trailing': this.$t('dashboard.indicator.backtest.closeLongTrailing'),
         'reduce_long': this.$t('dashboard.indicator.backtest.reduceLong'),
-        // 新格式 - 做空
+        // New format - Short
         'open_short': this.$t('dashboard.indicator.backtest.openShort'),
         'add_short': this.$t('dashboard.indicator.backtest.addShort'),
         'close_short': this.$t('dashboard.indicator.backtest.closeShort'),
@@ -984,20 +984,20 @@ export default {
     },
     disabledStartDate (current) {
       if (!current) return false
-      // 不能选择今天之后的日期
+      // Cannot select dates after today
       if (current > moment().endOf('day')) return true
-      // 不能选择最早日期之前的日期
+      // Cannot select dates before earliest date
       if (current < this.earliestDate.startOf('day')) return true
       return false
     },
     disabledEndDate (current) {
       if (!current) return false
-      // 不能选择今天之后的日期
+      // Cannot select dates after today
       if (current > moment().endOf('day')) return true
-      // 不能选择最早日期之前的日期
+      // Cannot select dates before earliest date
       if (current < this.earliestDate.startOf('day')) return true
 
-      // 如果已选择开始日期，限制结束日期不能超过开始日期+最大回测范围
+      // If start date is selected, limit end date to start date + max range
       const startDate = this.form.getFieldValue('startDate')
       if (startDate) {
         const maxDays = this.maxBacktestRange.days || 365
@@ -1007,7 +1007,7 @@ export default {
 
       return false
     },
-    // 应用快捷日期选择
+    // Apply quick date selection
     applyDatePreset (preset) {
       this.selectedDatePreset = preset.key
       const endDate = moment()
@@ -1016,21 +1016,21 @@ export default {
         startDate: startDate,
         endDate: endDate
       })
-      // 更新精度信息
+      // Update precision info
       this.fetchPrecisionInfo(startDate, endDate)
     },
-    // 获取精度信息
+    // Get precision info
     async fetchPrecisionInfo (startDate, endDate) {
-      // 如果没有传入日期，尝试从表单获取或使用默认值
+      // If no date provided, try from form or use default
       if (!startDate || !endDate) {
         startDate = this.form ? this.form.getFieldValue('startDate') : null
         endDate = this.form ? this.form.getFieldValue('endDate') : null
       }
-      // 如果还是没有，使用默认值
+      // Use defaults if still null
       if (!startDate) startDate = this.defaultStartDate
       if (!endDate) endDate = this.defaultEndDate
 
-      // 仅加密货币市场支持高精度回测
+      // Only crypto market supports high precision backtest
       if (!this.market || this.market.toLowerCase() !== 'crypto') {
         this.precisionInfo = {
           enabled: false,
@@ -1055,13 +1055,13 @@ export default {
           this.precisionInfo = response.data
         }
       } catch (e) {
-        // 静默失败，不影响正常使用
+        // Fail silently
         this.precisionInfo = null
       }
     },
-    // 时间周期变化时重新获取精度信息和更新快捷日期选项
+    // Re-fetch precision info and update quick dates when timeframe changes
     onTimeframeChange () {
-      // 重置日期选择为默认30天
+      // Reset date selection to default 30 days
       this.selectedDatePreset = '30d'
       const endDate = moment()
       const startDate = moment().subtract(30, 'days')
@@ -1069,17 +1069,17 @@ export default {
         startDate: startDate,
         endDate: endDate
       })
-      // 重新获取精度信息
+      // Re-fetch precision info
       this.fetchPrecisionInfo(startDate, endDate)
     },
-    // 日期变化时获取精度信息
+    // Get precision info when date changes
     onDateChange () {
-      this.selectedDatePreset = null // 清除快捷选择状态
+      this.selectedDatePreset = null // Clear quick select state
       this.$nextTick(() => {
         this.fetchPrecisionInfo()
       })
     },
-    // 验证日期范围
+    // Validate date range
     validateDateRange (startDate, endDate) {
       if (!startDate || !endDate) return true
       const diffDays = endDate.diff(startDate, 'days')
@@ -1096,13 +1096,13 @@ export default {
     },
     formatPercent (value) {
       if (value === null || value === undefined) return '--'
-      // 后端返回的已经是百分比数值（如59.34表示59.34%），不需要再乘100
+      // Backend returns percentage values already (e.g. 59.34 for 59.34%)
       const sign = value >= 0 ? '+' : ''
       return `${sign}${value.toFixed(2)}%`
     },
     formatMoney (value) {
       if (value === null || value === undefined) return '--'
-      // 正数显示+，负数显示-
+      // Positive shows +, negative shows -
       const sign = value >= 0 ? '+' : '-'
       return `${sign}$${Math.abs(value).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`
     },
@@ -1132,14 +1132,14 @@ export default {
       this.hasResult = false
       this.backtestRunId = null
     },
-    // 加载动画提示轮播
+    // Loading animation carousel
     startLoadingAnimation () {
       const tips = [
-        this.$t('dashboard.indicator.backtest.loadingTip1') || '正在获取历史K线数据...',
-        this.$t('dashboard.indicator.backtest.loadingTip2') || '正在执行策略信号计算...',
-        this.$t('dashboard.indicator.backtest.loadingTip3') || '正在模拟交易执行...',
-        this.$t('dashboard.indicator.backtest.loadingTip4') || '正在计算回测指标...',
-        this.$t('dashboard.indicator.backtest.loadingTip5') || '即将完成，请稍候...'
+        this.$t('dashboard.indicator.backtest.loadingTip1') || 'Getting historical K-line data...',
+        this.$t('dashboard.indicator.backtest.loadingTip2') || 'Calculating strategy signals...',
+        this.$t('dashboard.indicator.backtest.loadingTip3') || 'Simulating trade execution...',
+        this.$t('dashboard.indicator.backtest.loadingTip4') || 'Computing backtest metrics...',
+        this.$t('dashboard.indicator.backtest.loadingTip5') || 'Finishing up, please wait...'
       ]
       let idx = 0
       this.loadingTip = tips[0]
@@ -1243,7 +1243,7 @@ export default {
             leverage: values.leverage || 1,
             tradeDirection: values.tradeDirection || 'long',
             strategyConfig,
-            // 启用多时间框架高精度回测（加密货币市场）
+            // Enable multi-timeframe high-precision backtest (Crypto market)
             enableMtf: this.market && this.market.toLowerCase() === 'crypto'
           }
 
@@ -1254,7 +1254,7 @@ export default {
           })
 
           if (response.code === 1 && response.data) {
-            // Backward compatible: data can be { runId, result } or raw result
+            // Backward compatible
             if (response.data.runId) {
               this.backtestRunId = response.data.runId
             }
@@ -1286,12 +1286,12 @@ export default {
       this.equityChart = echarts.init(this.$refs.equityChartRef)
 
       const data = this.result.equityCurve || []
-      // 后端返回格式：{ time: "2025-06-01 00:00", value: 100000 }
-      // 前端需要：dates, equity (value字段), benchmark (可选)
+      // Backend format: { time: "2025-06-01 00:00", value: 100000 }
+      // Frontend needs: dates, equity (value field), benchmark (optional)
       const dates = data.map(item => item.time || item.date)
       const equity = data.map(item => item.value !== undefined ? item.value : item.equity)
 
-      // 计算收益是正还是负，用于渐变颜色
+      // Determine if return is positive or negative for gradient color
       const initialValue = equity[0] || 100000
       const finalValue = equity[equity.length - 1] || initialValue
       const isPositive = finalValue >= initialValue
@@ -1345,7 +1345,7 @@ export default {
             color: '#8c8c8c',
             fontSize: 11,
             rotate: 0,
-            interval: Math.floor(dates.length / 6) // 自动间隔显示
+            interval: Math.floor(dates.length / 6) // Auto interval display
           }
         },
         yAxis: {
@@ -1373,9 +1373,9 @@ export default {
             name: this.$t('dashboard.indicator.backtest.strategy'),
             type: 'line',
             data: equity,
-            smooth: 0.4, // 平滑系数，0-1之间，值越大越平滑
-            symbol: 'none', // 不显示数据点
-            sampling: 'lttb', // 使用 LTTB 算法降采样，保持曲线形状
+            smooth: 0.4, // Smoothing factor, between 0-1, larger means smoother
+            symbol: 'none', // Do not show data points
+            sampling: 'lttb', // Use LTTB algorithm for downsampling
             lineStyle: {
               width: 2.5,
               color: mainColor,
@@ -1397,7 +1397,7 @@ export default {
 
       this.equityChart.setOption(option)
 
-      // 响应式调整
+      // Responsive adjustment
       window.addEventListener('resize', () => {
         if (this.equityChart) {
           this.equityChart.resize()
diff --git a/frontend_vue/src/views/indicator-analysis/components/IndicatorEditor.vue b/frontend_vue/src/views/indicator-analysis/components/IndicatorEditor.vue
index 6731204..ffe732d 100644
--- a/frontend_vue/src/views/indicator-analysis/components/IndicatorEditor.vue
+++ b/frontend_vue/src/views/indicator-analysis/components/IndicatorEditor.vue
@@ -17,7 +17,7 @@
     >
       <div class="editor-content">
         <a-row :gutter="16" class="editor-layout" :class="{ 'mobile-layout': isMobile }">
-          <!-- 左侧：代码编辑器和智能生成 -->
+          <!-- Left: Code editor and AI generation -->
           <a-col :span="24" :xs="24" :sm="24" :md="24" class="code-editor-column">
             <div class="code-section">
               <div class="section-header">
@@ -50,14 +50,14 @@
                 :description="$t('dashboard.indicator.boundary.indicatorRule')"
               />
 
-              <!-- 代码编辑器模式 -->
+              <!-- Code editor mode -->
               <div class="code-mode-split">
                 <a-row :gutter="16" class="code-mode-row">
-                  <!-- 左：代码编辑器 -->
+                  <!-- Left: Code editor -->
                   <a-col :xs="24" :sm="24" :md="18" class="code-pane">
                     <div ref="codeEditorContainer" class="code-editor-container"></div>
                   </a-col>
-                  <!-- 右：AI 生成 -->
+                  <!-- Right: AI generation -->
                   <a-col :xs="24" :sm="24" :md="6" class="ai-pane">
                     <div class="ai-panel">
                       <div class="ai-panel-title">
@@ -104,12 +104,12 @@
 <script>
 import CodeMirror from 'codemirror'
 import 'codemirror/lib/codemirror.css'
-// Python 模式
+// Python mode
 import 'codemirror/mode/python/python'
-// 主题（可选）
+// Themes
 import 'codemirror/theme/monokai.css'
 import 'codemirror/theme/eclipse.css'
-// 常用插件
+// Common addons
 import 'codemirror/addon/edit/closebrackets'
 import 'codemirror/addon/edit/matchbrackets'
 import 'codemirror/addon/selection/active-line'
@@ -147,20 +147,20 @@ export default {
   watch: {
     visible (val) {
       if (val) {
-        // Modal 打开时，等待 DOM 更新后初始化编辑器
+        // Modal opens, wait for DOM update to initialize editor
         this.$nextTick(() => {
-          // 延迟一下确保 Modal 完全渲染，表单字段已注册
+          // Delay a bit to ensure Modal is fully rendered
           setTimeout(() => {
             if (!this.codeEditor && this.$refs.codeEditorContainer) {
               this.initCodeEditor()
             }
 
-            // 初始化表单数据
+            // Initialize form data
             this.initFormData()
           }, 200)
         })
       } else {
-        // Modal 关闭时，刷新编辑器以确保下次打开时正确显示
+        // Modal closes, refresh editor to ensure correct display next time
         if (this.codeEditor) {
           this.codeEditor.refresh()
         }
@@ -169,7 +169,7 @@ export default {
     indicator: {
       handler (val) {
         if (val && this.visible) {
-          // 当 indicator 变化且弹窗可见时，等待一下再更新表单数据
+          // When indicator changes and modal is visible, wait before updating form data
           this.$nextTick(() => {
             setTimeout(() => {
               this.initFormData()
@@ -181,11 +181,11 @@ export default {
     }
   },
   mounted () {
-    // 检测是否为手机端
+    // Check if mobile
     this.checkMobile()
     window.addEventListener('resize', this.checkMobile)
 
-    // 如果 visible 初始为 true，也要初始化
+    // If visible is initially true, initialize
     if (this.visible) {
       this.$nextTick(() => {
         setTimeout(() => {
@@ -242,170 +242,17 @@ export default {
 #}
 `
     },
-    // 检测是否为手机端
+    // Check if mobile
     checkMobile () {
       this.isMobile = window.innerWidth <= 768
     },
 
-    /* Visual editor removed (code mode only).
-
-      // Helper function for crossovers
-      code += `def crossover(series1, series2):\n`
-      code += `    return (series1 > series2) & (series1.shift(1) <= series2.shift(1))\n\n`
-      code += `def crossunder(series1, series2):\n`
-      code += `    return (series1 < series2) & (series1.shift(1) >= series2.shift(1))\n\n`
-
-      modules.forEach((mod, idx) => {
-        const id = mod.id || (idx + 1)
-        const s = mod.style
-
-        if (mod.type === 'SMA') {
-          code += `# Module ${id}: SMA\n`
-          code += `sma_${id} = df['${mod.params.source}'].rolling(${mod.params.period}).mean()\n`
-          code += `output_plots.append({ "name": "SMA ${mod.params.period} (#${id})", "data": sma_${id}.tolist(), "color": "${s.color}", "overlay": ${s.overlay ? 'True' : 'False'} })\n\n`
-        } else if (mod.type === 'EMA') {
-          code += `# Module ${id}: EMA\n`
-          code += `ema_${id} = df['${mod.params.source}'].ewm(span=${mod.params.period}, adjust=False).mean()\n`
-          code += `output_plots.append({ "name": "EMA ${mod.params.period} (#${id})", "data": ema_${id}.tolist(), "color": "${s.color}", "overlay": ${s.overlay ? 'True' : 'False'} })\n\n`
-        } else if (mod.type === 'RSI') {
-          code += `# Module ${id}: RSI\n`
-          code += `delta_${id} = df['close'].diff()\n`
-          code += `gain_${id} = (delta_${id}.where(delta_${id} > 0, 0)).ewm(alpha=1/${mod.params.period}, adjust=False).mean()\n`
-          code += `loss_${id} = (-delta_${id}.where(delta_${id} < 0, 0)).ewm(alpha=1/${mod.params.period}, adjust=False).mean()\n`
-          code += `rs_${id} = gain_${id} / loss_${id}\n`
-          code += `rsi_${id} = 100 - (100 / (1 + rs_${id}))\n`
-          code += `output_plots.append({ "name": "RSI ${mod.params.period} (#${id})", "data": rsi_${id}.tolist(), "color": "${s.color}", "overlay": False })\n`
-          code += `output_plots.append({ "name": "Overbought", "data": [70]*len(df), "color": "#999", "style": "dashed", "overlay": False })\n`
-          code += `output_plots.append({ "name": "Oversold", "data": [30]*len(df), "color": "#999", "style": "dashed", "overlay": False })\n\n`
-        } else if (mod.type === 'MACD') {
-            code += `# Module ${id}: MACD\n`
-            code += `exp1_${id} = df['close'].ewm(span=${mod.params.fast}, adjust=False).mean()\n`
-            code += `exp2_${id} = df['close'].ewm(span=${mod.params.slow}, adjust=False).mean()\n`
-            code += `macd_${id} = exp1_${id} - exp2_${id}\n`
-            code += `signal_${id} = macd_${id}.ewm(span=${mod.params.signal}, adjust=False).mean()\n`
-            code += `hist_${id} = macd_${id} - signal_${id}\n`
-            code += `output_plots.append({ "name": "MACD (#${id})", "data": macd_${id}.tolist(), "color": "${s.color}", "overlay": False })\n`
-            code += `output_plots.append({ "name": "Signal (#${id})", "data": signal_${id}.tolist(), "color": "#ff9f43", "overlay": False })\n`
-            code += `output_plots.append({ "name": "Hist (#${id})", "data": hist_${id}.tolist(), "color": "#ccc", "type": "bar", "overlay": False })\n\n`
-        } else if (mod.type === 'BOLL') {
-            code += `# Module ${id}: BOLL\n`
-            code += `mid_${id} = df['close'].rolling(${mod.params.period}).mean()\n`
-            code += `std_${id} = df['close'].rolling(${mod.params.period}).std()\n`
-            code += `upper_${id} = mid_${id} + (${mod.params.std} * std_${id})\n`
-            code += `lower_${id} = mid_${id} - (${mod.params.std} * std_${id})\n`
-            code += `output_plots.append({ "name": "Boll Upper (#${id})", "data": upper_${id}.tolist(), "color": "${s.color}", "overlay": True })\n`
-            code += `output_plots.append({ "name": "Boll Lower (#${id})", "data": lower_${id}.tolist(), "color": "${s.color}", "overlay": True })\n`
-            code += `output_plots.append({ "name": "Boll Mid (#${id})", "data": mid_${id}.tolist(), "color": "${s.color}", "style": "dashed", "overlay": True })\n\n`
-        } else if (mod.type === 'KDJ') {
-            code += `# Module ${id}: KDJ\n`
-            code += `low_min_${id} = df['low'].rolling(${mod.params.period}).min()\n`
-            code += `high_max_${id} = df['high'].rolling(${mod.params.period}).max()\n`
-            code += `rsv_${id} = (df['close'] - low_min_${id}) / (high_max_${id} - low_min_${id}) * 100\n`
-            code += `k_${id} = rsv_${id}.ewm(alpha=1/${mod.params.m1}, adjust=False).mean()\n`
-            code += `d_${id} = k_${id}.ewm(alpha=1/${mod.params.m2}, adjust=False).mean()\n`
-            code += `j_${id} = 3 * k_${id} - 2 * d_${id}\n`
-            code += `output_plots.append({ "name": "K (#${id})", "data": k_${id}.tolist(), "color": "${s.color}", "overlay": False })\n`
-            code += `output_plots.append({ "name": "D (#${id})", "data": d_${id}.tolist(), "color": "#ff9f43", "overlay": False })\n`
-            code += `output_plots.append({ "name": "J (#${id})", "data": j_${id}.tolist(), "color": "#ffec3d", "overlay": False })\n\n`
-        } else if (mod.type === 'CCI') {
-            code += `# Module ${id}: CCI\n`
-            code += `tp_${id} = (df['high'] + df['low'] + df['close']) / 3\n`
-            code += `ma_${id} = tp_${id}.rolling(${mod.params.period}).mean()\n`
-            code += `md_${id} = tp_${id}.rolling(${mod.params.period}).apply(lambda x: np.mean(np.abs(x - np.mean(x))))\n`
-            code += `cci_${id} = (tp_${id} - ma_${id}) / (0.015 * md_${id})\n`
-            code += `output_plots.append({ "name": "CCI (#${id})", "data": cci_${id}.tolist(), "color": "${s.color}", "overlay": False })\n`
-            code += `output_plots.append({ "name": "Upper", "data": [100]*len(df), "color": "#999", "style": "dashed", "overlay": False })\n`
-            code += `output_plots.append({ "name": "Lower", "data": [-100]*len(df), "color": "#999", "style": "dashed", "overlay": False })\n\n`
-        } else if (mod.type === 'ATR') {
-            code += `# Module ${id}: ATR\n`
-            code += `tr1_${id} = df['high'] - df['low']\n`
-            code += `tr2_${id} = (df['high'] - df['close'].shift(1)).abs()\n`
-            code += `tr3_${id} = (df['low'] - df['close'].shift(1)).abs()\n`
-            code += `tr_${id} = pd.concat([tr1_${id}, tr2_${id}, tr3_${id}], axis=1).max(axis=1)\n`
-            code += `atr_${id} = tr_${id}.rolling(${mod.params.period}).mean()\n`
-            code += `output_plots.append({ "name": "ATR (#${id})", "data": atr_${id}.tolist(), "color": "${s.color}", "overlay": False })\n\n`
-        } else if (mod.type === 'SIGNAL') {
-            code += `# Module ${id}: Signal Logic\n`
-
-            // Helper to get variable name or default to 'close' if not found or 'close'
-            const getVar = (val) => {
-                if (!val || val === 'close') return "df['close']"
-                // Check if it's a numeric constant
-                if (!isNaN(parseFloat(val))) return parseFloat(val)
-                return val
-            }
-
-            const leftBuy = getVar(mod.params.buy_cond_left)
-            const rightBuy = getVar(mod.params.buy_cond_right)
-            let buyCond = ''
-
-            if (mod.params.buy_op === '>') buyCond = `(${leftBuy} > ${rightBuy})`
-            else if (mod.params.buy_op === '<') buyCond = `(${leftBuy} < ${rightBuy})`
-            else if (mod.params.buy_op === 'cross_up') buyCond = `crossover(${leftBuy}, ${rightBuy})`
-            else if (mod.params.buy_op === 'cross_down') buyCond = `crossunder(${leftBuy}, ${rightBuy})`
-
-            const leftSell = getVar(mod.params.sell_cond_left)
-            const rightSell = getVar(mod.params.sell_cond_right)
-            let sellCond = ''
-
-            if (mod.params.sell_op === '>') sellCond = `(${leftSell} > ${rightSell})`
-            else if (mod.params.sell_op === '<') sellCond = `(${leftSell} < ${rightSell})`
-            else if (mod.params.sell_op === 'cross_up') sellCond = `crossover(${leftSell}, ${rightSell})`
-            else if (mod.params.sell_op === 'cross_down') sellCond = `crossunder(${leftSell}, ${rightSell})`
-
-            code += `buy_signal_${id} = ${buyCond}\n`
-            code += `sell_signal_${id} = ${sellCond}\n`
-
-            code += `output_signals.append({\n`
-            code += `    "type": "buy",\n`
-            code += `    "text": "B",\n`
-            code += `    "data": [df['low'].iloc[i] * 0.995 if buy_signal_${id}.iloc[i] else None for i in range(len(df))],\n`
-            code += `    "color": "#00E676"\n`
-            code += `})\n`
-            code += `output_signals.append({\n`
-            code += `    "type": "sell",\n`
-            code += `    "text": "S",\n`
-            code += `    "data": [df['high'].iloc[i] * 1.005 if sell_signal_${id}.iloc[i] else None for i in range(len(df))],\n`
-            code += `    "color": "#FF5252"\n`
-            code += `})\n\n`
-        }
-      })
-
-      code += `output = {\n`
-      code += `    "name": my_indicator_name,\n`
-      code += `    "plots": output_plots,\n`
-      code += `    "signals": output_signals\n`
-      code += `}\n`
-
-      this.codeEditor.setValue(code)
-      this.editMode = 'code'
-      this.$message.success('代码生成成功！')
-    },
-    parseConfigFromCode (code) {
-      if (!code) return
-      const regex = /# <VISUAL_CONF>\s*\n# (.*?)\s*\n# <\/VISUAL_CONF>/s
-      const match = code.match(regex)
-      if (match && match[1]) {
-        try {
-          this.visualModules = JSON.parse(match[1])
-          this.editMode = 'visual' // Auto-switch to visual if config found
-        } catch (e) {
-          console.error('Failed to parse visual config', e)
-        }
-      } else {
-        this.editMode = 'code'
-        this.visualModules = []
-      }
-    },
-
-    */
-
-    // 跳转到文档中心
+    // Jump to docs
     goToDocs () {
       window.open('https://github.com/brokermr810/QuantDinger/blob/main/docs/STRATEGY_DEV_GUIDE.md', '_blank')
     },
 
-    // 验证代码
+    // Verify code
     handleVerifyCode () {
       const code = this.codeEditor ? this.codeEditor.getValue() : ''
       if (!code || !code.trim()) {
@@ -414,7 +261,7 @@ export default {
       }
 
       this.verifying = true
-      // 使用 request 工具（axios）发送请求，它会自动处理 baseURL 和 token
+      // Use request tool (axios) which handles baseURL and token
       request({
         url: '/api/indicator/verifyCode',
         method: 'post',
@@ -424,7 +271,7 @@ export default {
           const data = res.data || {}
           this.$message.success(`${this.$t('dashboard.indicator.editor.verifyCodeSuccess')} (${data.plots_count || 0} plots, ${data.signals_count || 0} signals)`)
         } else {
-          // 显示详细错误
+          // Show detailed error
           const errorData = res.data || {}
           this.$error({
             title: this.$t('dashboard.indicator.editor.verifyCodeFailed'),
@@ -454,7 +301,7 @@ export default {
       })
     },
 
-    // 清理代码中的 markdown 代码块标记
+    // Clean markdown code block markers
     cleanMarkdownCodeBlocks (code) {
       if (!code || typeof code !== 'string') {
         return code
@@ -462,42 +309,41 @@ export default {
 
       let cleanedCode = code.trim()
 
-      // 检查是否包含代码块标记
+      // Check for code block markers
       const hasCodeBlockMarkers = /```/.test(cleanedCode)
 
       if (!hasCodeBlockMarkers) {
-        // 如果没有代码块标记，直接返回
+        // If no markers, return
         return cleanedCode
       }
 
-      // 移除开头的代码块标记（如 ```python、```py、``` 等）
-      // 匹配 ``` 开头，可能包含语言标识（python, py, python3 等），后面可能有空格和换行
+      // Remove starting marker (e.g. ```python, ```py, ``` etc.)
       cleanedCode = cleanedCode.replace(/^```[\w]*\s*\n?/i, '')
 
-      // 如果还有开头标记（可能没有语言标识），再次尝试移除
+      // If still has opening marker, try again
       if (cleanedCode.startsWith('```')) {
         cleanedCode = cleanedCode.replace(/^```\s*\n?/g, '')
       }
 
-      // 移除结尾的代码块标记（```）
+      // Remove ending marker
       if (cleanedCode.endsWith('```')) {
         cleanedCode = cleanedCode.replace(/\n?```\s*$/g, '')
       }
 
-      // 移除代码块中间可能出现的 ```标记（通常是错误标记）
-      // 匹配单独的代码块标记行（整行只有```和可能的语言标识）
+      // Remove internal markers (usually errors)
+      // Match lines with only markers
       cleanedCode = cleanedCode.replace(/^\s*```[\w]*\s*$/gm, '')
       cleanedCode = cleanedCode.replace(/^\s*```\s*$/gm, '')
 
-      // 清理多余的空行（连续两个以上换行变为两个）
+      // Clean extra newlines
       cleanedCode = cleanedCode.replace(/\n{3,}/g, '\n\n')
 
-      // 再次清理首尾空白
+      // Trim again
       cleanedCode = cleanedCode.trim()
 
       return cleanedCode
     },
-    // 初始化弹窗数据（编辑/新建）
+    // Initialize modal data (edit/new)
     initFormData () {
       if (!this.visible) {
         return
@@ -515,7 +361,6 @@ export default {
             this.codeEditor.setValue(code)
             this.codeEditor.refresh()
           }
-          // Visual editor removed
         }, 50)
       })
     },
@@ -524,7 +369,7 @@ export default {
         return
       }
 
-      // 如果编辑器已存在，先销毁
+      // If editor exists, destroy first
       if (this.codeEditor) {
         try {
           if (typeof this.codeEditor.toTextArea === 'function') {
@@ -541,12 +386,13 @@ export default {
       }
 
       try {
-        // 清空容器
+        // Clear container
         this.$refs.codeEditorContainer.innerHTML = ''
 
-        // 创建新的编辑器实例
+        // Create new editor instance
         this.codeEditor = CodeMirror(this.$refs.codeEditorContainer, {
           value: (() => {
+            const lang = (this.$i18n && this.$i18n.locale) ? this.$i18n.locale : 'en-US'
             const existing = this.indicator ? (this.indicator.code || '') : ''
             return existing && String(existing).trim() ? existing : this.getDefaultIndicatorCode()
           })(),
@@ -566,13 +412,13 @@ export default {
           viewportMargin: Infinity
         })
 
-        // 监听代码变化，同步到表单
+        // Listen for code changes
         this.codeEditor.on('change', (editor) => {
           // no-op: form fields removed; code is read from editor on save
           editor.getValue()
         })
 
-        // 刷新编辑器以确保正确显示
+        // Refresh editor
         this.$nextTick(() => {
           if (this.codeEditor) {
             this.codeEditor.refresh()
@@ -582,7 +428,7 @@ export default {
       }
     },
     handleSave () {
-      // 先从编辑器获取代码
+      // Get code from editor
       const code = this.codeEditor ? this.codeEditor.getValue() : ''
       const finalCode = code || ''
       if (!finalCode.trim()) {
@@ -591,7 +437,7 @@ export default {
       }
 
       this.saving = true
-      // 触发保存事件：name/description 等字段已移除，后端会从代码中解析
+      // Trigger save event
       this.$emit('save', {
         id: this.indicator ? this.indicator.id : 0,
         code: finalCode,
@@ -605,7 +451,7 @@ export default {
       this.$emit('cancel')
     },
     handleAfterClose () {
-      // Modal 完全关闭后，刷新编辑器以确保下次打开时正确显示
+      // Refresh editor after modal closed
       if (this.codeEditor) {
         this.$nextTick(() => {
           if (this.codeEditor) {
@@ -614,7 +460,7 @@ export default {
         })
       }
 
-      // 清空 AI 生成输入框内容
+      // Clear AI prompt
       this.aiPrompt = ''
     },
     async handleAIGenerate () {
@@ -625,13 +471,13 @@ export default {
 
       this.aiGenerating = true
 
-      // 获取编辑器中的现有代码作为上下文
+      // Get existing code as context
       let existingCode = ''
       if (this.codeEditor) {
         existingCode = this.codeEditor.getValue() || ''
       }
 
-      // 先给一个可见反馈，避免用户感觉“没反应”
+      // Provide feedback
       if (this.codeEditor) {
         this.codeEditor.setValue('# AI generating...\n')
         this.codeEditor.refresh()
@@ -643,20 +489,20 @@ export default {
         // Local python API (SSE)
         const url = '/api/indicator/aiGenerate'
 
-        // 获取 token
+        // Get token
         const token = storage.get(ACCESS_TOKEN)
 
-        // 构建请求体，包含现有代码作为上下文
+        // Build request body
         const requestBody = {
           prompt: this.aiPrompt.trim()
         }
 
-        // 如果有现有代码，将其作为上下文传递
+        // Pass existing code as context if available
         if (existingCode.trim()) {
           requestBody.existingCode = existingCode.trim()
         }
 
-        // 使用 fetch 处理流式响应
+        // Use fetch for streaming response
         const response = await fetch(url, {
           method: 'POST',
           headers: {
@@ -674,9 +520,9 @@ export default {
           throw new Error(text || `HTTP error! status: ${response.status}`)
         }
 
-        // 处理流式响应
+        // Handle streaming response
         if (!response.body || typeof response.body.getReader !== 'function') {
-          throw new Error('AI 服务未返回可读取的流（response.body 不存在）')
+          throw new Error('AI service did not return a readable stream (response.body missing)')
         }
         const reader = response.body.getReader()
         const decoder = new TextDecoder()
@@ -689,22 +535,21 @@ export default {
             break
           }
 
-          // 解码数据块
+          // Decode chunk
           buffer += decoder.decode(value, { stream: true })
 
-          // 处理完整的 SSE 消息
+          // Process SSE messages
           const lines = buffer.split('\n\n')
-          buffer = lines.pop() || '' // 保留最后一个不完整的消息
+          buffer = lines.pop() || '' // Keep incomplete message
 
           for (const line of lines) {
             if (!line.trim() || !line.startsWith('data: ')) {
               continue
             }
 
-            const data = line.substring(6) // 移除 "data: " 前缀
+            const data = line.substring(6) // Remove "data: " prefix
 
             if (data === '[DONE]') {
-              // 流式传输完成
               break
             }
 
@@ -716,16 +561,16 @@ export default {
               }
 
               if (json.content) {
-                // 追加内容到代码
+                // Append content
                 generatedCode += json.content
 
-                // 清理 markdown 代码块标记
+                // Clean markdown markers
                 const cleanedCode = this.cleanMarkdownCodeBlocks(generatedCode)
 
-                // 实时更新编辑器
+                // Real-time update
                 if (this.codeEditor) {
                   this.codeEditor.setValue(cleanedCode)
-                  // 滚动到末尾
+                  // Scroll to end
                   const lineCount = this.codeEditor.lineCount()
                   this.codeEditor.setCursor({ line: lineCount - 1, ch: 0 })
                   this.codeEditor.refresh()
@@ -736,19 +581,19 @@ export default {
           }
         }
 
-        // 最终更新 - 清理 markdown 代码块标记
+        // Final update - clean markers
         if (this.codeEditor && generatedCode) {
           const cleanedCode = this.cleanMarkdownCodeBlocks(generatedCode)
           this.codeEditor.setValue(cleanedCode)
           this.codeEditor.refresh()
           this.$message.success(this.$t('dashboard.indicator.editor.aiGenerateSuccess'))
         } else if (!generatedCode) {
-          this.$message.warning('未生成任何代码，请尝试更详细的提示词')
+          this.$message.warning('No code generated, please try more detailed prompts')
         }
       } catch (error) {
         this.$message.error(error.message || this.$t('dashboard.indicator.editor.aiGenerateError'))
 
-        // 如果有部分生成的代码，保留它（清理 markdown 标记）
+        // If partial code generated, keep it
         if (generatedCode && this.codeEditor) {
           const cleanedCode = this.cleanMarkdownCodeBlocks(generatedCode)
           this.codeEditor.setValue(cleanedCode)
@@ -757,7 +602,7 @@ export default {
         this.aiGenerating = false
       }
     }
-    // 发布到社区 / 定价 / 预览图上传 等功能已移除（开源本地版不需要）
+    // Community / Pricing / Preview upload removed (not needed for local version)
   }
 }
 </script>
@@ -842,7 +687,7 @@ export default {
   border-top: 1px solid #e8e8e8;
 }
 
-/* 手机端适配 */
+/* Mobile adaptation */
 @media (max-width: 768px) {
   .visual-editor-container {
       height: auto;
@@ -1072,7 +917,7 @@ export default {
   }
 }
 
-/* 手机端适配 */
+/* Mobile adaptation */
 @media (max-width: 768px) {
   .indicator-editor-modal {
     :deep(.ant-modal) {
@@ -1123,13 +968,13 @@ export default {
     min-height: auto !important;
   }
 
-  /* 左右布局改为上下布局 */
+  /* Switch left-right layout to top-bottom layout */
   .code-editor-column {
     width: 100% !important;
     margin-bottom: 16px;
   }
 
-  /* 代码编辑器区域 */
+  /* Code editor area */
   .code-section {
     margin-bottom: 16px;
 
@@ -1158,13 +1003,13 @@ export default {
     }
   }
 
-  /* 智能生成区域 */
+  /* AI generation area */
   .ai-panel {
     height: auto !important;
     min-height: auto !important;
   }
 
-  /* 底部按钮 */
+  /* Footer buttons */
   .editor-footer {
     flex-direction: column-reverse;
     gap: 8px;
diff --git a/frontend_vue/src/views/indicator-analysis/components/KlineChart.vue b/frontend_vue/src/views/indicator-analysis/components/KlineChart.vue
index b6028b1..4fbac41 100644
--- a/frontend_vue/src/views/indicator-analysis/components/KlineChart.vue
+++ b/frontend_vue/src/views/indicator-analysis/components/KlineChart.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="chart-left" :class="{ 'theme-dark': chartTheme === 'dark' }">
     <div class="chart-wrapper">
-      <!-- 画线工具工具栏 -->
+      <!-- Drawing Tools Toolbar -->
       <div class="drawing-toolbar">
         <a-tooltip
           v-for="tool in drawingTools"
@@ -24,9 +24,9 @@
           </div>
         </a-tooltip>
       </div>
-      <!-- 图表内容区域 -->
+      <!-- Chart Content Area -->
       <div class="chart-content-area">
-        <!-- 指标工具栏 -->
+        <!-- Indicators Toolbar -->
         <div class="indicator-toolbar">
           <div
             v-for="indicator in indicatorButtons"
@@ -61,7 +61,7 @@
         </div>
       </div>
 
-      <!-- Pyodide 加载失败提示 -->
+      <!-- Pyodide Load Failed Hint -->
       <div v-if="pyodideLoadFailed" class="chart-overlay pyodide-warning">
         <div class="warning-box">
           <a-icon type="warning" style="font-size: 32px; color: #faad14; margin-bottom: 12px" />
@@ -70,7 +70,7 @@
         </div>
       </div>
 
-      <!-- 初始提示蒙版 -->
+      <!-- Initial Mask Hint -->
       <div v-if="!symbol && !loading && !error && !pyodideLoadFailed" class="chart-overlay initial-hint">
         <div class="hint-box">
           <a-icon type="line-chart" style="font-size: 48px; color: #1890ff; margin-bottom: 16px" />
@@ -122,32 +122,32 @@ export default {
   },
   emits: ['retry', 'price-change', 'load', 'indicator-toggle'],
   setup (props, { emit }) {
-    // K线数据
+    // K-line data
     const klineData = shallowRef([])
     const loading = ref(false)
     const error = ref(null)
     const loadingHistory = ref(false)
     const hasMoreHistory = ref(true)
-    // 用于追踪正在进行的加载请求，防止重复请求
+    // Track ongoing load requests to prevent duplicate requests
     let loadingHistoryPromise = null
-    // 标记图表是否已初始化完成，避免初始化时触发加载
+    // Mark if chart is initialized to avoid triggering load during initialization
     const chartInitialized = ref(false)
 
-    // 图表实例
+    // Chart instance
     const chartRef = shallowRef(null)
     const chartTheme = ref(props.theme || 'light')
 
-    // 实时更新设置
+    // Real-time update settings
     const realtimeTimer = ref(null)
     const realtimeInterval = ref(5000)
 
-    // 指标刷新锁：避免实时定时器触发时 updateIndicators 重入（Python 指标可能较慢）
+    // Indicator refresh lock: avoid updateIndicators re-entry when real-time timer triggers (Python indicators might be slow)
     const indicatorsUpdating = ref(false)
-    // 指标刷新节流：K线/价格可高频刷新，但指标计算可以低频刷新（默认 10s）
+    // Indicator refresh throttle: K-line/price can refresh at high frequency, but indicators can refresh at lower frequency (default 10s)
     const indicatorRefreshInterval = ref(10000)
     const lastIndicatorRefreshTs = ref(0)
 
-    // K线刷新很频繁时，指标计算不必同步频率；这里做节流（并且有重入锁）。
+    // When K-line refresh is frequent, indicator calculations don't need to sync; throttle used here (with re-entry lock).
     const maybeUpdateIndicators = (force = false) => {
       if (!chartRef.value) return
       const now = Date.now()
@@ -158,16 +158,16 @@ export default {
       }
     }
 
-    // 已添加的指标 ID 列表（用于清理）
+    // List of added indicator IDs (for cleanup)
     const addedIndicatorIds = ref([])
-    // 已添加的信号 overlay ID 列表（用于清理）
+    // List of added signal overlay IDs (for cleanup)
     const addedSignalOverlayIds = ref([])
-    // 已添加的画线 overlay ID 列表（用于清理和管理）
+    // List of added drawing overlay IDs (for cleanup and management)
     const addedDrawingOverlayIds = ref([])
-    // 当前激活的画线工具
+    // Currently active drawing tool
     const activeDrawingTool = ref(null)
 
-    // 画线工具定义（使用 computed 实现多语言支持）
+    // Drawing tool definitions (uses computed for multi-language support)
     const { proxy } = getCurrentInstance()
 
     const drawingTools = computed(() => [
@@ -182,36 +182,36 @@ export default {
       { name: 'fibonacciLine', title: proxy.$t('dashboard.indicator.drawing.fibonacciLine'), icon: 'rise' }
     ])
 
-    // 指标按钮定义
+    // Indicator button definitions
     const indicatorButtons = ref([
-      { id: 'sma', name: 'SMA (简单移动平均)', shortName: 'SMA', type: 'line', defaultParams: { length: 20 } },
-      { id: 'ema', name: 'EMA (指数移动平均)', shortName: 'EMA', type: 'line', defaultParams: { length: 20 } },
-      { id: 'rsi', name: 'RSI (相对强弱)', shortName: 'RSI', type: 'line', defaultParams: { length: 14 } },
+      { id: 'sma', name: 'SMA (Simple Moving Average)', shortName: 'SMA', type: 'line', defaultParams: { length: 20 } },
+      { id: 'ema', name: 'EMA (Exponential Moving Average)', shortName: 'EMA', type: 'line', defaultParams: { length: 20 } },
+      { id: 'rsi', name: 'RSI (Relative Strength Index)', shortName: 'RSI', type: 'line', defaultParams: { length: 14 } },
       { id: 'macd', name: 'MACD', shortName: 'MACD', type: 'macd', defaultParams: { fast: 12, slow: 26, signal: 9 } },
-      { id: 'bb', name: '布林带 (Bollinger Bands)', shortName: 'BB', type: 'band', defaultParams: { length: 20, mult: 2 } },
-      { id: 'atr', name: 'ATR (平均真实波幅)', shortName: 'ATR', type: 'line', defaultParams: { period: 14 } },
-      { id: 'cci', name: 'CCI (商品通道指数)', shortName: 'CCI', type: 'line', defaultParams: { length: 20 } },
-      { id: 'williams', name: 'Williams %R (威廉指标)', shortName: 'W%R', type: 'line', defaultParams: { length: 14 } },
-      { id: 'mfi', name: 'MFI (资金流量指标)', shortName: 'MFI', type: 'line', defaultParams: { length: 14 } },
-      { id: 'adx', name: 'ADX (平均趋向指数)', shortName: 'ADX', type: 'adx', defaultParams: { length: 14 } },
-      { id: 'obv', name: 'OBV (能量潮)', shortName: 'OBV', type: 'line', defaultParams: {} },
-      { id: 'adosc', name: 'ADOSC (积累/派发振荡器)', shortName: 'ADOSC', type: 'line', defaultParams: { fast: 3, slow: 10 } },
-      { id: 'ad', name: 'AD (积累/派发线)', shortName: 'AD', type: 'line', defaultParams: {} },
-      { id: 'kdj', name: 'KDJ (随机指标)', shortName: 'KDJ', type: 'line', defaultParams: { period: 9, k: 3, d: 3 } }
+      { id: 'bb', name: 'Bollinger Bands', shortName: 'BB', type: 'band', defaultParams: { length: 20, mult: 2 } },
+      { id: 'atr', name: 'ATR (Average True Range)', shortLine: 'ATR', type: 'line', defaultParams: { period: 14 } },
+      { id: 'cci', name: 'CCI (Commodity Channel Index)', shortName: 'CCI', type: 'line', defaultParams: { length: 20 } },
+      { id: 'williams', name: 'Williams %R', shortName: 'W%R', type: 'line', defaultParams: { length: 14 } },
+      { id: 'mfi', name: 'MFI (Money Flow Index)', shortName: 'MFI', type: 'line', defaultParams: { length: 14 } },
+      { id: 'adx', name: 'ADX (Average Directional Index)', shortName: 'ADX', type: 'adx', defaultParams: { length: 14 } },
+      { id: 'obv', name: 'OBV (On-Balance Volume)', shortName: 'OBV', type: 'line', defaultParams: {} },
+      { id: 'adosc', name: 'ADOSC (Accumulation/Distribution Oscillator)', shortName: 'ADOSC', type: 'line', defaultParams: { fast: 3, slow: 10 } },
+      { id: 'ad', name: 'AD (Accumulation/Distribution Line)', shortName: 'AD', type: 'line', defaultParams: {} },
+      { id: 'kdj', name: 'KDJ (Stochastic Oscillator)', shortName: 'KDJ', type: 'line', defaultParams: { period: 9, k: 3, d: 3 } }
     ])
 
-    // 检查指标是否激活
+    // Check if indicator is active
     const isIndicatorActive = (indicatorId) => {
       return props.activeIndicators.some(ind => ind.id === indicatorId)
     }
 
-    // 选择画线工具
+    // Select drawing tool
     const selectDrawingTool = (toolName) => {
       if (!chartRef.value) {
         return
       }
 
-      // 工具名称映射（UI 工具名 -> klinecharts 内部覆盖物名称）
+      // Tool name mapping (UI tool name -> klinecharts internal overlay name)
       const toolMap = {
         line: 'segment',
         horizontalLine: 'horizontalStraightLine',
@@ -226,12 +226,12 @@ export default {
 
       const overlayName = toolMap[toolName] || toolName
 
-      // 如果点击的是当前激活的工具，则取消激活
+      // If current tool is clicked again, deactivate it
       if (activeDrawingTool.value === toolName) {
         activeDrawingTool.value = null
-        // 取消当前的绘制模式
-        // KLineChart 没有直接的 "cancelDrawing" API，通常移除最后一个未完成的覆盖物
-        // 或者通过 overrideOverlay(null) 来取消正在进行的动作（如果支持）
+        // Cancel current drawing mode
+        // KLineChart lacks a direct "cancelDrawing" API; usually removes the last incomplete overlay
+        // Or use overrideOverlay(null) to cancel ongoing actions (if supported)
         try {
           if (typeof chartRef.value.overrideOverlay === 'function') {
             chartRef.value.overrideOverlay(null)
@@ -241,20 +241,20 @@ export default {
         return
       }
 
-      // 激活新的画线工具
+      // Activate new drawing tool
       activeDrawingTool.value = toolName
 
       try {
-        // 准备覆盖物配置
+        // Prepare overlay configuration
         const overlayConfig = {
           name: overlayName,
-          lock: false, // 允许编辑
+          lock: false, // Allow editing
           extendData: {
-            isDrawing: true // 标记为正在绘制
+            isDrawing: true // Flag as drawing
           }
         }
 
-        // 调用 createOverlay 且不传 points，库会自动进入绘制模式
+        // Call createOverlay without points; library automatically enters drawing mode
         const overlayId = chartRef.value.createOverlay(overlayConfig)
 
         if (overlayId) {
@@ -267,12 +267,12 @@ export default {
       }
     }
 
-    // 清除所有画线
+    // Clear all drawings
     const clearAllDrawings = () => {
       if (!chartRef.value) return
 
       try {
-        // 移除所有已添加的画线覆盖物
+        // Remove all added drawing overlays
         addedDrawingOverlayIds.value.forEach(overlayId => {
           try {
             if (typeof chartRef.value.removeOverlay === 'function') {
@@ -286,7 +286,7 @@ export default {
         addedDrawingOverlayIds.value = []
         activeDrawingTool.value = null
 
-        // 取消当前的绘制模式
+        // Cancel current drawing mode
         if (typeof chartRef.value.overrideOverlay === 'function') {
           chartRef.value.overrideOverlay(null)
         }
@@ -294,22 +294,22 @@ export default {
       }
     }
 
-    // 切换指标显示/隐藏
+    // Toggle indicator visibility
     const toggleIndicator = (indicator) => {
       const isActive = isIndicatorActive(indicator.id)
 
       if (isActive) {
-        // 移除指标
+        // Remove indicator
         emit('indicator-toggle', {
           action: 'remove',
           indicator: { id: indicator.id }
         })
       } else {
-        // 添加指标
+        // Add indicator
         const indicatorToAdd = {
           ...indicator,
           params: { ...indicator.defaultParams },
-          calculate: null // calculate 函数在 updateIndicators 中通过 id 判断
+          calculate: null // calculate function determined by id in updateIndicators
         }
         emit('indicator-toggle', {
           action: 'add',
@@ -318,13 +318,13 @@ export default {
       }
     }
 
-    // Pyodide 相关
+    // Pyodide related
     const pyodide = ref(null)
     const loadingPython = ref(false)
     const pythonReady = ref(false)
     const pyodideLoadFailed = ref(false)
 
-    // 主题配置
+    // Theme configuration
     const themeConfig = computed(() => {
       if (chartTheme.value === 'dark') {
         return {
@@ -369,7 +369,7 @@ export default {
       }
     })
 
-    // 根据主题获取指标颜色
+    // Get indicator color based on theme
     const getIndicatorColor = (idx) => {
       if (chartTheme.value === 'dark') {
         return ['#13c2c2', '#e040fb', '#ffeb3b', '#00e676', '#ff6d00', '#9c27b0'][idx % 6]
@@ -378,10 +378,10 @@ export default {
       }
     }
 
-    // ========== Pyodide 初始化 ==========
+    // ========== Pyodide Initialization ==========
     const loadPyodide = () => {
       return new Promise((resolve, reject) => {
-        // 检查是否已经加载
+        // Check if already loaded
         if (window.pyodide) {
           pyodide.value = window.pyodide
           pythonReady.value = true
@@ -391,11 +391,11 @@ export default {
 
         loadingPython.value = true
 
-        // 动态加载 Pyodide（生产环境默认 CDN 优先，避免本地静态资源缺失导致 404 卡住/报错）
-        // 可通过环境变量自定义：
-        // - VUE_APP_PYODIDE_CDN_BASE: 覆盖 CDN 基础路径（需以 / 结尾或会自动补齐）
-        // - VUE_APP_PYODIDE_LOCAL_BASE: 覆盖本地基础路径（需以 / 结尾或会自动补齐）
-        // - VUE_APP_PYODIDE_PREFER_CDN: 'true'/'false' 强制优先级
+        // Dynamically load Pyodide (production default CDN priority, avoid local static resource missing causing 404/error)
+        // Can be customized via environment variables:
+        // - VUE_APP_PYODIDE_CDN_BASE: Override CDN base path (must end with / or will be appended)
+        // - VUE_APP_PYODIDE_LOCAL_BASE: Override local base path (must end with / or will be appended)
+        // - VUE_APP_PYODIDE_PREFER_CDN: 'true'/'false' force priority
         const PYODIDE_VERSION = '0.25.0'
         const _ensureTrailingSlash = (s) => (s && s.endsWith('/')) ? s : (s ? (s + '/') : s)
         const defaultLocalBase = `/assets/pyodide/v${PYODIDE_VERSION}/full/`
@@ -415,7 +415,7 @@ export default {
             if (typeof window.loadPyodide === 'function') return resolve()
             // Otherwise wait for load/error.
             existing.addEventListener('load', () => resolve(), { once: true })
-            existing.addEventListener('error', () => reject(new Error('Pyodide 脚本加载失败')), { once: true })
+            existing.addEventListener('error', () => reject(new Error('Pyodide script failed to load')), { once: true })
             return
           }
 
@@ -423,17 +423,17 @@ export default {
           s.dataset.pyodideSrc = src
           s.src = src
           s.onload = () => resolve()
-          s.onerror = () => reject(new Error('Pyodide 脚本加载失败'))
+          s.onerror = () => reject(new Error('Pyodide script failed to load'))
           document.head.appendChild(s)
         })
 
         const initFromBase = async (baseUrl) => {
           if (typeof window.loadPyodide !== 'function') {
-            throw new Error('loadPyodide 函数未找到')
+            throw new Error('loadPyodide function not found')
           }
           window.pyodide = await window.loadPyodide({ indexURL: baseUrl })
 
-              // 预加载 pandas 和 numpy
+              // Preload pandas and numpy
               await window.pyodide.loadPackage(['pandas', 'numpy'])
 
               pyodide.value = window.pyodide
@@ -472,20 +472,20 @@ export default {
       })
     }
 
-    // ========== Python 代码解析 ==========
-    // 解析 Python 代码，提取参数信息
+    // ========== Python Code Parsing ==========
+    // Parse Python code, extract parameter info
     const parsePythonStrategy = (code) => {
       if (!code || typeof code !== 'string') {
         return null
       }
 
       try {
-        // 简单的参数提取：查找类似 @param 或 #param 的注释，或者函数参数
-        // 提取可能的参数
+        // Simple parameter extraction: search for comments like @param or #param, or function arguments
+        // Extract possible parameters
         const params = {}
 
-        // 尝试从代码中提取参数（如果有的话）
-        // 例如：查找类似 span=144 这样的参数
+        // Try to extract parameters from code (if any)
+        // For example: find parameters like span=144
         const paramMatches = code.match(/(\w+)\s*=\s*(\d+\.?\d*)/g)
         if (paramMatches) {
           paramMatches.forEach(match => {
@@ -500,14 +500,14 @@ export default {
           })
         }
 
-        // 返回解析结果
+        // Return resolution results
         return {
           params: params,
-          plots: [], // 从代码中无法直接提取 plots，需要在执行时确定
+          plots: [], // Cannot directly extract plots from code, must be determined during execution
           success: true
         }
       } catch (err) {
-        // 即使解析失败，也返回一个基本对象，允许执行
+        // Even if parsing fails, return a basic object, allowing execution
         return {
           params: {},
           plots: [],
@@ -516,68 +516,68 @@ export default {
       }
     }
 
-    // ========== Python 执行引擎 ==========
+    // ========== Python Execution Engine ==========
     const executePythonStrategy = async (userCode, klineData, params = {}, indicatorInfo = {}) => {
       if (!pythonReady.value || !pyodide.value) {
-        // 如果正在加载，等待一段时间后重试
+        // If loading, wait and retry
         if (loadingPython.value) {
-          // 等待最多 15 秒（30次 * 500ms）
+          // Wait up to 15 seconds (30 times * 500ms)
           let waitCount = 0
           while (loadingPython.value && waitCount < 30) {
             await new Promise(resolve => setTimeout(resolve, 500))
             waitCount++
-            // 如果加载完成，退出循环
+            // If loading complete, exit loop
             if (pythonReady.value && pyodide.value) {
               break
             }
           }
         }
 
-        // 如果仍然未就绪，检查是否加载失败
+        // If still not ready, check if loading failed
         if (!pythonReady.value || !pyodide.value) {
-          // 如果不在加载中，说明加载失败或超时
+          // If not loading, indicates failure or timeout
           if (!loadingPython.value) {
             pyodideLoadFailed.value = true
           } else {
-            // 如果还在加载中但超时了，也标记为失败
+            // If still loading but timed out, mark as failed
             loadingPython.value = false
             pyodideLoadFailed.value = true
           }
-          throw new Error('Python 引擎未就绪，请等待加载完成')
+          throw new Error('Python engine not ready, please wait for loading to complete')
         }
       }
 
       try {
-        // 检查代码是否需要解密（购买的指标）
+        // Check if code needs decryption (purchased indicators)
         let finalCode = userCode
         const isEncrypted = indicatorInfo.is_encrypted || indicatorInfo.isEncrypted || 0
         if (isEncrypted || needsDecrypt(userCode, isEncrypted)) {
-          // 获取用户ID（优先级：indicatorInfo > props > params）
+          // Get user ID (priority: indicatorInfo > props > params)
           const userId = indicatorInfo.user_id || indicatorInfo.userId || props.userId || params.userId
-          // 使用原始数据库ID（originalId），如果没有则使用id
+          // Use original database ID (originalId), if not available use id
           const indicatorId = indicatorInfo.originalId || indicatorInfo.id || params.indicatorId
 
           if (userId && indicatorId) {
             try {
               finalCode = await decryptCodeAuto(finalCode, userId, indicatorId)
             } catch (decryptError) {
-              throw new Error('代码解密失败，无法执行指标: ' + (decryptError.message || '未知错误'))
+              throw new Error('Code decryption failed, cannot execute indicator: ' + (decryptError.message || 'Unknown Error'))
             }
           } else {
-            throw new Error('缺少必要的解密参数（用户ID或指标ID），无法执行加密指标')
+            throw new Error('Missing necessary decryption parameters (User ID or Indicator ID), cannot execute encrypted indicator')
           }
         }
-        // 1. 数据转换：将 JS 的 klineData / params 转换为 JSON 字符串
-        // klineData 可能是内部格式（time）或 KLineChart 格式（timestamp）
+        // 1. Data conversion: convert JS klineData / params to JSON string
+        // klineData might be internal format (time) or KLineChart format (timestamp)
         const rawData = klineData.map(item => {
-          // 兼容两种格式
+          // Compatible with both formats
           let timeValue = item.timestamp || item.time
-          // 如果是秒级时间戳，转换为毫秒
+          // If second-level timestamp, convert to milliseconds
           if (timeValue < 1e10) {
             timeValue = timeValue * 1000
           }
           return {
-            time: Math.floor(timeValue / 1000), // Python 端使用秒级时间戳
+            time: Math.floor(timeValue / 1000), // Python side uses second-level timestamp
             open: parseFloat(item.open) || 0,
             high: parseFloat(item.high) || 0,
             low: parseFloat(item.low) || 0,
@@ -588,8 +588,8 @@ export default {
         const rawDataJson = JSON.stringify(rawData)
         const paramsJson = JSON.stringify(params || {})
 
-        // 2. 构建 Python 执行代码
-        // 转义 JSON 字符串中的特殊字符
+        // 2. Construct Python execution code
+        // Escape special characters in JSON string
         const escapedJson = rawDataJson.replace(/\\/g, '\\\\').replace(/'/g, "\\'").replace(/\n/g, '\\n').replace(/\r/g, '\\r')
         const escapedParams = paramsJson.replace(/\\/g, '\\\\').replace(/'/g, "\\'").replace(/\n/g, '\\n').replace(/\r/g, '\\r')
 
@@ -598,7 +598,7 @@ import json
 import pandas as pd
 import numpy as np
 
-# 递归清理 NaN 值的函数
+# Recursively clean NaN values
 def clean_nan(obj):
     if isinstance(obj, dict):
         return {k: clean_nan(v) for k, v in obj.items()}
@@ -615,12 +615,12 @@ def clean_nan(obj):
     else:
         return obj
 
-# 接收 JSON 数据
+# Receive JSON data
 raw_data = json.loads('${escapedJson}')
 params = json.loads('${escapedParams}')
 
-# 将前端参数注入为指标代码可直接使用的变量（对齐回测/实盘执行环境）
-# 兼容多种命名（snake_case / camelCase）
+# Inject frontend parameters as variables directly usable in indicator code (align with backtest/live environment)
+# Compatible with multiple naming conventions (snake_case / camelCase)
 def _get_param(key, default=None):
     if key in params:
         return params.get(key, default)
@@ -660,63 +660,63 @@ try:
 except Exception:
     initial_highest_price = 0.0
 
-# 转换为 DataFrame
+# Convert to DataFrame
 df = pd.DataFrame(raw_data)
 
-# 转换数据类型
+# Convert data types
 df['open'] = df['open'].astype(float)
 df['high'] = df['high'].astype(float)
 df['low'] = df['low'].astype(float)
 df['close'] = df['close'].astype(float)
 df['volume'] = df['volume'].astype(float)
 
-# 用户代码（已解密）
+# User code (decrypted)
 ${finalCode}
 
-# 构造输出（如果用户没有定义 output，则尝试从 result_json 获取）
+# Construct output (if output undefined, try to get from result_json)
 if 'output' not in locals():
     if 'result_json' in locals():
         output = json.loads(result_json)
     else:
         output = {"plots": []}
 else:
-    # 确保 output 是字典格式
+    # Ensure output is in dictionary format
     if isinstance(output, str):
         output = json.loads(output)
 
-# 清理 output 中的所有 NaN 值
+# Clean all NaN values in output
 output = clean_nan(output)
 
-# 返回 JSON 字符串
+# Return JSON string
 json.dumps(output)
 `
 
-        // 3. 执行 Python 代码
+        // 3. Execute Python code
         const resultJson = await pyodide.value.runPythonAsync(pythonCode)
 
-        // 检查返回结果
+        // Check returned results
         if (!resultJson || typeof resultJson !== 'string') {
-          throw new Error(`Python 代码执行后未返回有效的 JSON 字符串，返回类型: ${typeof resultJson}`)
+          throw new Error(`Python code execution did not return a valid JSON string, return type: ${typeof resultJson}`)
         }
 
         let result
         try {
           result = JSON.parse(resultJson)
         } catch (parseError) {
-          throw new Error(`JSON 解析失败: ${parseError.message}。可能是数据中包含 NaN 或其他无效值。`)
+          throw new Error(`JSON parsing failed: ${parseError.message}. Data might contain NaN or other invalid values.`)
         }
 
-        // 4. 验证和格式化输出
+        // 4. Verify and format output
         if (!result) {
           return { plots: [], signals: [], calculatedVars: {} }
         }
 
-        // 确保 plots 存在且为数组
+        // Ensure plots exist and are an array
         if (!result.plots || !Array.isArray(result.plots)) {
           result.plots = []
         }
 
-        // 5. 处理每个 plot 的数据，将 NaN 转换为 null
+        // 5. Process data for each plot, converting NaN to null
         result.plots = result.plots.map(plot => {
           if (plot.data && Array.isArray(plot.data)) {
             plot.data = plot.data.map(val => {
@@ -729,7 +729,7 @@ json.dumps(output)
           return plot
         })
 
-        // 6. 处理 signals（如果有）
+        // 6. Process signals (if any)
         if (result.signals && Array.isArray(result.signals)) {
           result.signals = result.signals.map(signal => {
             if (signal.data && Array.isArray(signal.data)) {
@@ -744,19 +744,19 @@ json.dumps(output)
           })
         }
 
-        // 7. 确保 calculatedVars 存在
+        // 7. Ensure calculatedVars exist
         if (!result.calculatedVars) {
           result.calculatedVars = {}
         }
 
         return result
       } catch (err) {
-        throw new Error(`Python 执行失败: ${err.message}`)
+        throw new Error(`Python execution failed: ${err.message}`)
       }
     }
 
-    // --- 指标计算函数 ---
-    // 这些函数可能通过 indicator.calculate 间接调用，所以 ESLint 可能无法识别
+    // --- Indicator Calculation Functions ---
+    // These functions might be indirectly called via indicator.calculate, so ESLint might not recognize them
 
     // eslint-disable-next-line no-unused-vars
     function calculateSMA (data, length) {
@@ -792,7 +792,7 @@ json.dumps(output)
 
     // eslint-disable-next-line no-unused-vars
     function calculateBollingerBands (data, length, mult) {
-      // 内部计算SMA
+      // Internally calculate SMA
       const sma = []
       for (let i = 0; i < data.length; i++) {
         if (i < length - 1) {
@@ -843,10 +843,10 @@ json.dumps(output)
         const loss = change < 0 ? Math.abs(change) : 0
 
         if (i < length) {
-          // 前length-1个值，累积但不计算RSI
+          // First length-1 values, accumulate but don't calculate RSI
           result.push(null)
         } else if (i === length) {
-          // 第length个值，计算初始平均值
+          // length-th value, calculate initial average
           let sumGain = 0
           let sumLoss = 0
           for (let j = 1; j <= length; j++) {
@@ -859,7 +859,7 @@ json.dumps(output)
           const rs = avgLoss === 0 ? 100 : avgGain / avgLoss
           result.push(100 - (100 / (1 + rs)))
         } else {
-          // 后续值，使用平滑移动平均
+          // Subsequent values, use smoothed moving average (SMMA)
           avgGain = (avgGain * (length - 1) + gain) / length
           avgLoss = (avgLoss * (length - 1) + loss) / length
           const rs = avgLoss === 0 ? 100 : avgGain / avgLoss
@@ -875,7 +875,7 @@ json.dumps(output)
       const slowEMA = calculateEMA(data, slow)
       const macdLine = []
 
-      // 计算MACD线
+      // Calculate MACD line
       for (let i = 0; i < data.length; i++) {
         if (fastEMA[i] == null || slowEMA[i] == null) {
           macdLine.push(null)
@@ -884,14 +884,14 @@ json.dumps(output)
         }
       }
 
-      // 计算Signal线 (MACD的EMA)
-      // 需要保持原始数组长度，对null值进行特殊处理
+      // Calculate Signal line (EMA of MACD)
+      // Need to maintain original array length, handle null values specially
       const signalLine = []
       const histogram = []
       let signalEMA = null
       let signalStartIdx = -1
 
-      // 找到第一个非null的MACD值作为signal计算的起点
+      // Find the first non-null MACD value as the starting point for signal calculation
       for (let i = 0; i < macdLine.length; i++) {
         if (macdLine[i] !== null && signalStartIdx === -1) {
           signalStartIdx = i
@@ -900,12 +900,12 @@ json.dumps(output)
         }
       }
 
-      // 如果找到了起点，继续计算signal
+      // If starting point found, continue signal calculation
       if (signalStartIdx >= 0) {
         const multiplier = 2 / (signal + 1)
         for (let i = 0; i < macdLine.length; i++) {
           if (i < signalStartIdx + signal - 1) {
-            // signal需要等待足够的MACD值
+            // Signal requires enough MACD values
             signalLine.push(null)
             histogram.push(null)
           } else if (macdLine[i] === null) {
@@ -913,7 +913,7 @@ json.dumps(output)
             histogram.push(null)
           } else {
             if (i === signalStartIdx + signal - 1) {
-              // 第一个signal值：计算前signal个MACD值的平均值
+              // First signal value: calculate average of the first signal-many MACD values
               let sum = 0
               let count = 0
               for (let j = signalStartIdx; j <= i; j++) {
@@ -924,7 +924,7 @@ json.dumps(output)
               }
               signalEMA = sum / count
             } else {
-              // 后续值：使用EMA公式
+              // Subsequent values: use EMA formula
               signalEMA = (macdLine[i] - signalEMA) * multiplier + signalEMA
             }
             signalLine.push(signalEMA)
@@ -932,7 +932,7 @@ json.dumps(output)
           }
         }
       } else {
-        // 如果没有有效的MACD值，全部设为null
+        // If no valid MACD values, set all to null
         for (let i = 0; i < macdLine.length; i++) {
           signalLine.push(null)
           histogram.push(null)
@@ -942,9 +942,9 @@ json.dumps(output)
       return { macd: macdLine, signal: signalLine, histogram }
     }
 
-    // 计算ATR（平均真实波幅）
+    // Calculate ATR (Average True Range)
     function calculateATR (data, period) {
-      const tr = [] // 真实波幅
+      const tr = [] // True Range
       for (let i = 0; i < data.length; i++) {
         if (i === 0) {
           tr.push(data[i].high - data[i].low)
@@ -956,7 +956,7 @@ json.dumps(output)
         }
       }
 
-      // 计算ATR（TR的SMA）
+      // Calculate ATR (SMA of TR)
       const atr = []
       for (let i = 0; i < data.length; i++) {
         if (i < period - 1) {
@@ -972,23 +972,23 @@ json.dumps(output)
       return atr
     }
 
-    // 计算CCI (商品通道指数)
+    // Calculate CCI (Commodity Channel Index)
     function calculateCCI (data, length) {
       const cci = []
       for (let i = 0; i < data.length; i++) {
         if (i < length - 1) {
           cci.push(null)
         } else {
-          // 计算典型价格 (TP)
+          // Calculate Typical Price (TP)
           const tp = []
           for (let j = i - length + 1; j <= i; j++) {
             tp.push((data[j].high + data[j].low + data[j].close) / 3)
           }
-          // 计算TP的SMA
+          // Calculate SMA of TP
           const sma = tp.reduce((sum, val) => sum + val, 0) / length
-          // 计算平均偏差
+          // Calculate mean deviation
           const meanDev = tp.reduce((sum, val) => sum + Math.abs(val - sma), 0) / length
-          // 计算CCI
+          // Calculate CCI
           const currentTP = (data[i].high + data[i].low + data[i].close) / 3
           const cciValue = meanDev === 0 ? 0 : (currentTP - sma) / (0.015 * meanDev)
           cci.push(cciValue)
@@ -997,7 +997,7 @@ json.dumps(output)
       return cci
     }
 
-    // 计算Williams %R (威廉指标)
+    // Calculate Williams %R (Williams Index)
     function calculateWilliamsR (data, length) {
       const williamsR = []
       for (let i = 0; i < data.length; i++) {
@@ -1017,7 +1017,7 @@ json.dumps(output)
       return williamsR
     }
 
-    // 计算MFI (资金流量指标)
+    // Calculate MFI (Money Flow Index)
     function calculateMFI (data, length) {
       const mfi = []
       for (let i = 0; i < data.length; i++) {
@@ -1046,13 +1046,13 @@ json.dumps(output)
       return mfi
     }
 
-    // 计算ADX (平均趋向指数) 和 DMI (+DI, -DI)
+    // Calculate ADX (Average Directional Index) and DMI (+DI, -DI)
     function calculateADX (data, length) {
       const plusDI = []
       const minusDI = []
       const adx = []
 
-      // 计算真实波幅(TR)和方向移动(+DM, -DM)
+      // Calculate True Range (TR) and Directional Movement (+DM, -DM)
       const tr = []
       const plusDM = []
       const minusDM = []
@@ -1085,7 +1085,7 @@ json.dumps(output)
         }
       }
 
-      // 计算平滑的TR, +DM, -DM
+      // Calculate smoothed TR, +DM, -DM
       const smoothTR = []
       const smoothPlusDM = []
       const smoothMinusDM = []
@@ -1099,7 +1099,7 @@ json.dumps(output)
           minusDI.push(null)
           adx.push(null)
         } else if (i === length - 1) {
-          // 初始值：简单求和
+          // Initial values: simple summation
           let sumTR = 0
           let sumPlusDM = 0
           let sumMinusDM = 0
@@ -1112,7 +1112,7 @@ json.dumps(output)
           smoothPlusDM.push(sumPlusDM)
           smoothMinusDM.push(sumMinusDM)
         } else {
-          // 平滑计算：Wilder's smoothing
+          // Smoothed calculation: Wilder's smoothing
           smoothTR.push(smoothTR[i - 1] - (smoothTR[i - 1] / length) + tr[i])
           smoothPlusDM.push(smoothPlusDM[i - 1] - (smoothPlusDM[i - 1] / length) + plusDM[i])
           smoothMinusDM.push(smoothMinusDM[i - 1] - (smoothMinusDM[i - 1] / length) + minusDM[i])
@@ -1131,20 +1131,20 @@ json.dumps(output)
             minusDI.push((minusDMVal / trVal) * 100)
           }
 
-          // 计算DX
+          // Calculate DX
           if (i >= length - 1) {
             const diSum = plusDI[i] + minusDI[i]
             const dx = diSum === 0 ? 0 : Math.abs(plusDI[i] - minusDI[i]) / diSum * 100
 
-            // 计算ADX (DX的平滑)
+            // Calculate ADX (Smoothing of DX)
             if (i === length - 1) {
               adx.push(dx)
             } else if (i === length) {
-              // 第二个ADX值：前两个DX的平均值
+              // Second ADX value: average of first two DX values
               const prevDX = Math.abs(plusDI[i - 1] - minusDI[i - 1]) / (plusDI[i - 1] + minusDI[i - 1]) * 100
               adx.push((prevDX + dx) / 2)
             } else {
-              // ADX平滑：Wilder's smoothing
+              // ADX smoothing: Wilder's smoothing
               adx.push((adx[i - 1] * (length - 1) + dx) / length)
             }
           }
@@ -1154,7 +1154,7 @@ json.dumps(output)
       return { adx, plusDI, minusDI }
     }
 
-    // 计算OBV (能量潮指标)
+    // Calculate OBV (On-Balance Volume)
     function calculateOBV (data) {
       const obv = []
       let obvValue = 0
@@ -1168,14 +1168,14 @@ json.dumps(output)
           } else if (data[i].close < data[i - 1].close) {
             obvValue -= data[i].volume
           }
-          // 如果收盘价相同，OBV不变
+          // If close price is same, OBV remains unchanged
         }
         obv.push(obvValue)
       }
       return obv
     }
 
-    // 计算AD (积累/派发线)
+    // Calculate AD (Accumulation/Distribution Line)
     function calculateAD (data) {
       const ad = []
       let adValue = 0
@@ -1195,7 +1195,7 @@ json.dumps(output)
       return ad
     }
 
-    // 计算ADOSC (积累/派发振荡器) = AD的快速EMA - AD的慢速EMA
+    // Calculate ADOSC (Accumulation/Distribution Oscillator) = Fast EMA of AD - Slow EMA of AD
     function calculateADOSC (data, fast, slow) {
       const ad = calculateAD(data)
       const fastEMA = []
@@ -1226,7 +1226,7 @@ json.dumps(output)
       return adosc
     }
 
-    // 计算KDJ (随机指标)
+    // Calculate KDJ (Stochastic Oscillator)
     function calculateKDJ (data, period, kPeriod, dPeriod) {
       const kValues = []
       const dValues = []
@@ -1238,7 +1238,7 @@ json.dumps(output)
           dValues.push(null)
           jValues.push(null)
         } else {
-          // 找到period内的最高价和最低价
+          // Find highest and lowest prices within period
           let highest = -Infinity
           let lowest = Infinity
           for (let j = i - period + 1; j <= i; j++) {
@@ -1246,24 +1246,24 @@ json.dumps(output)
             lowest = Math.min(lowest, data[j].low)
           }
 
-          // 计算RSV
+          // Calculate RSV
           const rsv = (highest - lowest) === 0 ? 50 : ((data[i].close - lowest) / (highest - lowest)) * 100
 
-          // 计算K值 (RSV的移动平均)
+          // Calculate K value (Moving average of RSV)
           if (kValues[i - 1] === null) {
             kValues.push(rsv)
           } else {
             kValues.push((rsv * 2 + kValues[i - 1] * (kPeriod - 2)) / kPeriod)
           }
 
-          // 计算D值 (K值的移动平均)
+          // Calculate D value (Moving average of K)
           if (dValues[i - 1] === null) {
             dValues.push(kValues[i])
           } else {
             dValues.push((kValues[i] * 2 + dValues[i - 1] * (dPeriod - 2)) / dPeriod)
           }
 
-          // 计算J值
+          // Calculate J value
           jValues.push(3 * kValues[i] - 2 * dValues[i])
         }
       }
@@ -1271,42 +1271,42 @@ json.dumps(output)
       return { k: kValues, d: dValues, j: jValues }
     }
 
-    // ========== 注册自定义信号 Overlay (Signal Tag) ==========
-    // 这是一个能够绘制 "圆点 + 带背景色文字框" 的自定义覆盖物
-// ========== 注册自定义信号 Overlay (Signal Tag) ==========
+    // ========== Register Custom Signal Overlay (Signal Tag) ==========
+    // This is a custom overlay that can draw "Dot + Colored background text box"
+// ========== Register Custom Signal Overlay (Signal Tag) ==========
 registerOverlay({
       name: 'signalTag',
-      // 【关键修改1】必须改为 1。告诉图表这个图形只需要一个点就画完了。
-      // 只要这里是 1，图表就不会画那个蓝色的"编辑中"手柄。
+      // [Critical Change 1] Must be changed to 1. Tells chart that this figure needs only one point to finish.
+      // If it is 1, the chart won't draw that blue "editing" handle.
       totalStep: 1,
 
-      // 【关键修改2】彻底禁止该 Overlay 响应任何鼠标事件
-      // 这样鼠标放上去也不会有蓝色的选中框
+      // [Critical Change 2] Completely prohibit this overlay from responding to any mouse events.
+      // This way there won't be a blue selection box when hovering mouse
       lock: true,
       needDefaultPointFigure: false,
       needDefaultXAxisFigure: false,
       needDefaultYAxisFigure: false,
 
-      // 【建议保留】进一步确保不拦截事件
+      // [Recommended to keep] Further ensure events are not intercepted
       checkEventOn: () => false,
 
       createPointFigures: ({ coordinates, overlay }) => {
         const { text } = overlay.extendData || {}
         const color = overlay.extendData?.color || '#555555'
 
-        // 1. 获取信号点坐标
+        // 1. Get signal point coordinates
         if (!coordinates[0]) return []
         const x = coordinates[0].x
-        const signalY = coordinates[0].y // Point 0: Python中计算的标签位置（已包含垂直间距）
+        const signalY = coordinates[0].y // Point 0: Compiled label position in Python (includes vertical spacing)
 
-        // 2. 获取K线极值坐标（用于画圆点）
-        const anchorY = coordinates[1] ? coordinates[1].y : signalY // Point 1: K线的high/low
+        // 2. Get K-line extrema coordinates (for drawing the dot)
+        const anchorY = coordinates[1] ? coordinates[1].y : signalY // Point 1: K-line high/low
 
         const boxPaddingX = 8
         const boxPaddingY = 4
         const fontSize = 12
         const textStr = String(text || '')
-        // 简单的字符宽度估算
+        // Simple character width estimation
         const textWidth = textStr.split('').reduce((acc, char) => acc + (char.charCodeAt(0) > 255 ? 12 : 7), 0)
         const boxWidth = textWidth + boxPaddingX * 2
         const boxHeight = fontSize + boxPaddingY * 2
@@ -1315,39 +1315,39 @@ registerOverlay({
         const side = overlay.extendData?.side || overlay.extendData?.type || 'buy'
         const isBuy = side === 'buy'
 
-        // 3. 计算 Box 的 Y 轴位置
-        // 【关键修改】直接使用 signalY（Python中已经调整好的位置），不再使用固定margin
-        // signalY 已经包含了反转信号的垂直间距调整
+        // 3. Calculate Box Y-axis position
+        // [Critical Change] Use signalY directly (adjusted position in Python), don't use fixed margin anymore
+        // signalY already includes adjustment for inverted signal's vertical spacing
         const boxY = isBuy ? signalY : (signalY - boxHeight)
 
-        // 计算线段连接点
-        // 圆点画在K线极值位置（anchorY），紧挨着K线
-        // 连线从圆点连到标签框
-        const circleY = anchorY // 圆点位置：K线的High或Low
-        const lineStartY = circleY // 连线起点：圆点位置
-        const lineEndY = isBuy ? boxY : (boxY + boxHeight) // 连线终点：标签框边缘
+        // Calculate segment connection point
+        // Dot drawn at K-line extrema position (anchorY), right next to K-line
+        // Connector line from dot to label box
+        const circleY = anchorY // Dot position: K-line High or Low
+        const lineStartY = circleY // Connector line start: Dot position
+        const lineEndY = isBuy ? boxY : (boxY + boxHeight) // Connector line end: Label box edge
 
         return [
-          // 1. 虚线 (从圆点连到标签框)
+          // 1. Dashed line (from dot to label box)
           {
             type: 'line',
             attrs: {
               coordinates: [
-                { x, y: lineStartY }, // 从圆点（K线极值位置）
-                { x, y: lineEndY } // 连到标签框边缘
+                { x, y: lineStartY }, // From dot (K-line extrema position)
+                { x, y: lineEndY } // Connect to label box edge
               ]
             },
             styles: { style: 'stroke', color: color, dashedValue: [2, 2] },
             ignoreEvent: true
           },
-          // 2. 圆点 (画在K线极值位置，紧挨着K线)
+          // 2. Dot (drawn at K-line extrema position, right next to K-line)
           {
             type: 'circle',
             attrs: { x, y: circleY, r: 4 },
             styles: { style: 'fill', color: color },
             ignoreEvent: true
           },
-          // 3. 背景框 (基于 boxY)
+          // 3. Background box (based on boxY)
           {
             type: 'rect',
             attrs: {
@@ -1360,7 +1360,7 @@ registerOverlay({
             styles: { style: 'fill', color: color, borderSize: 0 },
             ignoreEvent: true
           },
-          // 4. 文字
+          // 4. Text
           {
             type: 'text',
             attrs: {
@@ -1377,15 +1377,15 @@ registerOverlay({
       }
     })
 
-    // --- 数据加载相关函数 ---
-    // 格式化数据为 KLineChart 格式（timestamp 需要是毫秒）
+    // --- Data loading related functions ---
+    // Format data to KLineChart format (timestamp needs to be in milliseconds)
     const formatKlineData = (data) => {
       return data.map(item => {
         let timeValue = item.time || item.timestamp
         if (typeof timeValue === 'string') {
           timeValue = parseInt(timeValue)
         }
-        // KLineChart 需要毫秒时间戳，如果当前是秒级，转换为毫秒
+        // KLineChart needs millisecond timestamp; if currently second-level, convert to milliseconds
         if (timeValue < 1e10) {
           timeValue = timeValue * 1000
         }
@@ -1416,10 +1416,10 @@ registerOverlay({
       }
     }
 
-    // 将 KLineChart 格式的数据转换为内部格式（用于 isSameTimeframe 等函数）
+    // Convert KLineChart format data to internal format (used for functions like isSameTimeframe)
     const convertToInternalFormat = (data) => {
       return data.map(item => ({
-        time: Math.floor(item.timestamp / 1000), // 转回秒级时间戳用于比较
+        time: Math.floor(item.timestamp / 1000), // Convert back to second-level timestamp for comparison
         open: item.open,
         high: item.high,
         low: item.low,
@@ -1504,8 +1504,8 @@ registerOverlay({
           if (response.code === 1 && response.data && Array.isArray(response.data)) {
             formattedData = formatKlineData(response.data)
           } else {
-            // 特殊处理 Tiingo 订阅限制提示
-            let errMsg = response.msg || '获取K线数据失败'
+            // Special handling for Tiingo subscription limit notice
+            let errMsg = response.msg || 'Failed to fetch Kline data'
             if (response.hint === 'tiingo_subscription') {
               errMsg = proxy.$t('dashboard.indicator.error.tiingoSubscription') || 'Forex 1-minute data requires Tiingo paid subscription'
             }
@@ -1515,9 +1515,9 @@ registerOverlay({
           throw apiErr
         }
 
-        // 检查数据是否为空
+        // Check if data is empty
         if (!formattedData || formattedData.length === 0) {
-          throw new Error('未获取到K线数据')
+          throw new Error('No Kline data fetched')
         }
 
         klineData.value = formattedData
@@ -1529,7 +1529,7 @@ registerOverlay({
           if (!chartRef.value) {
             initChart()
           } else {
-            // 确保数据格式正确
+            // Ensure data format is correct
             const validData = klineData.value.filter(item =>
               item.timestamp &&
               !isNaN(item.open) &&
@@ -1539,14 +1539,14 @@ registerOverlay({
             )
 
             if (validData.length > 0 && chartRef.value) {
-              // 使用 applyNewData 初始化
+              // Use applyNewData for initialization
               try {
                 chartRef.value.applyNewData(validData)
               } catch (e) {
                 chartRef.value.applyNewData(validData)
               }
 
-              // 延迟更新指标
+              // Delayed indicator update
               setTimeout(() => {
                 if (chartRef.value) {
                   updateIndicators()
@@ -1562,9 +1562,9 @@ registerOverlay({
         })
       } catch (err) {
         error.value = proxy.$t('dashboard.indicator.error.loadDataFailed') + ': ' + (err.message || proxy.$t('dashboard.indicator.error.loadDataFailedDesc'))
-        // 清空K线数据，不显示图表
+        // Clear Kline data, don't show chart
         klineData.value = []
-        // 如果有图表实例，清空数据
+        // If chart instance exists, clear data
         if (chartRef.value) {
           try {
             chartRef.value.applyNewData([])
@@ -1576,15 +1576,15 @@ registerOverlay({
       }
     }
 
-    // 加载更多历史数据（用于滚动加载，保持滚动位置）
+    // Load more historical data (for infinite scroll, maintains scroll position)
     const loadMoreHistoryDataForScroll = async (timestamp) => {
       if (!props.symbol || !klineData.value || klineData.value.length === 0) {
         return
       }
 
-      // 【核心修复】防止重复请求：如果已经有正在进行的请求，直接返回
+      // [Core Fix] Prevent duplicate requests: if a request is already in progress, return immediately
       if (loadingHistory.value || loadingHistoryPromise) {
-        // 如果有正在进行的请求，等待它完成
+        // If a request is in progress, wait for it to complete
         if (loadingHistoryPromise) {
           try {
             await loadingHistoryPromise
@@ -1595,21 +1595,21 @@ registerOverlay({
       }
 
       if (!hasMoreHistory.value) {
-        // 如果没有更多数据，通知图表
+        // If no more data, notify the chart
         if (chartRef.value && typeof chartRef.value.noMoreData === 'function') {
           chartRef.value.noMoreData()
         }
         return
       }
 
-      // 立即设置加载状态和创建 Promise，防止并发请求
+      // Set loading state and create Promise immediately to prevent concurrent requests
       loadingHistory.value = true
       loadingHistoryPromise = (async () => {
-        // 强制触发更新
+        // Force trigger update
         await nextTick()
 
         try {
-        // timestamp 是毫秒时间戳，转换为秒级用于 API
+        // timestamp is in ms, convert to seconds for API
         const beforeTime = Math.floor(timestamp / 1000)
 
         const response = await request({
@@ -1620,7 +1620,7 @@ registerOverlay({
             symbol: props.symbol,
             timeframe: props.timeframe,
             limit: 500,
-            before_time: beforeTime // 获取此时间之前的数据
+            before_time: beforeTime // Fetch data prior to this time
           }
         })
 
@@ -1628,7 +1628,7 @@ registerOverlay({
           const newData = formatKlineData(response.data)
 
           if (newData.length === 0) {
-            // 没有更多数据了
+            // No more data
             hasMoreHistory.value = false
             if (chartRef.value && typeof chartRef.value.noMoreData === 'function') {
               chartRef.value.noMoreData()
@@ -1636,11 +1636,11 @@ registerOverlay({
             return
           }
 
-          // 确保新数据的时间早于传入的时间戳
+          // Ensure new data time is earlier than passed timestamp
           const filteredNewData = newData.filter(item => item.timestamp < timestamp)
 
           if (filteredNewData.length === 0) {
-            // 没有更早的数据了
+            // No earlier data
             hasMoreHistory.value = false
             if (chartRef.value && typeof chartRef.value.noMoreData === 'function') {
               chartRef.value.noMoreData()
@@ -1648,8 +1648,8 @@ registerOverlay({
             return
           }
 
-          // 保存当前可见范围，用于恢复滚动位置
-          // klinecharts 9.x 的 getVisibleRange() 返回的 from/to 是数据索引（整数），不是百分比
+          // Save current visible range for restoring scroll position
+          // klinecharts 9.x getVisibleRange() returns from/to as data indices (integers), not percentages
           let savedVisibleRange = null
           try {
             if (chartRef.value && typeof chartRef.value.getVisibleRange === 'function') {
@@ -1661,32 +1661,32 @@ registerOverlay({
           // 记录新数据的数量，用于后续计算偏移
           const newDataCount = filteredNewData.length
 
-          // 将新数据插入到现有数据的前面
+          // Prepended new data to existing data
           klineData.value = [...filteredNewData, ...klineData.value]
 
-          // 使用 applyNewData 添加历史数据（applyMoreData 在 v9.8.0 已废弃）
+          // Use applyNewData to add historical data (applyMoreData is deprecated in v9.8.0)
           nextTick(() => {
             if (chartRef.value) {
-              // 应用新数据
+              // Apply new data
               chartRef.value.applyNewData(klineData.value)
 
-              // 恢复滚动位置
-              // 由于新数据插入到了前面，原来的索引需要偏移 newDataCount
+              // Restore scroll position
+              // Since new data is prepended, original indices need an offset of newDataCount
               if (savedVisibleRange && typeof savedVisibleRange.from === 'number') {
                 // 计算新的可见范围索引
-                // 原来看的是索引 from 到 to 的数据，现在这些数据的索引变成了 from + newDataCount 到 to + newDataCount
+                // Originally viewed indices from-to now become from+newDataCount to to+newDataCount
                 const newFrom = savedVisibleRange.from + newDataCount
                 const newTo = savedVisibleRange.to + newDataCount
 
-                // 使用 setTimeout 确保数据已经渲染完成
+                // Use setTimeout to ensure data has finished rendering
                 setTimeout(() => {
                   try {
                     if (chartRef.value) {
-                      // 尝试使用 scrollToDataIndex 方法（如果存在）
+                      // Try using scrollToDataIndex method (if it exists)
                       if (typeof chartRef.value.scrollToDataIndex === 'function') {
                         chartRef.value.scrollToDataIndex(newFrom)
                       } else if (typeof chartRef.value.setVisibleRange === 'function') {
-                        // 使用 setVisibleRange 设置可见范围（参数是数据索引）
+                        // Use setVisibleRange to set visible range (parameters are data indices)
                         chartRef.value.setVisibleRange(newFrom, newTo)
                       }
                     }
@@ -1695,36 +1695,36 @@ registerOverlay({
                 }, 50)
               }
 
-              // 更新指标
+              // Update indicators
               updateIndicators()
             }
           })
         } else {
-          // API返回错误，通知图表加载失败
+          // API returned error, notify chart of load failure
           if (chartRef.value && typeof chartRef.value.noMoreData === 'function') {
             chartRef.value.noMoreData()
           }
         }
         } catch (err) {
-          // 加载失败，通知图表
+          // Load failed, notify chart
           if (chartRef.value && typeof chartRef.value.noMoreData === 'function') {
             chartRef.value.noMoreData()
           }
         } finally {
           loadingHistory.value = false
-          loadingHistoryPromise = null // 清除请求追踪
+          loadingHistoryPromise = null // Clear request tracking
         }
-      })() // 立即执行 Promise
+      })() // Execute Promise immediately
 
-      // 等待请求完成
+      // Wait for request completion
       try {
         await loadingHistoryPromise
       } catch (err) {
-        // 错误已经在内部的 catch 中处理，这里只是确保 Promise 完成
+        // Error handled in internal catch, this just ensures Promise completes
       }
     }
 
-    // 加载更多历史数据（保留原有函数，用于其他场景）
+    // Load more historical data (keeps original function for other scenarios)
     const loadMoreHistoryData = async () => {
       if (!props.symbol || !klineData.value || klineData.value.length === 0) {
         return
@@ -1737,9 +1737,9 @@ registerOverlay({
       loadingHistory.value = true
 
       try {
-        // 获取当前最早的数据时间（转换为秒级用于 API）
+        // Get current earliest data time (convert to seconds for API)
         const earliestTimestamp = klineData.value[0].timestamp
-        const earliestTime = Math.floor(earliestTimestamp / 1000) // 转换为秒级
+        const earliestTime = Math.floor(earliestTimestamp / 1000) // Convert to seconds
         const response = await request({
           url: '/api/indicator/kline',
           method: 'get',
@@ -1748,7 +1748,7 @@ registerOverlay({
             symbol: props.symbol,
             timeframe: props.timeframe,
             limit: 500,
-            before_time: earliestTime // 获取此时间之前的数据
+            before_time: earliestTime // Fetch data before this time
           }
         })
 
@@ -1756,26 +1756,26 @@ registerOverlay({
           const newData = formatKlineData(response.data)
 
           if (newData.length === 0) {
-            // 没有更多数据了
+            // No more data
             hasMoreHistory.value = false
             loadingHistory.value = false
             return
           }
 
-          // 确保新数据的时间早于现有最早数据
+          // Ensure new data time is earlier than existing earliest data
           const filteredNewData = newData.filter(item => item.timestamp < earliestTimestamp)
 
           if (filteredNewData.length === 0) {
-            // 没有更早的数据了
+            // No earlier data
             hasMoreHistory.value = false
             loadingHistory.value = false
             return
           }
 
-          // 将新数据插入到现有数据的前面
+          // Prepended new data to existing data
           klineData.value = [...filteredNewData, ...klineData.value]
 
-          // 更新图表
+          // Update chart
           nextTick(() => {
             if (chartRef.value) {
               chartRef.value.applyNewData(klineData.value)
@@ -1783,26 +1783,26 @@ registerOverlay({
             }
           })
         } else {
-          // API返回错误，但不一定表示没有更多数据，可能是网络问题
-          // 不设置 hasMoreHistory = false，允许用户重试
+          // API error, but doesn't necessarily mean no more data, could be network issue
+          // Don't set hasMoreHistory = false, allow user retry
         }
       } catch (err) {
-        // 加载失败可能是网络问题，不应该立即认为没有更多数据
-        // 只有在明确知道没有更早数据时才设置 hasMoreHistory = false
-        // 这里不设置，允许用户重试
+        // Load failure could be network issue, shouldn't immediately assume no more data
+        // Only set hasMoreHistory = false when explicitly known no more earlier data exists
+        // Not setting here, allowing user retry
       } finally {
         loadingHistory.value = false
       }
     }
 
-    // 增量更新K线数据（实时更新）
+    // Incremental update of Kline data (real-time update)
     const updateKlineRealtime = async () => {
       if (!props.symbol || !klineData.value || klineData.value.length === 0) {
-        return // 如果没有现有数据，不进行增量更新
+        return // If no existing data, don't perform incremental update
       }
 
       try {
-        // 只获取最新的5根K线用于更新
+        // Only fetch latest 5 Klines for update
         const response = await request({
           url: '/api/indicator/kline',
           method: 'get',
@@ -1810,7 +1810,7 @@ registerOverlay({
             market: props.market,
             symbol: props.symbol,
             timeframe: props.timeframe,
-            limit: 5 // 只获取最新5根
+            limit: 5 // Only fetch latest 5
           }
         })
 
@@ -1819,18 +1819,18 @@ registerOverlay({
           const existingData = [...klineData.value]
 
           if (newData.length > 0) {
-            const lastNewTime = Math.floor(newData[newData.length - 1].timestamp / 1000) // 转回秒级用于比较
+            const lastNewTime = Math.floor(newData[newData.length - 1].timestamp / 1000) // Convert back to seconds for comparison
             const lastExistingTime = Math.floor(existingData[existingData.length - 1].timestamp / 1000)
 
-            // 判断是否属于同一时间段
+            // Check if belonging to same timeframe
             if (isSameTimeframe(lastNewTime, lastExistingTime, props.timeframe)) {
-              // 同一时间段，合并更新最后一根K线的数据
-              // K线合并规则：
-              // - open: 保持不变（时间段开始时的价格）
-              // - high: 取最大值（时间段内的最高价）
-              // - low: 取最小值（时间段内的最低价）
-              // - close: 更新为最新价格（当前价格）
-              // - volume: 使用API返回的最新值（API返回的已是该周期的总成交量，无需累加）
+              // Same timeframe, merge and update the last Kline data
+              // Kline merge rules:
+              // - open: remain unchanged (price at start of timeframe)
+              // - high: take maximum (highest price within timeframe)
+              // - low: take minimum (lowest price within timeframe)
+              // - close: update to latest price (current price)
+              // - volume: use latest API value (API already returns total volume for the period)
               const existingLast = existingData[existingData.length - 1]
               const newLast = newData[newData.length - 1]
 
@@ -1840,33 +1840,33 @@ registerOverlay({
                 high: Math.max(existingLast.high, newLast.high), // 最高价取最大值
                 low: Math.min(existingLast.low, newLast.low), // 最低价取最小值
                 close: newLast.close, // 收盘价更新为最新价格
-                volume: newLast.volume // 成交量使用API返回的最新值（已是该周期的总成交量）
+                volume: newLast.volume // volume from latest API value (already total volume for the period)
               }
               klineData.value = existingData
 
-              // 更新价格面板（使用内部格式）
+              // Update price panel (using internal format)
               const internalData = convertToInternalFormat(klineData.value)
               updatePricePanel(internalData)
 
-              // 更新 KLineChart - 使用 updateData 方法保持滚动位置
+              // Update KLineChart - use updateData to maintain scroll position
               if (chartRef.value && typeof chartRef.value.updateData === 'function') {
                 // 更新最后一根K线数据，保持滚动位置
-                // updateData 只需要一个参数：要更新的数据对象（v9.8.0+ 不再接受 callback 参数）
+                // updateData needs only one argument: data object to update (v9.8.0+ no longer accepts callback)
                 const lastIndex = klineData.value.length - 1
                 chartRef.value.updateData(existingData[lastIndex])
-                // 指标计算节流：默认 10 秒刷新一次（避免 1 秒频率下 CPU 拉满）
+                // Indicator calculation throttle: default 10s refresh (avoid CPU spiking at 1s frequency)
                 maybeUpdateIndicators(false)
               } else if (chartRef.value) {
-                // 降级方案：使用 applyNewData（会重置滚动位置）
+                // Fallback: use applyNewData (resets scroll position)
                 chartRef.value.applyNewData(klineData.value)
                 maybeUpdateIndicators(false)
               }
             } else if (lastNewTime > lastExistingTime) {
-              // 新的时间段，追加新数据
-              // 先移除可能重复的K线（基于时间段，而不是精确时间戳）
+              // New timeframe, append new data
+              // Remove potentially duplicate Klines first (based on timeframe, not precise timestamp)
               const uniqueNewData = newData.filter(newItem => {
                 const newItemTime = Math.floor(newItem.timestamp / 1000)
-                // 检查是否与现有数据中的任何一条属于同一时间段
+                // Check if belonging to same timeframe as any existing data
                 return !existingData.some(existingItem => {
                   const existingItemTime = Math.floor(existingItem.timestamp / 1000)
                   return isSameTimeframe(newItemTime, existingItemTime, props.timeframe)
@@ -1884,11 +1884,11 @@ registerOverlay({
                 const internalData = convertToInternalFormat(klineData.value)
                 updatePricePanel(internalData)
 
-                // 更新 KLineChart - 使用 applyMoreData 保持滚动位置
+                // Update KLineChart - use applyMoreData to maintain scroll position
                 if (chartRef.value && typeof chartRef.value.applyMoreData === 'function') {
                   // 追加新K线，使用 applyMoreData 保持滚动位置
                   chartRef.value.applyMoreData(uniqueNewData)
-                  // 新K线出现时强制刷新一次指标
+                  // Force single indicator refresh when new Kline appears
                   maybeUpdateIndicators(true)
                 } else if (chartRef.value) {
                   // 降级方案：使用 applyNewData（会重置滚动位置）
@@ -1901,37 +1901,37 @@ registerOverlay({
           }
         }
       } catch (err) {
-        // 增量更新失败时静默处理，不影响现有数据
+        // Silently handle incremental update failure, no effect on existing data
       }
     }
 
-    // 启动实时更新
+    // Start real-time update
     const startRealtime = () => {
-      // 先清除现有定时器
+      // Clear existing timer first
       if (realtimeTimer.value) {
         clearInterval(realtimeTimer.value)
       }
 
-      // 根据时间周期智能调整更新频率
+      // Intelligently adjust update frequency based on timeframe
       const intervalMap = {
-        '1m': 5000, // 1分钟K线，每5秒更新
-        '5m': 10000, // 5分钟K线，每10秒更新
-        '15m': 15000, // 15分钟K线，每15秒更新
-        '30m': 30000, // 30分钟K线，每30秒更新
-        '1H': 60000, // 1小时K线，每60秒更新
-        '4H': 300000, // 4小时K线，每5分钟更新
-        '1D': 600000, // 日线，每10分钟更新
-        '1W': 1800000 // 周线，每30分钟更新
+        '1m': 5000,  // 1m K-line, 5s interval
+        '5m': 10000, // 5m K-line, 10s interval
+        '15m': 15000, // 15m K-line, 15s interval
+        '30m': 30000, // 30m K-line, 30s interval
+        '1H': 60000,  // 1H K-line, 60s interval
+        '4H': 300000, // 4H K-line, 5m interval
+        '1D': 600000, // Daily, 10m interval
+        '1W': 1800000 // Weekly, 30m interval
       }
-      // UI体验优先：允许高频刷新以便观察“价格/K线/指标”同步效果。
-      // 这里将刷新间隔上限限制为 1 秒；若指标计算较慢，updateIndicators 内部会用锁避免重入。
+      // UI Experience Priority: allow high-frequency refresh for observing "Price/Kline/Indicator" synchronization.
+      // Limit maximum refresh interval to 1s; if calculation is slow, updateIndicators uses a lock internally to prevent re-entry.
       const base = intervalMap[props.timeframe] || 10000
       realtimeInterval.value = Math.min(base, 1000)
 
-      // 如果启用了实时更新且有选中的标的
+      // If real-time update enabled and symbol selected
       if (props.realtimeEnabled && props.symbol && klineData.value.length > 0) {
         realtimeTimer.value = setInterval(() => {
-          // 只在不在加载中且有现有数据时进行增量更新
+          // Incrementally update Kline only when not loading and data exists
           if (!loading.value && props.symbol && klineData.value && klineData.value.length > 0) {
             updateKlineRealtime() // 增量更新K线
           }
@@ -1939,7 +1939,7 @@ registerOverlay({
       }
     }
 
-    // 停止实时更新
+    // Stop real-time update
     const stopRealtime = () => {
       if (realtimeTimer.value) {
         clearInterval(realtimeTimer.value)
@@ -1947,7 +1947,7 @@ registerOverlay({
       }
     }
 
-    // --- 图表初始化函数 ---
+    // --- Chart initialization function ---
     const initChart = () => {
       const container = document.getElementById('kline-chart-container')
       if (!container) return
@@ -1970,7 +1970,7 @@ registerOverlay({
         return
       }
 
-      // 如果图表已存在，先销毁
+      // If chart already exists, destroy it first
       if (chartRef.value) {
         try {
           chartRef.value.destroy()
@@ -1979,27 +1979,27 @@ registerOverlay({
       }
 
       try {
-        // 初始化 KLineChart
+        // Initialize KLineChart
         const container = document.getElementById('kline-chart-container')
         if (!container) {
           throw new Error('容器元素不存在')
         }
 
-        // 尝试使用配置选项初始化，看是否支持内置画线工具栏
+        // Try initializing with options to check for built-in drawing toolbar support
         try {
           // 尝试使用第二个参数传入配置选项
           chartRef.value = init(container, {
-            drawingBarVisible: true, // 尝试启用内置画线工具栏
+            drawingBarVisible: true, // Try enabling built-in drawing toolbar
             overlay: {
               visible: true
             }
           })
         } catch (e) {
-          // 如果不支持配置选项，使用默认初始化
+          // If options not supported, use default initialization
           chartRef.value = init(container)
         }
 
-        // 如果配置选项方式不支持，尝试调用方法启用画线工具栏
+        // If options approach not supported, try calling method to enable drawing toolbar
         if (chartRef.value && typeof chartRef.value.setDrawingBarVisible === 'function') {
           chartRef.value.setDrawingBarVisible(true)
         } else if (chartRef.value && typeof chartRef.value.setDrawingBar === 'function') {
@@ -2012,9 +2012,9 @@ registerOverlay({
           throw new Error('图表初始化失败：无法创建图表实例')
         }
 
-        // 调试：输出图表实例的所有方法，检查是否有画线工具栏相关的方法
+        // Debug: output all chart instance methods, check for drawing toolbar related ones
         if (chartRef.value) {
-          // 检查是否有内置画线工具栏的方法
+          // Check for built-in drawing toolbar methods
           if (typeof chartRef.value.setDrawingBarVisible === 'function') {
             chartRef.value.setDrawingBarVisible(true)
           }
@@ -2029,11 +2029,11 @@ registerOverlay({
         // 设置主题样式
         updateChartTheme()
 
-        // 监听覆盖物创建完成事件，自动退出绘制模式
+        // Listen for overlay creation completion, automatically exit drawing mode
         if (chartRef.value && typeof chartRef.value.subscribeAction === 'function') {
           // 监听覆盖物创建完成事件
           chartRef.value.subscribeAction('onOverlayCreated', (overlay) => {
-            // 如果是通过画线工具创建的覆盖物，记录ID并退出绘制模式
+            // If overlay created via drawing tool, record ID and exit drawing mode
             if (activeDrawingTool.value && overlay && overlay.id) {
               addedDrawingOverlayIds.value.push(overlay.id)
               // 重置激活状态
@@ -2048,14 +2048,14 @@ registerOverlay({
             }
           })
 
-          // 监听覆盖物绘制完成事件（某些版本可能使用此事件）
+          // Listen for overlay drawing completion (some versions might use this event)
           if (typeof chartRef.value.subscribeAction === 'function') {
             try {
               chartRef.value.subscribeAction('onOverlayComplete', (overlay) => {
                 if (activeDrawingTool.value && overlay && overlay.id) {
                   addedDrawingOverlayIds.value.push(overlay.id)
                   activeDrawingTool.value = null
-                  // 退出绘制模式 - 不调用 overrideOverlay(null)，因为会导致错误
+                  // Exit drawing mode - don't call overrideOverlay(null) as it causes errors
                 }
               })
             } catch (e) {
@@ -2063,7 +2063,7 @@ registerOverlay({
             }
           }
 
-          // 监听覆盖物移除事件
+          // Listen for overlay removal event
           chartRef.value.subscribeAction('onOverlayRemoved', (overlayId) => {
             // 从列表中移除
             const index = addedDrawingOverlayIds.value.indexOf(overlayId)
@@ -2073,36 +2073,36 @@ registerOverlay({
           })
         }
 
-        // 使用 subscribeAction 监听可见范围变化，手动触发加载更多
-        // 替代 setLoadMoreDataCallback，因为它在某些版本可能不触发
+        // Use subscribeAction to listen for visible range changes, manually trigger load-more
+        // Replaces setLoadMoreDataCallback, which might not trigger in some versions
         if (chartRef.value && typeof chartRef.value.subscribeAction === 'function') {
-          // 保存上一次的可见范围，用于检测是否滚动到最左侧
+          // Save last visible range to detect scrolling to the far left
           let lastVisibleFrom = null
-          // 标记是否已经处理过初始化时的可见范围变化
+          // Mark if initialization visible range change handled
           let initialRangeProcessed = false
 
           chartRef.value.subscribeAction('onVisibleRangeChange', async (data) => {
             if (data && typeof data.from === 'number') {
-              // 如果是初始化时的第一次可见范围变化，只记录，不触发加载
+              // If first visible range change at initialization, record only, don't trigger load
               if (!initialRangeProcessed) {
                 lastVisibleFrom = data.from
                 initialRangeProcessed = true
-                // 延迟标记图表初始化完成，确保初始化完成后再允许触发加载
+                // Delayed marking of chart initialization as complete, to allow loads thereafter
                 setTimeout(() => {
                   chartInitialized.value = true
                 }, 1000)
                 return
               }
 
-              // 如果图表还未初始化完成，不触发加载
+              // If chart not yet initialized, don't trigger load
               if (!chartInitialized.value) {
                 lastVisibleFrom = data.from
                 return
               }
 
-              // 如果正在加载历史数据，且用户尝试继续向左滚动，阻止滚动
+              // If loading history and user tries to scroll left further, block scroll
               if (loadingHistory.value && data.from <= 0) {
-                // 尝试将可见范围保持在第一个数据点之后，防止继续向左
+                // Try to keep visible range after the first data point to prevent further left scroll
                 try {
                   if (chartRef.value && typeof chartRef.value.setVisibleRange === 'function') {
                     const dataLength = klineData.value.length
@@ -2110,10 +2110,10 @@ registerOverlay({
                       // 获取当前可见范围
                       const currentRange = chartRef.value.getVisibleRange()
                       if (currentRange) {
-                        // 计算可见的数据条数
+                        // Calculate number of visible data points
                         const visibleCount = Math.ceil((currentRange.to - currentRange.from) * dataLength / 100)
-                        // 设置新的可见范围，从第一个数据点开始（索引0对应0%，但我们要稍微向右一点）
-                        // 使用百分比：第一个数据点大约是 0%，我们设置为 0.1% 来防止继续向左
+                        // Set new visible range from the first data point (index 0 is 0%, but we go slightly right)
+                        // Use percentage: first point is approx 0%, set to 0.1% to prevent further left scroll
                         const minFrom = 0.1
                         const newTo = Math.min(100, minFrom + (visibleCount / dataLength * 100))
                         chartRef.value.setVisibleRange(minFrom, newTo)
@@ -2125,9 +2125,9 @@ registerOverlay({
                 return
               }
 
-              // 当滚动到最左侧（索引接近0或小于等于5）时触发加载
-              // 只有在用户主动向左滚动时才触发（lastVisibleFrom > data.from 表示向左滚动）
-              // 【关键】同时检查 loadingHistory.value 和 loadingHistoryPromise，确保没有正在进行的请求
+              // Trigger load when scrolled to far left (index close to 0 or <= 5)
+              // Only trigger on active left scroll (lastVisibleFrom > data.from)
+              // [Critical] Check both loadingHistory and loadingHistoryPromise to ensure no ongoing requests
               if (data.from <= 5 && !loadingHistory.value && !loadingHistoryPromise && hasMoreHistory.value && chartInitialized.value) {
                 // 检查是否是用户主动向左滚动（避免初始化时触发）
                 if (lastVisibleFrom !== null && lastVisibleFrom > data.from) {
@@ -2144,9 +2144,9 @@ registerOverlay({
           })
         }
 
-        // 如果有数据，应用数据
+        // If data exists, apply it
         if (klineData.value && klineData.value.length > 0) {
-          // 确保数据格式正确
+          // Ensure data format is correct
           const validData = klineData.value.filter(item =>
             item.timestamp &&
             !isNaN(item.open) &&
@@ -2156,7 +2156,7 @@ registerOverlay({
           )
 
           if (validData.length > 0) {
-            // 使用 applyNewData 初始化
+            // Use applyNewData for initialization
             try {
               chartRef.value.applyNewData(validData)
             } catch (e) {
@@ -2167,13 +2167,13 @@ registerOverlay({
               }
             }
 
-            // 创建成交量指标（默认显示）
+            // Create volume indicator (show by default)
             try {
               chartRef.value.createIndicator('VOL', false, { height: 100, dragEnabled: true })
             } catch (e) {
             }
 
-            // 延迟更新指标，确保K线先渲染
+            // Delayed indicator update to ensure Klines render first
             nextTick(() => {
               updateIndicators()
             })
@@ -2201,7 +2201,7 @@ registerOverlay({
       }
     }
 
-    // 更新图表主题
+    // Update chart theme
     const updateChartTheme = () => {
       if (!chartRef.value) return
 
@@ -2308,13 +2308,13 @@ registerOverlay({
       })
     }
 
-    // --- 注册自定义指标辅助函数 ---
+    // --- Register custom indicator helper functions ---
     const registerCustomIndicator = (name, calcFunc, figures, calcParams = [], precision = 2, shouldOverlay = false) => {
       try {
-        // KLineChart v9 使用 series: 'price' 来标识主图指标
+        // KLineChart v9 uses series: 'price' to identify main plot indicators
         const indicatorConfig = {
           name,
-          shortName: name, // 添加 shortName
+          shortName: name, // Add shortName
           calc: calcFunc,
           figures,
           calcParams,
@@ -2326,7 +2326,7 @@ registerOverlay({
         // console.log(`成功注册指标: ${name}, series: ${indicatorConfig.series}`)
         return true
       } catch (err) {
-        // 如果已注册，忽略错误
+        // If already registered, ignore error
         if (err.message && err.message.includes('already registered')) {
           return true
         }
@@ -2334,19 +2334,19 @@ registerOverlay({
       }
     }
 
-    // --- 更新指标（KLineChart 版本） ---
+    // --- Update indicators (KLineChart version) ---
     const updateIndicators = async () => {
       if (indicatorsUpdating.value) {
         return
       }
-      // 使用 JSON 序列化/反序列化去除 Vue 2 Observer 的干扰
+      // Use JSON serialization/deserialization to remove Vue 2 Observer interference
       if (!chartRef.value || klineData.value.length === 0) {
         return
       }
 
       indicatorsUpdating.value = true
       try {
-      // 1. 移除所有已添加的信号 overlays
+      // 1. Remove all added signal overlays
       try {
         if (addedSignalOverlayIds.value.length > 0 && chartRef.value) {
           addedSignalOverlayIds.value.forEach(overlayId => {
@@ -2365,11 +2365,11 @@ registerOverlay({
       } catch (e) {
       }
 
-      // 2. 移除所有已添加的指标
+      // 2. Remove all added indicators
       try {
         if (addedIndicatorIds.value.length > 0) {
           addedIndicatorIds.value.forEach(info => {
-            // info 可以是 { paneId, name } 对象或仅 name 字符串
+            // info can be { paneId, name } object or just name string
             const name = typeof info === 'string' ? info : info.name
             const paneId = typeof info === 'string' ? undefined : info.paneId
 
@@ -2378,9 +2378,9 @@ registerOverlay({
             if (paneId) {
               chartRef.value.removeIndicator(paneId, name)
             } else {
-              // 如果没有 paneId，尝试从主图移除
+              // If no paneId, try removing from main plot
               chartRef.value.removeIndicator('candle_pane', name)
-              // 也可以尝试不传 paneId
+              // Can also try without passing paneId
               chartRef.value.removeIndicator(name)
             }
           })
@@ -2390,24 +2390,24 @@ registerOverlay({
       } catch (e) {
       }
 
-      // 转换数据格式（KLineChart 需要内部格式用于计算）
+      // Convert data format (KLineChart needs internal format for calculations)
       const internalData = convertToInternalFormat(klineData.value)
 
-      // 遍历所有激活的指标
+      // Iterate through all active indicators
       for (let idx = 0; idx < props.activeIndicators.length; idx++) {
         const indicator = props.activeIndicators[idx]
         try {
-          // 处理 Python 指标
+          // Python indicators
           if (indicator.type === 'python') {
             if (!indicator.code) continue
 
             try {
-              // 如果有 calculate 函数，使用它（用于 Python 指标）
+              // If calculate function exists, use it (for Python indicators)
               if (indicator.calculate && typeof indicator.calculate === 'function') {
                 const result = await indicator.calculate(internalData, indicator.params || {})
 
-                // 处理结果中的 plots - 将所有 plots 合并到一个指标中
-                // 注意：signals 不添加到指标中，而是单独处理，避免显示 "n/a"
+                // Handle plots in result - merge all plots into one indicator
+                // Signals are not added to the indicator, but handled separately to avoid "n/a" display
                 let allPlots = []
                 if (result && result.plots && Array.isArray(result.plots)) {
                   allPlots = [...result.plots]
@@ -2461,7 +2461,7 @@ registerOverlay({
                           signalPoints.push({
                             timestamp,
                             price: signalValue,
-                            // 确定锚点价格：买入看 Low，卖出看 High
+                            // Determine anchor price: Low for buy, High for sell
                             anchorPrice: isBuySignal ? lowPrice : highPrice,
                             // side is used for layout/styling; action preserves the original type (buy/sell).
                             side: isBuySignal ? 'buy' : 'sell',
@@ -2608,10 +2608,10 @@ registerOverlay({
                   }
                 }
               } else {
-                // 如果没有 calculate 函数，直接使用 executePythonStrategy
-                // 构建解密所需的信息
+                // If no calculate function, use executePythonStrategy directly
+                // Construct information required for decryption
                 const decryptInfo = {
-                  id: indicator.originalId || indicator.id, // 优先使用原始数据库ID
+                  id: indicator.originalId || indicator.id, // Prefer original database ID
                   user_id: indicator.user_id || indicator.userId,
                   is_encrypted: indicator.is_encrypted || indicator.isEncrypted || 0
                 }
@@ -2619,11 +2619,11 @@ registerOverlay({
                   indicator.code,
                   internalData,
                   indicator.params || {},
-                  decryptInfo // 传递解密信息
+                  decryptInfo // Pass decryption info
                 )
 
-                // 处理 plots - 将所有 plots 合并到一个指标中
-                // 注意：signals 不添加到指标中，而是单独处理，避免显示 "n/a"
+                // Handle plots - merge all plots into one indicator
+                // Signals are not added to the indicator, but handled separately to avoid "n/a" display
                 let allPlots = []
                 if (pythonResult && pythonResult.plots && Array.isArray(pythonResult.plots)) {
                   allPlots = [...pythonResult.plots]
@@ -2824,7 +2824,7 @@ registerOverlay({
                 }
               }
             } catch (err) {
-              // 如果是 Python 引擎未就绪的错误，设置加载失败状态
+              // If Python engine not ready error, set load failure state
               if (err.message && err.message.includes('Python 引擎未就绪')) {
                 if (!loadingPython.value) {
                   pyodideLoadFailed.value = true
@@ -2834,12 +2834,12 @@ registerOverlay({
             continue
           }
 
-          // 注意：calculate 函数可能为 null，因为指标的计算逻辑在 updateIndicators 中通过 id 判断
-          // 所以这里不检查 calculate，而是直接根据 indicator.id 处理
+          // Note: calculate function might be null, as logic is determined by id in updateIndicators
+          // So we don't check calculate, but handle directly via indicator.id
 
           const color = getIndicatorColor(idx)
 
-          // 根据指标类型创建 KLineChart 指标
+          // Create KLineChart indicator based on indicator type
           if (indicator.id === 'sma' || indicator.id === 'ema') {
             const maType = indicator.id === 'sma' ? 'SMA' : 'EMA'
             const period = indicator.params?.length || indicator.params?.period || 20
@@ -2852,7 +2852,7 @@ registerOverlay({
                 customIndicatorName,
                 (kLineDataList, indicator) => {
                   const p = indicator.calcParams[0] || calcPeriod
-                  // calculateSMA/EMA 需要传入包含 close 属性的对象数组，而不是数字数组
+                  // calculateSMA/EMA needs an array of objects with close property, not a numeric array
                   const values = maType === 'SMA'
                     ? calculateSMA(kLineDataList, p)
                     : calculateEMA(kLineDataList, p)
@@ -2875,14 +2875,14 @@ registerOverlay({
                 if (paneId) {
                   addedIndicatorIds.value.push({ paneId, name: customIndicatorName })
                 } else {
-                  // 如果返回 null (主图指标可能返回 null)，也记录下来
+                  // If null returned (main plot indicator might return null), record it too
                   addedIndicatorIds.value.push({ paneId: 'candle_pane', name: customIndicatorName })
                 }
               }
             } catch (err) {
             }
           } else if (indicator.id === 'macd') {
-            // MACD 默认画在副图
+            // MACD drawn on sub-plot by default
             const indicatorId = chartRef.value.createIndicator('MACD', false, { height: 100, dragEnabled: true })
             if (indicatorId) {
               addedIndicatorIds.value.push({ paneId: indicatorId, name: 'MACD' })
@@ -2893,7 +2893,7 @@ registerOverlay({
                addedIndicatorIds.value.push({ paneId: indicatorId, name: 'RSI' })
              }
           } else if (indicator.id === 'bollinger_bands' || indicator.id === 'bb') {
-            // 布林带需要注册自定义指标
+            // Bollinger Bands requires custom indicator registration
             const length = indicator.params?.length || 20
             const mult = indicator.params?.mult || 2
             const customIndicatorName = `BOLL_${length}_${mult}`
@@ -2904,9 +2904,9 @@ registerOverlay({
                 (kLineDataList, indicator) => {
                   const length = indicator.calcParams[0] || 20
                   const mult = indicator.calcParams[1] || 2
-                  // calculateBollingerBands 需要传入包含 close 属性的对象数组
+                  // calculateBollingerBands needs an array of objects with close property
                   const bbResult = calculateBollingerBands(kLineDataList, length, mult)
-                  // KLineChart 需要返回对象数组，每个对象的键对应 figures 的 key
+                  // KLineChart requires an array of objects, with keys matching figures keys
                   const result = []
                   for (let i = 0; i < bbResult.length; i++) {
                     result.push({
@@ -2918,9 +2918,9 @@ registerOverlay({
                   return result
                 },
                 [
-                  { key: 'upper', title: `上轨(${length},${mult})`, type: 'line' },
-                  { key: 'middle', title: `中轨(${length})`, type: 'line' },
-                  { key: 'lower', title: `下轨(${length},${mult})`, type: 'line' }
+                  { key: 'upper', title: `Upper(${length},${mult})`, type: 'line' },
+                  { key: 'middle', title: `Middle(${length})`, type: 'line' },
+                  { key: 'lower', title: `Lower(${length},${mult})`, type: 'line' }
                 ],
                 [length, mult], // calcParams
                 2, // precision
@@ -2928,10 +2928,10 @@ registerOverlay({
               )
 
               if (registered) {
-                // 创建指标（主图指标）
+                // Create indicator (main plot indicator)
                 const paneId = chartRef.value.createIndicator(
                   customIndicatorName,
-                  false, // isStack: false 表示不堆叠
+                  false, // isStack: false denotes no stacking
                   { id: 'candle_pane' }
                 )
                 if (paneId) {
@@ -2943,7 +2943,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'atr') {
-            // ATR 需要注册自定义指标
+            // ATR requires custom indicator registration
             const period = indicator.params?.period || indicator.params?.length || 14
             const customIndicatorName = `ATR_${period}`
 
@@ -2979,7 +2979,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'williams' || indicator.id === 'williams_r') {
-            // Williams %R 需要注册自定义指标
+            // Williams %R requires custom indicator registration
             const length = indicator.params?.length || 14
             const customIndicatorName = `WPR_${length}`
 
@@ -3015,7 +3015,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'mfi') {
-            // MFI 需要注册自定义指标
+            // MFI requires custom indicator registration
             const length = indicator.params?.length || 14
             const customIndicatorName = `MFI_${length}`
 
@@ -3052,7 +3052,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'cci') {
-            // CCI 需要注册自定义指标
+            // CCI requires custom indicator registration
             const length = indicator.params?.length || 20
             const customIndicatorName = `CCI_${length}`
 
@@ -3088,7 +3088,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'adx') {
-            // ADX 需要注册自定义指标
+            // ADX requires custom indicator registration
             const length = indicator.params?.length || 14
             const customIndicatorName = `ADX_${length}`
 
@@ -3124,7 +3124,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'obv') {
-            // OBV 需要注册自定义指标
+            // OBV requires custom indicator registration
             const customIndicatorName = 'OBV'
 
             try {
@@ -3156,7 +3156,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'adosc') {
-            // ADOSC 需要注册自定义指标
+            // ADOSC requires custom indicator registration
             const fast = indicator.params?.fast || 3
             const slow = indicator.params?.slow || 10
             const customIndicatorName = `ADOSC_${fast}_${slow}`
@@ -3194,7 +3194,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'ad') {
-            // AD 需要注册自定义指标
+            // AD requires custom indicator registration
             const customIndicatorName = 'AD'
 
             try {
@@ -3228,7 +3228,7 @@ registerOverlay({
             } catch (err) {
             }
           } else if (indicator.id === 'kdj') {
-            // KDJ 需要注册自定义指标
+            // KDJ requires custom indicator registration
             const period = indicator.params?.period || 9
             const kPeriod = indicator.params?.k || 3
             const dPeriod = indicator.params?.d || 3
@@ -3270,7 +3270,7 @@ registerOverlay({
             } catch (err) {
             }
           } else {
-            // 尝试直接用 indicator.id 创建（假设是内置指标名）
+            // Try creating directly with indicator.id (assuming built-in indicator name)
             try {
               const indicatorName = indicator.id.toUpperCase()
               const indicatorId = chartRef.value.createIndicator(indicatorName, false, { height: 100, dragEnabled: true })
@@ -3280,7 +3280,7 @@ registerOverlay({
             } catch (err) {
             }
           }
-          // ... 其他指标 ...
+          // ... Other indicators ...
         } catch (e) {
         }
       }
@@ -3293,7 +3293,7 @@ registerOverlay({
       loadKlineData()
     }
 
-    // 生命周期
+    // Lifecycle
     watch(() => props.symbol, () => {
       if (props.symbol) {
         loadKlineData()
@@ -3323,7 +3323,7 @@ registerOverlay({
       if (props.symbol) {
         loadKlineData()
       }
-      // 时间周期变化时，重新启动实时更新（如果已启用）
+      // Restart real-time update on timeframe change (if enabled)
       if (props.realtimeEnabled) {
         stopRealtime()
         startRealtime()
@@ -3331,9 +3331,9 @@ registerOverlay({
     })
 
     watch(() => props.activeIndicators, (newVal, oldVal) => {
-      // 当指标列表变化时，重新渲染图表
+      // Rerender chart when indicator list changes
       if (chartRef.value && klineData.value.length > 0) {
-        // 使用 nextTick 确保 DOM 更新完成后再更新图表
+        // Use nextTick to ensure chart updates after DOM update completion
         nextTick(() => {
           if (chartRef.value) {
             updateIndicators()
@@ -3351,14 +3351,14 @@ registerOverlay({
     })
 
     onMounted(async () => {
-      // 优先使用 props.theme（从 Vuex store 获取），确保与系统主题同步
-      // 使用 nextTick 确保 props 已经正确传递
+      // Prioritize props.theme (from Vuex store) to ensure synchronization with system theme
+      // Use nextTick to ensure props are correctly passed
       await nextTick()
       if (props.theme && (props.theme === 'dark' || props.theme === 'light')) {
         chartTheme.value = props.theme
       }
 
-      // 加载 Pyodide
+      // Load Pyodide
       try {
         await loadPyodide()
       } catch (err) {
@@ -3423,7 +3423,7 @@ registerOverlay({
 </script>
 
 <style lang="less" scoped>
-/* 左侧图表容器 */
+/* Left chart container */
 .chart-left {
   width: 70% !important;
   flex: 0 0 70% !important;
@@ -3455,7 +3455,7 @@ registerOverlay({
   }
 }
 
-/* 画线工具工具栏 */
+/* Drawing Tools Toolbar */
 .drawing-toolbar {
   flex-shrink: 0;
   width: 40px;
@@ -3521,7 +3521,7 @@ registerOverlay({
   height: 20px;
 }
 
-/* 指标工具栏 */
+/* Indicator Toolbar */
 .indicator-toolbar {
   flex-shrink: 0;
   display: flex;
@@ -3546,12 +3546,12 @@ registerOverlay({
   height: 0;
 }
 
-/* 图表内容区域 */
+/* Chart content area */
 .chart-content-area {
   flex: 1;
   display: flex;
   flex-direction: column;
-  min-width: 0; /* 防止 flex 子元素溢出 */
+  min-width: 0; /* Prevent flex sub-element overflow */
   overflow: hidden;
 }
 
@@ -3735,7 +3735,7 @@ registerOverlay({
   color: #787b86;
 }
 
-/* 历史数据加载提示 */
+/* History data loading hint */
 .history-loading-hint {
   position: absolute;
   left: 20px;
@@ -3768,44 +3768,44 @@ registerOverlay({
   margin-left: 4px;
 }
 
-/* 移动端适配 */
+/* Mobile adaptation */
 @media (max-width: 768px) {
   .drawing-toolbar {
-    display: none; /* 移动端隐藏画线工具栏 */
+    display: none; /* Hide drawing toolbar on mobile */
   }
 
   .indicator-toolbar {
-    padding-left: 12px; /* 移动端恢复原始padding */
-    flex-wrap: nowrap; /* 手机端不换行，只显示一行 */
-    overflow-x: auto; /* 允许横向滚动 */
-    overflow-y: hidden; /* 禁止纵向滚动 */
-    scrollbar-width: none; /* Firefox 隐藏滚动条 */
-    -ms-overflow-style: none; /* IE 10+ 隐藏滚动条 */
-    -webkit-overflow-scrolling: touch; /* iOS 平滑滚动 */
+    padding-left: 12px; /* Restore original padding on mobile */
+    flex-wrap: nowrap; /* No wrapping on mobile, show only one row */
+    overflow-x: auto; /* Allow horizontal scrolling */
+    overflow-y: hidden; /* Prohibit vertical scrolling */
+    scrollbar-width: none; /* Firefox: hide scrollbar */
+    -ms-overflow-style: none; /* IE 10+: hide scrollbar */
+    -webkit-overflow-scrolling: touch; /* iOS smooth scrolling */
   }
 
   .indicator-toolbar::-webkit-scrollbar {
-    display: none; /* Chrome Safari 隐藏滚动条 */
+    display: none; /* Chrome Safari: hide scrollbar */
     width: 0;
     height: 0;
   }
 
   .indicator-btn {
-    flex-shrink: 0; /* 按钮不收缩，保持原始大小 */
+    flex-shrink: 0; /* Button doesn't shrink, maintains original size */
   }
 }
 
 @media (max-width: 1200px) {
   .drawing-toolbar {
-    display: none; /* 移动端隐藏画线工具栏 */
+    display: none; /* Hide drawing toolbar on mobile */
   }
 
   .indicator-toolbar {
-    padding-left: 12px; /* 移动端恢复原始padding */
+    padding-left: 12px; /* Restore original padding on mobile */
   }
 
   .kline-chart-container {
-    margin-left: 0; /* 移动端恢复原始margin */
+    margin-left: 0; /* Restore original margin on mobile */
   }
 
   .chart-left {
@@ -3859,7 +3859,7 @@ registerOverlay({
   }
 
   .kline-chart-container {
-    height: calc(100% - 45px) !important; /* 减去工具栏高度 */
+    height: calc(100% - 45px) !important; /* Subtract toolbar height */
     min-height: 350px !important;
     max-height: calc(100% - 45px) !important;
   }
@@ -3879,7 +3879,7 @@ registerOverlay({
   }
 
   .kline-chart-container {
-    height: calc(100% - 45px) !important; /* 减去工具栏高度 */
+    height: calc(100% - 45px) !important; /* Subtract toolbar height */
     min-height: 300px !important;
     max-height: calc(100% - 45px) !important;
   }
diff --git a/frontend_vue/src/views/indicator-analysis/index.vue b/frontend_vue/src/views/indicator-analysis/index.vue
index b364923..ed4e173 100644
--- a/frontend_vue/src/views/indicator-analysis/index.vue
+++ b/frontend_vue/src/views/indicator-analysis/index.vue
@@ -83,7 +83,7 @@
 
     <div class="chart-content">
       <div class="chart-main-row">
-        <!-- 手机端：币种和价格信息显示在K线图上方 -->
+        <!-- Mobile: Symbol and price info displayed above K-line chart -->
         <div class="mobile-symbol-price" v-if="currentSymbol">
           <div class="mobile-symbol-info">
             <span class="mobile-market-tag">{{ currentMarket }}</span><span>-</span>
@@ -115,7 +115,7 @@
             <div class="panel-header">
               <span>{{ $t('dashboard.indicator.panel.title') }}</span>
               <div style="display: flex; align-items: center; margin-left: auto; gap: 8px;">
-                <!-- 手机端：创建指标按钮 -->
+                <!-- Mobile: Create indicator button -->
                 <a-button
                   v-if="isMobile"
                   type="primary"
@@ -126,7 +126,7 @@
                 >
                   {{ $t('dashboard.indicator.create') }}
                 </a-button>
-                <!-- 实时更新开关 -->
+                <!-- Real-time update switch -->
                 <a-tooltip :title="realtimeEnabled ? $t('dashboard.indicator.panel.realtimeOn') : $t('dashboard.indicator.panel.realtimeOff')">
                   <a-button
                     type="text"
@@ -141,9 +141,9 @@
             </div>
 
             <div class="panel-body">
-              <!-- PC端：两个区域各占一半 -->
+              <!-- PC: Two sections each taking half -->
               <template v-if="!isMobile">
-                <!-- 我创建的指标 -->
+                <!-- My Created Indicators -->
                 <div class="indicator-section" :class="{ 'section-empty': customIndicators.length === 0 }">
                   <div class="section-label">
                     <div class="section-label-left" @click="toggleCustomSection">
@@ -239,7 +239,7 @@
                   </div>
                 </div>
 
-                <!-- 我购买的指标 -->
+                <!-- My Purchased Indicators -->
                 <div class="indicator-section" :class="{ 'section-empty': purchasedIndicators.length === 0 }">
                   <div class="section-label">
                     <div class="section-label-left" @click="purchasedSectionCollapsed = !purchasedSectionCollapsed">
@@ -270,7 +270,7 @@
                             {{ indicator.name }}
                           </span>
                           <div class="card-actions">
-                            <!-- 购买的指标：只能启动/停止和回测，不能编辑删除 -->
+                            <!-- Purchased indicators: can only start/stop and backtest, cannot edit/delete -->
                             <a-tooltip :title="isIndicatorActive('purchased-' + indicator.id) ? $t('dashboard.indicator.action.stop') : $t('dashboard.indicator.action.start')">
                               <a-icon
                                 :type="isIndicatorActive('purchased-' + indicator.id) ? 'pause-circle' : 'play-circle'"
@@ -307,7 +307,7 @@
 
               </template>
 
-              <!-- 手机端：显示指标列表 -->
+              <!-- Mobile: Show indicator list -->
               <template v-else>
                 <div class="mobile-tab-content">
                   <div class="section-content custom-scrollbar">
@@ -458,7 +458,7 @@
         </div>
       </div>
 
-      <!-- 指标编辑器弹窗 -->
+      <!-- Indicator editor modal -->
       <indicator-editor
         ref="indicatorEditor"
         :visible="showIndicatorEditor"
@@ -469,7 +469,7 @@
         @cancel="showIndicatorEditor = false; editingIndicator = null"
       />
 
-      <!-- 回测弹窗 -->
+      <!-- Backtest modal -->
       <backtest-modal
         :visible="showBacktestModal"
         :userId="userId"
@@ -480,7 +480,7 @@
         @cancel="showBacktestModal = false; backtestIndicator = null"
       />
 
-      <!-- 指标参数配置弹窗 -->
+      <!-- Indicator parameter configuration modal -->
       <a-modal
         :visible="showParamsModal"
         :title="$t('dashboard.indicator.paramsConfig.title')"
@@ -505,26 +505,26 @@
                   <a-icon type="question-circle" style="color: #999; margin-left: 4px;" />
                 </a-tooltip>
               </div>
-              <!-- 整数类型 -->
+              <!-- Integer type -->
               <a-input-number
                 v-if="param.type === 'int'"
                 v-model="indicatorParamValues[param.name]"
                 :precision="0"
                 style="width: 100%;"
               />
-              <!-- 浮点数类型 -->
+              <!-- Float type -->
               <a-input-number
                 v-else-if="param.type === 'float'"
                 v-model="indicatorParamValues[param.name]"
                 :precision="4"
                 style="width: 100%;"
               />
-              <!-- 布尔类型 -->
+              <!-- Boolean type -->
               <a-switch
                 v-else-if="param.type === 'bool'"
                 v-model="indicatorParamValues[param.name]"
               />
-              <!-- 字符串类型 -->
+              <!-- String type -->
               <a-input
                 v-else
                 v-model="indicatorParamValues[param.name]"
@@ -535,7 +535,7 @@
         </div>
       </a-modal>
 
-      <!-- 回测记录抽屉 -->
+      <!-- Backtest history drawer -->
       <backtest-history-drawer
         :visible="showBacktestHistoryDrawer"
         :userId="userId"
@@ -548,7 +548,7 @@
         @view="handleViewBacktestRun"
       />
 
-      <!-- 回测记录详情 -->
+      <!-- Backtest run details -->
       <backtest-run-viewer
         :visible="showBacktestRunViewer"
         :run="selectedBacktestRun"
@@ -566,7 +566,7 @@
         @update:symbol="qtSymbol = $event"
       />
 
-      <!-- 发布到社区弹窗 -->
+      <!-- Publish to community modal -->
       <a-modal
         :title="publishIndicator && publishIndicator.publish_to_community ? $t('dashboard.indicator.publish.editTitle') : $t('dashboard.indicator.publish.title')"
         :visible="showPublishModal"
@@ -627,7 +627,7 @@
         </a-form-model>
       </a-modal>
 
-      <!-- 添加股票弹窗 -->
+      <!-- Add stock modal -->
       <a-modal
         :title="$t('dashboard.analysis.modal.addStock.title')"
         :visible="showAddStockModal"
@@ -639,7 +639,7 @@
         :cancelText="$t('dashboard.analysis.modal.addStock.cancel')"
       >
         <div class="add-stock-modal-content">
-          <!-- Tab标签 -->
+          <!-- Tabs -->
           <a-tabs v-model="selectedMarketTab" @change="handleMarketTabChange" class="market-tabs">
             <a-tab-pane
               v-for="marketType in marketTypes"
@@ -649,7 +649,7 @@
             </a-tab-pane>
           </a-tabs>
 
-          <!-- 搜索/输入框（整合搜索和手动输入） -->
+          <!-- Search/Input box (integrated search and manual input) -->
           <div class="symbol-search-section">
             <a-input-search
               v-model="symbolSearchKeyword"
@@ -666,7 +666,7 @@
             </a-input-search>
           </div>
 
-          <!-- 搜索结果 -->
+          <!-- Search results -->
           <div v-if="symbolSearchResults.length > 0" class="search-results-section">
             <div class="section-title">
               <a-icon type="search" style="margin-right: 4px;" />
@@ -694,7 +694,7 @@
             </a-list>
           </div>
 
-          <!-- 热门标的 -->
+          <!-- Hot symbols -->
           <div class="hot-symbols-section">
             <div class="section-title">
               <a-icon type="fire" style="color: #ff4d4f; margin-right: 4px;" />
@@ -725,7 +725,7 @@
             </a-spin>
           </div>
 
-          <!-- 选中的标的显示 -->
+          <!-- Selected symbol display -->
           <div v-if="selectedSymbolForAdd" class="selected-symbol-section">
             <a-alert
               :message="$t('dashboard.analysis.modal.addStock.selectedSymbol')"
@@ -780,9 +780,9 @@ export default {
     ...mapState({
       navTheme: state => state.app.theme
     }),
-    // 图表主题 - 从 store 获取
+    // Chart theme - get from store
     chartTheme () {
-      // 将 'dark' 或 'realdark' 都映射为 'dark'，其他为 'light'
+      // Map 'dark' or 'realdark' to 'dark', others to 'light'
       return (this.navTheme === 'dark' || this.navTheme === 'realdark') ? 'dark' : 'light'
     },
     // 判断是否为暗黑主题（用于添加类名）
@@ -799,27 +799,27 @@ export default {
     const userId = ref(1)
     const loadingUserInfo = ref(false)
 
-    // 搜索相关
+    // Search related
     const searchSymbol = ref(undefined)
     const symbolSuggestions = ref([])
-    const watchlist = ref([]) // 自选股列表
+    const watchlist = ref([]) // Watchlist
     const loadingWatchlist = ref(false)
-    const symbolSearchValue = ref('') // 搜索输入值
-    const symbolSearchOpen = ref(false) // 下拉框是否打开
+    const symbolSearchValue = ref('') // Search input value
+    const symbolSearchOpen = ref(false) // Whether dropdown is open
 
     // 添加股票弹窗相关
     const showAddStockModal = ref(false)
     const addingStock = ref(false)
-    const selectedMarketTab = ref('') // 当前选中的市场类型tab
-    const symbolSearchKeyword = ref('') // 搜索关键词
-    const symbolSearchResults = ref([]) // 搜索结果
-    const searchingSymbols = ref(false) // 是否正在搜索
-    const hotSymbols = ref([]) // 热门标的列表
-    const loadingHotSymbols = ref(false) // 是否正在加载热门标的
-    const selectedSymbolForAdd = ref(null) // 选中的标的（用于添加）
-    const searchTimer = ref(null) // 搜索防抖定时器
-    const marketTypes = ref([]) // 股票类型列表
-    const hasSearched = ref(false) // 是否已经搜索过（用于显示无结果提示）
+    const selectedMarketTab = ref('') // Currently selected market type tab
+    const symbolSearchKeyword = ref('') // Search keyword
+    const symbolSearchResults = ref([]) // Search results
+    const searchingSymbols = ref(false) // Whether searching
+    const hotSymbols = ref([]) // Hot symbols list
+    const loadingHotSymbols = ref(false) // Whether loading hot symbols
+    const selectedSymbolForAdd = ref(null) // Selected symbol (for addition)
+    const searchTimer = ref(null) // Search debounce timer
+    const marketTypes = ref([]) // Symbol types list
+    const hasSearched = ref(false) // Whether searched (for no results hint)
 
     const currentSymbol = ref('')
     const currentMarket = ref('')
@@ -844,74 +844,68 @@ export default {
     const activeIndicators = ref([])
     const isMobile = ref(false)
 
-    // SMA和EMA的均线组合定义（已废弃，保留用于兼容性检查）
+    // SMA and EMA moving average group definition (deprecated, kept for compatibility)
     const smaGroup = [
-      { id: 'sma5', name: 'SMA5 (5日均线)', shortName: 'SMA5', type: 'line', defaultParams: { length: 5 } },
-      { id: 'sma10', name: 'SMA10 (10日均线)', shortName: 'SMA10', type: 'line', defaultParams: { length: 10 } },
-      { id: 'sma20', name: 'SMA20 (20日均线)', shortName: 'SMA20', type: 'line', defaultParams: { length: 20 } },
-      { id: 'sma30', name: 'SMA30 (30日均线)', shortName: 'SMA30', type: 'line', defaultParams: { length: 30 } }
+      { id: 'sma5', name: 'SMA5 (5-day MA)', shortName: 'SMA5', type: 'line', defaultParams: { length: 5 } },
+      { id: 'sma10', name: 'SMA10 (10-day MA)', shortName: 'SMA10', type: 'line', defaultParams: { length: 10 } },
+      { id: 'sma20', name: 'SMA20 (20-day MA)', shortName: 'SMA20', type: 'line', defaultParams: { length: 20 } },
+      { id: 'sma30', name: 'SMA30 (30-day MA)', shortName: 'SMA30', type: 'line', defaultParams: { length: 30 } }
     ]
 
     const emaGroup = [
-      { id: 'ema5', name: 'EMA5 (5日指数均线)', shortName: 'EMA5', type: 'line', defaultParams: { length: 5 } },
-      { id: 'ema10', name: 'EMA10 (10日指数均线)', shortName: 'EMA10', type: 'line', defaultParams: { length: 10 } },
-      { id: 'ema20', name: 'EMA20 (20日指数均线)', shortName: 'EMA20', type: 'line', defaultParams: { length: 20 } },
-      { id: 'ema30', name: 'EMA30 (30日指数均线)', shortName: 'EMA30', type: 'line', defaultParams: { length: 30 } }
+      { id: 'ema5', name: 'EMA5 (5-day EMA)', shortName: 'EMA5', type: 'line', defaultParams: { length: 5 } },
+      { id: 'ema10', name: 'EMA10 (10-day EMA)', shortName: 'EMA10', type: 'line', defaultParams: { length: 10 } },
+      { id: 'ema20', name: 'EMA20 (20-day EMA)', shortName: 'EMA20', type: 'line', defaultParams: { length: 20 } },
+      { id: 'ema30', name: 'EMA30 (30-day EMA)', shortName: 'EMA30', type: 'line', defaultParams: { length: 30 } }
     ]
 
-    // 从数据库获取的指标
-    const customIndicators = ref([]) // 我创建的指标（is_buy=0）
-    const purchasedIndicators = ref([]) // 我购买的指标（is_buy=1）
-    const loadingIndicators = ref(false)
-
-    // 指标参数配置弹窗
-    const showParamsModal = ref(false)
-    const pendingIndicator = ref(null) // 待运行的指标
-    const pendingSource = ref('') // 待运行指标的来源 (custom/purchased)
-    const indicatorParams = ref([]) // 指标参数声明
-    const indicatorParamValues = ref({}) // 用户设置的参数值
+    // Indicator parameter configuration modal
+    const pendingIndicator = ref(null) // Indicator pending to run
+    const pendingSource = ref('') // Source of pending indicator (custom/purchased)
+    const indicatorParams = ref([]) // Indicator parameter declaration
+    const indicatorParamValues = ref({}) // Parameter values set by user
     const loadingParams = ref(false)
-    // 保存每个指标的参数值（key: indicatorId, value: { paramName: paramValue }）
+    // Save parameter values for each indicator (key: indicatorId, value: { paramName: paramValue })
     const savedIndicatorParams = ref({})
 
-    // 折叠状态
-    const customSectionCollapsed = ref(false) // 我创建的指标区域是否折叠
-    const purchasedSectionCollapsed = ref(false) // 我购买的指标区域是否折叠
+    // Collapse states
+    const customSectionCollapsed = ref(false) // Whether my created indicators section is collapsed
+    const purchasedSectionCollapsed = ref(false) // Whether my purchased indicators section is collapsed
 
-    // 指标编辑器相关
+    // Indicator editor related
     const showIndicatorEditor = ref(false)
     const editingIndicator = ref(null)
 
-    // 回测相关
+    // Backtest related
     const showBacktestModal = ref(false)
     const backtestIndicator = ref(null)
 
-    // 回测记录相关
+    // Backtest history related
     const showBacktestHistoryDrawer = ref(false)
     const backtestHistoryIndicator = ref(null)
     const showBacktestRunViewer = ref(false)
     const selectedBacktestRun = ref(null)
 
-    // 发布到社区相关
+    // Publish to community related
     const showPublishModal = ref(false)
     const publishIndicator = ref(null)
     const publishing = ref(false)
     const unpublishing = ref(false)
-    // 使用独立的 ref 变量，确保 v-model 正常工作
+    // Use independent ref variables to ensure v-model works correctly
     const publishPricingType = ref('free')
     const publishPrice = ref(10)
     const publishDescription = ref('')
     const publishVipFree = ref(false)
     const publishRules = {
       price: [
-        { required: true, message: '请输入价格', trigger: 'blur', type: 'number' }
+        { required: true, message: 'Please enter price', trigger: 'blur', type: 'number' }
       ]
     }
 
-    // 实时更新设置
-    const realtimeEnabled = ref(false) // 是否启用实时更新
+    // Real-time update settings
+    const realtimeEnabled = ref(false) // Whether real-time update is enabled
 
-    // 处理价格变化事件（从 KlineChart 组件接收）
+    // Handle price change event (receiving from KlineChart component)
     const handlePriceChange = ({ price, change }) => {
       currentPrice.value = price
       priceChange.value = change
@@ -925,20 +919,20 @@ export default {
       showQuickTrade.value = true
     }
 
-    // 处理图表重试事件
+    // Handle chart retry event
     const handleChartRetry = () => {
-      // KlineChart 组件会自己处理重试，这里可以添加额外的逻辑
+      // KlineChart component handles retry itself, additional logic can be added here
     }
 
-    // --- 指标定义（已废弃，保留用于兼容） ---
+    // --- Indicator definitions (deprecated, kept for compatibility) ---
     const trendIndicators = ref([])
     const oscillatorIndicators = ref([])
 
-    // --- 交互逻辑 ---
+    // --- Interaction logic ---
 
     const setTimeframe = (tf) => {
       timeframe.value = tf
-      // KlineChart 组件会通过 watch timeframe 自动加载数据
+      // KlineChart will automatically load data via watch timeframe
     }
 
     const formatParams = (params) => {
@@ -946,37 +940,37 @@ export default {
       return Object.values(params).join(', ')
     }
 
-    // 加载用户信息
+    // Load user info
     const loadUserInfo = async () => {
       loadingUserInfo.value = true
       try {
-        // 获取 store 实例
+        // Get store instance
         const instance = getCurrentInstance()
         const store = instance?.proxy?.$store
 
-        // 先从 store 获取
+        // Get from store first
         const storeUserInfo = store?.getters?.userInfo || {}
         if (storeUserInfo && storeUserInfo.email) {
           userId.value = storeUserInfo.id
           loadingUserInfo.value = false
-          // 加载数据
+          // Load data
           loadWatchlist()
-          // 加载指标列表
+          // Load indicator list
           loadIndicators()
           return
         }
 
-        // 如果 store 中没有，从 API 获取
+        // If not in store, get from API
         const res = await getUserInfo()
         if (res && res.code === 1 && res.data) {
           userId.value = res.data.id
-          // 更新 store
+          // Update store
           if (store) {
             store.commit('SET_INFO', res.data)
           }
-          // 加载数据
+          // Load data
           loadWatchlist()
-          // 加载指标列表
+          // Load indicator list
           loadIndicators()
         }
       } catch (error) {
@@ -985,7 +979,7 @@ export default {
       }
     }
 
-    // 加载自选股
+    // Load watchlist
     const loadWatchlist = async () => {
       if (!userId.value) return
       loadingWatchlist.value = true
@@ -997,10 +991,10 @@ export default {
             label: item.symbol + (item.name ? ` (${item.name})` : ''),
             value: `${item.market}:${item.symbol}`
           }))
-          // 更新 symbolSuggestions
+          // Update symbolSuggestions
           updateSymbolSuggestions()
 
-          // 如果有自选股，自动选择最新添加的那个（数组第一个，因为后端按 createtime desc 排序）
+          // If watchlist has items, select the latest one (first in array since backend sorts by createtime desc)
           if (watchlist.value.length > 0 && !currentSymbol.value) {
             const latestSymbol = watchlist.value[0]
             currentMarket.value = latestSymbol.market
@@ -1015,23 +1009,23 @@ export default {
       }
     }
 
-    // 更新搜索建议（基于自选股）
+    // Update symbol suggestions (based on watchlist)
     const updateSymbolSuggestions = () => {
       if (symbolSearchValue.value) {
-        // 如果有搜索输入，过滤自选股
+        // Filter watchlist if search input exists
         symbolSuggestions.value = watchlist.value.filter(item =>
           item.symbol.toLowerCase().includes(symbolSearchValue.value.toLowerCase()) ||
           (item.name && item.name.toLowerCase().includes(symbolSearchValue.value.toLowerCase()))
         )
       } else {
-        // 没有搜索输入时，显示所有自选股
+        // Show all watchlist items if no search input
         symbolSuggestions.value = watchlist.value
       }
     }
 
     const handleSymbolSearch = (value) => {
       symbolSearchValue.value = value
-      // 如果没有自选股且用户输入了内容，打开下拉框
+      // Open dropdown if watchlist empty and user entered content
       if (watchlist.value.length === 0 && value) {
         symbolSearchOpen.value = true
       }
@@ -1040,36 +1034,36 @@ export default {
 
     const handleDropdownVisibleChange = (open) => {
       symbolSearchOpen.value = open
-      // 如果关闭下拉框，清空搜索值
+      // Clear search value if dropdown closed
       if (!open) {
         symbolSearchValue.value = ''
       }
     }
 
     const handleSymbolSelect = (value) => {
-      // 如果是提示选项，不处理
+      // Ignore if hint option
       if (value === '__empty_watchlist_hint__') {
         return
       }
-      // 如果是添加股票选项
+      // If add stock option
       if (value === '__add_stock_option__') {
         showAddStockModal.value = true
-        // 重置选中项，避免显示内部值
+        // Reset selected item to avoid displaying internal value
         setTimeout(() => {
           searchSymbol.value = undefined
         }, 0)
         return
       }
 
-      // 从自选股列表中找到选中的项
+      // Find selected item from watchlist
       let selected = watchlist.value.find(s => s.value === value)
 
-      // 如果没找到，尝试从建议列表中找到
+      // Try finding from suggestions if not in watchlist
       if (!selected) {
         selected = symbolSuggestions.value.find(s => s.value === value)
       }
 
-      // 如果还是没找到，尝试解析格式 "market:symbol"
+      // Parse "market:symbol" if still not found
       if (!selected && value.includes(':')) {
         const [market, symbol] = value.split(':')
         selected = { market, symbol, value }
@@ -1078,22 +1072,22 @@ export default {
       if (selected) {
         currentMarket.value = selected.market
         currentSymbol.value = selected.symbol
-        searchSymbol.value = selected.value // 显示选中的值
-        // KlineChart 组件会通过 watch symbol 和 market 自动加载数据
+        searchSymbol.value = selected.value // Display selected value
+        // KlineChart component automatically loads data via watch symbol and market
       }
     }
 
-    // 过滤选项（用于搜索）
+    // Filter options (for search)
     const filterSymbolOption = (input, option) => {
       const value = option.componentOptions?.propsData?.value || ''
-      // 如果是提示选项或添加按钮，始终显示
+      // Always show hint option or add button
       if (value === '__empty_watchlist_hint__' || value === '__add_stock_option__') {
         return true
       }
       return value.toLowerCase().includes(input.toLowerCase())
     }
 
-    // 加载股票类型列表
+    // Load symbol type list
     const loadMarketTypes = async () => {
       try {
         const res = await getMarketTypes()
@@ -1117,7 +1111,7 @@ export default {
           ]
         }
 
-        // 初始化选中的市场类型tab
+        // Initialize selected market type tab
         if (marketTypes.value.length > 0 && !selectedMarketTab.value) {
           selectedMarketTab.value = marketTypes.value[0].value
         }
@@ -1132,7 +1126,7 @@ export default {
       }
     }
 
-    // 关闭添加股票弹窗
+    // Close add stock modal
     const handleCloseAddStockModal = () => {
       showAddStockModal.value = false
       selectedSymbolForAdd.value = null
@@ -1142,28 +1136,28 @@ export default {
       selectedMarketTab.value = marketTypes.value.length > 0 ? marketTypes.value[0].value : ''
     }
 
-    // 市场类型Tab切换
+    // Market type tab switch
     const handleMarketTabChange = (activeKey) => {
       selectedMarketTab.value = activeKey
       symbolSearchKeyword.value = ''
       symbolSearchResults.value = []
       selectedSymbolForAdd.value = null
       hasSearched.value = false
-      // 加载该市场类型的热门标的
+      // Load hot symbols for this market type
       loadHotSymbols(activeKey)
     }
 
-    // 搜索标的输入变化（防抖）
+    // Symbol search input change (debounce)
     const handleSymbolSearchInput = (e) => {
       const keyword = e.target.value
       symbolSearchKeyword.value = keyword
 
-      // 清除之前的定时器
+      // Clear previous timer
       if (searchTimer.value) {
         clearTimeout(searchTimer.value)
       }
 
-      // 如果关键词为空，清空搜索结果和状态
+      // Clear results if keyword empty
       if (!keyword || keyword.trim() === '') {
         symbolSearchResults.value = []
         hasSearched.value = false
@@ -1171,13 +1165,13 @@ export default {
         return
       }
 
-      // 防抖：500ms后执行搜索
+      // Debounce: execute search after 500ms
       searchTimer.value = setTimeout(() => {
         searchSymbolsInModal(keyword)
       }, 500)
     }
 
-    // 搜索或直接添加（整合逻辑）
+    // Search or direct add (integrated logic)
     const handleSearchOrInput = (keyword) => {
       if (!keyword || !keyword.trim()) {
         return
@@ -1188,21 +1182,21 @@ export default {
         return
       }
 
-      // 如果有搜索结果，不处理（让用户选择）
+      // Don't handle if search results exist (let user choose)
       if (symbolSearchResults.value.length > 0) {
         return
       }
 
-      // 如果没有搜索结果，直接添加
+      // Direct add if no search results
       if (hasSearched.value && symbolSearchResults.value.length === 0) {
         handleDirectAdd()
       } else {
-        // 执行搜索
+        // Execute search
         searchSymbolsInModal(keyword)
       }
     }
 
-    // 搜索标的（在添加股票弹窗中）
+    // Search symbols (in add stock modal)
     const searchSymbolsInModal = async (keyword) => {
       if (!keyword || keyword.trim() === '') {
         symbolSearchResults.value = []
@@ -1226,29 +1220,29 @@ export default {
         if (res && res.code === 1 && res.data && res.data.length > 0) {
           symbolSearchResults.value = res.data
         } else {
-          // 搜索无结果，不报错，允许直接添加
+          // Search no results, allow direct add
           symbolSearchResults.value = []
-          // 自动设置为手动输入模式
+          // Automatically set to manual input mode
           selectedSymbolForAdd.value = {
             market: selectedMarketTab.value,
             symbol: keyword.trim().toUpperCase(),
-            name: '' // 名称由后端通过API获取
+            name: '' // Name will be fetched by backend API
           }
         }
       } catch (error) {
-        // 搜索失败也不报错，允许直接添加
+        // Allow direct add even if search fails
         symbolSearchResults.value = []
         selectedSymbolForAdd.value = {
           market: selectedMarketTab.value,
           symbol: keyword.trim().toUpperCase(),
-          name: '' // 名称由后端通过API获取
+          name: '' // Name will be fetched by backend API
         }
       } finally {
         searchingSymbols.value = false
       }
     }
 
-    // 直接添加（搜索无结果时）
+    // Direct add (when no search results)
     const handleDirectAdd = () => {
       if (!symbolSearchKeyword.value || !symbolSearchKeyword.value.trim()) {
         message.warning(proxy.$t('dashboard.analysis.modal.addStock.pleaseEnterSymbol'))
@@ -1260,15 +1254,15 @@ export default {
         return
       }
 
-      // 设置选中的标的（手动输入，名称会在后端获取）
+      // Set selected symbol (manual input, name fetched by backend)
       selectedSymbolForAdd.value = {
         market: selectedMarketTab.value,
         symbol: symbolSearchKeyword.value.trim().toUpperCase(),
-        name: '' // 名称由后端通过API获取
+        name: '' // Name will be fetched by backend API
       }
     }
 
-    // 选择标的
+    // Select symbol
     const selectSymbol = (symbol) => {
       selectedSymbolForAdd.value = {
         market: symbol.market,
@@ -1277,7 +1271,7 @@ export default {
       }
     }
 
-    // 加载热门标的
+    // Load hot symbols
     const loadHotSymbols = async (market) => {
       if (!market) {
         market = selectedMarketTab.value || (marketTypes.value.length > 0 ? marketTypes.value[0].value : '')
@@ -1305,17 +1299,17 @@ export default {
       }
     }
 
-    // 添加自选股
+    // Add to watchlist
     const handleAddStock = async () => {
       let market = ''
       let symbol = ''
 
-      // 检查是否选中了标的（从数据库选择或手动输入）
+      // Check if symbol is selected (from database or manual)
       if (selectedSymbolForAdd.value) {
         market = selectedSymbolForAdd.value.market
         symbol = selectedSymbolForAdd.value.symbol.toUpperCase()
       } else if (symbolSearchKeyword.value && symbolSearchKeyword.value.trim()) {
-        // 如果没有选中，但搜索框有输入，使用搜索框的值
+        // Use search box value if nothing selected but input exists
         if (!selectedMarketTab.value) {
           message.warning(proxy.$t('dashboard.analysis.modal.addStock.pleaseSelectMarket'))
           return
@@ -1337,7 +1331,7 @@ export default {
         if (res && res.code === 1) {
           message.success(proxy.$t('dashboard.analysis.message.addStockSuccess'))
           handleCloseAddStockModal()
-          // 重新加载自选股
+          // Reload watchlist
           await loadWatchlist()
         } else {
           message.error(res?.msg || proxy.$t('dashboard.analysis.message.addStockFailed'))
@@ -1350,31 +1344,31 @@ export default {
       }
     }
 
-    // --- 数据加载和图表初始化函数已迁移到 KlineChart 组件 ---
+    // --- Data loading and chart initialization migrated to KlineChart component ---
 
     const addIndicator = (ind) => {
       if (isIndicatorActive(ind.id)) return
-      // 如果传入的指标已经有 params，使用传入的 params；否则使用 defaultParams
+      // Use provided params if exists, else use defaultParams
       const params = ind.params || ind.defaultParams || {}
       activeIndicators.value.push({
         ...ind,
-        id: ind.id, // 简单处理，如果允许多个同类指标需用 uniqueId
+        id: ind.id, // Simple handling, uniqueId needed for multiple indicators of same type
         params: { ...params }
       })
-      // KlineChart 组件会通过 watch activeIndicators 自动更新图表
+      // KlineChart automatically updates chart via watch activeIndicators
     }
 
     const removeIndicator = (id) => {
       // const beforeCount = activeIndicators.value.length
       activeIndicators.value = activeIndicators.value.filter(i => i.id !== id)
       // const afterCount = activeIndicators.value.length
-      // KlineChart 组件会通过 watch activeIndicators 自动更新图表
+      // KlineChart automatically updates chart via watch activeIndicators
     }
 
-    // 处理从 KlineChart 组件传来的指标切换事件
+    // Handle indicator toggle event from KlineChart
     const handleIndicatorToggle = ({ action, indicator }) => {
       if (action === 'add') {
-        // 需要为指标添加 calculate 函数
+        // Need to add calculate function to indicator
         const indicatorWithCalculate = {
           ...indicator,
           calculate: getIndicatorCalculateFunction(indicator.id)
@@ -1385,16 +1379,16 @@ export default {
       }
     }
 
-    // 根据指标 ID 获取对应的 calculate 函数
-    // 注意：计算函数已迁移到 KlineChart.vue，这里返回 null，让 KlineChart.vue 根据 id 处理
+    // Get calculate function by indicator ID
+    // Note: calculate function moved to KlineChart.vue, return null here
     const getIndicatorCalculateFunction = (indicatorId) => {
-      // KlineChart.vue 的 updateIndicators 函数会根据 indicator.id 直接处理
-      // 不再需要 Indicator.vue 中的计算函数
+      // KlineChart.vue updateIndicators handles it via indicator.id
+      // Calculate function in Indicator.vue no longer needed
       return null
     }
 
     const isIndicatorActive = (id) => {
-      // 特殊处理SMA和EMA组合
+      // Special handling for SMA and EMA groups
       if (id === 'sma') {
         return smaGroup.some(ind => activeIndicators.value.some(i => i.id === ind.id))
       }
@@ -1452,12 +1446,12 @@ export default {
       }
     }
 
-    // --- Python 相关函数已迁移到 KlineChart 组件 ---
+    // --- Python related functions migrated to KlineChart component ---
 
-    // KlineChart 组件引用
+    // KlineChart component reference
     const klineChart = ref(null)
 
-    // 添加Python代码指标
+    // Add Python code indicator
     const addPythonIndicator = async (indicator, source) => {
       const indicatorId = `${source}-${indicator.id}`
       if (isIndicatorActive(indicatorId)) {
@@ -1490,32 +1484,32 @@ export default {
           return
         }
 
-        // 用户传递的参数（来自参数配置弹窗）
+        // User parameters (from config modal)
         const userParams = indicator.userParams || {}
 
-        // 创建一个Python指标对象
-        // 保存代码到局部变量，避免闭包问题
+        // Create a Python indicator object
+        // Save code to local variable to avoid closure issues
         const savedCode = pythonCode
-        const savedUserParams = { ...userParams } // 保存用户参数
+        const savedUserParams = { ...userParams } // Save user parameters
         const pythonIndicator = {
-          id: indicatorId, // 格式化后的ID（如 bought-1）
+          id: indicatorId, // Formatted ID (e.g. purchased-1)
           name: indicator.name,
           type: 'python',
           code: savedCode,
           description: indicator.description,
-          parsed: parsed, // 保存解析结果
-          userParams: savedUserParams, // 保存用户参数
-          // 保存原始数据库ID和用户ID，用于解密
-          originalId: indicator.id, // 数据库中的真实ID
-          user_id: indicator.user_id || indicator.userId, // 用户ID
-          is_encrypted: indicator.is_encrypted || indicator.isEncrypted || 0, // 是否加密标记
+          parsed: parsed, // Save parse results
+          userParams: savedUserParams, // Save user parameters
+          // Save original DB ID and User ID for decryption
+          originalId: indicator.id, // Real ID in database
+          user_id: indicator.user_id || indicator.userId, // User ID
+          is_encrypted: indicator.is_encrypted || indicator.isEncrypted || 0, // Encryption flag
           calculate: (data, params) => {
-            // 通过 KlineChart 组件的 ref 访问 executePythonStrategy 函数
-            // 使用savedCode确保每个指标使用自己的代码（避免闭包问题）
-            // 传递完整的indicator信息用于解密
-            // 将用户参数直接合并到 params 中，让指标代码可以通过 params.get('name', default) 访问
+            // Access executePythonStrategy via KlineChart ref
+            // Use savedCode to ensure each indicator uses its own code
+            // Pass full indicator info for decryption
+            // Merge user parameters into params
             return klineChart.value.executePythonStrategy(savedCode, data, { ...params, ...savedUserParams }, {
-              id: indicator.id, // 使用原始数据库ID
+              id: indicator.id, // Use original database ID
               user_id: indicator.user_id || indicator.userId,
               is_encrypted: indicator.is_encrypted || indicator.isEncrypted || 0
             })
@@ -1533,35 +1527,35 @@ export default {
       }
     }
 
-    // 切换指标开关
+    // Toggle indicator switch
     const toggleIndicator = async (indicator, source) => {
       const indicatorId = `${source}-${indicator.id}`
       if (isIndicatorActive(indicatorId)) {
         removeIndicator(indicatorId)
       } else {
-        // 检查指标是否有参数声明
+        // Check if indicator has parameter declarations
         try {
           loadingParams.value = true
           const res = await proxy.$http.get('/api/indicator/getIndicatorParams', {
             params: { indicator_id: indicator.id }
           })
           if (res && res.code === 1 && Array.isArray(res.data) && res.data.length > 0) {
-            // 有参数，显示配置弹窗
+            // Has parameters, show config modal
             indicatorParams.value = res.data
-            // 获取指标的唯一标识（用于保存参数值）
+            // Get unique identifier for indicator (to save parameter values)
             const indicatorKey = `${source}-${indicator.id}`
-            // 先检查是否有保存的参数值
+            // Check for saved parameter values
             const savedParams = savedIndicatorParams.value[indicatorKey]
-            // 先清空，然后逐个设置，确保响应式正常工作
+            // Clear first, then set individually for reactivity
             const newParamValues = {}
             res.data.forEach(p => {
-              // 如果有保存的值，使用保存的值；否则使用默认值
-              // 需要处理类型转换
+              // Use saved value if exists, else use default
+              // Need to handle type conversion
               let value = savedParams && savedParams[p.name] !== undefined
                 ? savedParams[p.name]
                 : p.default
 
-              // 根据参数类型进行类型转换
+              // Type conversion based on parameter type
               if (p.type === 'int') {
                 value = parseInt(value) || 0
               } else if (p.type === 'float') {
@@ -1574,7 +1568,7 @@ export default {
 
               newParamValues[p.name] = value
             })
-            // 一次性设置所有值，确保响应式更新
+            // Set all values at once to ensure reactive update
             indicatorParamValues.value = newParamValues
             pendingIndicator.value = indicator
             pendingSource.value = source
@@ -1585,7 +1579,7 @@ export default {
           }
         } catch (err) {
           console.warn('Failed to load indicator params:', err)
-          // 出错时直接运行
+          // Run directly if error occurs
           addPythonIndicator(indicator, source)
         } finally {
           loadingParams.value = false
@@ -1593,10 +1587,10 @@ export default {
       }
     }
 
-    // 确认参数配置并运行指标
+    // Confirm parameter config and run indicator
     const confirmIndicatorParams = () => {
       if (pendingIndicator.value) {
-        // 保存参数值（用于下次打开时使用）
+        // Save parameter values (for next use)
         const indicatorKey = `${pendingSource.value}-${pendingIndicator.value.id}`
         savedIndicatorParams.value[indicatorKey] = { ...indicatorParamValues.value }
 
@@ -1612,34 +1606,34 @@ export default {
       pendingSource.value = ''
     }
 
-    // 取消参数配置
+    // Cancel parameter configuration
     const cancelIndicatorParams = () => {
-      // 保存参数值（在关闭前保存）
+      // Save parameter values before closing
       saveCurrentParams()
       showParamsModal.value = false
-      // 延迟清空，确保 afterClose 能访问到数据
+      // Delay clearing to ensure afterClose can access data
       setTimeout(() => {
         pendingIndicator.value = null
         pendingSource.value = ''
       }, 100)
     }
 
-    // 保存当前参数值
+    // Save current parameter values
     const saveCurrentParams = () => {
       if (pendingIndicator.value && pendingSource.value) {
         const indicatorKey = `${pendingSource.value}-${pendingIndicator.value.id}`
-        // 深拷贝参数值，确保保存的是当前值
+        // Deep copy parameter values to ensure current values are saved
         savedIndicatorParams.value[indicatorKey] = JSON.parse(JSON.stringify(indicatorParamValues.value))
       }
     }
 
-    // 弹窗关闭后的处理
+    // Handle after modal closed
     const handleParamsModalAfterClose = () => {
-      // 确保参数值已保存
+      // Ensure parameter values are saved
       saveCurrentParams()
     }
 
-    // 运行指标代码（从编辑器）
+    // Run indicator code (from editor)
     const handleRunIndicator = (data) => {
       const { code, name } = data
       if (!code || !code.trim()) {
@@ -1647,7 +1641,7 @@ export default {
         return
       }
 
-      // 创建一个临时指标对象用于运行
+      // Create a temporary indicator object for running
       try {
         // 检查图表组件是否已初始化
         if (!klineChart.value) {
@@ -1674,27 +1668,27 @@ export default {
         // 创建Python指标对象
         const pythonIndicator = {
           id: 'temp-editor-indicator',
-          name: name || '临时指标',
+          name: name || 'Temporary Indicator',
           type: 'python',
           code: code,
           description: '',
           parsed: parsed,
           calculate: (data, params) => {
-            // 通过 KlineChart 组件的 ref 访问 executePythonStrategy 函数
-            // 使用indicator.code确保每个指标使用自己的代码（避免闭包问题）
-            // 注意：这里使用indicatorCode，因为这是临时指标，需要从外部作用域获取code
+            // Access executePythonStrategy via KlineChart ref
+            // Use indicator.code to ensure each indicator uses its own code
+            // Note: use indicatorCode here as it is a temporary indicator
             const indicatorCode = code
             return klineChart.value.executePythonStrategy(indicatorCode, data, params)
           }
         }
 
-        // 如果已存在临时指标，先移除
+        // If temporary indicator already exists, remove it first
         const existingIndex = activeIndicators.value.findIndex(i => i.id === 'temp-editor-indicator')
         if (existingIndex >= 0) {
           activeIndicators.value.splice(existingIndex, 1)
         }
 
-        // 添加到活动指标列表
+        // Add to active indicators list
         activeIndicators.value.push({
           ...pythonIndicator,
           params: { ...parsed.params }
@@ -1703,28 +1697,28 @@ export default {
         // KlineChart 组件会通过 watch activeIndicators 自动更新图表
         message.success(proxy.$t('dashboard.indicator.success.runIndicator'))
       } catch (error) {
-        message.error(proxy.$t('dashboard.indicator.error.runIndicatorFailed') + ': ' + (error.message || '未知错误'))
+        message.error(proxy.$t('dashboard.indicator.error.runIndicatorFailed') + ': ' + (error.message || 'Unknown Error'))
       }
     }
 
-    // 创建指标
+    // Create indicator
     const handleCreateIndicator = () => {
       editingIndicator.value = null
       showIndicatorEditor.value = true
     }
 
-    // 编辑指标
+    // Edit indicator
     const handleEditIndicator = (indicator) => {
       editingIndicator.value = indicator
       showIndicatorEditor.value = true
     }
 
-    // 切换我创建的指标区域折叠状态
+    // Toggle collapse status of my created indicators section
     const toggleCustomSection = () => {
       customSectionCollapsed.value = !customSectionCollapsed.value
     }
 
-    // 删除指标
+    // Delete indicator
     const handleDeleteIndicator = (indicator) => {
       Modal.confirm({
         title: proxy.$t('dashboard.indicator.delete.confirmTitle'),
@@ -1745,24 +1739,24 @@ export default {
 
             if (res.code === 1) {
               message.success(proxy.$t('dashboard.indicator.delete.success'))
-              // 如果该指标正在使用，先移除
+              // If indicator is in use, remove it first
               const indicatorId = 'custom-' + indicator.id
               if (isIndicatorActive(indicatorId)) {
                 removeIndicator(indicatorId)
               }
-              // 重新加载指标列表
+              // Reload indicators list
               await loadIndicators()
             } else {
               message.error(res.msg || proxy.$t('dashboard.indicator.delete.failed'))
             }
           } catch (error) {
-            message.error(proxy.$t('dashboard.indicator.delete.failed') + ': ' + (error.message || '未知错误'))
+            message.error(proxy.$t('dashboard.indicator.delete.failed') + ': ' + (error.message || 'Unknown Error'))
           }
         }
       })
     }
 
-    // 打开回测弹窗（策略 = 指标信号 + 回测参数配置）
+    // Open backtest modal (Strategy = Indicator signals + Backtest parameter config)
     const handleOpenBacktest = (indicator) => {
       backtestIndicator.value = { ...indicator }
       showBacktestModal.value = true
@@ -1794,10 +1788,10 @@ export default {
       showBacktestRunViewer.value = true
     }
 
-    // 发布指标到社区
+    // Publish indicator to community
     const handlePublishIndicator = (indicator) => {
       publishIndicator.value = { ...indicator }
-      // 设置表单初始值
+      // Set initial form values
       publishPricingType.value = indicator.pricing_type || 'free'
       publishPrice.value = indicator.price || 10
       publishDescription.value = indicator.description || ''
@@ -1805,7 +1799,7 @@ export default {
       showPublishModal.value = true
     }
 
-    // 确认发布
+    // Confirm publish
     const handleConfirmPublish = async () => {
       if (!userId.value) {
         message.error(proxy.$t('dashboard.indicator.error.pleaseLogin'))
@@ -1845,7 +1839,7 @@ export default {
       }
     }
 
-    // 取消发布
+    // Unpublish indicator
     const handleUnpublish = async () => {
       if (!userId.value || !publishIndicator.value) return
 
@@ -1882,14 +1876,14 @@ export default {
       }
     }
 
-    // 保存指标到数据库
+    // Save indicator to database
     const handleSaveIndicator = async (data) => {
       if (!userId.value) {
         message.error(proxy.$t('dashboard.indicator.error.pleaseLogin'))
         return
       }
 
-      // 通过ref获取编辑器组件，设置saving状态
+      // Get editor component via ref and set saving state
       const editorRef = proxy.$refs.indicatorEditor
       if (editorRef) {
         editorRef.saving = true
@@ -1908,7 +1902,7 @@ export default {
 
         if (res.code === 1) {
           message.success(proxy.$t('dashboard.indicator.save.success'))
-          // 关闭弹窗
+          // Close modal
           showIndicatorEditor.value = false
           editingIndicator.value = null
           // 重新加载指标列表
@@ -1917,7 +1911,7 @@ export default {
           message.error(res.msg || proxy.$t('dashboard.indicator.save.failed'))
         }
       } catch (error) {
-        message.error(proxy.$t('dashboard.indicator.save.failed') + ': ' + (error.message || '未知错误'))
+        message.error(proxy.$t('dashboard.indicator.save.failed') + ': ' + (error.message || 'Unknown Error'))
       } finally {
         if (editorRef) {
           editorRef.saving = false
@@ -1925,7 +1919,7 @@ export default {
       }
     }
 
-    // 获取指标状态文本
+    // Get indicator status text
     const getIndicatorStatus = (indicator) => {
       const endTime = indicator.end_time
       if (endTime === 1 || endTime === '1') {
@@ -1941,7 +1935,7 @@ export default {
       return proxy.$t('dashboard.indicator.status.normal')
     }
 
-    // 获取指标状态图标
+    // Get indicator status icon
     const getIndicatorStatusIcon = (indicator) => {
       const endTime = indicator.end_time
       if (endTime === 1 || endTime === '1') {
@@ -1957,7 +1951,7 @@ export default {
       return 'check-circle'
     }
 
-    // 获取指标状态样式类
+    // Get indicator status style class
     const getIndicatorStatusClass = (indicator) => {
       const endTime = indicator.end_time
       if (endTime === 1 || endTime === '1') {
@@ -1973,7 +1967,7 @@ export default {
       return 'status-normal'
     }
 
-    // 获取到期时间文本
+    // Get expiry time text
     const getExpiryTimeText = (indicator) => {
       const endTime = indicator.end_time
       if (endTime === 1 || endTime === '1') {
@@ -1990,7 +1984,7 @@ export default {
       return proxy.$t('dashboard.indicator.expiry.expiresOn', { date })
     }
 
-    // 获取市场名称（多语言）
+    // Get market name (multi-language)
     const getMarketName = (market) => {
       const marketMap = {
         'USStock': 'dashboard.indicator.market.USStock',
@@ -2002,7 +1996,7 @@ export default {
       return key && proxy?.$t ? proxy.$t(key) : market
     }
 
-    // 获取市场颜色
+    // Get market color
     const getMarketColor = (market) => {
       const colors = {
         'USStock': 'green',
@@ -2013,68 +2007,68 @@ export default {
       return colors[market] || 'default'
     }
 
-    // --- 实时更新函数已迁移到 KlineChart 组件 ---
+    // --- Real-time update functions migrated to KlineChart component ---
 
-    // 切换实时更新状态
+    // Toggle real-time update status
     const toggleRealtime = () => {
       realtimeEnabled.value = !realtimeEnabled.value
       localStorage.setItem('realtimeEnabled', realtimeEnabled.value.toString())
-      // KlineChart 组件会通过 watch realtimeEnabled 自动启动或停止实时更新
+      // KlineChart automatically starts/stops real-time update via watch realtimeEnabled
     }
 
-    // 检测是否为手机端
+    // Detect if mobile device
     const checkMobile = () => {
       isMobile.value = window.innerWidth <= 768
     }
 
     onMounted(() => {
-      // 从 localStorage 加载实时更新设置
+      // Load real-time update settings from localStorage
       const savedRealtime = localStorage.getItem('realtimeEnabled')
       if (savedRealtime !== null) {
         realtimeEnabled.value = savedRealtime === 'true'
       }
 
-      // 检测设备类型
+      // Detect device type
       checkMobile()
       window.addEventListener('resize', checkMobile)
 
-      // 加载市场类型和热门标的
+      // Load market types and hot symbols
       loadMarketTypes()
 
-      // 加载用户信息（会尝试从 store/API 获取；本地单用户模式下 userId 默认=1）
+      // Load user info (local single-user mode: userId defaults to 1)
       loadUserInfo()
 
-      // 本地单用户模式：直接拉自选股，避免未登录导致左上角无标的可选
+      // Local single-user mode: pull watchlist directly
       loadWatchlist()
 
-      // 加载指标列表（仅“我创建的指标”）
+      // Load indicators list (My Created Indicators only)
       loadIndicators()
 
-      // KlineChart 组件会自动处理实时更新和图表初始化
+      // KlineChart automatically handles real-time updates and chart initialization
     })
 
     onBeforeUnmount(() => {
       window.removeEventListener('resize', checkMobile)
-      // 清理搜索定时器
+      // Clear search timer
       if (searchTimer.value) {
         clearTimeout(searchTimer.value)
       }
-      // KlineChart 组件会自动清理资源
+      // KlineChart automatically cleans up resources
     })
 
-    // 监听弹窗打开，初始化数据
+    // Watch modal open, initialize data
     watch(showAddStockModal, (newVal) => {
       if (newVal) {
-        // 初始化选中的市场类型
+        // Initialize selected market type
         if (marketTypes.value.length > 0 && !selectedMarketTab.value) {
           selectedMarketTab.value = marketTypes.value[0].value
         }
-        // 加载热门标的
+        // Load hot symbols
         if (selectedMarketTab.value) {
           loadHotSymbols(selectedMarketTab.value)
         }
       } else {
-        // 关闭时清理数据
+        // Clear data on close
         selectedSymbolForAdd.value = null
         symbolSearchKeyword.value = ''
         symbolSearchResults.value = []
@@ -2086,24 +2080,24 @@ export default {
       }
     })
 
-    // 监听参数值变化，实时保存
+    // Watch parameter value changes, save in real-time
     watch(
       () => indicatorParamValues.value,
       (newVal) => {
-        // 只有在弹窗打开且有 pendingIndicator 时才保存
+        // Only save if modal is open and pendingIndicator exists
         if (showParamsModal.value && pendingIndicator.value && pendingSource.value) {
           const indicatorKey = `${pendingSource.value}-${pendingIndicator.value.id}`
-          // 深拷贝保存，避免引用问题
+          // Deep copy to avoid reference issues
           savedIndicatorParams.value[indicatorKey] = JSON.parse(JSON.stringify(newVal))
         }
       },
       { deep: true, immediate: false }
     )
 
-    // 监听参数配置弹窗关闭
+    // Watch parameter configuration modal close
     watch(showParamsModal, (newVal) => {
       if (!newVal) {
-        // 弹窗关闭时，确保参数值已保存
+        // Ensure parameter values are saved when modal closes
         saveCurrentParams()
       }
     })
@@ -2171,7 +2165,7 @@ getMarketColor,
       handlePriceChange,
       handleChartRetry,
       handleIndicatorToggle,
-      // 指标参数配置相关
+      // Indicator parameter configuration
       showParamsModal,
       pendingIndicator,
       indicatorParams,
@@ -2180,11 +2174,11 @@ getMarketColor,
       confirmIndicatorParams,
       cancelIndicatorParams,
       handleParamsModalAfterClose,
-      // 回测相关
+      // Backtest
       showBacktestModal,
       backtestIndicator,
       handleOpenBacktest,
-      // 回测记录相关
+      // Backtest history
       showBacktestHistoryDrawer,
       backtestHistoryIndicator,
       handleOpenBacktestHistory,
@@ -2193,7 +2187,7 @@ getMarketColor,
       handleViewBacktestRun,
       handleCreateStrategyFromIndicator,
       goToIndicatorMarket,
-      // 发布到社区相关
+      // Publish to community
       showPublishModal,
       publishIndicator,
       publishing,
@@ -2206,13 +2200,13 @@ getMarketColor,
       handlePublishIndicator,
       handleConfirmPublish,
       handleUnpublish,
-      // 暴露给回测弹窗使用的选中值
+      // Expose selected values to backtest modal
       selectedSymbol: currentSymbol,
       selectedMarket: currentMarket,
       selectedTimeframe: timeframe,
-      // 手机端相关
+      // Mobile related
       isMobile,
-      // 添加股票弹窗相关
+      // Add stock modal related
       showAddStockModal,
       addingStock,
       selectedMarketTab,
@@ -2240,21 +2234,19 @@ getMarketColor,
 </script>
 
 <style lang="less" scoped>
-/* 整体容器：浅色主题背景 */
+/* Overall container: light theme background */
 .chart-container {
   display: flex;
   flex-direction: column;
   width: 100%;
-  // height: 100vh; /* 使用100vh，让chart-content的70vh生效 */
   min-width: 100%;
-  // max-width: 100%;
   background: #f0f2f5;
   color: #333;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
   box-sizing: border-box;
 }
 
-/* 顶部 Header */
+/* Top Header */
 .chart-header {
   display: flex;
   flex-direction: column;
@@ -2281,7 +2273,7 @@ getMarketColor,
   gap: 20px;
 }
 
-/* 搜索框美化 */
+/* Search box beautification */
 .symbol-select {
   width: 220px;
 
@@ -2311,7 +2303,7 @@ getMarketColor,
   }
 }
 
-/* 时间周期按钮 */
+/* Timeframe buttons */
 .timeframe-group {
   display: flex;
   background: #f0f2f5;
@@ -2340,7 +2332,7 @@ getMarketColor,
   }
 }
 
-/* 当前标的信息 */
+/* Current symbol info */
 .current-symbol {
   display: flex;
   align-items: center;
@@ -2401,13 +2393,12 @@ getMarketColor,
   font-size: 12px;
 }
 
-/* 手机端：币种和价格信息显示在K线图上方 */
+/* Mobile: symbol and price info displayed above K-line chart */
 .mobile-symbol-price {
-  display: none; /* 默认隐藏，只在移动端显示 */
+  display: none; /* Hidden by default, only displayed on mobile */
 }
 
-/* 主题切换按钮 */
-/* 主题切换按钮 - 在 panel-header 中 */
+/* Theme switcher button - in panel-header */
 .panel-header .theme-switcher {
   margin-left: auto;
   display: flex;
@@ -2442,7 +2433,7 @@ getMarketColor,
   }
 }
 
-/* 主内容区 */
+/* Main content area */
 .chart-content {
   display: flex;
   flex-direction: column;
@@ -2457,15 +2448,15 @@ getMarketColor,
   display: flex;
   overflow: hidden;
   width: 100%;
-  height: 80vh !important; /* K线图占屏幕高度70% */
-  min-height: 500px !important; /* 最小高度保证 */
-  max-height: 80vh !important; /* 限制最大高度 */
-  flex-shrink: 0; /* 防止被压缩 */
+  height: 80vh !important;
+  min-height: 500px !important;
+  max-height: 80vh !important;
+  flex-shrink: 0;
 }
 
-/* 图表相关样式已迁移到 KlineChart 组件 */
+/* Chart related styles migrated to KlineChart component */
 
-/* 右侧指标侧边栏 */
+/* Right indicator sidebar */
 .chart-right {
   width: 30% !important;
   flex: 0 0 30% !important;
@@ -2562,7 +2553,7 @@ getMarketColor,
   margin-right: 0px;
 }
 
-/* 手机端隐藏PC端的创建按钮 */
+/* Hide PC create button on mobile */
 @media (max-width: 768px) {
   .create-indicator-btn {
     display: none !important;
@@ -2576,7 +2567,7 @@ getMarketColor,
   min-height: 0;
 }
 
-/* 指标卡片 */
+/* Indicator card */
 .indicator-card {
   display: flex;
   justify-content: space-between;
@@ -2784,7 +2775,7 @@ getMarketColor,
   font-size: 13px;
 }
 
-/* 自定义滚动条 - 隐藏滚动条但保持滚动功能 */
+/* Custom scrollbar - Hide scrollbar but keep scroll function */
 .custom-scrollbar {
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none; /* IE 10+ */
@@ -2796,7 +2787,7 @@ getMarketColor,
   height: 0;
 }
 
-/* 覆盖 Ant Design 下拉框样式 */
+/* Override Ant Design dropdown styles */
 :global(.dark-dropdown) {
   background-color: #fff;
   border: 1px solid #e8e8e8;
@@ -2838,7 +2829,7 @@ getMarketColor,
   font-size: 12px;
 }
 
-/* 响应式样式 - 手机端 */
+/* Responsive styles - Mobile */
 @media (max-width: 768px) {
   .chart-container {
     padding: 0;
@@ -2881,7 +2872,7 @@ getMarketColor,
 
       .timeframe-item {
         flex: 1;
-        min-width: calc(14.28% - 4px); /* 7个按钮，每个占约14.28% */
+        min-width: calc(14.28% - 4px); /* 7 buttons, each occupies about 14.28% */
         text-align: center;
         padding: 6px 8px;
         font-size: 12px;
@@ -2889,7 +2880,7 @@ getMarketColor,
     }
 
     .current-symbol {
-      display: none; /* 在移动端隐藏header中的币种信息，改用K线图上方的显示 */
+      display: none; /* Hide symbol info in header on mobile, use display above K-line instead */
     }
   }
 
@@ -2915,14 +2906,13 @@ getMarketColor,
     align-items: center;
     padding: 12px 16px;
     background: #fff;
-    // border-bottom: 1px solid #e8e8e8;
     width: 100%;
 
     .mobile-price-info {
       display: flex;
       align-items: center;
       gap: 12px;
-      flex-direction: row; /* 确保在一行显示 */
+      flex-direction: row; /* Ensure display in one line */
 
       &.color-up { color: #0ecb81; }
       &.color-down { color: #f6465d; }
@@ -2940,7 +2930,7 @@ getMarketColor,
     }
   }
 
-  /* K线图在上方 */
+  /* K-line chart on top */
   kline-chart {
     order: 1 !important;
     width: 100% !important;
@@ -2958,7 +2948,7 @@ getMarketColor,
     border-bottom: 1px solid #e8e8e8 !important;
   }
 
-  /* 指标列表在下方 */
+  /* Indicator list at bottom */
   .chart-right {
     order: 2 !important;
     width: 100% !important;
@@ -2966,7 +2956,7 @@ getMarketColor,
     max-width: 100% !important;
     flex: 0 0 auto !important;
     height: auto !important;
-    max-height: calc(100vh - 350px - 120px) !important; /* 减去K线图高度和header高度 */
+    max-height: calc(100vh - 350px - 120px) !important; /* Subtract K-line chart height and header height */
     border-left: none !important;
     border-top: none !important;
     margin-top: 0 !important;
@@ -2976,8 +2966,8 @@ getMarketColor,
 
     .indicators-panel {
       height: auto !important;
-      min-height: 600px !important; /* 增加最小高度 */
-      max-height: calc(100vh - 350px - 60px) !important; /* 增加高度，减去K线图高度和header高度 */
+      min-height: 600px !important; /* Increase minimum height */
+      max-height: calc(100vh - 350px - 60px) !important; /* Increase height, subtract K-line height and header height */
       overflow: hidden;
       display: flex;
       flex-direction: column;
@@ -3013,7 +3003,7 @@ getMarketColor,
         flex: 1;
         display: flex;
         flex-direction: column;
-        overflow: hidden; /* 防止整个tabs滚动 */
+        overflow: hidden; /* Prevent entire tabs from scrolling */
         min-height: 0;
         height: 100%;
 
@@ -3038,7 +3028,7 @@ getMarketColor,
 
         :deep(.ant-tabs-content) {
           flex: 1;
-          overflow: auto; /* 防止content区域滚动 */
+          overflow: auto; /* Prevent content area from scrolling */
           min-height: 0;
           display: flex;
           flex-direction: column;
@@ -3047,7 +3037,7 @@ getMarketColor,
 
         :deep(.ant-tabs-tabpane) {
           height: 100%;
-          overflow: hidden; /* 防止tabpane滚动 */
+          overflow: hidden; /* Prevent tabpane from scrolling */
           display: none;
           flex-direction: column;
           min-height: 0;
@@ -3058,12 +3048,12 @@ getMarketColor,
           flex-direction: column;
           min-height: 0;
           height: 100%;
-          overflow: hidden; /* 防止激活的tabpane滚动 */
+          overflow: hidden; /* Prevent active tabpane from scrolling */
         }
 
         :deep(.ant-tabs-content-holder) {
           flex: 1;
-          overflow: hidden; /* 防止content-holder滚动 */
+          overflow: hidden; /* Prevent content-holder from scrolling */
           min-height: 0;
           display: flex;
           flex-direction: column;
@@ -3092,11 +3082,11 @@ getMarketColor,
         }
 
         .mobile-create-btn-wrapper {
-          display: none !important; /* 手机端不再需要这个wrapper，按钮已移到header */
+          display: none !important; /* Wrapper no longer needed on mobile, button moved to header */
         }
 
         .mobile-create-btn {
-          display: none !important; /* 手机端不再需要这个按钮，已移到header */
+          display: none !important; /* Button no longer needed on mobile, moved to header */
         }
       }
 
@@ -3127,9 +3117,9 @@ getMarketColor,
   }
 }
 
-/* ========== 暗黑主题样式 ========== */
-/* 根据框架主题自动应用暗黑样式 */
-/* 当主题为暗色时应用的样式 - 通过组件类名或全局类名 */
+/* ========== Dark Theme Styles ========== */
+/* Automatically apply dark styles based on framework theme */
+/* Styles applied when theme is dark - via component class or global class */
 .chart-container.theme-dark,
 :global(body.dark) .chart-container,
 :global(body.realdark) .chart-container,
@@ -3414,7 +3404,7 @@ getMarketColor,
     }
   }
 
-  /* 移动端适配 */
+  /* Mobile adaptation */
   @media (max-width: 768px) {
     .chart-header {
       background: #1e222d;
@@ -3489,7 +3479,7 @@ getMarketColor,
   }
 }
 
-/* 添加股票弹窗样式 */
+/* Add stock modal styles */
 .add-stock-modal-content {
   .market-tabs {
     margin-bottom: 16px;
@@ -3561,7 +3551,7 @@ getMarketColor,
 
 }
 
-/* 暗黑主题下的弹窗样式 */
+/* Modal styles in dark theme */
 .chart-container.theme-dark,
 :global(body.dark) .chart-container,
 :global(body.realdark) .chart-container {
@@ -3596,7 +3586,7 @@ getMarketColor,
   }
 }
 
-/* 指标参数配置弹窗 */
+/* Indicator parameter configuration modal */
 .params-config-modal {
   .indicator-info {
     text-align: center;
diff --git a/frontend_vue/src/views/polymarket/index.vue b/frontend_vue/src/views/polymarket/index.vue
new file mode 100644
index 0000000..0152f4c
--- /dev/null
+++ b/frontend_vue/src/views/polymarket/index.vue
@@ -0,0 +1,142 @@
+<template>
+  <div class="polymarket-page" :class="{ 'theme-dark': isDarkTheme }">
+    <div class="page-hero">
+      <div class="hero-copy">
+        <div class="hero-eyebrow">{{ tt('polymarket.analysis.title', 'Polymarket Analysis') }}</div>
+        <h1>{{ tt('polymarket.analysis.heroTitle', 'Compare market pricing with AI conviction') }}</h1>
+        <p>{{ tt('polymarket.analysis.description', 'Analyze a prediction market by URL or title and compare market pricing with AI probability.') }}</p>
+      </div>
+      <div class="hero-actions">
+        <a-button size="large" icon="arrow-left" @click="$router.push('/ai-asset-analysis?tab=polymarket')">
+          {{ tt('polymarket.analysis.backToAssetAnalysis', 'Back to AI Asset Analysis') }}
+        </a-button>
+      </div>
+    </div>
+
+    <polymarket-analysis-workspace ref="workspace" embedded />
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import PolymarketAnalysisWorkspace from '@/components/PolymarketAnalysisWorkspace.vue'
+
+export default {
+  name: 'PolymarketPage',
+  components: {
+    PolymarketAnalysisWorkspace
+  },
+  computed: {
+    ...mapState({
+      navTheme: state => state.app.theme
+    }),
+    isDarkTheme () {
+      return this.navTheme === 'dark' || this.navTheme === 'realdark'
+    }
+  },
+  watch: {
+    '$route.query.input': {
+      immediate: true,
+      handler (value) {
+        if (!value) return
+        this.$nextTick(() => {
+          const workspace = this.$refs.workspace
+          if (workspace && workspace.startFromInput) {
+            workspace.startFromInput(value)
+          }
+        })
+      }
+    }
+  },
+  methods: {
+    tt (key, fallback, params) {
+      const translated = this.$t(key, params)
+      return translated !== key ? translated : fallback
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.polymarket-page {
+  min-height: calc(100vh - 120px);
+  padding: 16px;
+  background: linear-gradient(180deg, #f3f6fb 0%, #eef4fb 100%);
+}
+
+.page-hero {
+  display: flex;
+  justify-content: space-between;
+  gap: 18px;
+  align-items: flex-start;
+  margin-bottom: 18px;
+  padding: 26px;
+  border: 1px solid #dbe7f5;
+  border-radius: 28px;
+  background:
+    radial-gradient(circle at top left, rgba(37, 99, 235, 0.16), transparent 34%),
+    linear-gradient(135deg, #ffffff 0%, #f8fbff 52%, #eef7ff 100%);
+  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
+}
+
+.hero-copy {
+  max-width: 760px;
+}
+
+.hero-eyebrow {
+  color: #2563eb;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.page-hero h1 {
+  margin: 10px 0 12px;
+  color: #0f172a;
+  font-size: 30px;
+  font-weight: 700;
+}
+
+.page-hero p {
+  margin: 0;
+  color: rgba(15, 23, 42, 0.68);
+  line-height: 1.7;
+}
+
+.hero-actions {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+
+.theme-dark.polymarket-page {
+  background: linear-gradient(180deg, #0b1220 0%, #111827 100%);
+}
+
+.theme-dark .page-hero {
+  border-color: rgba(59, 130, 246, 0.16);
+  background:
+    radial-gradient(circle at top left, rgba(37, 99, 235, 0.22), transparent 34%),
+    linear-gradient(135deg, #111827 0%, #0f172a 58%, #161b22 100%);
+  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
+}
+
+.theme-dark .hero-eyebrow {
+  color: #60a5fa;
+}
+
+.theme-dark .page-hero h1 {
+  color: #f8fafc;
+}
+
+.theme-dark .page-hero p {
+  color: rgba(248, 250, 252, 0.72);
+}
+
+@media (max-width: 900px) {
+  .page-hero {
+    flex-direction: column;
+  }
+}
+</style>
diff --git a/frontend_vue/src/views/trading-assistant/components/AIDecisionRecords.vue b/frontend_vue/src/views/trading-assistant/components/AIDecisionRecords.vue
index 0b29cfe..8a4f39e 100644
--- a/frontend_vue/src/views/trading-assistant/components/AIDecisionRecords.vue
+++ b/frontend_vue/src/views/trading-assistant/components/AIDecisionRecords.vue
@@ -76,7 +76,7 @@ export default {
           key: 'created_at',
           width: 180,
           customRender: (text) => {
-            return new Date(text * 1000).toLocaleString('zh-CN')
+            return new Date(text * 1000).toLocaleString('en-US')
           }
         },
         {
@@ -128,19 +128,19 @@ export default {
           limit: this.pagination.pageSize
         })
         if (res.code === 1) {
-          // 处理返回的数据格式
+          // Handle returned data format
           const data = res.data
           let decisions = []
           let total = 0
 
-          // 兼容新旧格式
+          // Compatible with new and old formats
           if (data && typeof data === 'object') {
             if (Array.isArray(data)) {
-              // 旧格式：直接是数组
+              // Old format: direct array
               decisions = data
               total = data.length
             } else if (data.decisions) {
-              // 新格式：包含 decisions 和 total
+              // New format: includes decisions and total
               decisions = data.decisions || []
               total = data.total || 0
             }
@@ -209,7 +209,7 @@ export default {
     color: var(--text-color, #1f1f1f);
   }
 
-  // 确保 hold 标签（cyan）在所有主题下都有足够的对比度
+  // Ensure hold tag (cyan) has enough contrast in all themes
   /deep/ .ant-tag {
     &.ant-tag-cyan {
       background-color: #13c2c2 !important;
@@ -218,12 +218,12 @@ export default {
     }
   }
 
-  // 表格容器横向滚动
+  // Table container horizontal scroll
   /deep/ .ant-table-wrapper {
     min-width: 100%;
   }
 
-  // 适配主题色
+  // Adapt to theme colors
   /deep/ .ant-table {
     background: var(--table-row-bg, #fff);
     color: var(--text-color, #1f1f1f);
@@ -269,7 +269,7 @@ export default {
     }
   }
 
-  // 进度条使用主题色
+  // Progress bar uses theme color
   /deep/ .ant-progress {
     .ant-progress-bg {
       background-color: var(--primary-color, #1890ff);
@@ -284,7 +284,7 @@ export default {
     }
   }
 
-  // 自定义滚动条样式
+  // Custom scrollbar style
   &::-webkit-scrollbar {
     height: 8px;
   }
@@ -303,7 +303,7 @@ export default {
     }
   }
 
-  // 分页器主题适配
+  // Pager theme adaptation
   /deep/ .ant-pagination {
     color: var(--text-color, #1f1f1f);
 
@@ -363,7 +363,7 @@ export default {
 </style>
 
 <style lang="less">
-// 全局样式：暗色主题下的标签优化
+// Global styles: tag optimization under dark theme
 .trading-assistant.theme-dark {
   .ai-decision-records {
     /deep/ .ant-table {
@@ -410,14 +410,14 @@ export default {
     }
 
     /deep/ .ant-tag {
-      // hold 标签使用青色，确保在暗色背景下可见
+      // hold tag uses cyan, ensure visible on dark background
       &.ant-tag-cyan {
         background-color: #13c2c2 !important;
         border-color: #13c2c2 !important;
         color: #fff !important;
       }
 
-      // 其他标签在暗色主题下的优化
+      // Other tags optimization under dark theme
       &.ant-tag-green {
         background-color: #52c41a !important;
         border-color: #52c41a !important;
@@ -442,7 +442,7 @@ export default {
         color: #fff !important;
       }
 
-      // default 标签在暗色主题下的优化
+      // default tag optimization under dark theme
       &.ant-tag-default {
         background-color: #434343 !important;
         border-color: #434343 !important;
@@ -450,7 +450,7 @@ export default {
       }
     }
 
-    // 进度条在暗色主题下使用主题色
+    // Progress bar use theme color under dark theme
     /deep/ .ant-progress {
       .ant-progress-bg {
         background-color: var(--primary-color, #1890ff);
@@ -465,7 +465,7 @@ export default {
       }
     }
 
-    // 暗色主题下的滚动条样式
+    // Scrollbar style under dark theme
     &::-webkit-scrollbar-track {
       background: #2a2e39;
     }
@@ -478,7 +478,7 @@ export default {
       }
     }
 
-    // 暗色主题下的分页器
+    // Pager under dark theme
     /deep/ .ant-pagination {
       color: var(--text-color, #d1d4dc);
 
diff --git a/frontend_vue/src/views/trading-assistant/components/PerformanceAnalysis.vue b/frontend_vue/src/views/trading-assistant/components/PerformanceAnalysis.vue
index c376f61..96c8a56 100644
--- a/frontend_vue/src/views/trading-assistant/components/PerformanceAnalysis.vue
+++ b/frontend_vue/src/views/trading-assistant/components/PerformanceAnalysis.vue
@@ -364,7 +364,7 @@ export default {
         ? new Date(raw < 1e12 ? raw * 1000 : raw)
         : new Date(time)
       if (Number.isNaN(date.getTime())) return '--'
-      return date.toLocaleDateString(this.$i18n.locale === 'zh-CN' ? 'zh-CN' : 'en-US', {
+      return date.toLocaleDateString('en-US', {
         month: 'short',
         day: 'numeric'
       })
diff --git a/frontend_vue/src/views/trading-assistant/components/PositionRecords.vue b/frontend_vue/src/views/trading-assistant/components/PositionRecords.vue
index 2cc4f8a..ae2fc58 100644
--- a/frontend_vue/src/views/trading-assistant/components/PositionRecords.vue
+++ b/frontend_vue/src/views/trading-assistant/components/PositionRecords.vue
@@ -139,7 +139,7 @@ export default {
       handler (val) {
         if (val) {
           this.loadPositions()
-          // 每5秒刷新一次持仓
+          // Refresh positions every 5 seconds
           this.startPolling()
         } else {
           this.stopPolling()
@@ -158,7 +158,7 @@ export default {
       try {
         const res = await getStrategyPositions(this.strategyId)
         if (res.code === 1) {
-          // 确保数据格式正确，处理可能的字段名不一致
+          // Ensure data format is correct, handle potential field name inconsistencies
           const rawPositions = res.data.positions || []
 
           this.positions = rawPositions.map((position, index) => {
@@ -167,7 +167,7 @@ export default {
             if (!isFinite(lev) || lev <= 0) lev = 1
             if (mt === 'spot') lev = 1
 
-            // 处理 entry_price：不要回退到 current_price，避免误导显示开仓价=现价
+            // Handle entry_price: do not fall back to current_price, to avoid misleadingly showing entry price = current price
             const entryPrice = parseFloat(position.entry_price || position.entryPrice || 0)
             const size = parseFloat(position.size || '0') || 0
             const pnl = parseFloat(position.unrealized_pnl || position.unrealizedPnl || '0') || 0
@@ -195,7 +195,7 @@ export default {
             return mapped
           })
         } else {
-          // 不显示错误，可能策略还没有持仓
+          // Do not show error, strategy might not have positions yet
           this.positions = []
         }
       } catch (error) {
@@ -223,7 +223,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-// 颜色变量
+// Color variables
 @primary-color: #1890ff;
 @success-color: #0ecb81;
 @danger-color: #f6465d;
@@ -249,7 +249,7 @@ export default {
     color: #333;
   }
 
-  // 自定义细滚动条
+  // Custom thin scrollbar
   ::v-deep .ant-table-body {
     overflow-x: auto;
     scrollbar-width: thin;
@@ -271,7 +271,7 @@ export default {
     }
   }
 
-  // 表格容器的滚动条样式
+  // Scrollbar style for table container
   ::v-deep .ant-table-container {
     scrollbar-width: thin;
     scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
@@ -292,7 +292,7 @@ export default {
     }
   }
 
-  // 所有可能的表格滚动容器的滚动条样式
+  // Scrollbar style for all possible table scroll containers
   ::v-deep .ant-table-content,
   ::v-deep .ant-table-wrapper {
     scrollbar-width: thin;
@@ -341,7 +341,7 @@ export default {
     }
   }
 
-  // 方向标签美化
+  // Direction tag beautification
   ::v-deep .ant-tag {
     border-radius: 6px;
     padding: 2px 10px;
@@ -362,7 +362,7 @@ export default {
     }
   }
 
-  // 暗黑主题适配
+  // Dark theme adaptation
   &.theme-dark,
   .theme-dark & {
     ::v-deep .ant-table {
@@ -436,12 +436,12 @@ export default {
     }
   }
 
-  // 移动端适配
+  // Mobile adaptation
   @media (max-width: 768px) {
     min-height: 200px;
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
-    // 移动端也使用细滚动条
+    // Mobile also uses thin scrollbar
     scrollbar-width: thin;
     scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
     &::-webkit-scrollbar {
@@ -467,10 +467,10 @@ export default {
 
     ::v-deep .ant-table {
       font-size: 12px;
-      min-width: 700px; // 确保表格最小宽度，触发横向滚动
+      min-width: 700px; // Ensure minimum table width to trigger horizontal scroll
     }
 
-    // 移动端也使用细滚动条
+    // Mobile also uses thin scrollbar
     ::v-deep .ant-table-body,
     ::v-deep .ant-table-container,
     ::v-deep .ant-table-wrapper {
@@ -535,8 +535,8 @@ export default {
 </style>
 
 <style lang="less">
-// 暗黑主题适配 - 使用更高优先级的选择器覆盖 scoped 样式
-// 必须使用完整的 scoped 选择器路径来覆盖
+// Dark theme adaptation - Use higher priority selectors to override scoped styles
+// Must use full scoped selector path to override
 .theme-dark .position-records .ant-table-tbody > tr > td,
 .theme-dark .position-records[data-v] .ant-table-tbody > tr > td,
 body.dark .position-records .ant-table-tbody > tr > td,
@@ -578,7 +578,7 @@ body.realdark .position-records .ant-table-tbody > tr:hover > td {
   background: #2a2e39 !important;
 }
 
-// 确保表头文字可见
+// Ensure table header text is visible
 .theme-dark .position-records .ant-table-thead > tr > th,
 .theme-dark .position-records[data-v] .ant-table-thead > tr > th,
 body.dark .position-records .ant-table-thead > tr > th,
@@ -588,7 +588,7 @@ body.realdark .position-records .ant-table-thead > tr > th {
   }
 }
 
-// 通用选择器作为后备
+// Universal selector as fallback
 .theme-dark .position-records[data-v] .ant-table-tbody > tr > td,
 .theme-dark [class*="position-records"][data-v] .ant-table-tbody > tr > td {
   color: #d1d4dc !important;
@@ -605,11 +605,11 @@ body.realdark .position-records .ant-table-thead > tr > th {
 </style>
 
 <style lang="less">
-// 暗黑主题适配 - 使用最高优先级的选择器覆盖 scoped 样式
-// 关键：必须使用与 scoped 样式完全相同的选择器结构，加上 theme-dark 前缀
-// 使用属性选择器的精确匹配来覆盖 scoped 样式
+// Dark theme adaptation - Use highest priority selectors to override scoped styles
+// Key: Must use exactly the same selector structure as scoped styles, plus theme-dark prefix
+// Use attribute selector exact matching to override scoped styles
 
-// 方法1：精确匹配 data-v-6c1eb557
+// Method 1: Exact match data-v-6c1eb557
 .theme-dark .position-records[data-v-6c1eb557] .ant-table-tbody > tr > td,
 .theme-dark [data-v-6c1eb557].position-records .ant-table-tbody > tr > td,
 .theme-dark [data-v-6c1eb557] .position-records .ant-table-tbody > tr > td {
@@ -618,7 +618,7 @@ body.realdark .position-records .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 方法2：使用属性选择器前缀匹配（更通用）
+// Method 2: Use attribute selector prefix matching (more universal)
 .theme-dark [data-v-6c1eb557] .ant-table-tbody > tr > td {
   color: #d1d4dc !important;
   background: #1e222d !important;
@@ -643,7 +643,7 @@ body.realdark .position-records .ant-table-thead > tr > th {
   background: #2a2e39 !important;
 }
 
-// body.dark 和 body.realdark 支持
+// body.dark and body.realdark support
 body.dark .position-records[data-v-6c1eb557] .ant-table-tbody > tr > td,
 body.dark [data-v-6c1eb557].position-records .ant-table-tbody > tr > td,
 body.dark [data-v-6c1eb557] .position-records .ant-table-tbody > tr > td,
@@ -655,7 +655,7 @@ body.realdark [data-v-6c1eb557] .position-records .ant-table-tbody > tr > td {
   border-bottom-color: #363c4e !important;
 }
 
-// 方法2：使用属性选择器前缀匹配（更通用）
+// Method 2: Use attribute selector prefix matching (more universal)
 body.dark [data-v-6c1eb557] .ant-table-tbody > tr > td,
 body.realdark [data-v-6c1eb557] .ant-table-tbody > tr > td {
   color: #d1d4dc !important;
@@ -674,7 +674,7 @@ body.realdark [data-v-6c1eb557] .position-records .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 方法2：使用属性选择器前缀匹配（更通用）
+// Method 2: Use attribute selector prefix matching (more universal)
 body.dark [data-v-6c1eb557] .ant-table-thead > tr > th,
 body.realdark [data-v-6c1eb557] .ant-table-thead > tr > th {
   background: #2a2e39 !important;
@@ -682,7 +682,7 @@ body.realdark [data-v-6c1eb557] .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 通用后备选择器（如果 data-v 值变化）
+// Universal fallback selector (if data-v value changes)
 .theme-dark .position-records[data-v] .ant-table-tbody > tr > td,
 body.dark .position-records[data-v] .ant-table-tbody > tr > td,
 body.realdark .position-records[data-v] .ant-table-tbody > tr > td {
@@ -699,7 +699,7 @@ body.realdark .position-records[data-v] .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 其他样式
+// Other styles
 .theme-dark .position-records[data-v-6c1eb557] .ant-empty .ant-empty-description,
 body.dark .position-records[data-v-6c1eb557] .ant-empty .ant-empty-description,
 body.realdark .position-records[data-v-6c1eb557] .ant-empty .ant-empty-description {
@@ -720,8 +720,8 @@ body.realdark .position-records[data-v-6c1eb557] .loss {
 </style>
 
 <style lang="less">
-// 最终覆盖方案：使用更长的选择器链确保最高优先级
-// 直接匹配 scoped 样式生成的完整选择器路径
+// Final override solution: Use longer selector chain to ensure highest priority
+// Directly match the full selector path generated by scoped styles
 .theme-dark .trading-assistant .position-records[data-v-6c1eb557] .ant-table-tbody > tr > td,
 .theme-dark .trading-assistant [data-v-6c1eb557].position-records .ant-table-tbody > tr > td,
 body.dark .trading-assistant .position-records[data-v-6c1eb557] .ant-table-tbody > tr > td,
@@ -744,7 +744,7 @@ body.realdark .trading-assistant [data-v-6c1eb557].position-records .ant-table-t
   border-bottom-color: #363c4e !important;
 }
 
-// 暗黑主题滚动条样式
+// Dark theme scrollbar style
 .theme-dark .position-records[data-v-6c1eb557] .ant-table-body,
 .theme-dark .position-records[data-v-6c1eb557] .ant-table-container,
 .theme-dark .position-records[data-v-6c1eb557] .ant-table-content,
@@ -776,7 +776,7 @@ body.realdark .position-records[data-v-6c1eb557] .ant-table-wrapper {
   }
 }
 
-// 通用后备选择器
+// Universal fallback selector
 .theme-dark .position-records[data-v] .ant-table-body,
 .theme-dark .position-records[data-v] .ant-table-container,
 .theme-dark .position-records[data-v] .ant-table-content,
diff --git a/frontend_vue/src/views/trading-assistant/components/TradingRecords.vue b/frontend_vue/src/views/trading-assistant/components/TradingRecords.vue
index 33d316a..865214a 100644
--- a/frontend_vue/src/views/trading-assistant/components/TradingRecords.vue
+++ b/frontend_vue/src/views/trading-assistant/components/TradingRecords.vue
@@ -138,10 +138,10 @@ export default {
       try {
         const res = await getStrategyTrades(this.strategyId)
         if (res.code === 1) {
-          // 确保数据格式正确
+          // Ensure data format is correct
           this.records = (res.data.trades || []).map(trade => ({
             ...trade,
-            // 确保时间字段存在
+            // Ensure time field exists
             time: trade.created_at || trade.time
           }))
         } else {
@@ -157,37 +157,31 @@ export default {
         let date
 
         if (typeof time === 'number') {
-          // 数字类型：判断是秒级还是毫秒级时间戳
+          // Number type: determine if it's second or millisecond timestamp
           const timestampMs = time < 1e12 ? time * 1000 : time
           date = new Date(timestampMs)
         } else if (typeof time === 'string') {
-          // 字符串类型
+          // String type
           if (/^\d+$/.test(time)) {
-            // 纯数字字符串（时间戳）
+            // Pure numeric string (timestamp)
             const timestamp = parseInt(time, 10)
             const timestampMs = timestamp < 1e12 ? timestamp * 1000 : timestamp
             date = new Date(timestampMs)
           } else {
-            // ISO 日期字符串或其他格式，直接解析
+            // ISO date string or other format, parse directly
             date = new Date(time)
           }
         } else {
           return '--'
         }
 
-        // 检查日期是否有效
+        // Check if date is valid
         if (isNaN(date.getTime())) {
           return '--'
         }
 
-        // 使用24小时制格式化时间
-        const locale = this.$i18n.locale || 'zh-CN'
-        const localeMap = {
-          'zh-CN': 'zh-CN',
-          'zh-TW': 'zh-TW',
-          'en-US': 'en-US'
-        }
-        return date.toLocaleString(localeMap[locale] || 'zh-CN', {
+        // Format time using 24-hour clock
+        return date.toLocaleString('en-US', {
           year: 'numeric',
           month: '2-digit',
           day: '2-digit',
@@ -200,20 +194,20 @@ export default {
         return '--'
       }
     },
-    // 获取交易类型颜色
+    // Get trade type color
     getTradeTypeColor (type) {
       const colorMap = {
-        // 旧格式
+        // Old format
         'buy': 'green',
         'sell': 'red',
         'liquidation': 'orange',
-        // 新格式 - 做多
+        // New format - Long
         'open_long': 'green',
         'add_long': 'cyan',
         'close_long': 'orange',
         'close_long_stop': 'red',
         'close_long_profit': 'lime',
-        // 新格式 - 做空
+        // New format - Short
         'open_short': 'red',
         'add_short': 'magenta',
         'close_short': 'blue',
@@ -222,20 +216,20 @@ export default {
       }
       return colorMap[type] || 'default'
     },
-    // 获取交易类型文本
+    // Get trade type text
     getTradeTypeText (type) {
       const textMap = {
-        // 旧格式
+        // Old format
         'buy': this.$t('dashboard.indicator.backtest.buy'),
         'sell': this.$t('dashboard.indicator.backtest.sell'),
         'liquidation': this.$t('dashboard.indicator.backtest.liquidation'),
-        // 新格式 - 做多
+        // New format - Long
         'open_long': this.$t('dashboard.indicator.backtest.openLong'),
         'add_long': this.$t('dashboard.indicator.backtest.addLong'),
         'close_long': this.$t('dashboard.indicator.backtest.closeLong'),
         'close_long_stop': this.$t('dashboard.indicator.backtest.closeLongStop'),
         'close_long_profit': this.$t('dashboard.indicator.backtest.closeLongProfit'),
-        // 新格式 - 做空
+        // New format - Short
         'open_short': this.$t('dashboard.indicator.backtest.openShort'),
         'add_short': this.$t('dashboard.indicator.backtest.addShort'),
         'close_short': this.$t('dashboard.indicator.backtest.closeShort'),
@@ -244,31 +238,31 @@ export default {
       }
       return textMap[type] || type
     },
-    // 格式化金额（盈亏）
+    // Format money (profit/loss)
     formatMoney (value) {
       if (value === null || value === undefined) return '--'
-      // 正数显示+，负数显示-
+      // Positive shows +, negative shows -
       const sign = value >= 0 ? '+' : '-'
       return `${sign}$${Math.abs(value).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`
     },
-    // 格式化盈亏（处理信号模式下没有实盘的情况）
+    // Format profit (handle cases in signal mode with no live trades)
     formatProfit (value, record) {
-      // 如果是信号模式（没有实盘交易），profit为0或null时显示--
-      // 判断依据：如果是开仓信号且profit为0，或者record.is_signal_only为true
+      // If signal mode (no live trades), show -- when profit is 0 or null
+      // Criteria: If entry signal and profit is 0, or record.is_signal_only is true
       if (value === null || value === undefined) return '--'
 
       const numValue = parseFloat(value)
 
-      // 如果值为0且是开仓信号（open_long/open_short），显示--
-      // 因为开仓时还没有盈亏
+      // If value is 0 and it's an entry signal (open_long/open_short), show --
+      // Because there's no profit/loss at entry
       const openTypes = ['open_long', 'open_short', 'add_long', 'add_short']
       if (numValue === 0 && record && openTypes.includes(record.type)) {
         return '--'
       }
 
-      // 如果值极小（科学计数法如0E-8），视为0
+      // If value is extremely small (scientific notation like 0E-8), treat as 0
       if (Math.abs(numValue) < 0.000001) {
-        // 开仓类型显示--，平仓类型显示$0.00
+        // Entry types show --, cover types show $0.00
         if (record && openTypes.includes(record.type)) {
           return '--'
         }
@@ -277,18 +271,18 @@ export default {
 
       return this.formatMoney(numValue)
     },
-    // 格式化手续费（避免科学计数法如0E-8）
+    // Format commission (avoid scientific notation like 0E-8)
     formatCommission (value) {
       if (value === null || value === undefined) return '--'
 
       const numValue = parseFloat(value)
 
-      // 如果值极小（科学计数法如0E-8），显示为0或--
+      // If value is extremely small (scientific notation like 0E-8), show as 0 or --
       if (isNaN(numValue) || Math.abs(numValue) < 0.000001) {
         return '--'
       }
 
-      // 正常格式化显示
+      // Normal formatting display
       return `$${numValue.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 6 })}`
     }
   }
@@ -296,7 +290,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-// 颜色变量
+// Color variables
 @primary-color: #1890ff;
 @success-color: #0ecb81;
 @danger-color: #f6465d;
@@ -446,7 +440,7 @@ export default {
     }
   }
 
-  // 交易类型标签美化
+  // Trade type tag beautification
   ::v-deep .ant-tag {
     border-radius: 6px;
     padding: 3px 10px;
@@ -480,7 +474,7 @@ export default {
     }
   }
 
-  // 分页器美化
+  // Pager beautification
   ::v-deep .ant-pagination {
     margin-top: 16px;
     display: flex;
@@ -524,7 +518,7 @@ export default {
     }
   }
 
-  // 暗黑主题适配
+  // Dark theme adaptation
   &.theme-dark,
   .theme-dark & {
     ::v-deep .ant-table {
@@ -558,7 +552,7 @@ export default {
     background: #fafafa;
   }
 
-  // 移动端适配
+  // Mobile adaptation
   @media (max-width: 768px) {
     min-height: 200px;
     overflow-x: visible;
@@ -567,7 +561,7 @@ export default {
       font-size: 12px;
     }
 
-    // 移动端也使用细滚动条
+    // Mobile also uses thin scrollbar
     ::v-deep .ant-table-body,
     ::v-deep .ant-table-container,
     ::v-deep .ant-table-wrapper {
@@ -635,12 +629,12 @@ export default {
   }
 }
 
-// 暗黑主题 - 在 scoped 中处理，确保优先级足够高
+// Dark theme - handled in scoped to ensure high priority
 </style>
 
 <style lang="less">
-// 暗黑主题适配 - 使用最高优先级的选择器覆盖 scoped 样式
-// 关键：必须使用与 scoped 样式完全相同的选择器结构，加上 theme-dark 前缀
+// Dark theme adaptation - Use highest priority selectors to override scoped styles
+// Key: Must use exactly the same selector structure as scoped styles, plus theme-dark prefix
 .theme-dark .trading-records .ant-table-tbody > tr > td,
 .theme-dark .trading-records[data-v] .ant-table-tbody > tr > td,
 body.dark .trading-records .ant-table-tbody > tr > td,
@@ -682,7 +676,7 @@ body.realdark .trading-records .ant-table-tbody > tr:hover > td {
   background: #2a2e39 !important;
 }
 
-// 确保表头文字可见
+// Ensure table header text is visible
 .theme-dark .trading-records .ant-table-thead > tr > th,
 .theme-dark .trading-records[data-v] .ant-table-thead > tr > th,
 body.dark .trading-records .ant-table-thead > tr > th,
@@ -696,7 +690,7 @@ body.realdark .trading-records .ant-table-thead > tr > th {
   background: #2a2e39 !important;
 }
 
-// body.dark 和 body.realdark 支持
+// body.dark and body.realdark support
 body.dark .trading-records[data-v-8a68b65a] .ant-table-tbody > tr > td,
 body.realdark .trading-records[data-v-8a68b65a] .ant-table-tbody > tr > td {
   color: #d1d4dc !important;
@@ -711,7 +705,7 @@ body.realdark .trading-records[data-v-8a68b65a] .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 通用后备选择器（如果 data-v 值变化）
+// Universal fallback selector (if data-v value changes)
 .theme-dark .trading-records[data-v] .ant-table-tbody > tr > td,
 body.dark .trading-records[data-v] .ant-table-tbody > tr > td,
 body.realdark .trading-records[data-v] .ant-table-tbody > tr > td {
@@ -728,7 +722,7 @@ body.realdark .trading-records[data-v] .ant-table-thead > tr > th {
   border-bottom-color: #363c4e !important;
 }
 
-// 分页器样式
+// Pager styles
 .theme-dark .trading-records[data-v-8a68b65a] .ant-pagination-item,
 body.dark .trading-records[data-v-8a68b65a] .ant-pagination-item,
 body.realdark .trading-records[data-v-8a68b65a] .ant-pagination-item {
@@ -780,7 +774,7 @@ body.realdark .trading-records[data-v-8a68b65a] .ant-pagination-next:hover .ant-
   color: #1890ff !important;
 }
 
-// 通用后备选择器
+// Universal fallback selector
 .theme-dark .trading-records[data-v] .ant-pagination-item,
 body.dark .trading-records[data-v] .ant-pagination-item,
 body.realdark .trading-records[data-v] .ant-pagination-item {
@@ -832,7 +826,7 @@ body.realdark .trading-records[data-v] .ant-pagination-next:hover .ant-paginatio
   color: #1890ff !important;
 }
 
-// 暗黑主题滚动条样式
+// Dark theme scrollbar styles
 .theme-dark .trading-records[data-v-8a68b65a] .ant-table-body,
 .theme-dark .trading-records[data-v-8a68b65a] .ant-table-container,
 .theme-dark .trading-records[data-v-8a68b65a] .ant-table-content,
@@ -864,7 +858,7 @@ body.realdark .trading-records[data-v-8a68b65a] .ant-table-wrapper {
   }
 }
 
-// 通用后备选择器
+// Universal fallback selector
 .theme-dark .trading-records[data-v] .ant-table-body,
 .theme-dark .trading-records[data-v] .ant-table-container,
 .theme-dark .trading-records[data-v] .ant-table-content,
@@ -898,7 +892,7 @@ body.realdark .trading-records[data-v] .ant-table-wrapper {
 </style>
 
 <style lang="less">
-// 暗黑主题适配 - 使用全局样式确保能够覆盖
+// Dark theme adaptation - Use global styles to ensure overrides
 .theme-dark .trading-records {
   ::v-deep .ant-table {
     background: #1e222d !important;
@@ -942,7 +936,7 @@ body.realdark .trading-records[data-v] .ant-table-wrapper {
     color: #868993 !important;
   }
 
-  // 暗黑主题滚动条样式
+  // Dark theme scrollbar styles
   ::v-deep .ant-table-body,
   ::v-deep .ant-table-container,
   ::v-deep .ant-table-content,
@@ -1063,7 +1057,7 @@ body.realdark .trading-records {
     color: #868993 !important;
   }
 
-  // 暗黑主题滚动条样式
+  // Dark theme scrollbar styles
   ::v-deep .ant-table-body,
   ::v-deep .ant-table-container,
   ::v-deep .ant-table-content,
@@ -1142,7 +1136,7 @@ body.realdark .trading-records {
 </style>
 
 <style lang="less">
-/* 暗黑主题适配 - 使用更高优先级的选择器 */
+/* Dark theme adaptation - Use higher priority selectors */
 .theme-dark .trading-records,
 .theme-dark .trading-records *,
 body.dark .trading-records,
diff --git a/frontend_vue/src/views/trading-assistant/index.vue b/frontend_vue/src/views/trading-assistant/index.vue
index 70d2dec..dd439de 100644
--- a/frontend_vue/src/views/trading-assistant/index.vue
+++ b/frontend_vue/src/views/trading-assistant/index.vue
@@ -53,7 +53,7 @@
       <a-tab-pane key="strategy">
         <span slot="tab">{{ tt('trading-assistant.tabs.strategyManage', 'Strategy Manager') }}</span>
         <a-row :gutter="24" class="strategy-layout">
-          <!-- 左侧：策略列表 -->
+          <!-- Left side: strategy list -->
           <a-col
             :xs="24"
             :sm="24"
@@ -70,7 +70,7 @@
                 </a-button>
               </div>
 
-              <!-- 分组方式切换 -->
+              <!-- Grouping mode switch -->
               <div class="group-mode-switch">
                 <span class="group-mode-label">{{ $t('trading-assistant.groupBy') }}:</span>
                 <a-radio-group v-model="groupByMode" size="small" button-style="solid">
@@ -101,9 +101,9 @@
                 </div>
 
                 <div v-else class="strategy-grouped-list">
-                  <!-- 策略组列表 -->
+                  <!-- Strategy groups -->
                   <div v-for="group in groupedStrategies.groups" :key="group.id" class="strategy-group">
-                    <!-- 策略组头部 -->
+                    <!-- Group header -->
                     <div class="strategy-group-header" @click="toggleGroup(group.id)">
                       <div class="group-header-left">
                         <a-icon :type="collapsedGroups[group.id] ? 'right' : 'down'" class="collapse-icon" />
@@ -139,7 +139,7 @@
                         </a-dropdown>
                       </div>
                     </div>
-                    <!-- 策略组内的策略列表（可折叠） -->
+                    <!-- Strategies inside the group (collapsible) -->
                     <div v-show="!collapsedGroups[group.id]" class="strategy-group-content">
                       <div
                         v-for="item in group.strategies"
@@ -229,6 +229,10 @@
                                 <a-icon type="edit" />
                                 {{ $t('trading-assistant.editStrategy') }}
                               </a-menu-item>
+                              <a-menu-item key="backtest">
+                                <a-icon type="experiment" />
+                                {{ $t('dashboard.indicator.action.backtest') }}
+                              </a-menu-item>
                               <a-menu-divider />
                               <a-menu-item key="delete" class="danger-item">
                                 <a-icon type="delete" />
@@ -242,7 +246,7 @@
                     </div>
                   </div>
 
-                  <!-- 未分组的策略列表 -->
+                  <!-- Ungrouped strategies -->
                   <div
                     v-for="item in groupedStrategies.ungrouped"
                     :key="item.id"
@@ -305,6 +309,10 @@
                             <a-icon type="edit" />
                             {{ $t('trading-assistant.editStrategy') }}
                           </a-menu-item>
+                          <a-menu-item key="backtest">
+                            <a-icon type="experiment" />
+                            {{ $t('dashboard.indicator.action.backtest') }}
+                          </a-menu-item>
                           <a-menu-divider />
                           <a-menu-item key="delete" class="danger-item">
                             <a-icon type="delete" />
@@ -320,7 +328,7 @@
             </a-card>
           </a-col>
 
-          <!-- 右侧：策略详情和交易记录 -->
+          <!-- Right side: strategy details and runtime records -->
           <a-col
             :xs="24"
             :sm="24"
@@ -349,7 +357,7 @@
             </div>
 
             <div v-else class="strategy-detail-panel">
-              <!-- 策略头部信息 -->
+              <!-- Strategy header -->
               <a-card :bordered="false" class="strategy-header-card">
                 <div class="strategy-header">
                   <div class="header-left">
@@ -361,7 +369,7 @@
                       </div>
                     </div>
 
-                    <!-- 关键数据卡片 -->
+                    <!-- Key stats -->
                     <div class="key-stats-grid">
                       <div
                         class="stat-card"
@@ -401,7 +409,7 @@
                       </div>
                     </div>
 
-                    <!-- 策略详情标签 -->
+                    <!-- Strategy tags -->
                     <div class="strategy-tags">
                       <div class="tag-item" v-if="selectedStrategy.trading_config">
                         <a-icon type="stock" />
@@ -432,6 +440,13 @@
                     </div>
                   </div>
                   <div class="header-right">
+                    <a-button
+                      size="large"
+                      class="action-btn"
+                      @click="goToBacktestCenter(selectedStrategy)">
+                      <a-icon type="experiment" />
+                      {{ $t('dashboard.indicator.action.backtest') }}
+                    </a-button>
                     <a-button
                       v-if="selectedStrategy.status === 'stopped'"
                       type="primary"
@@ -454,7 +469,7 @@
                 </div>
               </a-card>
 
-              <!-- 策略详情标签页 -->
+              <!-- Strategy detail tabs -->
               <a-card :bordered="false" class="strategy-content-card">
                 <a-tabs defaultActiveKey="positions">
                   <a-tab-pane key="positions" :tab="$t('trading-assistant.tabs.positions')">
@@ -482,7 +497,7 @@
       </a-tab-pane>
     </a-tabs>
 
-    <!-- 创建/编辑策略弹窗 - 合并版本 -->
+    <!-- Create/edit strategy modal -->
     <a-modal
       :visible="showFormModal"
       :title="editingStrategy ? $t('trading-assistant.editStrategy') : $t('trading-assistant.createStrategy')"
@@ -514,9 +529,9 @@
         </a-steps>
 
         <div class="form-container">
-          <!-- 步骤1: 指标策略-选择技术指标 / AI策略-基础配置 -->
+          <!-- Step 1: indicator selection or base strategy configuration -->
           <div v-show="currentStep === 0" class="step-content">
-            <!-- 指标策略：选择技术指标 -->
+            <!-- Indicator strategy: choose the technical indicator -->
             <div v-if="strategyType === 'indicator'">
               <a-form :form="form" layout="vertical">
                 <a-form-item :label="$t('trading-assistant.form.indicator')">
@@ -579,7 +594,7 @@
                   </div>
                 </a-form-item>
 
-                <!-- 指标参数配置 -->
+                <!-- Indicator parameter configuration -->
                 <a-form-item v-if="indicatorParams.length > 0" :label="$t('trading-assistant.form.indicatorParams')">
                   <div class="indicator-params-form">
                     <a-row :gutter="16">
@@ -591,26 +606,26 @@
                               <a-icon type="question-circle" style="margin-left: 4px; color: #999;" />
                             </a-tooltip>
                           </label>
-                          <!-- 整数类型 -->
+                          <!-- Integer type -->
                           <a-input-number
                             v-if="param.type === 'int'"
                             v-model="indicatorParamValues[param.name]"
                             :precision="0"
                             style="width: 100%;"
                             size="small" />
-                          <!-- 浮点数类型 -->
+                          <!-- Float type -->
                           <a-input-number
                             v-else-if="param.type === 'float'"
                             v-model="indicatorParamValues[param.name]"
                             :precision="4"
                             style="width: 100%;"
                             size="small" />
-                          <!-- 布尔类型 -->
+                          <!-- Boolean type -->
                           <a-switch
                             v-else-if="param.type === 'bool'"
                             v-model="indicatorParamValues[param.name]"
                             size="small" />
-                          <!-- 字符串类型 -->
+                          <!-- String type -->
                           <a-input
                             v-else
                             v-model="indicatorParamValues[param.name]"
@@ -656,7 +671,7 @@
 
                 <!-- ===== Strategy type: only show in advanced mode ===== -->
                 <div v-show="isAdvancedMode || editingStrategy || showAdvancedSettings">
-                  <!-- 策略类型选择 -->
+                  <!-- Strategy type selection -->
                   <a-form-item :label="$t('trading-assistant.form.strategyType')">
                     <a-radio-group
                       v-decorator="['cs_strategy_type', { initialValue: 'single' }]"
@@ -670,7 +685,7 @@
                   </a-form-item>
                 </div>
 
-                <!-- 截面策略配置 -->
+                <!-- Cross-sectional strategy configuration -->
                 <template v-if="form.getFieldValue('cs_strategy_type') === 'cross_sectional'">
                   <a-form-item :label="$t('trading-assistant.form.symbolList')">
                     <a-select
@@ -751,11 +766,11 @@
                   </a-form-item>
                 </template>
 
-                <!-- 单标的策略：原有的标的选择 -->
+                <!-- Single-symbol strategy: legacy symbol selector -->
                 <a-form-item
                   v-if="form.getFieldValue('cs_strategy_type') !== 'cross_sectional'"
                   :label="isEditMode ? $t('trading-assistant.form.symbol') : $t('trading-assistant.form.symbols')">
-                  <!-- 编辑模式：单选 -->
+                  <!-- Edit mode: single select -->
                   <a-select
                     v-if="isEditMode"
                     v-decorator="['symbol', { rules: [{ required: true, message: $t('trading-assistant.validation.symbolRequired') }] }]"
@@ -777,7 +792,7 @@
                         <span v-if="item.name" class="symbol-name-extra">{{ item.name }}</span>
                       </div>
                     </a-select-option>
-                    <!-- 添加交易对选项 -->
+                    <!-- Add-symbol option -->
                     <a-select-option key="__add_symbol_option__" value="__add_symbol_option__" class="add-symbol-option">
                       <div style="width: 100%; text-align: center; padding: 4px 0; color: #1890ff; cursor: pointer;">
                         <a-icon type="plus" style="margin-right: 4px;" />
@@ -785,7 +800,7 @@
                       </div>
                     </a-select-option>
                   </a-select>
-                  <!-- 创建模式：多选 -->
+                  <!-- Create mode: multi-select -->
                   <a-select
                     v-else
                     v-model="selectedSymbols"
@@ -809,7 +824,7 @@
                         <span v-if="item.name" class="symbol-name-extra">{{ item.name }}</span>
                       </div>
                     </a-select-option>
-                    <!-- 添加交易对选项 -->
+                    <!-- Add-symbol option -->
                     <a-select-option key="__add_symbol_option__" value="__add_symbol_option__" class="add-symbol-option">
                       <div style="width: 100%; text-align: center; padding: 4px 0; color: #1890ff; cursor: pointer;">
                         <a-icon type="plus" style="margin-right: 4px;" />
@@ -925,7 +940,7 @@
 
           <!-- Step 2: params (backtest-like / trading params) -->
           <div v-show="currentStep === 1 || (isSimpleMode && currentStep === 0 && showAdvancedSettings)" class="step-content">
-            <!-- 指标策略：策略参数 -->
+            <!-- Indicator strategy: strategy parameters -->
             <div v-if="strategyType === 'indicator'">
               <a-form :form="form" layout="vertical">
                 <!-- Backtest-like configuration (aligned with indicator-analysis BacktestModal) -->
@@ -1580,7 +1595,7 @@
       </template>
     </a-modal>
 
-    <!-- 添加交易对弹窗 -->
+    <!-- Add-symbol modal -->
     <a-modal
       :title="$t('trading-assistant.form.addSymbolTitle')"
       :visible="showAddSymbolModal"
@@ -1593,7 +1608,7 @@
       :maskClosable="false"
       :keyboard="false">
       <div class="add-symbol-modal-content">
-        <!-- 市场类型Tab -->
+        <!-- Market tabs -->
         <a-tabs v-model="addSymbolMarket" @change="handleAddSymbolMarketChange" class="market-tabs">
           <a-tab-pane
             v-for="marketType in addSymbolMarketTypes"
@@ -1602,7 +1617,7 @@
           </a-tab-pane>
         </a-tabs>
 
-        <!-- 搜索输入框 -->
+        <!-- Search input -->
         <div class="symbol-search-section">
           <a-input-search
             v-model="addSymbolKeyword"
@@ -1618,7 +1633,7 @@
           </a-input-search>
         </div>
 
-        <!-- 搜索结果 -->
+        <!-- Search results -->
         <div v-if="symbolSearchResults.length > 0" class="search-results-section">
           <div class="section-title">
             <a-icon type="search" style="margin-right: 4px;" />
@@ -1645,7 +1660,7 @@
           </a-list>
         </div>
 
-        <!-- 热门标的 -->
+        <!-- Hot symbols -->
         <div class="hot-symbols-section">
           <div class="section-title">
             <a-icon type="fire" style="color: #ff4d4f; margin-right: 4px;" />
@@ -1675,7 +1690,7 @@
           </a-spin>
         </div>
 
-        <!-- 选中的标的显示 -->
+        <!-- Selected symbol preview -->
         <div v-if="selectedAddSymbol" class="selected-symbol-section">
           <div class="section-title">
             <a-icon type="check-circle" style="color: #52c41a; margin-right: 4px;" />
@@ -1705,7 +1720,7 @@ import PositionRecords from './components/PositionRecords.vue'
 import PerformanceAnalysis from './components/PerformanceAnalysis.vue'
 import StrategyLogs from './components/StrategyLogs.vue'
 
-// 常见加密货币交易对
+// Common crypto trading pairs
 const CRYPTO_SYMBOLS = [
   'BTC/USDT', 'ETH/USDT', 'BNB/USDT', 'SOL/USDT', 'ADA/USDT',
   'XRP/USDT', 'DOGE/USDT', 'DOT/USDT', 'MATIC/USDT', 'AVAX/USDT',
@@ -1732,8 +1747,8 @@ const BROKER_OPTIONS = [
   // Future brokers can be added here:
   // { value: 'td', labelKey: 'td', name: 'TD Ameritrade' },
   // { value: 'schwab', labelKey: 'schwab', name: 'Charles Schwab' },
-  // { value: 'futu', labelKey: 'futu', name: 'Futu (富途)' },
-  // { value: 'tiger', labelKey: 'tiger', name: 'Tiger Brokers (老虎证券)' },
+  // { value: 'futu', labelKey: 'futu', name: 'Futu' },
+  // { value: 'tiger', labelKey: 'tiger', name: 'Tiger Brokers' },
 ]
 
 // Forex broker options
@@ -1768,10 +1783,10 @@ export default {
     isSimpleMode () {
       return this.creationMode === 'simple'
     },
-    // Map internal currentStep to displayed step index for simple mode
+    // Map the internal step index to the displayed step in simple mode.
     displayCurrentStep () {
       if (this.isSimpleMode && !this.editingStrategy) {
-        // simple mode: step 0 → 0, step 2 → 1 (step 1 is skipped)
+        // Simple mode maps step 0 -> 0 and step 2 -> 1 because step 1 is skipped.
         return this.currentStep === 0 ? 0 : 1
       }
       return this.currentStep
@@ -1795,7 +1810,7 @@ export default {
     isBrokerMarket () {
       return this.isIBKRMarket || this.isMT5Market
     },
-    // 预处理交易所列表，包含显示名称，提升性能
+    // Precompute exchange options with display names to avoid repeated translation work.
     formattedExchangeOptions () {
       return EXCHANGE_OPTIONS.map(exchange => {
         let label = ''
@@ -1808,7 +1823,7 @@ export default {
             }
           }
         } catch (e) {
-          // 忽略翻译错误
+          // Ignore translation lookup failures and fall back to the raw id.
         }
 
         if (!label) {
@@ -1884,9 +1899,9 @@ export default {
       }
       return false
     },
-    // 是否显示模拟交易开关
+    // Whether to show the demo trading switch.
     showDemoTradingSwitch () {
-      // 目前仅支持 Binance 的 Demo Trading
+      // Demo trading is currently available only for Binance.
       return this.currentExchangeId && this.currentExchangeId.toLowerCase() === 'binance'
     },
     // Broker options for US stocks (with i18n support)
@@ -1951,14 +1966,14 @@ export default {
         }
       })
     },
-    // 策略分组显示
+    // Strategy grouping display
     groupedStrategies () {
       if (this.groupByMode === 'symbol') {
         return this.groupedBySymbol
       }
       return this.groupedByStrategy
     },
-    // 按策略分组（原有逻辑）
+    // Group by strategy (existing grouping logic).
     groupedByStrategy () {
       const groups = {}
       const ungrouped = []
@@ -1971,7 +1986,7 @@ export default {
               id: groupId,
               baseName: s.group_base_name || s.strategy_name.split('-')[0],
               strategies: [],
-              // 统计信息
+              // Aggregate counters
               runningCount: 0,
               stoppedCount: 0
             }
@@ -1987,7 +2002,7 @@ export default {
         }
       }
 
-      // 转换为数组，按创建时间排序
+      // Convert to an array and sort by creation time.
       const groupList = Object.values(groups).sort((a, b) => {
         const aTime = Math.max(...a.strategies.map(s => s.created_at || 0))
         const bTime = Math.max(...b.strategies.map(s => s.created_at || 0))
@@ -1996,7 +2011,7 @@ export default {
 
       return { groups: groupList, ungrouped }
     },
-    // 按 Symbol 分组
+    // Group by symbol
     groupedBySymbol () {
       const groups = {}
       const ungrouped = []
@@ -2014,7 +2029,7 @@ export default {
               stoppedCount: 0
             }
           }
-          // 添加策略详情信息
+          // Attach detail metadata used by the grouped list UI.
           const strategyInfo = {
             ...s,
             displayInfo: {
@@ -2034,7 +2049,7 @@ export default {
         }
       }
 
-      // 转换为数组，按 symbol 名称排序
+      // Convert to an array and sort by symbol name.
       const groupList = Object.values(groups).sort((a, b) => {
         return a.baseName.localeCompare(b.baseName)
       })
@@ -2090,8 +2105,8 @@ export default {
       loadingIndicators: false,
       availableIndicators: [],
       selectedIndicator: null,
-      indicatorParams: [], // 指标参数声明
-      indicatorParamValues: {}, // 用户设置的参数值
+      indicatorParams: [], // Indicator parameter declaration.
+      indicatorParamValues: {}, // User-configured indicator values.
       cryptoSymbols: CRYPTO_SYMBOLS,
       // Watchlist symbols (same source as indicator-analysis page)
       loadingWatchlist: false,
@@ -2102,17 +2117,17 @@ export default {
       testing: false,
       testResult: null,
       connectionTestResult: null,
-      indicatorsLoaded: false, // 标记指标是否已加载
-      editingStrategy: null, // 正在编辑的策略
-      currentEquity: null, // 当前净值
-      equityPollingTimer: null, // 净值轮询定时器
+      indicatorsLoaded: false, // Whether indicators have already been loaded.
+      editingStrategy: null, // Strategy currently being edited.
+      currentEquity: null, // Current equity value.
+      equityPollingTimer: null, // Equity polling timer.
       // Backtest-like UI state (same as indicator-analysis BacktestModal step1)
       backtestCollapseKeys: ['risk'],
       trailingEnabledUi: false,
       entryPctMaxUi: 100,
       aiFilterEnabledUi: false,
-      isEditMode: false, // 是否为编辑模式
-      supportedIPs: [], // 白名单IP列表
+      isEditMode: false, // Whether the form is in edit mode.
+      supportedIPs: [], // Whitelisted IPs for exchange APIs.
       executionModeUi: 'signal',
       liveDisclaimerAckUi: false,
       notifyChannelsUi: ['browser'],
@@ -2132,15 +2147,15 @@ export default {
       exchangeCredentials: [],
       saveCredentialUi: false,
       suppressApiClearOnce: false,
-      // 多币种选择（创建模式）
+      // Multi-symbol selection in create mode.
       selectedSymbols: [],
-      // 截面策略标的列表
+      // Symbol list for cross-sectional strategy mode.
       crossSectionalSymbols: [],
-      // 策略组折叠状态
+      // Collapsed state per strategy group.
       collapsedGroups: {},
-      // 分组模式: 'strategy' 或 'symbol'
+      // Grouping mode: 'strategy' or 'symbol'.
       groupByMode: 'strategy',
-      // 添加交易对弹窗相关
+      // Add-symbol modal state.
       showAddSymbolModal: false,
       addSymbolMarket: 'Crypto',
       addSymbolMarketTypes: [
@@ -2250,7 +2265,7 @@ export default {
         this.loadingWatchlist = false
       }
     },
-    // ====== 添加交易对弹窗相关方法 ======
+    // ====== Add-symbol modal helpers ======
     handleCloseAddSymbolModal () {
       this.showAddSymbolModal = false
       this.addSymbolKeyword = ''
@@ -2264,20 +2279,20 @@ export default {
       this.symbolSearchResults = []
       this.selectedAddSymbol = null
       this.hasSearchedSymbol = false
-      // 加载该市场的热门标的
+      // Load hot symbols for the selected market.
       this.loadHotSymbols(market)
     },
-    // 搜索输入框变化时的处理（防抖）
+    // Debounce symbol search input changes.
     handleSymbolSearchInputChange (e) {
       const keyword = e.target.value
       this.addSymbolKeyword = keyword
 
-      // 清除之前的定时器
+      // Clear the previous debounce timer.
       if (this.searchTimer) {
         clearTimeout(this.searchTimer)
       }
 
-      // 如果关键词为空，清空搜索结果和状态
+      // Reset search state when the input is empty.
       if (!keyword || keyword.trim() === '') {
         this.symbolSearchResults = []
         this.hasSearchedSymbol = false
@@ -2285,12 +2300,12 @@ export default {
         return
       }
 
-      // 防抖：500ms后执行搜索
+      // Run the search 500ms after typing stops.
       this.searchTimer = setTimeout(() => {
         this.searchSymbolsInModal(keyword)
       }, 500)
     },
-    // 搜索或直接添加（整合逻辑）
+    // Search first, or add directly when nothing matches.
     async handleSearchSymbol (keyword) {
       if (!keyword || !keyword.trim()) {
         return
@@ -2301,20 +2316,20 @@ export default {
         return
       }
 
-      // 如果有搜索结果，不处理（让用户选择）
+      // If there are search results already, wait for explicit user selection.
       if (this.symbolSearchResults.length > 0) {
         return
       }
 
-      // 如果没有搜索结果，直接添加
+      // If no result was found, offer direct add.
       if (this.hasSearchedSymbol && this.symbolSearchResults.length === 0) {
         this.handleDirectAdd()
       } else {
-        // 执行搜索
+        // Trigger the search.
         this.searchSymbolsInModal(keyword)
       }
     },
-    // 搜索标的（在添加股票弹窗中）
+    // Search symbols inside the add-symbol modal.
     async searchSymbolsInModal (keyword) {
       if (!keyword || keyword.trim() === '') {
         this.symbolSearchResults = []
@@ -2345,7 +2360,7 @@ export default {
         this.searchingSymbol = false
       }
     },
-    // 直接添加（搜索无结果时）
+    // Add the typed symbol directly when search returns no results.
     handleDirectAdd () {
       if (!this.addSymbolKeyword || !this.addSymbolKeyword.trim()) {
         this.$message.warning(this.$t('dashboard.analysis.modal.addStock.pleaseEnterSymbol'))
@@ -2357,11 +2372,11 @@ export default {
         return
       }
 
-      // 设置选中的标的（手动输入，名称会在后端获取）
+      // Keep the manual symbol selection; the backend can resolve its display name later.
       this.selectedAddSymbol = {
         market: this.addSymbolMarket,
         symbol: this.addSymbolKeyword.trim().toUpperCase(),
-        name: '' // 名称由后端通过API获取
+        name: '' // The backend resolves the display name if available.
       }
     },
     handleSelectAddSymbol (item) {
@@ -2371,7 +2386,7 @@ export default {
         name: item.name || ''
       }
     },
-    // 加载热门标的
+    // Load the market's hot symbols.
     async loadHotSymbols (market) {
       if (!market) {
         market = this.addSymbolMarket || 'Crypto'
@@ -2399,16 +2414,16 @@ export default {
       }
     },
     async handleConfirmAddSymbol () {
-      // 确定要添加的交易对
+      // Resolve the target symbol to add.
       let market = ''
       let symbol = ''
 
-      // 检查是否选中了标的（从数据库选择或手动输入）
+      // Accept either a selected symbol or the manual input value.
       if (this.selectedAddSymbol) {
         market = this.selectedAddSymbol.market
         symbol = this.selectedAddSymbol.symbol.toUpperCase()
       } else if (this.addSymbolKeyword && this.addSymbolKeyword.trim()) {
-        // 如果没有选中，但搜索框有输入，使用搜索框的值
+        // Fall back to the typed value when nothing was selected.
         if (!this.addSymbolMarket) {
           this.$message.warning(this.$t('dashboard.analysis.modal.addStock.pleaseSelectMarket'))
           return
@@ -2422,7 +2437,7 @@ export default {
 
       this.addingSymbol = true
       try {
-        // 调用添加自选API
+        // Call the watchlist API.
         const res = await addWatchlist({
           userid: 1,
           market: market,
@@ -2430,21 +2445,21 @@ export default {
         })
         if (res && res.code === 1) {
           this.$message.success(this.$t('dashboard.analysis.message.addStockSuccess'))
-          // 重新加载自选列表
+          // Reload the watchlist.
           await this.loadWatchlist()
-          // 自动选中新添加的交易对
+          // Select the newly added symbol automatically.
           const newValue = `${market}:${symbol}`
           if (this.isEditMode) {
             this.form.setFieldsValue({ symbol: newValue })
             this.handleWatchlistSymbolChange(newValue)
           } else {
-            // 多选模式：添加到已选列表
+            // In multi-select mode, append it to the current selection.
             if (!this.selectedSymbols.includes(newValue)) {
               this.selectedSymbols = [...this.selectedSymbols, newValue]
             }
             this.handleMultiSymbolChange(this.selectedSymbols)
           }
-          // 关闭弹窗
+          // Close the modal.
           this.handleCloseAddSymbolModal()
         } else {
           this.$message.error(res?.msg || this.$t('dashboard.analysis.message.addStockFailed'))
@@ -2456,27 +2471,27 @@ export default {
         this.addingSymbol = false
       }
     },
-    // ====== 添加交易对弹窗相关方法 END ======
+    // ====== End add-symbol modal helpers ======
     filterWatchlistOption (input, option) {
       const value = option.componentOptions?.propsData?.value || ''
-      // 始终显示"添加"选项
+      // Always keep the special "add symbol" option visible.
       if (value === '__add_symbol_option__') return true
       return String(value).toLowerCase().includes(String(input || '').toLowerCase())
     },
     filterWatchlistOptionWithAdd (input, option) {
       const value = option.componentOptions?.propsData?.value || ''
-      // 始终显示"添加"选项
+      // Always keep the special "add symbol" option visible.
       if (value === '__add_symbol_option__') return true
       return String(value).toLowerCase().includes(String(input || '').toLowerCase())
     },
     handleMultiSymbolChangeWithAdd (vals) {
-      // 检查是否点击了"添加"选项
+      // Check whether the special "add symbol" option was clicked.
       if (vals && vals.includes('__add_symbol_option__')) {
-        // 从选中列表中移除特殊选项
+        // Remove the helper option from the selected values.
         this.selectedSymbols = vals.filter(v => v !== '__add_symbol_option__')
-        // 打开添加弹窗
+        // Open the add-symbol modal.
         this.showAddSymbolModal = true
-        // 加载热门标的
+        // Load hot symbols for the current market.
         this.loadHotSymbols(this.addSymbolMarket)
         return
       }
@@ -2484,25 +2499,25 @@ export default {
     },
     handleStrategyTypeChange (e) {
       const strategyType = e.target.value
-      // 当切换到单标的策略时，清空截面策略的标的列表
+      // Clear the basket selection when switching back to a single-symbol strategy.
       if (strategyType === 'single') {
         this.crossSectionalSymbols = []
       }
     },
     handleCrossSectionalSymbolChange (vals) {
-      // 检查是否点击了"添加"选项
+      // Check whether the special "add symbol" option was clicked.
       if (vals && vals.includes('__add_symbol_option__')) {
-        // 从选中列表中移除特殊选项
+        // Remove the helper option from the selected values.
         this.crossSectionalSymbols = vals.filter(v => v !== '__add_symbol_option__')
-        // 打开添加弹窗
+        // Open the add-symbol modal.
         this.showAddSymbolModal = true
-        // 加载热门标的
+        // Load hot symbols for the current market.
         this.loadHotSymbols(this.addSymbolMarket)
         return
       }
       this.crossSectionalSymbols = vals || []
 
-      // 更新市场类型基于选中的标的
+      // Keep the market category aligned with the first selected symbol.
       if (vals && vals.length > 0) {
         const firstVal = vals[0]
         if (typeof firstVal === 'string' && firstVal.includes(':')) {
@@ -2522,15 +2537,15 @@ export default {
       return colors[market] || 'default'
     },
     handleWatchlistSymbolChange (val) {
-      // 检查是否点击了"添加"选项
+      // Check whether the special "add symbol" option was clicked.
       if (val === '__add_symbol_option__') {
-        // 重置表单值（不选中特殊选项）
+        // Reset the field value without keeping the helper option selected.
         this.$nextTick(() => {
           this.form.setFieldsValue({ symbol: undefined })
         })
-        // 打开添加弹窗
+        // Open the add-symbol modal.
         this.showAddSymbolModal = true
-        // 加载热门标的
+        // Load hot symbols for the current market.
         this.loadHotSymbols(this.addSymbolMarket)
         return
       }
@@ -2742,16 +2757,16 @@ export default {
       try {
         const res = await getStrategyList()
         if (res.code === 1) {
-          // 显示所有策略（包括指标策略和AI策略）
+          // Show all strategies returned by the backend.
           const allStrategies = res.data.strategies || []
           this.strategies = allStrategies
-          // 如果有选中的策略，更新它
+          // Refresh the currently selected strategy reference if possible.
           if (this.selectedStrategy) {
             const updated = this.strategies.find(s => s.id === this.selectedStrategy.id)
             if (updated) {
               this.selectedStrategy = updated
             } else {
-              // 如果选中的策略被过滤掉了，清空选中状态
+              // Clear the selection if the strategy no longer exists.
               this.selectedStrategy = null
             }
           }
@@ -2864,7 +2879,7 @@ export default {
       this.$router.replace({ path: this.$route.path, query: {} }).catch(() => {})
     },
     handleEditStrategy (strategy) {
-      // 如果策略正在运行，提示用户先停止
+      // Running strategies must be stopped before editing.
       if (strategy.status === 'running') {
         this.$message.warning(this.$t('trading-assistant.messages.runningWarning'))
         return
@@ -2901,12 +2916,12 @@ export default {
       })
     },
     async loadStrategyDataToForm (strategy) {
-      // 先加载指标列表（如果需要）
+      // Ensure the indicator catalog is available before filling the form.
       if (!this.indicatorsLoaded) {
         await this.loadIndicators()
       }
 
-      // 使用 nextTick 确保表单已初始化
+      // Wait for the modal form fields to mount before writing values.
       await this.$nextTick()
 
       // Market / execution / notification defaults (backward compatible)
@@ -2988,24 +3003,23 @@ export default {
         notify_webhook: strategy.notification_config?.targets?.webhook || ''
       })
 
-      // 加载指标数据
+      // Restore indicator selection and saved parameter values.
       if (strategy.indicator_config && strategy.indicator_config.indicator_id) {
-        // 查找对应的指标，确保ID类型一致（处理 string vs number 问题）
+        // Match by stringified id to avoid number/string mismatch issues.
         const targetId = strategy.indicator_config.indicator_id
-        // 使用字符串比较处理类型不匹配问题（string vs number）
         const indicator = this.availableIndicators.find(ind => {
           return String(ind.id) === String(targetId)
         })
 
         if (indicator) {
-          // 找到匹配的指标，使用指标对象中的ID（确保类型一致）
+          // Reuse the normalized id from the loaded indicator list.
           const finalId = String(indicator.id)
           this.form.setFieldsValue({
             indicator_id: finalId
           })
           await this.handleIndicatorChange(finalId)
 
-          // 恢复已保存的指标参数值 - 使用 $set 确保响应式
+          // Restore saved indicator parameter values while keeping reactivity.
           const savedParams = strategy.trading_config?.indicator_params
           if (savedParams && typeof savedParams === 'object') {
             Object.keys(savedParams).forEach(key => {
@@ -3015,7 +3029,7 @@ export default {
             })
           }
         } else {
-          // 如果找不到，仍然设置值，但可能显示为ID
+          // Keep the raw id if the catalog entry cannot be resolved.
           this.form.setFieldsValue({
             indicator_id: String(targetId)
           })
@@ -3079,14 +3093,14 @@ export default {
         }
       }
 
-      // 加载交易配置
+      // Restore trading configuration.
       if (strategy.trading_config) {
         const tc = strategy.trading_config || {}
         const trailingObj = (tc.trailing && typeof tc.trailing === 'object') ? tc.trailing : null
         const scaleObj = (tc.scale && typeof tc.scale === 'object') ? tc.scale : null
         const posObj = (tc.position && typeof tc.position === 'object') ? tc.position : null
 
-        // 加载截面策略配置
+        // Restore cross-sectional settings if this is a basket strategy.
         const strategyType = tc.strategy_type || strategy.strategy_type || 'single'
         if (strategyType === 'cross_sectional') {
           this.form.setFieldsValue({
@@ -3095,11 +3109,11 @@ export default {
             long_ratio: tc.long_ratio || 0.5,
             rebalance_frequency: tc.rebalance_frequency || 'daily'
           })
-          // 加载标的列表
+          // Restore the basket symbol list.
           if (tc.symbol_list && Array.isArray(tc.symbol_list)) {
             this.crossSectionalSymbols = tc.symbol_list
           } else if (strategy.symbol_list) {
-            // 如果trading_config中没有，尝试从主表字段读取
+            // Fall back to the top-level field if trading_config has no symbol list.
             try {
               const symbolList = typeof strategy.symbol_list === 'string' ? JSON.parse(strategy.symbol_list) : strategy.symbol_list
               if (Array.isArray(symbolList)) {
@@ -3161,7 +3175,7 @@ export default {
           adverse_reduce_size_pct: (tc.adverse_reduce_size_pct !== undefined) ? (tc.adverse_reduce_size_pct || 0) : (adverseReduceObj ? (adverseReduceObj.sizePct || 0) : 0),
           adverse_reduce_max_times: (tc.adverse_reduce_max_times !== undefined) ? (tc.adverse_reduce_max_times || 0) : (adverseReduceObj ? (adverseReduceObj.maxTimes || 0) : 0),
           entry_pct: (tc.entry_pct === 0 || tc.entry_pct) ? tc.entry_pct : (posObj && posObj.entryPct ? posObj.entryPct : 100),
-          // AI智能决策过滤
+          // AI decision filter
           enable_ai_filter: aiFilterEnabled
         })
 
@@ -3173,9 +3187,9 @@ export default {
     },
     handleSelectStrategy (strategy) {
       this.selectedStrategy = strategy
-      this.currentEquity = null // 重置当前净值
+      this.currentEquity = null // Reset the live equity display.
       this.loadStrategyDetails()
-      this.startEquityPolling() // 开始轮询净值
+      this.startEquityPolling() // Start polling the live equity display.
     },
     async loadStrategyDetails () {
       if (!this.selectedStrategy) {
@@ -3214,7 +3228,7 @@ export default {
       this.stopEquityPolling()
       if (!this.selectedStrategy) return
 
-      // 初始加载一次
+      // Load once immediately before starting the interval.
       this.loadStrategyDetails()
 
       // Dist polls more aggressively to keep the detail header responsive.
@@ -3266,11 +3280,25 @@ export default {
         case 'edit':
           this.handleEditStrategy(strategy)
           break
+        case 'backtest':
+          this.goToBacktestCenter(strategy)
+          break
         case 'delete':
           this.handleDeleteStrategy(strategy)
           break
       }
     },
+    goToBacktestCenter (strategy) {
+      const target = strategy || this.selectedStrategy
+      if (!target || !target.id) return
+      this.$router.push({
+        path: '/backtest-center',
+        query: {
+          tab: 'strategy',
+          strategy_id: String(target.id)
+        }
+      })
+    },
     toggleGroup (groupId) {
       this.$set(this.collapsedGroups, groupId, !this.collapsedGroups[groupId])
     },
@@ -3333,7 +3361,7 @@ export default {
             if (res.code === 1) {
               const count = res.data?.success_ids?.length || strategyIds.length
               this.$message.success(this.$t('trading-assistant.messages.batchDeleteSuccess', { count }))
-              // 如果删除的策略包含当前选中的策略，清空选中状态
+              // Clear the detail panel if the deleted batch contained the selected strategy.
               if (this.selectedStrategy && strategyIds.includes(this.selectedStrategy.id)) {
                 this.selectedStrategy = null
                 this.stopEquityPolling()
@@ -3354,7 +3382,7 @@ export default {
         if (res.code === 1) {
           this.$message.success(this.$t('trading-assistant.messages.startSuccess'))
           this.loadStrategies()
-          // 更新选中的策略状态
+          // Update the selected strategy state immediately for a smoother UI.
           if (this.selectedStrategy && this.selectedStrategy.id === id) {
             this.selectedStrategy.status = 'running'
           }
@@ -3371,7 +3399,7 @@ export default {
         if (res.code === 1) {
           this.$message.success(this.$t('trading-assistant.messages.stopSuccess'))
           this.loadStrategies()
-          // 更新选中的策略状态
+          // Update the selected strategy state immediately for a smoother UI.
           if (this.selectedStrategy && this.selectedStrategy.id === id) {
             this.selectedStrategy.status = 'stopped'
           }
@@ -3399,7 +3427,7 @@ export default {
               this.$message.success(this.$t('trading-assistant.messages.deleteSuccess'))
               if (this.selectedStrategy && this.selectedStrategy.id === strategy.id) {
                 this.selectedStrategy = null
-                this.stopEquityPolling() // 停止轮询
+                this.stopEquityPolling() // Stop detail polling after deleting the selected strategy.
               }
               this.loadStrategies()
             } else {
@@ -3428,22 +3456,22 @@ export default {
     getTradeDirectionText (direction) {
       if (!direction) return ''
       const directionMap = {
-        long: this.$t('trading-assistant.form.tradeDirectionLong') || '做多',
-        short: this.$t('trading-assistant.form.tradeDirectionShort') || '做空',
-        both: this.$t('trading-assistant.form.tradeDirectionBoth') || '双向'
+        long: this.$t('trading-assistant.form.tradeDirectionLong') || 'Long',
+        short: this.$t('trading-assistant.form.tradeDirectionShort') || 'Short',
+        both: this.$t('trading-assistant.form.tradeDirectionBoth') || 'Both'
       }
       return directionMap[direction] || direction
     },
-    // 指标相关方法
+    // Indicator helpers
     async handleIndicatorSelectFocus () {
-      // 懒加载：只在用户点击选择框时才加载指标
+      // Lazy-load indicators only when the select is first focused.
       if (!this.indicatorsLoaded && !this.loadingIndicators) {
         await this.loadIndicators()
       }
     },
     async loadIndicators () {
       if (this.loadingIndicators) {
-        // 如果正在加载，等待加载完成
+        // Wait for the current indicator request to finish.
         return new Promise((resolve) => {
           const checkInterval = setInterval(() => {
             if (!this.loadingIndicators) {
@@ -3458,13 +3486,13 @@ export default {
         return Promise.resolve()
       }
 
-      // 获取用户ID
+      // Resolve the current user id with a local-mode fallback.
       const userInfo = this.$store.getters.userInfo || {}
       const userId = userInfo.id || 1
 
       this.loadingIndicators = true
       try {
-        // 使用和 indicator-analysis 页面相同的接口
+        // Reuse the same endpoint as indicator-analysis.
         const res = await request({
           url: '/api/indicator/getIndicators',
           method: 'get',
@@ -3474,7 +3502,7 @@ export default {
         })
 
         if (res.code === 1 && res.data) {
-          // 将所有指标（包括选购的和自己创建的）合并到一个数组
+          // Merge all indicators, including purchased and custom items.
           const indicators = res.data.map(item => ({
             id: item.id,
             name: item.name,
@@ -3503,7 +3531,7 @@ export default {
       this.selectedIndicator = this.availableIndicators.find(ind => String(ind.id) === idStr)
       this.applyAutoStrategyName(this.selectedIndicator)
 
-      // 获取指标参数声明
+      // Load the indicator parameter declaration.
       this.indicatorParams = []
       this.indicatorParamValues = {}
       if (indicatorId) {
@@ -3511,10 +3539,10 @@ export default {
           const res = await this.$http.get('/api/indicator/getIndicatorParams', {
             params: { indicator_id: indicatorId }
           })
-          // 响应拦截器已返回 response.data，所以直接访问 res.code 和 res.data
+          // The response interceptor already returns response.data.
           if (res && res.code === 1 && Array.isArray(res.data)) {
             this.indicatorParams = res.data
-            // 初始化参数值为默认值 - 先构建完整对象再赋值，确保响应式
+            // Build the full object before assignment so Vue keeps it reactive.
             const paramValues = {}
             res.data.forEach(p => {
               paramValues[p.name] = p.default
@@ -3528,7 +3556,7 @@ export default {
     },
     handleMarketTypeChange (e) {
       const marketType = e.target.value
-      // 如果切换到现货，自动设置交易方向为做多，杠杆为1
+      // Spot mode only supports long direction with 1x leverage.
       if (marketType === 'spot') {
         this.form.setFieldsValue({
           trade_direction: 'long',
@@ -3649,14 +3677,14 @@ export default {
     getIndicatorTypeName (type) {
       return this.$t(`trading-assistant.indicatorType.${type}`) || type
     },
-    // 交易所相关方法
+    // Exchange helpers
     getExchangeName (exchange) {
       if (exchange.labelKey) {
         const translationKey = `trading-assistant.exchangeNames.${exchange.labelKey}`
         const translated = this.$t(translationKey)
-        // 如果翻译不存在，返回键值本身，否则返回翻译后的名称
+        // Fall back to the raw exchange id when no translation exists.
         if (translated === translationKey) {
-          // 翻译不存在，返回交易所ID的首字母大写
+          // Format the exchange id with a capitalized first letter.
           return exchange.value.charAt(0).toUpperCase() + exchange.value.slice(1)
         }
         return translated
@@ -3665,16 +3693,16 @@ export default {
     },
     getExchangeDisplayName (exchangeId) {
       if (!exchangeId) return ''
-      // 查找对应的交易所选项
+      // Look up the matching exchange option first.
       const exchange = this.exchangeOptions.find(ex => ex.value === exchangeId)
       if (exchange) {
         return this.getExchangeName(exchange)
       }
-      // 如果找不到，返回格式化的交易所ID
+      // Fall back to a formatted exchange id.
       return exchangeId.charAt(0).toUpperCase() + exchangeId.slice(1)
     },
     getExchangeTagColor (exchangeId) {
-      // 为不同交易所设置不同的标签颜色
+      // Use distinct tag colors for different exchanges.
       const colorMap = {
         binance: 'gold',
         okx: 'blue',
@@ -3717,7 +3745,7 @@ export default {
       return colorMap[exchangeId] || 'default'
     },
     handleApiConfigChange () {
-      // 当API配置字段变化时，清空测试结果，需要重新测试
+      // Clear the connection test result when API fields change.
       this.testResult = null
       this.connectionTestResult = null
     },
@@ -3764,53 +3792,53 @@ export default {
     getPlaceholder (fieldType) {
       const placeholders = {
         okx: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key',
-          passphrase: '请输入Passphrase（创建API时设置）'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key',
+          passphrase: 'Enter the passphrase used when creating the API key'
         },
         okex: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key',
-          passphrase: '请输入Passphrase（创建API时设置）'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key',
+          passphrase: 'Enter the passphrase used when creating the API key'
         },
         binance: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key'
         },
         coinbaseexchange: {
-          api_key: '请输入API Key（或Key Name）',
-          secret_key: '请输入API Secret（或Private Key）',
-          passphrase: '请输入Passphrase（Legacy Pro API需要）'
+          api_key: 'Enter API Key (or Key Name)',
+          secret_key: 'Enter API Secret (or Private Key)',
+          passphrase: 'Enter passphrase (required for Legacy Pro API)'
         },
         kucoin: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key',
-          passphrase: '请输入Passphrase'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key',
+          passphrase: 'Enter passphrase'
         },
         gate: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key'
         },
         mexc: {
-          api_key: '请输入Access Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter Access Key',
+          secret_key: 'Enter Secret Key'
         },
         kraken: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key'
         },
         bitfinex: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key'
         },
         bybit: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key'
         },
         bitget: {
-          api_key: '请输入API Key',
-          secret_key: '请输入Secret Key',
-          passphrase: '请输入Passphrase（Legacy Pro API需要）'
+          api_key: 'Enter API Key',
+          secret_key: 'Enter Secret Key',
+          passphrase: 'Enter passphrase (required for Legacy Pro API)'
         }
       }
 
@@ -3818,7 +3846,7 @@ export default {
       if (exchangePlaceholders[fieldType]) {
         return exchangePlaceholders[fieldType]
       }
-      // 默认占位符使用多语言
+      // Use localized fallback placeholders by default.
       const fieldLabels = {
         'api_key': this.$t('trading-assistant.placeholders.inputApiKey'),
         'secret_key': this.$t('trading-assistant.placeholders.inputSecretKey'),
@@ -3988,7 +4016,7 @@ export default {
         this.testing = false
       }
     },
-    // 表单步骤控制
+    // Form step control
     handleNext () {
       if (this.currentStep === 0) {
         // Step 1: basic config
@@ -4000,24 +4028,24 @@ export default {
           fieldsToValidate.push('initial_capital', 'market_type', 'leverage', 'trade_direction', 'timeframe')
         }
 
-        // 编辑模式需要验证 symbol 字段
+        // Edit mode still needs to validate the symbol field.
         if (this.isEditMode) {
           fieldsToValidate.push('symbol')
         }
         this.form.validateFields(fieldsToValidate, (err, values) => {
           if (err) return
 
-          // 创建模式：验证多币种选择
+          // In create mode, validate the selected symbol collection.
           if (!this.isEditMode) {
             const strategyType = this.form.getFieldValue('cs_strategy_type') || 'single'
             if (strategyType === 'cross_sectional') {
-              // 截面策略：验证截面策略标的列表
+              // Cross-sectional strategies require a non-empty basket.
               if (!this.crossSectionalSymbols || this.crossSectionalSymbols.length === 0) {
                 this.$message.warning(this.$t('trading-assistant.validation.symbolsRequired'))
                 return
               }
             } else {
-              // 单标的策略：验证多币种选择
+              // Single-symbol batch creation still requires at least one symbol.
               if (!this.selectedSymbols || this.selectedSymbols.length === 0) {
                 this.$message.warning(this.$t('trading-assistant.validation.symbolsRequired'))
                 return
@@ -4145,7 +4173,7 @@ export default {
               if (leverage > 125) leverage = 125
             }
 
-            // 构建基础 payload
+            // Build the shared payload shape used by create and update requests.
             const basePayload = {
               strategy_name: values.strategy_name,
               market_category: this.selectedMarketCategory || 'Crypto',
@@ -4215,11 +4243,11 @@ export default {
                 entry_pct: (values.entry_pct === 0 || values.entry_pct) ? values.entry_pct : 100,
                 commission: values.commission || 0,
                 slippage: values.slippage || 0,
-                // AI智能决策过滤
+                // AI decision filter
                 enable_ai_filter: enableAiFilter,
-                // 指标参数（外部传递）
+                // Indicator parameters collected from the UI.
                 indicator_params: this.indicatorParamValues,
-                // 截面策略配置
+                // Cross-sectional strategy settings.
                 strategy_type: values.cs_strategy_type || 'single',
                 symbol_list: values.cs_strategy_type === 'cross_sectional' ? this.crossSectionalSymbols : undefined,
                 portfolio_size: values.cs_strategy_type === 'cross_sectional' ? (values.portfolio_size || 10) : undefined,
@@ -4230,7 +4258,7 @@ export default {
 
             let res
             if (this.editingStrategy) {
-              // 编辑模式：更新单个策略
+              // Edit mode updates one existing strategy.
               let parsedSymbol = values.symbol
               if (typeof parsedSymbol === 'string' && parsedSymbol.includes(':')) {
                 const idx = parsedSymbol.indexOf(':')
@@ -4240,21 +4268,20 @@ export default {
               basePayload.trading_config.symbol = parsedSymbol
               res = await updateStrategy(this.editingStrategy.id, basePayload)
             } else {
-              // 创建模式：批量创建策略或截面策略
+              // Create mode either batches single-symbol strategies or creates one basket strategy.
               basePayload.user_id = 1
               basePayload.strategy_type = 'IndicatorStrategy'
 
-              // 如果是截面策略，只创建一个策略（使用 createStrategy）
+              // Cross-sectional mode stores the basket in trading_config and creates one strategy only.
               if (values.cs_strategy_type === 'cross_sectional') {
-                // 截面策略：只创建一个策略，标的列表存储在 trading_config 中
-                basePayload.strategy_type = 'IndicatorStrategy' // 保持为 IndicatorStrategy，截面类型在 trading_config 中
-                // 截面策略不需要设置 symbol，因为它是多标的的
+                basePayload.strategy_type = 'IndicatorStrategy' // Keep IndicatorStrategy; basket mode is encoded in trading_config.
+                // Basket strategies do not use a single symbol field.
                 basePayload.trading_config.symbol = null
-                // 使用 createStrategy 创建单个策略
+                // Use createStrategy for the single basket record.
                 res = await createStrategy(basePayload)
               } else {
-                // 单标的策略：批量创建多个策略（每个标的一个策略）
-                basePayload.symbols = this.selectedSymbols // 多币种数组
+                // Single-symbol mode creates one strategy per selected symbol.
+                basePayload.symbols = this.selectedSymbols // Multi-symbol array
                 res = await batchCreateStrategies(basePayload)
               }
             }
@@ -4263,7 +4290,7 @@ export default {
               if (this.isEditMode) {
                 this.$message.success(this.$t('trading-assistant.messages.updateSuccess'))
               } else {
-                // 根据策略类型计算创建的策略数量
+                // Derive the created strategy count from the strategy mode.
                 const strategyType = values.cs_strategy_type || 'single'
                 const symbolCount = strategyType === 'cross_sectional'
                   ? this.crossSectionalSymbols.length
@@ -4311,7 +4338,7 @@ export default {
       })
     },
     getDropdownContainer (triggerNode) {
-      // 始终将下拉菜单挂载到body，避免被父容器裁剪
+      // Always mount dropdowns under body to avoid clipping inside parent containers.
       return document.body
     }
   }
@@ -4319,7 +4346,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-// 主色调变量
+// Primary color tokens
 @primary-color: #1890ff;
 @primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
 @success-color: #0ecb81;
@@ -4547,7 +4574,7 @@ export default {
     margin-top: 22px;
   }
 
-  // 移动端适配
+  // Mobile layout adjustments
   @media (max-width: 768px) {
     min-height: auto;
     margin: -24px;
@@ -4765,14 +4792,14 @@ export default {
                     margin-top: 2px;
                   }
 
-                  // 确保文本可换行
+                  // Allow long values to wrap cleanly.
                   &>span {
                     word-break: break-word;
                     line-height: 1.5;
                     flex: 1;
                   }
 
-                  // 对于包含数值的span
+                  // Keep numeric spans readable when wrapping.
                   span:not(.anticon) {
                     display: inline;
                     word-break: break-word;
@@ -4780,7 +4807,7 @@ export default {
                   }
                 }
 
-                // 如果参数过多，使用单列布局
+                // Collapse to one column when metadata gets too dense.
                 @media (max-width: 480px) {
                   grid-template-columns: 1fr;
 
@@ -4851,7 +4878,7 @@ export default {
     }
   }
 
-  // 超小屏幕适配
+  // Extra-small screen adjustments
   @media (max-width: 480px) {
     .strategy-list-col {
       max-height: 45vh;
@@ -4938,7 +4965,7 @@ export default {
         }
       }
 
-      // 分组模式切换
+      // Grouping mode switch
       .group-mode-switch {
         display: flex;
         align-items: center;
@@ -4988,7 +5015,7 @@ export default {
         border-bottom: 1px solid #f0f0f0;
       }
 
-      // 策略分组列表
+      // Grouped strategy list
       .strategy-grouped-list {
         .strategy-group {
           margin-bottom: 12px;
@@ -5131,7 +5158,7 @@ export default {
           box-shadow: 0 4px 16px rgba(24, 144, 255, 0.15);
         }
 
-        // 移动端优化点击区域
+        // Increase the tappable area on mobile.
         @media (max-width: 768px) {
           padding: 12px 8px;
           margin: 0 4px 4px 4px;
@@ -5209,17 +5236,17 @@ export default {
         }
 
         /deep/ .ant-list-item-meta-description {
-          max-width: calc(100% - 20px); // 留出空间给右侧操作按钮和选中边框
+          max-width: calc(100% - 20px); // Keep room for action buttons and the active border.
           overflow: hidden;
 
           .strategy-item-info {
             display: flex !important;
-            gap: 12px; // 减小间距
+            gap: 12px; // Slightly tighter spacing works better here.
             margin-top: 8px;
             font-size: 12px;
             color: var(--text-color-secondary, #8c8c8c);
             align-items: center;
-            flex-wrap: nowrap; // 禁止换行
+            flex-wrap: nowrap; // Keep the metadata row on a single line.
             max-width: 100%;
             overflow: hidden;
 
@@ -5392,7 +5419,7 @@ export default {
       min-height: 100%;
 
       .strategy-header-card {
-        flex-shrink: 0; // 防止头部被压缩
+        flex-shrink: 0; // Prevent the header card from being squeezed.
         background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
         border: none;
         border-radius: @border-radius-lg;
@@ -5492,7 +5519,7 @@ export default {
               }
             }
 
-            // 关键数据卡片网格
+            // Key metric cards
             .key-stats-grid {
               display: flex;
               flex-wrap: wrap;
@@ -5575,7 +5602,7 @@ export default {
               }
             }
 
-            // 策略标签
+            // Strategy tags
             .strategy-tags {
               display: flex;
               flex-wrap: wrap;
@@ -5666,7 +5693,7 @@ export default {
         border-radius: @border-radius-lg;
         box-shadow: @card-shadow;
         transition: all 0.3s ease;
-        min-height: 400px; // 确保有足够的最小高度
+        min-height: 400px; // Keep enough vertical space for the tab content.
 
         &:hover {
           box-shadow: @card-shadow-hover;
@@ -5766,7 +5793,7 @@ export default {
       }
     }
 
-    // 左侧策略列表卡片
+    // Left strategy list card
     .strategy-list-col {
       .strategy-list-card {
         background: linear-gradient(180deg, #1e222d 0%, #1a1e28 100%);
@@ -5837,7 +5864,7 @@ export default {
       }
     }
 
-    // 右侧策略详情卡片
+    // Right strategy detail card
     .strategy-detail-col {
       .strategy-empty-detail-card {
         border-color: rgba(59, 130, 246, 0.18);
@@ -5964,7 +5991,7 @@ export default {
       }
     }
 
-    // 空状态
+    // Empty state
     .empty-detail {
       /deep/ .ant-empty-description {
         color: #868993;
@@ -6059,7 +6086,7 @@ export default {
   margin-top: 8px;
 }
 
-// 弹窗样式
+// Modal styles
 .steps-container {
   margin-bottom: 24px;
 
@@ -6306,7 +6333,7 @@ export default {
   color: #ff4d4f;
 }
 
-// 移动端弹窗样式
+// Mobile modal styles
 /deep/ .mobile-modal {
   .ant-modal {
     top: 20px;
@@ -6342,7 +6369,7 @@ export default {
   }
 }
 
-// 添加交易对弹窗样式
+// Add-symbol modal styles
 .add-symbol-modal-content {
   .market-tabs {
     margin-bottom: 16px;
diff --git a/frontend_vue/src/views/user-manage/index.vue b/frontend_vue/src/views/user-manage/index.vue
index d0fa1f5..6baa77b 100644
--- a/frontend_vue/src/views/user-manage/index.vue
+++ b/frontend_vue/src/views/user-manage/index.vue
@@ -141,9 +141,9 @@
             <div class="summary-info">
               <div class="summary-value">{{ strategySummary.running_strategies || 0 }}</div>
               <div class="summary-sub">
-                {{ $t('systemOverview.live') || '实盘' }}: {{ strategySummary.running_live_strategies || 0 }}
+                {{ $t('systemOverview.live') || 'Live' }}: {{ strategySummary.running_live_strategies || 0 }}
                 /
-                {{ $t('systemOverview.signal') || '仅通知' }}: {{ strategySummary.running_signal_strategies || 0 }}
+                {{ $t('systemOverview.signal') || 'Signal Only' }}: {{ strategySummary.running_signal_strategies || 0 }}
               </div>
               <div class="summary-label">{{ $t('systemOverview.runningStrategies') || 'Running' }}</div>
             </div>
@@ -155,9 +155,9 @@
             <div class="summary-info">
               <div class="summary-value">{{ formatNumber(strategySummary.total_capital) }}</div>
               <div class="summary-sub">
-                {{ $t('systemOverview.live') || '实盘' }}: {{ formatNumber(strategySummary.live_capital) }}
+                {{ $t('systemOverview.live') || 'Live' }}: {{ formatNumber(strategySummary.live_capital) }}
                 /
-                {{ $t('systemOverview.signal') || '仅通知' }}: {{ formatNumber(strategySummary.signal_capital) }}
+                {{ $t('systemOverview.signal') || 'Signal Only' }}: {{ formatNumber(strategySummary.signal_capital) }}
               </div>
               <div class="summary-label">{{ $t('systemOverview.totalCapital') || 'Total Capital' }}</div>
             </div>
@@ -172,9 +172,9 @@
                 <span class="roi-badge">{{ strategySummary.total_roi || 0 }}%</span>
               </div>
               <div class="summary-sub">
-                {{ $t('systemOverview.live') || '实盘' }}: {{ formatPnl(strategySummary.live_pnl) }}
+                {{ $t('systemOverview.live') || 'Live' }}: {{ strategySummary.live_pnl }}
                 /
-                {{ $t('systemOverview.signal') || '仅通知' }}: {{ formatPnl(strategySummary.signal_pnl) }}
+                {{ $t('systemOverview.signal') || 'Signal Only' }}: {{ strategySummary.signal_pnl }}
               </div>
               <div class="summary-label">{{ $t('systemOverview.totalPnl') || 'Total PnL' }}</div>
             </div>
diff --git a/frontend_vue/src/views/user/Login.vue b/frontend_vue/src/views/user/Login.vue
index b12b64e..ff8051f 100644
--- a/frontend_vue/src/views/user/Login.vue
+++ b/frontend_vue/src/views/user/Login.vue
@@ -912,39 +912,39 @@ export default {
           })
 
           if (res.code === 1 && res.data?.token) {
-            // 保存 token（先保存到 storage，确保请求拦截器能读取到）
+            // Save token (save to storage first to ensure request interceptor can read it)
             const expiresAt = new Date().getTime() + 7 * 24 * 60 * 60 * 1000
             storage.set(ACCESS_TOKEN, res.data.token, expiresAt)
             this.$store.commit('SET_TOKEN', res.data.token)
 
-            // 保存用户信息（从登录接口返回的 userinfo）
+            // Save user information (userinfo returned from the login interface)
             if (res.data.userinfo) {
               const userInfoData = { ...res.data.userinfo }
-              // 确保有 is_demo 字段，避免 GetInfo 认为缓存过期
+                // Ensure is_demo field exists to avoid GetInfo considering cache as expired
               if (typeof userInfoData.is_demo === 'undefined') {
                 userInfoData.is_demo = false
               }
 
-              // 保存到 storage，确保 GetInfo 能读取到
+                // Save to storage to ensure GetInfo can read it
               storage.set(USER_INFO, userInfoData, expiresAt)
               this.$store.commit('SET_INFO', userInfoData)
 
-              // 设置用户名
+                // Set username
               if (userInfoData.nickname) {
                 this.$store.commit('SET_NAME', { name: userInfoData.nickname, welcome: timeFix() })
               } else if (userInfoData.username) {
                 this.$store.commit('SET_NAME', { name: userInfoData.username, welcome: timeFix() })
               }
 
-              // 设置头像
+                // Set avatar
               if (userInfoData.avatar) {
                 this.$store.commit('SET_AVATAR', userInfoData.avatar)
               }
 
-              // 设置角色（如果有）
+                // Set roles (if any)
               let roles = []
               if (userInfoData.role) {
-                // 处理 role 可能是对象或数组的情况
+                  // Handle case where role might be an object or an array
                 if (Array.isArray(userInfoData.role)) {
                   roles = userInfoData.role
                 } else if (typeof userInfoData.role === 'object') {
@@ -953,37 +953,37 @@ export default {
                   roles = [{ id: userInfoData.role, permissionList: [] }]
                 }
               } else {
-                // 如果没有角色信息，设置一个默认角色对象，避免路由守卫卡住
+                  // If no role information, set a default role object to avoid route guard getting stuck
                 roles = [{ id: 'default', permissionList: [] }]
               }
               this.$store.commit('SET_ROLES', roles)
               storage.set(USER_ROLES, roles, expiresAt)
             }
 
-            // 确保 roles 已经被正确设置（使用 Vue.nextTick 确保状态已更新）
+              // Ensure roles have been correctly set (use Vue.nextTick to ensure state is updated)
             await this.$nextTick()
 
-            // 验证 token 和 roles 是否已正确设置
+              // Verify if token and roles are correctly set
             const currentToken = storage.get(ACCESS_TOKEN)
             const currentRoles = this.$store.getters.roles
             console.log('Token after save:', currentToken ? (typeof currentToken === 'string' ? 'string' : typeof currentToken) : 'missing')
             console.log('Roles after save:', currentRoles.length > 0 ? `has ${currentRoles.length} roles` : 'empty')
 
-            // 如果 roles 为空，设置默认角色
+              // If roles are empty, set default role
             if (currentRoles.length === 0) {
               const defaultRoles = [{ id: 'default', permissionList: [] }]
               this.$store.commit('SET_ROLES', defaultRoles)
               storage.set(USER_ROLES, defaultRoles, expiresAt)
             }
 
-            // 等待一下确保 token 已经设置到请求拦截器中
+              // Wait a bit to ensure token is set in request interceptor
             await new Promise(resolve => setTimeout(resolve, 200))
 
-            // 重置路由，强制重新生成（根据新用户的角色）
-            // 注意：ResetRoutes 只是清空路由，不会触发路由守卫
+              // Reset routes, force regeneration (based on new user's roles)
+              // Note: ResetRoutes only clears routes, it doesn't trigger route guards
             this.$store.dispatch('ResetRoutes')
 
-            // 直接跳转，路由守卫会检查 roles，如果 roles 已设置就不会调用 GetInfo
+              // Jump directly; route guard will check roles, if roles are set it won't call GetInfo
             const isNew = res.data.is_new_user
             this.$router.push({ path: '/' }).then(() => {
               this.$notification.success({
@@ -994,7 +994,7 @@ export default {
               })
             }).catch(err => {
               console.error('Router push error:', err)
-              // 即使跳转失败，也显示成功消息
+                // Show success message even if navigation fails
               this.$notification.success({
                 message: isNew ? (this.$t('user.login.welcomeNew') || 'Welcome!') : 'Welcome',
                 description: isNew
@@ -1111,39 +1111,39 @@ export default {
             this.$message.success(this.$t('user.register.success') || 'Registration successful')
 
             if (res.data?.token) {
-              // 保存 token（先保存到 storage，确保请求拦截器能读取到）
+              // Save token (save to storage first to ensure request interceptor can read it)
               const expiresAt = new Date().getTime() + 7 * 24 * 60 * 60 * 1000
               storage.set(ACCESS_TOKEN, res.data.token, expiresAt)
               this.$store.commit('SET_TOKEN', res.data.token)
 
-              // 保存用户信息（从注册接口返回的 userinfo）
+              // Save user information (userinfo returned from the registration interface)
               if (res.data.userinfo) {
                 const userInfoData = { ...res.data.userinfo }
-                // 确保有 is_demo 字段，避免 GetInfo 认为缓存过期
+                  // Ensure is_demo field exists to avoid GetInfo considering cache as expired
                 if (typeof userInfoData.is_demo === 'undefined') {
                   userInfoData.is_demo = false
                 }
 
-                // 保存到 storage，确保 GetInfo 能读取到
+                  // Save to storage to ensure GetInfo can read it
                 storage.set(USER_INFO, userInfoData, expiresAt)
                 this.$store.commit('SET_INFO', userInfoData)
 
-                // 设置用户名
+                // Set username
                 if (userInfoData.nickname) {
                   this.$store.commit('SET_NAME', { name: userInfoData.nickname, welcome: timeFix() })
                 } else if (userInfoData.username) {
                   this.$store.commit('SET_NAME', { name: userInfoData.username, welcome: timeFix() })
                 }
 
-                // 设置头像
+                // Set avatar
                 if (userInfoData.avatar) {
                   this.$store.commit('SET_AVATAR', userInfoData.avatar)
                 }
 
-                // 设置角色（如果有）
+                // Set roles (if any)
                 let roles = []
                 if (userInfoData.role) {
-                  // 处理 role 可能是对象或数组的情况
+                  // Handle case where role might be an object or an array
                   if (Array.isArray(userInfoData.role)) {
                     roles = userInfoData.role
                   } else if (typeof userInfoData.role === 'object') {
@@ -1152,37 +1152,37 @@ export default {
                     roles = [{ id: userInfoData.role, permissionList: [] }]
                   }
                 } else {
-                  // 如果没有角色信息，设置一个默认角色对象，避免路由守卫卡住
+                  // If no role information, set a default role object to avoid route guard getting stuck
                   roles = [{ id: 'default', permissionList: [] }]
                 }
               this.$store.commit('SET_ROLES', roles)
               storage.set(USER_ROLES, roles, expiresAt)
               }
 
-              // 确保 roles 已经被正确设置（使用 Vue.nextTick 确保状态已更新）
+              // Ensure roles have been correctly set (use Vue.nextTick to ensure state is updated)
               await this.$nextTick()
 
-              // 验证 token 和 roles 是否已正确设置
+              // Verify if token and roles are correctly set
               const currentToken = storage.get(ACCESS_TOKEN)
               const currentRoles = this.$store.getters.roles
               console.log('Register - Token after save:', currentToken ? (typeof currentToken === 'string' ? 'string' : typeof currentToken) : 'missing')
               console.log('Register - Roles after save:', currentRoles.length > 0 ? `has ${currentRoles.length} roles` : 'empty')
 
-              // 如果 roles 为空，设置默认角色
+              // If roles are empty, set default role
               if (currentRoles.length === 0) {
                 const defaultRoles = [{ id: 'default', permissionList: [] }]
                 this.$store.commit('SET_ROLES', defaultRoles)
                 storage.set(USER_ROLES, defaultRoles, expiresAt)
               }
 
-              // 等待一下确保 token 已经设置到请求拦截器中
+              // Wait a bit to ensure token is set in request interceptor
               await new Promise(resolve => setTimeout(resolve, 200))
 
-              // 重置路由，强制重新生成（根据新用户的角色）
-              // 注意：ResetRoutes 只是清空路由，不会触发路由守卫
+              // Reset routes, force regeneration (based on new user's roles)
+              // Note: ResetRoutes only clears routes, it doesn't trigger route guards
               this.$store.dispatch('ResetRoutes')
 
-              // 直接跳转，路由守卫会检查 roles，如果 roles 已设置就不会调用 GetInfo
+              // Jump directly; route guard will check roles, if roles are set it won't call GetInfo
               this.$router.push({ path: '/' }).then(() => {
                 this.$notification.success({
                   message: 'Welcome',
@@ -1190,7 +1190,7 @@ export default {
                 })
               }).catch(err => {
                 console.error('Router push error:', err)
-                // 即使跳转失败，也显示成功消息
+                // Show success message even if navigation fails
                 this.$notification.success({
                   message: 'Welcome',
                   description: `${timeFix()}, welcome to QuantDinger!`
diff --git a/frontend_vue/src/views/user/RegisterResult.vue b/frontend_vue/src/views/user/RegisterResult.vue
index 829b689..2d8fc5c 100644
--- a/frontend_vue/src/views/user/RegisterResult.vue
+++ b/frontend_vue/src/views/user/RegisterResult.vue
@@ -6,7 +6,7 @@
     >
       <template #extra>
         <a-button type="primary" @click="$router.push({ path: '/' })">
-          {{ $t('user.register-result.back-home') || '返回首页' }}
+          {{ $t('user.register-result.back-home') || 'Back Home' }}
         </a-button>
       </template>
     </a-result>
diff --git a/scripts/translate_chinese_to_english.py b/scripts/translate_chinese_to_english.py
new file mode 100644
index 0000000..ed60133
--- /dev/null
+++ b/scripts/translate_chinese_to_english.py
@@ -0,0 +1,319 @@
+#!/usr/bin/env python3
+"""
+Translate Chinese comments/docstrings in Python files and Chinese prose in
+selected Markdown files into English.
+
+This intentionally skips:
+- generated frontend assets
+- dedicated localized docs such as *_CN.md / *_CH.md / *_TW.md
+- regular code string literals that are not docstrings, to avoid changing
+  application behavior
+"""
+
+from __future__ import annotations
+
+import argparse
+import io
+import json
+import pathlib
+import re
+import sys
+import time
+import tokenize
+import urllib.parse
+import urllib.request
+from dataclasses import dataclass
+
+
+ROOT = pathlib.Path(__file__).resolve().parents[1]
+HAN_RE = re.compile(r"[\u3400-\u9FFF]")
+TRANSLATE_URL = (
+    "https://translate.googleapis.com/translate_a/single"
+    "?client=gtx&sl=auto&tl=en&dt=t&q={query}"
+)
+
+
+PYTHON_GLOBS = [
+    "backend_api_python/*.py",
+    "backend_api_python/app/**/*.py",
+    "scripts/*.py",
+]
+
+MARKDOWN_TARGETS = [
+    "backend_api_python/README.md",
+    "docs/FRONTEND_FAST_ANALYSIS.md",
+    "docs/CHANGELOG.md",
+    "docs/THIRD_PARTY_INTEGRATIONS.md",
+]
+
+SKIP_PATH_PATTERNS = [
+    "/frontend/dist/",
+    "/docs/README_CN.md",
+    "_CN.md",
+    "_CH.md",
+    "_TW.md",
+    "_JA.md",
+    "_KO.md",
+]
+
+
+@dataclass(order=True)
+class Replacement:
+    start: int
+    end: int
+    text: str
+
+
+def contains_han(text: str) -> bool:
+    return bool(HAN_RE.search(text))
+
+
+_CACHE: dict[str, str] = {}
+
+
+def translate_text(text: str) -> str:
+    text = text.strip("\n")
+    if not text or not contains_han(text):
+        return text
+    if text in _CACHE:
+        return _CACHE[text]
+
+    url = TRANSLATE_URL.format(query=urllib.parse.quote(text))
+    last_error: Exception | None = None
+    for attempt in range(3):
+        try:
+            with urllib.request.urlopen(url, timeout=20) as resp:
+                payload = json.loads(resp.read().decode("utf-8"))
+            translated = "".join(part[0] for part in payload[0] if part and part[0])
+            translated = normalize_translation(translated)
+            _CACHE[text] = translated
+            return translated
+        except Exception as exc:  # pragma: no cover - best effort script
+            last_error = exc
+            time.sleep(0.5 * (attempt + 1))
+    raise RuntimeError(f"Translation failed for text: {text!r}") from last_error
+
+
+def normalize_translation(text: str) -> str:
+    text = text.replace("K line", "K-line")
+    text = text.replace("K Line", "K-line")
+    text = text.replace("candlestick line", "candlestick")
+    text = text.replace("real-time market", "realtime market")
+    text = text.replace("real-time quote", "realtime quote")
+    return text
+
+
+def line_start_offsets(text: str) -> list[int]:
+    starts = [0]
+    for match in re.finditer(r"\n", text):
+        starts.append(match.end())
+    return starts
+
+
+def to_offset(line_starts: list[int], lineno: int, col: int) -> int:
+    return line_starts[lineno - 1] + col
+
+
+def translate_preserving_indent(text: str) -> str:
+    lines = text.splitlines(keepends=True)
+    out: list[str] = []
+    for line in lines:
+        body = line.rstrip("\r\n")
+        newline = line[len(body):]
+        if not contains_han(body):
+            out.append(line)
+            continue
+        leading = re.match(r"\s*", body).group(0)
+        translated = translate_text(body[len(leading):])
+        out.append(f"{leading}{translated}{newline}")
+    return "".join(out)
+
+
+DOCSTRING_ONE_LINE_RE = re.compile(
+    r'^(?P<indent>\s*)(?P<prefix>[rubfRUBF]*)(?P<quote>"""|\'\'\')(?P<body>.*?)(?P=quote)(?P<trailing>\s*(?:#.*)?)$'
+)
+DOCSTRING_START_RE = re.compile(
+    r'^(?P<indent>\s*)(?P<prefix>[rubfRUBF]*)(?P<quote>"""|\'\'\')(?P<body>.*)$'
+)
+
+
+def translate_python_file(path: pathlib.Path) -> bool:
+    src = path.read_text(encoding="utf-8")
+    docstring_translated = translate_python_docstrings(src)
+    line_starts = line_start_offsets(docstring_translated)
+    replacements: list[Replacement] = []
+
+    for token in tokenize.generate_tokens(io.StringIO(docstring_translated).readline):
+        if token.type != tokenize.COMMENT or not contains_han(token.string):
+            continue
+        leading = re.match(r"#\s*", token.string).group(0)
+        translated = translate_text(token.string[len(leading):])
+        replacement = f"{leading}{translated}"
+        replacements.append(
+            Replacement(
+                start=to_offset(line_starts, token.start[0], token.start[1]),
+                end=to_offset(line_starts, token.end[0], token.end[1]),
+                text=replacement,
+            )
+        )
+
+    if not replacements and docstring_translated == src:
+        return False
+
+    new_src = apply_replacements(docstring_translated, replacements)
+    if new_src != src:
+        path.write_text(new_src, encoding="utf-8")
+        return True
+    return False
+
+
+def translate_python_docstrings(src: str) -> str:
+    lines = src.splitlines(keepends=True)
+    out: list[str] = []
+    in_docstring = False
+    active_quote = ""
+
+    for line in lines:
+        stripped = line.lstrip()
+        if not in_docstring:
+            one_line = DOCSTRING_ONE_LINE_RE.match(line.rstrip("\n"))
+            if one_line and stripped.startswith(one_line.group("prefix") + one_line.group("quote")):
+                body = one_line.group("body")
+                if contains_han(body):
+                    body = translate_text(body)
+                newline = "\n" if line.endswith("\n") else ""
+                out.append(
+                    f"{one_line.group('indent')}{one_line.group('prefix')}{one_line.group('quote')}"
+                    f"{body}{one_line.group('quote')}{one_line.group('trailing')}{newline}"
+                )
+                continue
+
+            start = DOCSTRING_START_RE.match(line.rstrip("\n"))
+            if start and stripped.startswith(start.group("prefix") + start.group("quote")):
+                in_docstring = True
+                active_quote = start.group("quote")
+                body = start.group("body")
+                if contains_han(body):
+                    body = translate_text(body)
+                newline = "\n" if line.endswith("\n") else ""
+                out.append(
+                    f"{start.group('indent')}{start.group('prefix')}{start.group('quote')}{body}{newline}"
+                )
+                continue
+
+            out.append(line)
+            continue
+
+        line_no_newline = line.rstrip("\n")
+        if active_quote in line_no_newline:
+            before, after = line_no_newline.split(active_quote, 1)
+            if contains_han(before):
+                before = translate_preserving_indent(before).rstrip("\n")
+            out.append(f"{before}{active_quote}{after}{'\n' if line.endswith('\n') else ''}")
+            in_docstring = False
+            active_quote = ""
+        else:
+            out.append(translate_preserving_indent(line))
+
+    return "".join(out)
+
+
+def translate_markdown_file(path: pathlib.Path) -> bool:
+    src = path.read_text(encoding="utf-8")
+    lines = src.splitlines(keepends=True)
+    out: list[str] = []
+    in_fence = False
+    changed = False
+
+    for line in lines:
+        stripped = line.strip()
+        if stripped.startswith("```"):
+            in_fence = not in_fence
+            out.append(line)
+            continue
+        if in_fence or not contains_han(line):
+            out.append(line)
+            continue
+        translated = translate_preserving_indent(line)
+        out.append(translated)
+        changed = changed or translated != line
+
+    if changed:
+        path.write_text("".join(out), encoding="utf-8")
+    return changed
+
+
+def apply_replacements(text: str, replacements: list[Replacement]) -> str:
+    dedup: list[Replacement] = []
+    seen: set[tuple[int, int]] = set()
+    for item in sorted(replacements, reverse=True):
+        key = (item.start, item.end)
+        if key in seen:
+            continue
+        seen.add(key)
+        dedup.append(item)
+    for item in dedup:
+        text = text[: item.start] + item.text + text[item.end :]
+    return text
+
+
+def should_skip(path: pathlib.Path) -> bool:
+    posix = path.as_posix()
+    return any(pattern in posix for pattern in SKIP_PATH_PATTERNS)
+
+
+def iter_python_targets() -> list[pathlib.Path]:
+    paths: set[pathlib.Path] = set()
+    for pattern in PYTHON_GLOBS:
+        paths.update(ROOT.glob(pattern))
+    return sorted(path for path in paths if path.is_file() and not should_skip(path))
+
+
+def iter_markdown_targets() -> list[pathlib.Path]:
+    return [ROOT / target for target in MARKDOWN_TARGETS if (ROOT / target).exists()]
+
+
+def resolve_targets(args: argparse.Namespace) -> tuple[list[pathlib.Path], list[pathlib.Path]]:
+    if args.paths:
+        python_files: list[pathlib.Path] = []
+        markdown_files: list[pathlib.Path] = []
+        for raw in args.paths:
+            path = (ROOT / raw).resolve() if not pathlib.Path(raw).is_absolute() else pathlib.Path(raw)
+            if not path.exists():
+                continue
+            if path.suffix == ".py":
+                python_files.append(path)
+            elif path.suffix == ".md":
+                markdown_files.append(path)
+        return python_files, markdown_files
+    return iter_python_targets(), iter_markdown_targets()
+
+
+def main() -> int:
+    parser = argparse.ArgumentParser()
+    parser.add_argument("paths", nargs="*")
+    parser.add_argument("--verbose", action="store_true")
+    args = parser.parse_args()
+
+    python_targets, markdown_targets = resolve_targets(args)
+    changed_files: list[str] = []
+
+    for path in python_targets:
+        if args.verbose:
+            print(f"[py] {path.relative_to(ROOT).as_posix()}", file=sys.stderr)
+        if translate_python_file(path):
+            changed_files.append(path.relative_to(ROOT).as_posix())
+
+    for path in markdown_targets:
+        if args.verbose:
+            print(f"[md] {path.relative_to(ROOT).as_posix()}", file=sys.stderr)
+        if translate_markdown_file(path):
+            changed_files.append(path.relative_to(ROOT).as_posix())
+
+    for relpath in changed_files:
+        print(relpath)
+    return 0
+
+
+if __name__ == "__main__":
+    raise SystemExit(main())