From 29a1bbf50cf73ca555f9850306907ea0dac93846 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=94=B0=E5=B2=A9?= <tybb88x@gmail.com>
Date: Mon, 26 Jan 2026 16:53:02 +0800
Subject: [PATCH] =?UTF-8?q?JLBA202505130001=5F=E5=85=B3=E4=BA=8E=E5=90=89?=
 =?UTF-8?q?=E6=9E=97=E9=93=B6=E8=A1=8C=E6=96=B0=E5=BB=BAAI=E6=99=BA?=
 =?UTF-8?q?=E8=83=BD=E5=9F=B9=E8=AE=AD=E7=B3=BB=E7=BB=9F=E7=9A=84=E9=9C=80?=
 =?UTF-8?q?=E6=B1=82=5F=E5=BC=80=E5=8F=91=E4=BB=BB=E5=8A=A1=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../learningTasks/components/details-item.vue | 149 ++++++++++++++++--
 src/pages/learningTasks/details.vue           |  23 +--
 .../{details - 副本.vue => details2.vue}      |   0
 .../images/learningTasks/big-arrow-1.png      | Bin 0 -> 6998 bytes
 .../images/learningTasks/big-arrow-2.png      | Bin 0 -> 8206 bytes
 .../images/learningTasks/small-arrow.png      | Bin 0 -> 2923 bytes
 6 files changed, 145 insertions(+), 27 deletions(-)
 rename src/pages/learningTasks/{details - 副本.vue => details2.vue} (100%)
 create mode 100644 src/static/images/learningTasks/big-arrow-1.png
 create mode 100644 src/static/images/learningTasks/big-arrow-2.png
 create mode 100644 src/static/images/learningTasks/small-arrow.png

diff --git a/src/pages/learningTasks/components/details-item.vue b/src/pages/learningTasks/components/details-item.vue
index 8a0c26a8..e53d7deb 100644
--- a/src/pages/learningTasks/components/details-item.vue
+++ b/src/pages/learningTasks/components/details-item.vue
@@ -1,12 +1,19 @@
 <template>
 	<view class="item-div" :class="direction">
+		<!-- 箭头指示 -->
+		<view class="arrow-div">
+			<view class="big-arrow">
+				<image class="img" :src="statusOpen?bigArrow2:bigArrow1" mode=""></image>
+			</view>
+			<view class="small-arrow">
+				<image class="img" src="@/static/images/learningTasks/small-arrow.png" mode=""></image>
+			</view>
+		</view>
 		<view class="idea-div">
 			<image class="img" src="@/static/images/learningTasks/idea-1.png" mode="aspectFit"></image>
 		</view>
 		<view class="mid-div">
-			<view class="title-div">
-				柜面业务操作业务操作规范及流程
-			</view>
+			<view class="title-div">{{ props.item.crsName }}xx{{props.item.status}}</view>
 			<view class="button-div">
 				<view class="button button-status-1">
 					<view class="button-icon">
@@ -23,19 +30,83 @@
 			</view>
 		</view>
 		<view class="tip-div">
-			<image class="img" src="@/static/images/learningTasks/tip-1.png" mode="aspectFit"></image>
+			<view class="tip-self">
+				<view class="tip-text"></view>
+			</view>
 		</view>
 	</view>
 </template>
 
 <script setup>
