From 2ea00a538356bb9a8dae72f882f4ed125680dc6c Mon Sep 17 00:00:00 2001
From: kkfluous <kkfluous@kdemacbook-air.local>
Date: Fri, 17 Apr 2026 10:01:59 +0800
Subject: [PATCH] =?UTF-8?q?refactor(scheduling):=20=E6=8B=86=E5=88=86=20re?=
 =?UTF-8?q?ason=20=E5=8C=BA=E4=B8=BA=20=E5=AE=A2=E6=88=B7/=E8=BD=A6?=
 =?UTF-8?q?=E8=BE=86=20=E4=B8=A4=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

详情页的指标区从单列两格网格改为 左:客户 / 右:车辆 两栏。客户日均归
左侧，考核剩余、日均需、年度完成率、可为新车贡献归右侧，便于一眼
识别数据归属。

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/modules/scheduling/SuggestionDetail.tsx | 42 +++++++++++++++++----
 1 file changed, 34 insertions(+), 8 deletions(-)

diff --git a/src/modules/scheduling/SuggestionDetail.tsx b/src/modules/scheduling/SuggestionDetail.tsx
index f4f5e6b..1ced05d 100644
--- a/src/modules/scheduling/SuggestionDetail.tsx
+++ b/src/modules/scheduling/SuggestionDetail.tsx
@@ -25,6 +25,8 @@ function fmtRate(rate: number): string {
   return (rate * 100).toFixed(1) + '%';
 }
 
+const CUSTOMER_REASON_LABELS = new Set(['客户日均']);
+
 export default function SuggestionDetail({ suggestion: s, onClose, onNotifySuccess }: Props) {
   const [previewCandidate, setPreviewCandidate] = useState<CandidateVehicle | null>(null);
   const [sentPlates, setSentPlates] = useState<Set<string>>(new Set());
@@ -212,15 +214,39 @@ export default function SuggestionDetail({ suggestion: s, onClose, onNotifySucce
             </div>
           </div>
 
-          {/* Reason — structured lines */}
+          {/* Reason — customer vs vehicle columns */}
           <div className="px-4 py-2.5 border-b border-slate-100 bg-slate-50/60">
-            <div className="grid grid-cols-2 gap-x-3 gap-y-1">
-              {s.reason.lines.map((line, i) => (
-                <div key={i} className="flex items-center justify-between text-[11px]">
-                  <span className="text-slate-500">{line.label}</span>
-                  <span className="text-slate-700 font-medium">{line.value}</span>
-                </div>
-              ))}
+            <div className="grid grid-cols-2 gap-x-5">
+              {(() => {
+                const customerLines = s.reason.lines.filter(l => CUSTOMER_REASON_LABELS.has(l.label));
+                const vehicleLines = s.reason.lines.filter(l => !CUSTOMER_REASON_LABELS.has(l.label));
+                return (
+                  <>
+                    <div>
+                      <div className="text-[9px] font-bold text-slate-400 uppercase tracking-wider mb-1">客户</div>
+                      <div className="space-y-1">
+                        {customerLines.map((line, i) => (
+                          <div key={i} className="flex items-center justify-between text-[11px]">
+                            <span className="text-slate-500">{line.label}</span>
+                            <span className="text-slate-700 font-medium">{line.value}</span>
+                          </div>
+                        ))}
+                      </div>
+                    </div>
+                    <div>
+                      <div className="text-[9px] font-bold text-slate-400 uppercase tracking-wider mb-1">车辆</div>
+                      <div className="space-y-1">
+                        {vehicleLines.map((line, i) => (
+                          <div key={i} className="flex items-center justify-between text-[11px]">
+                            <span className="text-slate-500">{line.label}</span>
+                            <span className="text-slate-700 font-medium">{line.value}</span>
+                          </div>
+                        ))}
+                      </div>
+                    </div>
+                  </>
+                );
+              })()}
             </div>
             <div className="mt-2 pt-2 border-t border-slate-200">
               <span className="text-xs font-bold text-rose-600">{s.reason.conclusion}</span>