wangguoyu 3 weeks ago
parent
commit
1076d0278c
1 changed files with 90 additions and 91 deletions
  1. 90 91
      pages/chanpinneirong/index.vue

+ 90 - 91
pages/chanpinneirong/index.vue

@@ -4,7 +4,7 @@
 			<text class="nav-bar-title">学习</text>
 		</view>
 		<!-- 吸顶单元标题 -->
-		<ezyActiveVue
+	<!-- 	<ezyActiveVue
 			v-if="currentStickyTitle &&existData"
 			class="item-dy-box item-fixed"
 			@aclick="handleClickDanyuan(currentDanyuanId)"
@@ -18,7 +18,7 @@
 					</view>
 				</view>
 			</view>
-		</ezyActiveVue>
+		</ezyActiveVue> -->
 
 		<!-- 滚动区域 -->
 		<scroll-view
@@ -56,12 +56,10 @@
 				<!-- <view class="xx-item-title">— 以下为当前等级课程目录 —</view> -->
 
 				<view v-for="(danyuanItem, index) in danyuanList" :key="danyuanItem.danyuanId">
-
 					<!-- 单元标题(带唯一ID,用于位置查询) -->
-					<view class="xx-item-title" :id="`title-${danyuanItem.danyuanId}`">
+					<view class="xx-item-title" @click="handleClickDanyuan(danyuanItem.danyuanId)" :id="`title-${danyuanItem.danyuanId}`">
 						— {{ danyuanItem.danyuanName }} {{ danyuanItem.danyuanIntro }} —
 					</view>
-
 					<!-- 节列表 -->
 					<ezyActiveVue
 						class="ezy-list-item-active xx-item-box"
@@ -207,9 +205,9 @@
 					this.curProcess = cacheData.curProcess;
 					this.danyuanList = [...(cacheData.danyuanList || [])];
 					this.banbenId = cacheData.banbenId
-					this.$nextTick(() => {
-						this.updateTitlePositions();
-					});
+					// this.$nextTick(() => {
+					// 	this.updateTitlePositions();
+					// });
 				}
 			},
 
@@ -252,9 +250,9 @@
 						this.dengjiId = res.data.dengjiId
 						this.chanpinId = res.data.chanpinId
 						// 数据加载完成后初始化观察器
-						this.$nextTick(() => {
-							this.updateTitlePositions();
-						});
+						// this.$nextTick(() => {
+						// 	this.updateTitlePositions();
+						// });
 					}
 				}).catch(res => {
 					cacheManager.remove("xuexi-shuxue");
@@ -262,83 +260,83 @@
 				});
 			},
 
-			updateStickyHeight() {
-					const query = uni.createSelectorQuery().in(this);
-					query.select('.item-fixed').boundingClientRect(res => {
-						if (res) {
-							this.stickyHeight = res.height; // 单位 px
-						} else {
-							this.stickyHeight = 100; // 默认 fallback(约 200rpx = 100px)
-						}
-					}).exec();
-				},
+			// updateStickyHeight() {
+			// 		const query = uni.createSelectorQuery().in(this);
+			// 		query.select('.item-fixed').boundingClientRect(res => {
+			// 			if (res) {
+			// 				this.stickyHeight = res.height; // 单位 px
+			// 			} else {
+			// 				this.stickyHeight = 100; // 默认 fallback(约 200rpx = 100px)
+			// 			}
+			// 		}).exec();
+			// 	},
 
 			// 获取所有标题在 scroll-view 中的绝对位置