-	import { ref } from 'vue';
-	// 方向
-	const a = ['left', 'right'];
-	const direction = ref(a[0]);
+	import bigArrow1 from '@/static/images/learningTasks/big-arrow-1.png'
+	import bigArrow2 from '@/static/images/learningTasks/big-arrow-2.png'
+	import { ref, computed } from 'vue';
+	const props = defineProps({
+		item: {
+			type: Object,
+			requset: true
+		},
+		index: {
+			type: Number,
+			requset: true
+		}
+	});
+	const statusOpen = computed(() => ['01', '02'].includes(props.item.status));
+	const direction = computed(() => {
+		const styleArray = [];
+		if (props.index !== 0) {
+			styleArray.push('come_line');
+		}
+		if (props.index % 2 == 0) {
+			styleArray.push('left');
+		} else {
+			styleArray.push('right');
+		}
+		// 00进行中、01已完成、02已超时
+		const isFinish = props.item.isFinish;
+		if (isFinish === '01') {
+			styleArray.push('unfinished');
+		} else if (isFinish === '02') {
+			styleArray.push('completed');
+		} else {
+			styleArray.push('not_unlocked');
+		}
+		return styleArray;
+	});
+
+	const getStatusClass = () => {
+		const isFinish = props.item.isFinish;
+		// 00进行中、01已完成、02已超时
+		if (isFinish === '01') return 'unfinished';
+		if (isFinish === '02') return 'completed';
+		return 'not_unlocked';
+	};
 </script>
 
 <style scoped lang="scss">
