style: 移动端流转树主干道对齐与连线箭头

- 主线(含 TRANSFER 子任务)左边缘对齐,消除缩进形成笔直主干道
- 主线卡片之间加向下连线箭头(↓)
- 分支(SPAWN 协助)保留缩进 + 左边线

track-uniapp/src/pages/scan/components/FlowTree.vue

@@ -19,10 +19,12 @@
       </view>
     </view>
 
-    <!-- 子任务（递归缩进） -->
+    <!-- 子任务：主线继续主干道(左对齐 + ↓连线)，分支(SPAWN 协助)缩进 -->
-    <view v-if="node.child_tasks && node.child_tasks.length" class="ft-children">
+    <view v-if="node.child_tasks && node.child_tasks.length">
+      <!-- 主线子任务：左边缘对齐，形成笔直主干道，之间用 ↓ 连线 -->
+      <template v-for="(child, i) in mainChildren">
+        <view :key="'arrow-' + child.id" v-if="i > 0" class="ft-flow-arrow">↓</view>
         <FlowTree
-        v-for="child in node.child_tasks"
           :key="child.id"
           :node="child"
           :current-user="currentUser"
@@ -30,6 +32,19 @@
           :current-username="currentUsername"
           @view-records="$emit('viewRecords', $event)"
         />
+      </template>
+      <!-- 分支子任务：缩进 + 左边线 -->
+      <view v-if="branchChildren.length" class="ft-branch-children">
+        <FlowTree
+          v-for="child in branchChildren"
+          :key="child.id"
+          :node="child"
+          :current-user="currentUser"
+          :current-user-id="currentUserId"
+          :current-username="currentUsername"
+          @view-records="$emit('viewRecords', $event)"
+        />
+      </view>
     </view>
   </view>
 </template>
@@ -52,6 +67,18 @@ export default {
         || this.node.task_type === "TRANSFER"
         || this.node.task_type === "RECOVERY";
     },
+    // 主线子任务：TRANSFER/RECOVERY，继续主干道（左对齐）
+    mainChildren() {
+      return (this.node.child_tasks || []).filter((c) =>
+        !c.parent_task_id || c.task_type === "TRANSFER" || c.task_type === "RECOVERY"
+      );
+    },
+    // 分支子任务：其余(SPAWN 协助等)，缩进显示
+    branchChildren() {
+      return (this.node.child_tasks || []).filter((c) =>
+        c.parent_task_id && c.task_type !== "TRANSFER" && c.task_type !== "RECOVERY"
+      );
+    },
     isWarehouseTask() {
       const name = String(this.node.task_name || "");
       return (name.includes("在库") || name.includes("入库")) || this.node.assignee_id === "virtual_warehouse";
@@ -128,5 +155,20 @@ export default {
 .ft-time { font-size: 11px; color: #9ca3af; }
 .ft-records { font-size: 11px; color: #2563eb; font-weight: 600; }
 
-.ft-children { margin-left: 16px; padding-left: 10px; border-left: 2px solid #e5e7eb; margin-top: 8px; }
+/* 主线子任务：无缩进（左边缘对齐成笔直主干道），之间用 ↓ 连线 */
+.ft-flow-arrow {
+  text-align: center;
+  color: #9ca3af;
+  font-size: 16px;
+  font-weight: 700;
+  line-height: 1;
+  margin: 2px 0;
+}
+/* 分支子任务：缩进 + 左边线 */
+.ft-branch-children {
+  margin-left: 16px;
+  padding-left: 12px;
+  border-left: 2px solid #e5e7eb;
+  margin-top: 8px;
+}
 </style>

track-uniapp/src/pages/scan/components/TreeCanvas.vue

@@ -16,9 +16,10 @@
 
     <scroll-view v-else scroll-y class="tree-scroll" :style="{ height: scrollHeight + 'px' }">
       <view class="tree-root">
-        <!-- 递归纵向流转树：主线 + 分支缩进 -->
+        <!-- 递归纵向流转树：根级主线之间用 ↓ 连线，分支由 FlowTree 内部缩进 -->
+        <template v-for="(t, i) in product.task_tree">
+          <view :key="'arrow-' + i" v-if="i > 0" class="ft-flow-arrow">↓</view>
           <FlowTree
-          v-for="t in product.task_tree"
             :key="t.id"
             :node="t"
             :current-user="currentUser"
@@ -26,6 +27,7 @@
             :current-username="currentUsername"
             @view-records="$emit('viewRecords', $event)"
           />
+        </template>
       </view>
 
       <!-- 图例 -->
@@ -96,6 +98,15 @@ export default {
 
 .tree-scroll { flex-shrink: 0; }
 .tree-root { padding: 16px 12px 20px; }
+/* 根级主线之间的向下连线箭头 */
+.ft-flow-arrow {
+  text-align: center;
+  color: #9ca3af;
+  font-size: 16px;
+  font-weight: 700;
+  line-height: 1;
+  margin: 2px 0;
+}
 .tree-legend {
   display: flex;
   flex-wrap: wrap;