From 053f3ea01eae49f3102969533937c0a758d3d76a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <2178503051@qq.com>
Date: Fri, 3 Jul 2026 17:42:05 +0800
Subject: [PATCH] =?UTF-8?q?feat(wms/coil):=20=E6=96=B0=E5=A2=9E=E9=92=A2?=
 =?UTF-8?q?=E5=8D=B7=E8=B4=A8=E9=87=8F=E7=8A=B6=E6=80=81=E6=B5=81=E8=BD=AC?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1.  添加属性箭头样式类用于展示状态流转箭头
2.  新增初始质量状态props传递，在基础信息和生命周期追踪组件中展示质量状态变更
3.  在 futuristic 钢卷卡片中展示初始到当前的质量状态流转
---
 klp-ui/src/views/wms/coil/info/coil-info.scss   |  8 ++++++++
 .../coil/info/components/BasicInfoSection.vue   | 17 +++++++++++++++--
 .../coil/info/components/CoilCardFuturistic.vue | 16 ++++++++++++++--
 .../wms/coil/info/components/LifecycleTrace.vue |  4 +++-
 klp-ui/src/views/wms/coil/info/index.vue        | 15 +++++++++++++--
 5 files changed, 53 insertions(+), 7 deletions(-)

diff --git a/klp-ui/src/views/wms/coil/info/coil-info.scss b/klp-ui/src/views/wms/coil/info/coil-info.scss
index ad84da384..1f24d2092 100644
--- a/klp-ui/src/views/wms/coil/info/coil-info.scss
+++ b/klp-ui/src/views/wms/coil/info/coil-info.scss
@@ -598,6 +598,14 @@
   text-shadow: 0 0 6px rgba(100, 116, 139, 0.4) !important;
 }
 
