diff --git a/frontend/src/views/TaskHall.vue b/frontend/src/views/TaskHall.vue
index 81dc767..43cd1cc 100644
--- a/frontend/src/views/TaskHall.vue
+++ b/frontend/src/views/TaskHall.vue
@@ -1576,6 +1576,32 @@
                   </div>
                 </div>
 
+                <!-- 子任务进度时间线（流水线任务）- 横向拉满 -->
+                <div v-if="task.isPipeline === 1 && task.subTaskTotal" class="subtask-timeline-wrapper full-width">
+                  <div class="subtask-timeline">
+                    <div 
+                      v-for="(subTask, index) in (task.subTasks || []).slice(0, 5)" 
+                      :key="subTask.id || index"
+                      class="timeline-node"
+                      :class="getSubTaskStatusClass(subTask.status)"
+                    >
+                      <div class="node-dot"></div>
+                      <div class="node-label">{{ getSubTaskLabel(subTask, index) }}</div>
+                      <div class="node-status">{{ getSubTaskStatusText(subTask.status) }}</div>
+                    </div>
+                    <!-- 显示更多子任务提示 -->
+                    <div v-if="(task.subTasks || []).length > 5" class="timeline-node more">
+                      <div class="node-dot"></div>
+                      <div class="node-label">+{{ (task.subTasks || []).length - 5 }}</div>
+                    </div>
+                    <!-- 完结节点 -->
+                    <div class="timeline-node final" :class="{ completed: task.status === 'completed' }">
+                      <div class="node-dot"></div>
+                      <div class="node-label">完结</div>
+                    </div>
+                  </div>
+                </div>
+
                 <!-- 任务详情 -->
                 <div class="task-details">
                   <div class="detail-item">
@@ -1584,31 +1610,6 @@
                     </span>
                     <span>处理人: {{ task.receiverName || '待接单' }}</span>
                   </div>
-                  <!-- 子任务进度时间线（流水线任务） -->
-                  <div v-if="task.isPipeline === 1 && task.subTaskTotal" class="subtask-timeline-wrapper">
-                    <div class="subtask-timeline">
-                      <div 
-                        v-for="(subTask, index) in (task.subTasks || []).slice(0, 4)" 
-                        :key="subTask.id || index"
-                        class="timeline-node"
-                        :class="getSubTaskStatusClass(subTask.status)"
-                      >
-                        <div class="node-dot"></div>
-                        <div class="node-label">{{ getSubTaskLabel(subTask, index) }}</div>
-                        <div class="node-status">{{ getSubTaskStatusText(subTask.status) }}</div>
-                      </div>
-                      <!-- 显示更多子任务提示 -->
-                      <div v-if="(task.subTasks || []).length > 4" class="timeline-node more">
-                        <div class="node-dot"></div>
-                        <div class="node-label">+{{ (task.subTasks || []).length - 4 }}</div>
-                      </div>
-                      <!-- 完结节点 -->
-                      <div class="timeline-node final" :class="{ completed: task.status === 'completed' }">
-                        <div class="node-dot"></div>
-                        <div class="node-label">完结</div>
-                      </div>
-                    </div>
-                  </div>
                   <div v-if="task.brandName" class="detail-item">
                     <span class="icon">
                       <Icon name="tag" size="sm" color="#31f08b" />
@@ -5503,26 +5504,32 @@ onUnmounted(() => {
 // 子任务时间线样式
 .subtask-timeline-wrapper {
   width: 100%;
-  margin: 12px 0;
-  padding: 12px;
-  background: rgba(0, 0, 0, 0.2);
+  margin: 16px 0;
+  padding: 16px 20px;
+  background: rgba(0, 0, 0, 0.25);
   border-radius: 8px;
+  
+  &.full-width {
+    // 确保横向拉满
+    box-sizing: border-box;
+  }
 }
 
 .subtask-timeline {
   display: flex;
   align-items: flex-start;
+  justify-content: space-between;
   position: relative;
   
   // 连接线
   &::before {
     content: '';
     position: absolute;
-    top: 8px;
-    left: 8px;
-    right: 8px;
+    top: 10px;
+    left: 20px;
+    right: 20px;
     height: 2px;
-    background: linear-gradient(90deg, #303030 0%, #303030 100%);
+    background: linear-gradient(90deg, #52c41a 0%, #303030 50%, #303030 100%);
     z-index: 0;
   }
   
@@ -5533,28 +5540,30 @@ onUnmounted(() => {
     align-items: center;
     position: relative;
     z-index: 1;
-    min-width: 50px;
+    min-width: 60px;
+    max-width: 100px;
     
     .node-dot {
-      width: 16px;
-      height: 16px;
+      width: 20px;
+      height: 20px;
       border-radius: 50%;
       background: #303030;
-      border: 2px solid #444;
-      margin-bottom: 6px;
+      border: 3px solid #444;
+      margin-bottom: 8px;
       transition: all 0.3s ease;
     }
     
     .node-label {
-      font-size: 11px;
+      font-size: 12px;
       color: #888;
       text-align: center;
       white-space: nowrap;
-      margin-bottom: 2px;
+      margin-bottom: 4px;
+      font-weight: 500;
     }
     
     .node-status {
-      font-size: 10px;
+      font-size: 11px;
       color: #666;
       text-align: center;
       white-space: nowrap;
@@ -5580,7 +5589,7 @@ onUnmounted(() => {
       .node-dot {
         background: #1890ff;
         border-color: #1890ff;
-        box-shadow: 0 0 8px rgba(24, 144, 255, 0.5);
+        box-shadow: 0 0 10px rgba(24, 144, 255, 0.6);
         animation: pulse 1.5s ease-in-out infinite;
       }
       .node-label {
@@ -5608,14 +5617,16 @@ onUnmounted(() => {
     
     // 更多节点
     &.more {
-      flex: 0.5;
+      flex: 0.6;
       .node-dot {
+        width: 18px;
+        height: 18px;
         background: #444;
         border-color: #666;
       }
       .node-label {
         color: #888;
-        font-size: 10px;
+        font-size: 11px;
       }
     }
     
@@ -5627,7 +5638,7 @@ onUnmounted(() => {
       }
       .node-label {
         color: #888;
-        font-weight: 500;
+        font-weight: 600;
       }
       
       &.completed {