-			updateTitlePositions() {
-				this.titlePositions = [];
-				this.danyuanTitleRefs = [];
-
-				if (!this.danyuanList.length) return;
-
-				const query = uni.createSelectorQuery().in(this);
-				this.danyuanList.forEach(item => {
-					query.select(`#title-${item.danyuanId}`).boundingClientRect();
-					this.danyuanTitleRefs.push(item);
-				});
-
-				query.exec((rects) => {
-					rects.forEach((rect, index) => {
-						if (rect) {
-							// 在 scroll-view 初始未滚动时,rect.top 就是内容中的绝对 top
-							this.titlePositions.push({
-								danyuanId: this.danyuanTitleRefs[index].danyuanId,
-								name: this.danyuanTitleRefs[index].danyuanName,
-								intro: this.danyuanTitleRefs[index].danyuanIntro,
-								top: rect.top
-							});
-						}
-					});
-					this.titlePositions.sort((a, b) => a.top - b.top);
-					// 👇 新增:更新吸顶栏高度
-								this.updateStickyHeight();
-				});
-			},
+			// updateTitlePositions() {
+			// 	this.titlePositions = [];
+			// 	this.danyuanTitleRefs = [];
+
+			// 	if (!this.danyuanList.length) return;
+
+			// 	const query = uni.createSelectorQuery().in(this);
+			// 	this.danyuanList.forEach(item => {
+			// 		query.select(`#title-${item.danyuanId}`).boundingClientRect();
+			// 		this.danyuanTitleRefs.push(item);
+			// 	});
+
+			// 	query.exec((rects) => {
+			// 		rects.forEach((rect, index) => {
+			// 			if (rect) {
+			// 				// 在 scroll-view 初始未滚动时,rect.top 就是内容中的绝对 top
+			// 				this.titlePositions.push({
+			// 					danyuanId: this.danyuanTitleRefs[index].danyuanId,
+			// 					name: this.danyuanTitleRefs[index].danyuanName,
+			// 					intro: this.danyuanTitleRefs[index].danyuanIntro,
+			// 					top: rect.top
+			// 				});
+			// 			}
+			// 		});
+			// 		this.titlePositions.sort((a, b) => a.top - b.top);
+			// 		// 👇 新增:更新吸顶栏高度
+			// 					this.updateStickyHeight();
+			// 	});
+			// },
 
 			handleScroll(e) {
 				const scrollTop = e.detail.scrollTop;
-				const firstTitle = this.titlePositions[0];
-
-				if (!firstTitle) {
-					this.currentStickyTitle = '';
-					return;
-				}
-
-				// 👇 关键修改:提前触发吸顶
-				const triggerOffset = scrollTop + this.stickyHeightPx;
-
-				// 如果还没滚到第一个标题的顶部(考虑吸顶高度),则隐藏
-				if (triggerOffset < firstTitle.top) {
-					this.currentStickyTitle = '';
-					return;
-				}
-
-				// 找出最后一个 top <= triggerOffset 的标题(即刚进入吸顶区的单元)
-				let matched = null;
-				for (let i = this.titlePositions.length - 1; i >= 0; i--) {
-					if (this.titlePositions[i].top <= triggerOffset) {
-						matched = this.titlePositions[i];
-						break;
-					}
-				}
-				console.log('matched',matched);
-				if (matched) {
-					this.currentStickyTitle = matched.name;
-					this.currentStickyIntro = matched.intro;
-					this.currentDanyuanId = matched.danyuanId;
-					this.currentStickyDengjiId = this.banbenInfo.dengjiId || 1;
-				} else {
-					this.currentStickyTitle = '';
-				}
+				// const firstTitle = this.titlePositions[0];
+
+				// if (!firstTitle) {
+				// 	this.currentStickyTitle = '';
+				// 	return;
+				// }
+
+				// // 👇 关键修改:提前触发吸顶
+				// const triggerOffset = scrollTop + this.stickyHeightPx;
+
+				// // 如果还没滚到第一个标题的顶部(考虑吸顶高度),则隐藏
+				// if (triggerOffset < firstTitle.top) {
+				// 	this.currentStickyTitle = '';
+				// 	return;
+				// }
+
+				// // 找出最后一个 top <= triggerOffset 的标题(即刚进入吸顶区的单元)
+				// let matched = null;
+				// for (let i = this.titlePositions.length - 1; i >= 0; i--) {
+				// 	if (this.titlePositions[i].top <= triggerOffset) {
+				// 		matched = this.titlePositions[i];
+				// 		break;
+				// 	}
+				// }
+				// console.log('matched',matched);
+				// if (matched) {
+				// 	this.currentStickyTitle = matched.name;
+				// 	this.currentStickyIntro = matched.intro;
+				// 	this.currentDanyuanId = matched.danyuanId;
+				// 	this.currentStickyDengjiId = this.banbenInfo.dengjiId || 1;
+				// } else {
+				// 	this.currentStickyTitle = '';
+				// }
 			},
 
 			getJieAndDanyuan(data, jieId) {
@@ -409,6 +407,7 @@
 				this.saveAndNavigate(jieId, da.type, da, code);
 			},
 			handleClickDanyuan(danyuanId) {
+				
 				if (!danyuanId) {
 					toast("danyuanId丢失")
 					return false
@@ -428,14 +427,14 @@
 
 		// 计算吸顶栏下方的偏移(确保内容不被遮挡)
 		computed: {
-			stickyHeightPx() {
-					// 175rpx ≈ 87.5px,取整 90px 足够安全
-					return 90;
-				},
-			topOffset() {
-					// 只有当吸顶栏显示时,才增加上边距避免内容被遮挡
-					return this.currentStickyTitle ? '80rpx' : '0rpx';
-				}
+			// stickyHeightPx() {
+			// 		// 175rpx ≈ 87.5px,取整 90px 足够安全
+			// 		return 90;
+			// 	},
+			// topOffset() {
+			// 		// 只有当吸顶栏显示时,才增加上边距避免内容被遮挡
+			// 		return this.currentStickyTitle ? '80rpx' : '0rpx';
+			// 	}
 
 		}
 	}