From 3749aa766bc885f9934dc811896aa3e912ec9112 Mon Sep 17 00:00:00 2001
From: duxingchen <duxingchen@iris-rs.cn>
Date: Tue, 1 Sep 2026 15:02:20 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E7=A7=BB=E5=8A=A8=E7=AB=AF=E6=B5=81?=
 =?UTF-8?q?=E8=BD=AC=E6=A0=91=E8=A7=86=E8=A7=89=E9=99=8D=E5=99=AA=E4=B8=8E?=
 =?UTF-8?q?=E5=88=86=E6=94=AF=E7=AE=AD=E5=A4=B4=E6=96=B9=E5=90=91=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 已完成卡片降透明度/浅灰底/深灰字;进行中卡片纯白+蓝色边框+外发光
- 分支箭头改为从主干道指向分支(左翼←右翼→),橙色虚线
---
 .../src/pages/scan/components/FlowBranch.vue  | 24 +++++++++++++----
 .../src/pages/scan/components/FlowCard.vue    | 27 ++++++++++++++++++-
 2 files changed, 45 insertions(+), 6 deletions(-)

diff --git a/track-uniapp/src/pages/scan/components/FlowBranch.vue b/track-uniapp/src/pages/scan/components/FlowBranch.vue
index 18c7524..6a0b04a 100644
--- a/track-uniapp/src/pages/scan/components/FlowBranch.vue
+++ b/track-uniapp/src/pages/scan/components/FlowBranch.vue
@@ -20,8 +20,12 @@
       :node="node"
       @view-records="$emit('viewRecords', $event)"
     />
-    <!-- 横向连线箭头：左翼→指向中央，右翼←从中央伸出 -->
-    <view class="fb-arrow" :class="'arrow-' + side">{{ side === 'left' ? '→' : '←' }}</view>
+    <!-- 横向连线箭头：从主干道指向分支（左翼←，右翼→），橙色虚线 -->
+    <view class="fb-arrow" :class="'arrow-' + side">
+      <view v-if="side === 'left'" class="fb-hline" />
+      <text class="fb-arrow-text">{{ side === 'left' ? '←' : '→' }}</text>
+      <view v-if="side === 'right'" class="fb-hline" />
+    </view>
     <!-- 右翼：卡片在左侧贴近主干道 -->
     <FlowCard
       v-if="side === 'right'"
@@ -84,9 +88,19 @@ export default {
   margin: 0 4px;
 }
 .fb-arrow {
-  font-size: 14px;
-  font-weight: 700;
-  color: #9ca3af;
+  display: flex;
+  align-items: center;
+  gap: 2px;
   flex-shrink: 0;
 }
+/* 橙色虚线连接主干道与分支 */
+.fb-hline {
+  width: 22px;
+  border-top: 2px dashed #fb923c;
+}
+.fb-arrow-text {
+  font-size: 12px;
+  font-weight: 700;
+  color: #fb923c;
+}
 </style>
diff --git a/track-uniapp/src/pages/scan/components/FlowCard.vue b/track-uniapp/src/pages/scan/components/FlowCard.vue
index 9e44b9e..2c02c89 100644
--- a/track-uniapp/src/pages/scan/components/FlowCard.vue
+++ b/track-uniapp/src/pages/scan/components/FlowCard.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="fc-card" :class="statusColorClass(node.status)">
+  <view class="fc-card" :class="[statusColorClass(node.status), { 'is-completed': isCompleted, 'is-active': isActive }]">
     <view class="fc-head">
       <!-- 主线/分支 标签(仅中央主线显示) -->
       <text v-if="showBadge" class="fc-badge" :class="isMainNode ? 'fc-badge-main' : 'fc-badge-sub'">{{ isMainNode ? '主线' : '分支' }}</text>
@@ -41,6 +41,14 @@ export default {
       const name = String(this.node.task_name || "");
       return (name.includes("在库") || name.includes("入库")) || this.node.assignee_id === "virtual_warehouse";
     },
+    // 进行中/待接收：WIP / PENDING / IN_PROGRESS(待收货)
+    isActive() {
+      return ["WIP", "PENDING", "IN_PROGRESS"].includes(this.node.status);
+    },
+    // 已完成 / 历史状态：非进行中
+    isCompleted() {
+      return !this.isActive;
+    },
   },
   methods: {
     formatUserName(userId) {
@@ -92,6 +100,23 @@ export default {
 .fc-card.s-orange { border-left-color: #f97316; }
 .fc-card.s-gray { border-left-color: #9ca3af; }
 
+/* 已完成/历史状态：降透明度 + 浅灰底 + 深灰文字（视觉降噪） */
+.fc-card.is-completed {
+  opacity: 0.85;
+  background-color: #fafafa;
+}
+.fc-card.is-completed .fc-name,
+.fc-card.is-completed .fc-assignee,
+.fc-card.is-completed .fc-warehouse-in {
+  color: #6b7280;
+}
+/* 进行中/待接收：纯白底 + 完整蓝色边框 + 外发光，浮起来 */
+.fc-card.is-active {
+  background-color: #ffffff;
+  border: 1px solid #93c5fd;
+  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.12);
+}
+
 .fc-head { display: flex; align-items: center; gap: 4px; margin-bottom: 4px; flex-wrap: wrap; }
 .fc-badge { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 4px; color: #fff; }
 .fc-badge-main { background: #2563eb; }