From 5190be38d63ed9d1c9862db0d79b430ce39aa94d Mon Sep 17 00:00:00 2001 From: no99 <17663930442@163.com> Date: Thu, 21 Aug 2025 09:58:41 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E8=B7=B3=E8=BD=AC=E4=BC=98?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/homePage.vue | 121 +++++++++++++++++++++++++++++-------------------- 1 file changed, 72 insertions(+), 49 deletions(-) diff --git a/src/views/homePage.vue b/src/views/homePage.vue index 61366e0..904f003 100644 --- a/src/views/homePage.vue +++ b/src/views/homePage.vue @@ -375,9 +375,9 @@ const chartInteractionTimer = ref(null); // 图表交互检测定时器 // 获取当前活动页面的滚动容器 const getCurrentScrollContainer = () => { - if (activeTab.value === 'AIchat') { + if (activeTab.value === "AIchat") { return tabContentAIchat.value; - } else if (activeTab.value === 'AiEmotion') { + } else if (activeTab.value === "AiEmotion") { return tabContentAiEmotion.value; } return null; @@ -408,7 +408,12 @@ const throttledSmoothScrollToBottom = _.throttle(smoothScrollToBottom, 300, { // AiEmotion页面自动滚动到底部的防抖函数 const debouncedAiEmotionScrollToBottom = _.debounce(() => { - if (activeTab.value === 'AiEmotion' && isAiEmotionAutoScrollEnabled.value && !isAiEmotionUserScrolling.value && !isChartInteracting.value) { + if ( + activeTab.value === "AiEmotion" && + isAiEmotionAutoScrollEnabled.value && + !isAiEmotionUserScrolling.value && + !isChartInteracting.value + ) { const container = tabContentAiEmotion.value; if (container) { container.scrollTop = container.scrollHeight - container.offsetHeight; @@ -420,21 +425,25 @@ const debouncedAiEmotionScrollToBottom = _.debounce(() => { const startAiEmotionHeightObserver = () => { // 先停止之前的监听器 stopAiEmotionHeightObserver(); - + isAiEmotionAutoScrollEnabled.value = true; - + // 创建ResizeObserver监听页面内容变化 aiEmotionHeightObserver.value = new ResizeObserver((entries) => { - if (isAiEmotionAutoScrollEnabled.value && activeTab.value === 'AiEmotion' && !isChartInteracting.value) { + if ( + isAiEmotionAutoScrollEnabled.value && + activeTab.value === "AiEmotion" && + !isChartInteracting.value + ) { debouncedAiEmotionScrollToBottom(); } }); - + // 监听document.body的尺寸变化 if (document.body) { aiEmotionHeightObserver.value.observe(document.body); } - + // 创建MutationObserver监听DOM结构变化 const mutationObserver = new MutationObserver((mutations) => { let shouldScroll = false; @@ -455,12 +464,17 @@ const startAiEmotionHeightObserver = () => { } } }); - - if (shouldScroll && isAiEmotionAutoScrollEnabled.value && activeTab.value === 'AiEmotion' && !isChartInteracting.value) { + + if ( + shouldScroll && + isAiEmotionAutoScrollEnabled.value && + activeTab.value === "AiEmotion" && + !isChartInteracting.value + ) { debouncedAiEmotionScrollToBottom(); } }); - + // 监听AiEmotion页面的主要内容区域的DOM变化 const aiEmotionContainer = tabContentAiEmotion.value; if (aiEmotionContainer) { @@ -471,17 +485,19 @@ const startAiEmotionHeightObserver = () => { characterData: true, }); } - + // 保存mutationObserver引用以便清理 aiEmotionHeightObserver.value.mutationObserver = mutationObserver; - + // 为AiEmotion页面的滚动容器添加滚动事件监听器 if (aiEmotionContainer) { - aiEmotionContainer.addEventListener('scroll', handleAiEmotionUserScroll, { passive: true }); + aiEmotionContainer.addEventListener("scroll", handleAiEmotionUserScroll, { + passive: true, + }); // 保存滚动事件监听器引用以便清理 aiEmotionHeightObserver.value.scrollListener = handleAiEmotionUserScroll; } - + console.log("AiEmotion页面高度监听器已启动"); }; @@ -489,12 +505,12 @@ const startAiEmotionHeightObserver = () => { const handleAiEmotionUserScroll = () => { // 标记用户正在滚动 isAiEmotionUserScrolling.value = true; - + // 清除之前的定时器 if (aiEmotionScrollTimer.value) { clearTimeout(aiEmotionScrollTimer.value); } - + // 设置定时器,2秒后恢复自动滚动 // aiEmotionScrollTimer.value = setTimeout(() => { // isAiEmotionUserScrolling.value = false; @@ -506,7 +522,7 @@ const handleAiEmotionUserScroll = () => { const handleChartInteractionStart = () => { console.log("图表交互开始,临时禁用自动滚动"); isChartInteracting.value = true; - + // 清除之前的定时器 if (chartInteractionTimer.value) { clearTimeout(chartInteractionTimer.value); @@ -518,7 +534,7 @@ const handleChartInteractionEnd = () => { if (chartInteractionTimer.value) { clearTimeout(chartInteractionTimer.value); } - + // 设置定时器,1秒后恢复自动滚动 chartInteractionTimer.value = setTimeout(() => { isChartInteracting.value = false; @@ -532,7 +548,7 @@ window.handleChartInteractionEnd = handleChartInteractionEnd; // 处理AiEmotion页面的滚动请求 const handleAiEmotionScrollToBottom = () => { - if (activeTab.value === 'AiEmotion') { + if (activeTab.value === "AiEmotion") { const container = tabContentAiEmotion.value; if (container) { // 使用nextTick确保DOM已更新 @@ -548,32 +564,38 @@ const handleAiEmotionScrollToBottom = () => { const stopAiEmotionHeightObserver = () => { isAiEmotionAutoScrollEnabled.value = false; isAiEmotionUserScrolling.value = false; - + // 清理滚动检测定时器 if (aiEmotionScrollTimer.value) { clearTimeout(aiEmotionScrollTimer.value); aiEmotionScrollTimer.value = null; } - + if (aiEmotionHeightObserver.value) { // 清理ResizeObserver aiEmotionHeightObserver.value.disconnect(); - + // 清理MutationObserver if (aiEmotionHeightObserver.value.mutationObserver) { aiEmotionHeightObserver.value.mutationObserver.disconnect(); aiEmotionHeightObserver.value.mutationObserver = null; } - + // 清理滚动事件监听器 - if (aiEmotionHeightObserver.value.scrollListener && tabContentAiEmotion.value) { - tabContentAiEmotion.value.removeEventListener('scroll', aiEmotionHeightObserver.value.scrollListener); + if ( + aiEmotionHeightObserver.value.scrollListener && + tabContentAiEmotion.value + ) { + tabContentAiEmotion.value.removeEventListener( + "scroll", + aiEmotionHeightObserver.value.scrollListener + ); aiEmotionHeightObserver.value.scrollListener = null; } - + aiEmotionHeightObserver.value = null; } - + console.log("AiEmotion页面高度监听器已停止"); }; @@ -685,7 +707,7 @@ setTimeout(() => { const heightListener = () => { const tabContainer = getCurrentScrollContainer(); if (!tabContainer) return; - + let befortop = 0; const scrollHandler = () => { @@ -837,7 +859,8 @@ const touchmoveHandler = (e) => { } // 判断触摸目标是否在当前活动页面的可滚动区域内 const currentContainer = getCurrentScrollContainer(); - const isScrollableArea = currentContainer && currentContainer.contains(e.target); + const isScrollableArea = + currentContainer && currentContainer.contains(e.target); // 如果不在可滚动区域,则阻止滚动 if (!isScrollableArea) { @@ -905,12 +928,14 @@ const backToHome = () => { if (env == "development" || env == "test") { window.parent.location.href = "http://121.89.234.155:8807/hljw/homepage?menu=999999991"; - } else if (env == "product") { - window.parent.location.href = - "https://web.homilychart.com/product/hljw/homepage?menu=999999991"; - } else if (env == "production") { - window.parent.location.href = - "https://web.homilychart.com/hljw/homepage?menu=999999991"; + } else { + window.parent.postMessage( + { + type: "NAVIGATE_TO_HOMEPAGE", + menu: "999999991", + }, + "*" + ); } // window.parent.location.href = window.parent.document.referrer } @@ -983,7 +1008,6 @@ const goChange = () => { setTimeout(() => { changeSuccessDialogVisible.value = false; }, 3000); - }; // 8.18金币兑换Token end @@ -1031,17 +1055,17 @@ onUnmounted(() => { } // 清理AiEmotion页面的高度监听器 stopAiEmotionHeightObserver(); - + // 清理图表交互相关的定时器和全局函数 - if (chartInteractionTimer.value) { - clearTimeout(chartInteractionTimer.value); - } - if (window.handleChartInteractionStart) { - delete window.handleChartInteractionStart; - } - if (window.handleChartInteractionEnd) { - delete window.handleChartInteractionEnd; - } + if (chartInteractionTimer.value) { + clearTimeout(chartInteractionTimer.value); + } + if (window.handleChartInteractionStart) { + delete window.handleChartInteractionStart; + } + if (window.handleChartInteractionEnd) { + delete window.handleChartInteractionEnd; + } }); @@ -1142,7 +1166,6 @@ onUnmounted(() => {
{{ UserCount }}
点击获取Token
-
{ @enableInput="enableInput" />
- +