Parcourir la source

Merge branch 'master' of http://1.14.104.71:10880/root/ylrz_his_scrm_companyUI

lmx il y a 4 jours
Parent
commit
c208a7327c
2 fichiers modifiés avec 51 ajouts et 9 suppressions
  1. 1 1
      .env.prod-bjzm
  2. 50 8
      src/views/live/liveConsole/LiveConsole.vue

+ 1 - 1
.env.prod-bjzm

@@ -22,7 +22,7 @@ VUE_APP_COS_BUCKET = bjzmky-1323137866
 # 存储桶配置
 VUE_APP_COS_REGION = ap-chongqing
 # 线路一地址
-VUE_APP_VIDEO_LINE_1 = https://bjzmkytcpv.ylrzcloud.com
+VUE_APP_VIDEO_LINE_1 = http://bjzmkytcpv.ylrzcloud.com
 # 线路二地址
 VUE_APP_VIDEO_LINE_2 = https://bjzmobs.ylrztop.com
 

+ 50 - 8
src/views/live/liveConsole/LiveConsole.vue

@@ -154,6 +154,8 @@
             type="primary"
             size="small"
             @click.stop="loadLatestMessages"
+            :disabled="isLoadingLatest"
+            :loading="isLoadingLatest"
             icon="el-icon-refresh">
             加载最新消息
           </el-button>
@@ -407,6 +409,8 @@ export default {
       isAutoScrollEnabled: true, // 是否启用自动滚动
       autoScrollTimer: null, // 自动滚动定时器
       showLoadLatestBtn: false, // 是否显示加载最新消息按钮
+      isLoadingLatest: false, // 是否正在加载最新消息
+      scrollDebounceTimer: null, // 滚动防抖定时器
       msgParams: {
         pageNum: 1,
         pageSize: 30,
@@ -479,10 +483,6 @@ export default {
     // 滚动到底部
     scrollToBottom(forceScroll = false) {
       // 如果自动滚动被禁用且不是强制滚动,则不执行
-      console.log("scrollToBottom")
-      console.log(!this.isAutoScrollEnabled && !forceScroll)
-      console.log(this.$refs.manageRightRef && this.$refs.manageRightRef.wrap)
-      console.log(forceScroll || this.isAutoScrollEnabled)
       if (!this.isAutoScrollEnabled && !forceScroll) {
         return;
       }
@@ -503,6 +503,11 @@ export default {
     },
     // 加载最新消息
     loadLatestMessages() {
+      // 如果正在加载,直接返回
+      if (this.isLoadingLatest) {
+        return;
+      }
+      this.isLoadingLatest = true;
       this.showLoadLatestBtn = false;
       // 恢复自动滚动
       this.isAutoScrollEnabled = true;
@@ -718,8 +723,6 @@ export default {
           }
           this.msgList.push(message)
           // 如果启用自动滚动,自动滚动到底部
-          console.log("handleWsMessage")
-          console.log(this.isAutoScrollEnabled)
           if (this.isAutoScrollEnabled) {
             this.$nextTick(() => {
               this.autoScrollTimer = setTimeout(() => {
@@ -1182,6 +1185,9 @@ export default {
           // 所有消息加载完成后,根据自动滚动状态决定是否滚动
           this.$nextTick(() => {
             setTimeout(() => {
+              // 重置加载状态
+              this.isLoadingLatest = false;
+              
               if (this.isAutoScrollEnabled) {
                 // 如果启用自动滚动,强制滚动到底部并隐藏按钮
                 this.scrollToBottom(true);
@@ -1195,7 +1201,7 @@ export default {
                   const maxScrollTop = scrollHeight - clientHeight;
 
                   if (currentScrollTop < maxScrollTop - 50) {
-                    // this.showLoadLatestBtn = true;
+                    this.showLoadLatestBtn = true;
                   } else {
                     this.showLoadLatestBtn = false;
                   }
@@ -1208,9 +1214,38 @@ export default {
 
       // 添加滚动监听
       this.$nextTick(() => {
-        this.$refs.manageRightRef.wrap.addEventListener("scroll", this.manageRightScroll)
+        if (this.$refs.manageRightRef && this.$refs.manageRightRef.wrap) {
+          this.$refs.manageRightRef.wrap.addEventListener("scroll", this.manageRightScroll)
+        }
       })
     },
+    // 消息滚动监听(带防抖)
+    manageRightScroll() {
+      // 清除之前的防抖定时器
+      if (this.scrollDebounceTimer) {
+        clearTimeout(this.scrollDebounceTimer);
+      }
+      
+      // 设置防抖,300ms内只执行一次
+      this.scrollDebounceTimer = setTimeout(() => {
+        this.saveChatScrollPosition();
+        
+        // 检查是否滚动到底部
+        if (this.$refs.manageRightRef && this.$refs.manageRightRef.wrap) {
+          const wrap = this.$refs.manageRightRef.wrap;
+          const scrollHeight = wrap.scrollHeight;
+          const clientHeight = wrap.clientHeight;
+          const currentScrollTop = wrap.scrollTop;
+          const maxScrollTop = scrollHeight - clientHeight;
+          
+          // 如果滚动到底部(距离底部小于50px),隐藏按钮并恢复自动滚动
+          if (currentScrollTop >= maxScrollTop - 50) {
+            this.showLoadLatestBtn = false;
+            this.isAutoScrollEnabled = true;
+          }
+        }
+      }, 300);
+    },
     loadUserTotals() {
       if (!this.liveId) return;
       // 假设后端提供一个接口返回总人数(如果没有,可通过首次加载全量数据后统计)
@@ -1427,6 +1462,13 @@ export default {
     if (this.autoScrollTimer) {
       clearTimeout(this.autoScrollTimer);
     }
+    if (this.scrollDebounceTimer) {
+      clearTimeout(this.scrollDebounceTimer);
+    }
+    // 移除滚动监听器
+    if (this.$refs.manageRightRef && this.$refs.manageRightRef.wrap) {
+      this.$refs.manageRightRef.wrap.removeEventListener("scroll", this.manageRightScroll);
+    }
   },
   // 使用 deactivated 和 activated 钩子替代 beforeDestroy 和 destroyed
   deactivated() {