diff --git a/frontend/src/views/strategy/Code.vue b/frontend/src/views/strategy/Code.vue
index d947e0d..b5a5fd9 100644
--- a/frontend/src/views/strategy/Code.vue
+++ b/frontend/src/views/strategy/Code.vue
@@ -170,12 +170,14 @@ async function openVersions(): Promise<void> {
   }
 }
 
+const activeVersion = ref('')
 async function showDiff(h8: string): Promise<void> {
   if (!active.value) return
   diffReady.value = false
+  activeVersion.value = h8
   try {
     diffCode.value = await getCodeVersion(active.value.name, h8)
-    // 抽屉展开动画(~300ms)期间容器宽为 0,Monaco diff 在其中创建会把左右分栏算死
+    // 模态展开动画(~300ms)期间容器宽为 0,Monaco diff 在其中创建会把左右分栏算死
     // (左栏被压扁且事后 layout() 救不回)。等动画结束容器全宽后再挂载组件。
     setTimeout(() => { diffReady.value = true }, 360)
   } catch {
@@ -245,31 +247,39 @@ async function showDiff(h8: string): Promise<void> {
       </section>
     </div>
 
-    <!-- §12.6 版本历史：发起时快照列表 + 与当前代码 diff -->
-    <el-drawer :model-value="versionsOpen" size="860px" :with-header="false" append-to-body destroy-on-close @close="versionsOpen = false">
-      <div v-loading="versionsLoading" class="ver-drawer">
-      <div class="ver-head">
-        <div>
-          <div style="font-size:15px;font-weight:700;color:var(--text)">版本历史 · {{ activeName }}</div>
-          <div class="muted" style="font-size:11.5px;margin-top:2px">发起回测/模拟/实盘时的代码快照（内容寻址去重）；点「对比」查看与当前代码差异</div>
+    <!-- §12.6 版本历史：全屏模态（860px 抽屉太小看不清 diff，fullscreen 尽量吃满屏幕） -->
+    <el-dialog
+      :model-value="versionsOpen" fullscreen append-to-body destroy-on-close
+      class="ver-modal" :show-close="false" @close="versionsOpen = false"
+    >
+      <div v-loading="versionsLoading" class="ver-full">
+        <div class="ver-head">
+          <div>
+            <span style="font-size:15px;font-weight:700;color:var(--text)">版本历史 · {{ activeName }}</span>
+            <span class="muted" style="font-size:11.5px;margin-left:12px">发起回测/模拟/实盘时的代码快照 · 点版本卡片对比当前</span>
+          </div>
+          <button class="term-btn sm" @click="versionsOpen = false">关闭 (Esc)</button>
         </div>
-        <button class="term-btn sm" @click="versionsOpen = false">关闭</button>
+        <div v-if="!versions.length && !versionsLoading" class="muted" style="padding:40px 0;text-align:center;font-size:13px">
+          还没有快照——从策略档案发起过回测/模拟/实盘后自动生成
+        </div>
+        <div v-else class="ver-chips">
+          <button
+            v-for="v in versions" :key="v.code_version"
+            class="ver-chip" :class="{ on: diffCode != null && activeVersion === v.code_version }"
+            @click="showDiff(v.code_version)"
+          >
+            <span class="mono" style="color:var(--brand)">v{{ v.code_version }}</span>
+            <span class="muted mono" style="font-size:10.5px">{{ v.saved_at }}</span>
+            <span class="muted mono" style="font-size:10px">{{ (v.size / 1024).toFixed(1) }} KB</span>
+          </button>
+        </div>
+        <div v-if="diffCode != null && diffReady" class="ver-diff-full">
+          <MonacoDiff :original="diffCode" :modified="code" />
+        </div>
+        <div v-else-if="diffCode == null" class="ver-empty muted">选择上方版本开始对比 · 左=快照 右=当前 滚动联动</div>
       </div>
-      <div v-if="!versions.length && !versionsLoading" class="muted" style="padding:20px 0;text-align:center;font-size:12.5px">
-        还没有快照——从策略档案发起过回测/模拟/实盘后自动生成
-      </div>
-      <div v-for="v in versions" :key="v.code_version" class="ver-row">
-        <span class="mono" style="color:var(--brand)">v{{ v.code_version }}</span>
-        <span class="muted mono" style="font-size:11px">{{ v.saved_at }}</span>
-        <span class="muted mono" style="font-size:11px">{{ (v.size / 1024).toFixed(1) }} KB</span>
-        <button class="term-btn sm" style="margin-left:auto" @click="showDiff(v.code_version)">对比当前</button>
-      </div>
-      <div v-if="diffCode != null && diffReady" class="ver-diff">
-        <div class="muted mono" style="font-size:11px;margin-bottom:6px">左右滚动联动 · 快照 vs 当前</div>
-        <MonacoDiff :original="diffCode" :modified="code" />
-      </div>
-      </div>
-    </el-drawer>
+    </el-dialog>
   </div>
 </template>
 
@@ -402,13 +412,17 @@ async function showDiff(h8: string): Promise<void> {
   background: #05080d;
 }
 
-/* 版本历史抽屉 */
-.ver-drawer { display: flex; flex-direction: column; gap: 10px; padding: 4px 2px; }
-.ver-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
-.ver-row {
-  display: flex; align-items: center; gap: 12px; padding: 8px 10px;
-  border: 1px solid var(--border-2); border-radius: var(--r-sm);
+/* 版本历史：全屏模态 */
+.ver-full { display: flex; flex-direction: column; gap: 10px; height: calc(100vh - 60px); padding: 4px 2px; }
+.ver-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
+.ver-chips { display: flex; gap: 8px; flex-wrap: wrap; }
+.ver-chip {
+  display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px;
+  border: 1px solid var(--border-2); border-radius: var(--r-sm); background: transparent;
+  cursor: pointer; transition: border-color 0.12s var(--ease);
 }
-.ver-row:hover { background: var(--bg-hover); }
-.ver-diff { height: 460px; border: 1px solid var(--border-2); border-radius: var(--r-sm); overflow: hidden; }
+.ver-chip:hover { border-color: rgba(0, 229, 255, 0.5); }
+.ver-chip.on { border-color: var(--brand); background: rgba(0, 229, 255, 0.08); }
+.ver-diff-full { flex: 1; min-height: 0; border: 1px solid var(--border-2); border-radius: var(--r-sm); overflow: hidden; }
+.ver-empty { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 12.5px; }
 </style>
diff --git a/frontend/src/views/strategy/CodeSnapshotDrawer.vue b/frontend/src/views/strategy/CodeSnapshotDrawer.vue
index 1fc8919..9bb5103 100644
--- a/frontend/src/views/strategy/CodeSnapshotDrawer.vue
+++ b/frontend/src/views/strategy/CodeSnapshotDrawer.vue
@@ -43,30 +43,30 @@ onMounted(load)
 </script>
 
 <template>
-  <el-drawer :model-value="true" size="860px" :with-header="false" append-to-body destroy-on-close @close="emit('close')">
-    <div v-loading="loading" class="snap">
+  <el-dialog
+    :model-value="true" fullscreen append-to-body destroy-on-close
+    :show-close="false" @close="emit('close')"
+  >
+    <div v-loading="loading" class="snap-full">
       <div class="snap-head">
         <div>
-          <div style="font-size:15px;font-weight:700;color:var(--text)">代码快照 · {{ label }}</div>
-          <div class="mono muted" style="font-size:11px;margin-top:2px">
-            {{ codeFile || '…' }} · 发起版本 v{{ codeHash.slice(0, 8) }}
-          </div>
+          <span style="font-size:15px;font-weight:700;color:var(--text)">代码快照 · {{ label }}</span>
+          <span class="mono muted" style="font-size:11.5px;margin-left:12px">
+            {{ codeFile || '…' }} · 发起版本 v{{ codeHash.slice(0, 8) }} · 左=发起时快照 右=当前 滚动联动
+          </span>
         </div>
-        <button class="term-btn sm" @click="emit('close')">关闭</button>
+        <button class="term-btn sm" @click="emit('close')">关闭 (Esc)</button>
+      </div>
+      <div v-if="err" class="muted" style="flex:1;display:flex;align-items:center;justify-content:center;font-size:13px">{{ err }}</div>
+      <div v-else-if="diffReady && snapCode != null && curCode != null" class="snap-diff-full">
+        <MonacoDiff :original="snapCode" :modified="curCode" />
       </div>
-      <div v-if="err" class="muted" style="padding:24px 0;text-align:center;font-size:12.5px">{{ err }}</div>
-      <template v-else-if="diffReady && snapCode != null && curCode != null">
-        <div class="muted mono" style="font-size:11px;margin:6px 0">左=发起时快照 · 右=当前代码 · 滚动联动</div>
-        <div class="snap-diff">
-          <MonacoDiff :original="snapCode" :modified="curCode" />
-        </div>
-      </template>
     </div>
-  </el-drawer>
+  </el-dialog>
 </template>
 
 <style scoped>
-.snap { display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; }
-.snap-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
-.snap-diff { height: 520px; border: 1px solid var(--border-2); border-radius: var(--r-sm); overflow: hidden; }
+.snap-full { display: flex; flex-direction: column; gap: 10px; height: calc(100vh - 60px); padding: 4px 2px; }
+.snap-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
+.snap-diff-full { flex: 1; min-height: 0; border: 1px solid var(--border-2); border-radius: var(--r-sm); overflow: hidden; }
 </style>