文字改英文

src/App.vue

@@ -2,7 +2,7 @@
   <div class="app">
     <!-- 顶部导航 -->
     <header class="nav-bar">
-      <span class="nav-title">实时监控</span>
+      <span class="nav-title">Real-time Monitoring</span>
       <!-- <button class="layout-btn" @click="toggleLayout">
         {{ layout === 1 ? '⊞ 四画面' : '⊡ 单画面' }}
       </button> -->
@@ -24,7 +24,7 @@
 
     <!-- 底部摄像头列表抽屉 -->
     <div class="drawer-handle" @click="toggleDrawer">
-      <span>{{ drawerOpen ? '▼ 收起' : '▲ 摄像头列表' }}</span>
+      <span>{{ drawerOpen ? '▼ Collapse' : '▲ Camera List' }}</span>
     </div>
     <transition name="slide-up">
       <div class="drawer" v-if="drawerOpen">
@@ -38,9 +38,9 @@
           >
             <span class="source-dot" :class="{ on: isPlaying(source.id) }"></span>
             <span class="source-name">{{ source.desc }}</span>
-            <span class="source-badge" v-if="isPlaying(source.id)">播放中</span>
+            <span class="source-badge" v-if="isPlaying(source.id)">Playing</span>
           </div>
-          <div v-if="sourceList.length === 0" class="empty-tip">暂无摄像头</div>
+          <div v-if="sourceList.length === 0" class="empty-tip">No cameras available</div>
         </div>
       </div>
     </transition>

src/components/VideoBox.vue

@@ -5,7 +5,7 @@
       <div v-if="tipState === 'loading'" class="icon-dot"></div>
       <div v-if="tipState === 'offline'" class="deviceoffline">
         <span class="offline-icon">📵</span>
-        <span>离线</span>
+        <span>Offline</span>
       </div>
     </div>
 
@@ -14,7 +14,7 @@
       <span class="camera-name">{{ source.desc }}</span>
       <div class="alg-selector" v-if="source.alg && Object.keys(source.alg).length">
         <span class="alg-label" @click="showAlgMenu = !showAlgMenu">
-          算法: {{ currentAlgName }}
+          Algorithm: {{ currentAlgName }}
           <span class="arrow">▾</span>
         </span>
         <ul class="alg-menu" v-if="showAlgMenu">
@@ -63,8 +63,8 @@ const currentAlg = ref<string | null>(null)
 const videoInfo = ref<VideoInfo | null>(null)
 
 const currentAlgName = computed(() => {
-  if (!props.source?.alg || !currentAlg.value) return '无'
-  return props.source.alg[currentAlg.value]?.reserved_args.display_name ?? '无'
+  if (!props.source?.alg || !currentAlg.value) return 'None'
+  return props.source.alg[currentAlg.value]?.reserved_args.display_name ?? 'None'
 })
 
 function selectAlg(key: string) {