+	.arrow-div {
+		display: none;
+		position: absolute;
+		left: 46rpx;
+		top: 0;
+		// background-color: red;
+		.big-arrow {
+			.img {
+				width: 584rpx;
+				height: 120rpx;
+			}
+		}
+		.small-arrow {
+			position: absolute;
+			left: 20rpx;
+			top: 80rpx;
+			transform: scaleX(-1);
+			.img {
+				width: 62rpx;
+				height: 78rpx;
+			}
+		}
+	}
 	.title-div {
 		width: 100%;
 		font-weight: 500;
@@ -96,21 +167,28 @@
 	.idea-div {
 		display: flex;
 		align-items: center;
-
 		.img {
 			width: 108rpx;
 			height: 108rpx;
 		}
-		background-color: yellow;
 	}
 	.tip-div {
-		display: flex;
-		align-items: center;
-		.img {
+		.tip-self {
+			position: relative;
+			margin-top: 30rpx;
 			width: 108rpx;
 			height: 108rpx;
+			background-size: 100%;
+			background-repeat: no-repeat;
+			.tip-text {
+				position: absolute;
+				top: 10rpx;
+				left: 14rpx;
+				font-weight: 500;
+				font-size: 24rpx;
+				color: #ffffff;
+			}
 		}
-		background-color: green;
 	}
 	.mid {
 		.title-div {
@@ -122,8 +200,43 @@
 		display: flex;
 		justify-content: space-between;
 		width: calc(100% - 60rpx);
+		margin: 30rpx auto;
+		position: relative;
+		// 控制是否展示轨迹线
+		&.come_line {
+			padding-top: 130rpx;
+			.arrow-div {
+				display: block;
+			}
+		}
 
-		margin: 0 auto;
+		&.completed {
+			.tip-self {
+				background-image: url('@/static/images/learningTasks/tip-3.png');
+				.tip-text::before {
+					content: '已完成';
+				}
+			}
+		}
+		//未完成
+		&.unfinished {
+			.tip-self {
+				background-image: url('@/static/images/learningTasks/tip-2.png');
+				.tip-text::before {
+					content: '进行中';
+				}
+			}
+		}
+
+		// 未解锁
+		&.not_unlocked {
+			.tip-self {
+				background-image: url('@/static/images/learningTasks/tip-1.png');
+				.tip-text::before {
+					content: '未解锁';
+				}
+			}
+		}
 	}
 	// 状态样式
 	.left {
@@ -134,12 +247,16 @@
 			margin-left: 20rpx;
 			margin-right: 40rpx;
 		}
+		.arrow-div {
+			transform: scaleX(-1);
+		}
 	}
 	.right {
 		&.item-div {
 			flex-direction: row-reverse;
 		}
-		.tip-div .img {
+		.tip-div .tip-self,
+		.tip-div .tip-text {
 			transform: scaleX(-1);
 		}
 		.button-div {
diff --git a/src/pages/learningTasks/details.vue b/src/pages/learningTasks/details.vue
index df107c70..9116a818 100644
--- a/src/pages/learningTasks/details.vue
+++ b/src/pages/learningTasks/details.vue
@@ -1,5 +1,6 @@
 <template>
 	<view class="noise-bg">
+		<view class="is-bg"></view>
 		<view class="div-max">
 			<z-paging
 				ref="pagingRef"
@@ -57,7 +58,7 @@
 				</view>
 				<!-- 步骤 -->
 				<view class="step-list-div">
-					<detailsItem></detailsItem>
+					<detailsItem v-for="(item, index) in data_list" :item="item" :index="index"></detailsItem>
 				</view>
 			</z-paging>
 		</view>
@@ -241,6 +242,7 @@
 <style scoped lang="scss">
 	// 步骤
 	.step-list-div {
+		margin: 50rpx 0;
 	}
 	// 详情
 	.details-div {
@@ -330,25 +332,24 @@
 	.div-max {
 		width: 100vw;
 		height: 100vh;
-		// background: linear-gradient(358deg, #184891 0%, #3772c1 100%);
+		z-index: 10;
 		opacity: 1;
+		// background-color: red;
 	}
 	.interior {
 		z-index: 1;
 	}
-	
+
 	.noise-bg {
 		width: 100vw;
 		height: 100vh;
 		position: relative;
 		overflow: hidden;
-		background: linear-gradient(358deg, #184891 0%, #3772c1 100%);
-		opacity: 1;
+		background: linear-gradient(358deg, #1848a1 0%, #3772e1 100%);
+		// opacity: .4;
 	}
 
-	/* 伪元素：只负责噪点，单独模糊+调透明度 */
-	.noise-bg::before {
-		content: '';
+	.is-bg {
 		position: absolute;
 		top: 0;
 		left: 0;
@@ -357,16 +358,16 @@
 		/* 噪点图配置 */
 		background-image: url('@/static/images/learningTasks/bg.png');
 		background-repeat: repeat;
-		background-size: 300px; /* 控制噪点大小，可按需改 */
+		background-size: 200px; /* 控制噪点大小，可按需改 */
 		/* 核心：模糊噪点（1px=轻微，2px=中度，3px=更糊） */
 		// filter: blur(1px);
-		opacity: 0.8;
+		opacity: 0.3;
 		/* 混合模式：让噪点和渐变自然融合（multiply/overlay二选一） */
 		background-blend-mode: multiply;
 		/* 不影响容器内元素点击 */
 		pointer-events: none;
 		/* 确保噪点在内容之下，渐变之上 */
-		z-index: 1;
+		z-index: 0;
 	}
 	.body-title {
 		width: 100%;
diff --git a/src/pages/learningTasks/details - 副本.vue b/src/pages/learningTasks/details2.vue
similarity index 100%
rename from src/pages/learningTasks/details - 副本.vue
rename to src/pages/learningTasks/details2.vue
diff --git a/src/static/images/learningTasks/big-arrow-1.png b/src/static/images/learningTasks/big-arrow-1.png
new file mode 100644
index 0000000000000000000000000000000000000000..5a33aa35be1ded9c6e893c45201f7149d2279deb
GIT binary patch
literal 6998
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
YMep)5Ez-W6F)>}gdJ9~5#qQDn0eTU$bN~PV

literal 0
HcmV?d00001

diff --git a/src/static/images/learningTasks/big-arrow-2.png b/src/static/images/learningTasks/big-arrow-2.png
new file mode 100644
index 0000000000000000000000000000000000000000..2dea1bc0d421cfb381e9e34ed86619a5bf549604
GIT binary patch
literal 8206
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
NsiCL-@w)Ak{{e5idvyQ+

literal 0
HcmV?d00001

diff --git a/src/static/images/learningTasks/small-arrow.png b/src/static/images/learningTasks/small-arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..e594d15fc2cc2990d998c727a582f45f7a8acd4b
GIT binary patch
literal 2923
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
VS(br-#sB~S002ovPDHLkV1n%Si0}Xa

literal 0
HcmV?d00001