From 6b4e906e75eb15b5b64a28c1ec24ac56669b6d15 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 19 Oct 2023 16:40:36 +0800
Subject: [PATCH] update process flow

---
 src/views/extend/processFlow/index.vue | 26 +++++++++++++++++---------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/views/extend/processFlow/index.vue b/src/views/extend/processFlow/index.vue
index 59d3eda8..efa27691 100644
--- a/src/views/extend/processFlow/index.vue
+++ b/src/views/extend/processFlow/index.vue
@@ -17,7 +17,7 @@
 				:key="n"
 				:name="'工艺 ' + n"
 				line="产线1"
-				desc="Lorem ipsum dolor sit amet consectetur, elique! Nemo deserunt quidem facilis eum.sadf sf asdfa skdlj"
+				desc="显示工艺描述的内容"
 				:isActive="n % 2 == 0" />
 		</section>
 	</div>
@@ -37,19 +37,27 @@ const ProcessItem = {
 		return (
 			<div
 				class={'process-item' + (this.isActive ? ' active' : '')}
-				style="display: flex; flex-direction: column;">
-				<div class="process-item__content" style="flex: 1;">
-					<div class="logo"></div>
+				style="display: flex; flex-direction: column; position: relative;">
+				<div
+					class="process-item__content"
+					style="flex: 1; display: flex; align-items: center;">
+					{this.isActive && (
+						<span style="display: inline-block; width: 10px; height: 10px; border-radius: 100%; background: #0ebe3a; position: absolute; top: 20px; right: 20px;" />
+					)}
+					<svg-icon
+						icon-class="tree-table"
+						style="margin-left: 12px; width: 48px; height: 48px; color: #0858ff33"
+					/>
 					<div
 						class="info"
-						style="margin-left: 48px; display: flex; flex-direction: column;">
+						style="margin-left: 12px; display: flex; flex-direction: column;">
 						<h2 style="margin: 20px 0 0; font-weight: 600; font-size: 18px; ">
 							{this.name}
 						</h2>
 						<h3 style="margin: 0;  font-weight: 400; font-size: 14px; line-height: 2; color: #888;">
 							{this.line}
 						</h3>
-						<p style="margin: 0; height: 48px; width: 80%; text-overflow: ellipse; white-space: no-wrap; font-weight: 400; font-size: 14px; line-height: 1.25; color: #888;">
+						<p style="margin: 0; text-overflow: ellipse; white-space: nowrap; font-weight: 400; font-size: 14px; line-height: 1.25; color: #888;">
 							{this.desc}
 						</p>
 					</div>
@@ -132,8 +140,8 @@ export default {
 	box-shadow: 0 0 6px 1px #ccc;
 	overflow: hidden;
 
-	&.active {
-		box-shadow: 0 0 6px 1px #18c8bf66;
-	}
+	// &.active {
+	// 	box-shadow: 0 0 6px 1px #18c8bf66;
+	// }
 }
 </style>