+.attr-arrow {
+  display: inline-block;
+  margin: 0 4px;
+  color: #94a3b8;
+  font-size: 11px;
+  font-weight: 400;
+}
+
 .coil-futuristic-footer {
   display: flex;
   justify-content: space-around;
diff --git a/klp-ui/src/views/wms/coil/info/components/BasicInfoSection.vue b/klp-ui/src/views/wms/coil/info/components/BasicInfoSection.vue
index f90c0ad6a..d1d9bbaab 100644
--- a/klp-ui/src/views/wms/coil/info/components/BasicInfoSection.vue
+++ b/klp-ui/src/views/wms/coil/info/components/BasicInfoSection.vue
@@ -5,7 +5,7 @@
       <span class="section-title">基本信息</span>
     </div>
     <div class="section-body">
-      <CoilInfoRender :coilInfo="coilInfo" :column="5" />
+      <CoilInfoRender :coilInfo="displayCoilInfo" :column="5" />
     </div>
   </div>
 </template>
@@ -14,7 +14,20 @@
 export default {
   name: 'BasicInfoSection',
   props: {
-    coilInfo: { type: Object, default: () => ({}) }
+    coilInfo: { type: Object, default: () => ({}) },
+    initialQualityStatus: { type: String, default: '' }
+  },
+  computed: {
+    displayCoilInfo() {
+      const currentStatus = this.coilInfo.qualityStatus || '-'
+      if (this.initialQualityStatus && this.initialQualityStatus !== currentStatus) {
+        return {
+          ...this.coilInfo,
+          qualityStatus: `${this.initialQualityStatus} → ${currentStatus}`
+        }
+      }
+      return this.coilInfo
+    }
   }
 }
 </script>
diff --git a/klp-ui/src/views/wms/coil/info/components/CoilCardFuturistic.vue b/klp-ui/src/views/wms/coil/info/components/CoilCardFuturistic.vue
index 5dbe514c8..5f0b00865 100644
--- a/klp-ui/src/views/wms/coil/info/components/CoilCardFuturistic.vue
+++ b/klp-ui/src/views/wms/coil/info/components/CoilCardFuturistic.vue
@@ -55,7 +55,11 @@
         <div class="attr-tag attr-left">
           <div class="attr-content">
             <span class="attr-label">{{ leftLabel }}</span>
-            <span class="attr-value" :class="statusClass(coil.qualityStatus)">{{ coil.qualityStatus || '-' }}</span>
+            <span class="attr-value" :class="statusClass(initialQualityStatus)">{{ initialQualityStatus || '-' }}</span>
+            <template v-if="hasQualityChanged">
+              <span class="attr-arrow">→</span>
+              <span class="attr-value" :class="statusClass(currentQualityStatus)">{{ currentQualityStatus || '-' }}</span>
+            </template>
           </div>
         </div>
         <div v-if="coil.enterCoilNo && coil.enterCoilNo !== '-'" class="attr-tag attr-top-left">
@@ -116,7 +120,8 @@ export default {
   name: 'CoilCardFuturistic',
   props: {
     coil: { type: Object, default: () => ({}) },
-    type: { type: String, default: 'inbound' }
+    type: { type: String, default: 'inbound' },
+    initialQualityStatus: { type: String, default: '' }
   },
   data() {
     uid++
@@ -142,6 +147,13 @@ export default {
     },
     leftLabel() {
       return this.type === 'inbound' ? '质量状态' : '状态'
+    },
+    currentQualityStatus() {
+      return this.coil.qualityStatus || '-'
+    },
+    hasQualityChanged() {
+      return this.initialQualityStatus && this.currentQualityStatus !== '-'
+        && this.initialQualityStatus !== this.currentQualityStatus
     }
   },
   methods: {
diff --git a/klp-ui/src/views/wms/coil/info/components/LifecycleTrace.vue b/klp-ui/src/views/wms/coil/info/components/LifecycleTrace.vue
index c195d607f..ff74dfe18 100644
--- a/klp-ui/src/views/wms/coil/info/components/LifecycleTrace.vue
+++ b/klp-ui/src/views/wms/coil/info/components/LifecycleTrace.vue
@@ -38,6 +38,7 @@
                     <span class="card-label">&#128230; 入库</span>
                   </div>
                   <CoilCardFuturistic v-for="(coil, idx) in getCreationCoils(step, allSteps)" :key="idx" :coil="coil" type="inbound"
+                    :initialQualityStatus="initialQualityStatus"
                     v-if="coil && coil.currentCoilNo !== '-'" />
                   <div v-if="isEmpty(getCreationCoils(step, allSteps))" class="empty-coil">
                     <span>无钢卷信息</span>
@@ -147,7 +148,8 @@ export default {
   components: { CoilTraceResult, CoilCardFuturistic, CoilCardCompact, ShipmentCard },
   props: {
     traceResult: { type: Object, default: null },
-    coilInfo: { type: Object, default: () => ({}) }
+    coilInfo: { type: Object, default: () => ({}) },
+    initialQualityStatus: { type: String, default: '' }
   },
   methods: {
     isEmpty(list) {
diff --git a/klp-ui/src/views/wms/coil/info/index.vue b/klp-ui/src/views/wms/coil/info/index.vue
index 212b65572..e56a40741 100644
--- a/klp-ui/src/views/wms/coil/info/index.vue
+++ b/klp-ui/src/views/wms/coil/info/index.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="coil-info-page" v-loading="loading">
     <div class="content-container">
-      <BasicInfoSection :coilInfo="coilInfo" />
+      <BasicInfoSection :coilInfo="coilInfo" :initialQualityStatus="initialQualityStatus" />
 
       <CostInfoSection :coilInfo="coilInfo" :traceResult="traceResult"
         :hoardingDays="hoardingDays" :hoardingCost="hoardingCost" />
 
-      <LifecycleTrace :traceResult="traceResult" :coilInfo="coilInfo" />
+      <LifecycleTrace :traceResult="traceResult" :coilInfo="coilInfo" :initialQualityStatus="initialQualityStatus" />
 
       <ContractInfo title="生产合同信息" :info="salesInfo" emptyText="未找到相关生产合同信息" />
 
@@ -135,6 +135,17 @@ export default {
     hoardingCost() {
       const netWeight = parseFloat(this.coilInfo.netWeight) || 0
       return (this.hoardingDays * netWeight).toFixed(2)
+    },
+    initialQualityStatus() {
+      if (!this.coilQualityRejudgeList || this.coilQualityRejudgeList.length === 0) {
+        return this.coilInfo.qualityStatus || '-'
+      }
+      const sorted = [...this.coilQualityRejudgeList].sort((a, b) => {
+        const timeA = new Date(a.createTime || 0).getTime()
+        const timeB = new Date(b.createTime || 0).getTime()
+        return timeA - timeB
+      })
+      return sorted[0].beforeQuality || this.coilInfo.qualityStatus || '-'
     }
   },
   async created() {