diff --git a/web/frontend/src/views/DailyDirectionView.vue b/web/frontend/src/views/DailyDirectionView.vue
index 5bf0156..45da4bc 100644
--- a/web/frontend/src/views/DailyDirectionView.vue
+++ b/web/frontend/src/views/DailyDirectionView.vue
@@ -88,12 +88,11 @@ async function handleRun() {
   }
 }
 
-function formatLevels(json: string): string {
+function parseLevels(json: string): number[] {
   try {
-    const arr = JSON.parse(json) as number[]
-    return arr.join(', ')
+    return JSON.parse(json) as number[]
   } catch {
-    return '-'
+    return []
   }
 }
 
@@ -146,11 +145,17 @@ onMounted(fetchList)
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="支撑位" width="130">
-        <template #default="{ row }">{{ formatLevels(row.support) }}</template>
+      <el-table-column label="支撑位" width="160">
+        <template #default="{ row }">
+          <span v-for="(v, i) in parseLevels(row.support)" :key="'s'+i" class="level-chip sup">S{{ i + 1 }} {{ v }}</span>
+          <span v-if="!parseLevels(row.support).length">-</span>
+        </template>
       </el-table-column>
-      <el-table-column label="阻力位" width="130">
-        <template #default="{ row }">{{ formatLevels(row.resistance) }}</template>
+      <el-table-column label="阻力位" width="160">
+        <template #default="{ row }">
+          <span v-for="(v, i) in parseLevels(row.resistance)" :key="'r'+i" class="level-chip res">R{{ i + 1 }} {{ v }}</span>
+          <span v-if="!parseLevels(row.resistance).length">-</span>
+        </template>
       </el-table-column>
       <el-table-column label="明细" width="80" align="center">
         <template #default="{ row }">
@@ -172,16 +177,24 @@ onMounted(fetchList)
         </div>
 
         <div class="drawer-section">
-          <div class="drawer-label">关键价位</div>
-          <div class="drawer-levels">
-            <div class="level-block support">
-              <span class="level-tag">支撑</span>
-              <span>{{ formatLevels(selectedRow.support) || '-' }}</span>
+          <div class="drawer-label">支撑位</div>
+          <div class="level-rows">
+            <div v-for="(v, i) in parseLevels(selectedRow.support)" :key="'ds'+i" class="level-row sup">
+              <span class="level-tag">支撑{{ i + 1 }}</span>
+              <span class="level-val">{{ v }}</span>
             </div>
-            <div class="level-block resistance">
-              <span class="level-tag">阻力</span>
-              <span>{{ formatLevels(selectedRow.resistance) || '-' }}</span>
+            <div v-if="!parseLevels(selectedRow.support).length" class="level-row">-</div>
+          </div>
+        </div>
+
+        <div class="drawer-section">
+          <div class="drawer-label">阻力位</div>
+          <div class="level-rows">
+            <div v-for="(v, i) in parseLevels(selectedRow.resistance)" :key="'dr'+i" class="level-row res">
+              <span class="level-tag">阻力{{ i + 1 }}</span>
+              <span class="level-val">{{ v }}</span>
             </div>
+            <div v-if="!parseLevels(selectedRow.resistance).length" class="level-row">-</div>
           </div>
         </div>
 
@@ -219,13 +232,31 @@ onMounted(fetchList)
   font-size: 18px;
 }
 
+.level-chip {
+  display: inline-block;
+  font-size: 12px;
+  padding: 1px 6px;
+  border-radius: 3px;
+  margin-right: 4px;
+  margin-bottom: 2px;
+  font-weight: 600;
+}
+.level-chip.sup {
+  background: #ecf5ff;
+  color: #409eff;
+}
+.level-chip.res {
+  background: #fef0f0;
+  color: #f56c6c;
+}
+
 .drawer-section {
   margin-bottom: 20px;
 }
 .drawer-label {
   font-size: 13px;
   color: var(--el-text-color-secondary);
-  margin-bottom: 6px;
+  margin-bottom: 8px;
 }
 .drawer-confidence {
   margin-left: 12px;
@@ -241,29 +272,39 @@ onMounted(fetchList)
 .drawer-text.risk {
   color: var(--el-color-warning);
 }
-.drawer-levels {
+
+.level-rows {
   display: flex;
-  gap: 24px;
+  flex-direction: column;
+  gap: 8px;
 }
-.level-block {
+.level-row {
   display: flex;
   align-items: center;
-  gap: 8px;
+  gap: 12px;
 }
 .level-tag {
   font-size: 12px;
-  padding: 2px 8px;
+  padding: 2px 10px;
   border-radius: 4px;
   font-weight: 600;
+  min-width: 54px;
+  text-align: center;
 }
-.support .level-tag {
+.level-row.sup .level-tag {
   background: #ecf5ff;
   color: #409eff;
 }
-.resistance .level-tag {
+.level-row.res .level-tag {
   background: #fef0f0;
   color: #f56c6c;
 }
+.level-val {
+  font-size: 20px;
+  font-weight: 700;
+  color: var(--el-text-color-primary);
+}
+
 .drawer-section.meta {
   margin-top: 24px;
   padding-top: 16px;