@blueking/monitor-apm-log 2.3.26 → 2.3.27

package/main.js

@@ -117610,19 +117610,48 @@ var json_formatter_component = normalizeComponent(
     let firstLogEl = null;
     let throttleTimer;
     let timer;
+    let scrollBindTimer;
+    let highlightTimer;
+    let initLogResultTimer;
+    let filterCheckTimer;
+    let handleScroll = () => {};
     let displayFieldNames = [];
+    let contextLogRequestSeq = 0;
+    const contentLogRequestId = 'retrieve_getContentLog_contextLog';
+    const isContextLogVisible = () => isShow.value && props.isShow;
+    const isCurrentContextLogRequest = requestSeq => isContextLogVisible() && requestSeq === contextLogRequestSeq;
+    const clearContextLogTimers = () => {
+      clearTimeout(timer);
+      clearTimeout(throttleTimer);
+      clearTimeout(scrollBindTimer);
+      clearTimeout(highlightTimer);
+      clearTimeout(initLogResultTimer);
+      clearTimeout(filterCheckTimer);
+    };
+    const cleanupContextLogEffects = () => {
+      contextLogRequestSeq += 1;
+      clearContextLogTimers();
+      contextLog.value?.removeEventListener('scroll', handleScroll);
+      logLoading.value = false;
+      src_api.cancel(contentLogRequestId);
+    };
     (0,external_vue_.watch)(() => props.isShow, () => {
       isShow.value = props.isShow;
       if (isShow.value) {
-        setTimeout(() => {
-          logResultRef.value.init();
+        contextLogRequestSeq += 1;
+        initLogResultTimer = setTimeout(() => {
+          if (isContextLogVisible()) {
+            logResultRef.value?.init();
+          }
         });
+        return;
       }
+      cleanupContextLogEffects();
     }, {
       immediate: true
     });
     (0,external_vue_.watch)(() => [props.indexSetId, props.logParams], async () => {
-      if (props.indexSetId && props.logParams) {
+      if (isContextLogVisible() && props.indexSetId && props.logParams && Object.keys(props.logParams).length) {
         localParams.value = {};
         deepClone(props.logParams);
         await requestContentLog();
@@ -117631,7 +117660,11 @@ var json_formatter_component = normalizeComponent(
       immediate: true
     });
     (0,external_vue_.watch)(activeFilterKey, () => {
-      setTimeout(() => {
+      clearTimeout(filterCheckTimer);
+      filterCheckTimer = setTimeout(() => {
+        if (!isContextLogVisible()) {
+          return;
+        }
         const lineDomList = Array.from(logViewRef.value?.$el.querySelectorAll('.line') || []);
         if (lineDomList.length && lineDomList.every(item => item.style.display === 'none')) {
           isFilterEmpty.value = true;
@@ -117652,6 +117685,7 @@ var json_formatter_component = normalizeComponent(
       localParams.value = {};
     };
     const handleAfterLeave = () => {
+      cleanupContextLogEffects();
       dataFilterRef.value?.reset();
       logResultRef.value?.reset();
       highlightList.value = [];
@@ -117677,8 +117711,8 @@ var json_formatter_component = normalizeComponent(
       });
     };
     const handleKeyup = event => {
-      if (event.keyCode === 27) {
-        contextLog.value?.removeEventListener('scroll', handleScroll);
+      if (event.keyCode === 27 && isContextLogVisible()) {
+        cleanupContextLogEffects();
         handleAfterLeave();
       }
     };
@@ -117729,11 +117763,22 @@ var json_formatter_component = normalizeComponent(
       return ['log'];
     };
     const requestContentLog = async direction => {
+      if (!isContextLogVisible()) {
+        return;
+      }
+      const requestSeq = contextLogRequestSeq;
+      const paramsSnapshot = {
+        ...localParams.value
+      };
+      const dtEventTimeStamp = paramsSnapshot.dtEventTimeStamp ?? props.logParams?.dtEventTimeStamp;
+      if (!props.indexSetId || dtEventTimeStamp === undefined || dtEventTimeStamp === null || dtEventTimeStamp === 'None') {
+        return;
+      }
       const data = Object.assign({
         size: 50,
         zero: zero.value,
-        dtEventTimeStamp: props.logParams.dtEventTimeStamp
-      }, localParams.value);
+        dtEventTimeStamp
+      }, paramsSnapshot);
       if (direction === 'down') {
         data.begin = nextBegin.value;
       } else if (direction === 'top') {
@@ -117748,7 +117793,13 @@ var json_formatter_component = normalizeComponent(
             index_set_id: props.indexSetId
           },
           data
+        }, {
+          catchIsShowMessage: false,
+          requestId: contentLogRequestId
         });
+        if (!isCurrentContextLogRequest(requestSeq)) {
+          return;
+        }
         const {
           list
         } = res.data;
@@ -117782,18 +117833,26 @@ var json_formatter_component = normalizeComponent(
           }
         }
       } catch (e) {
-        console.error(e);
-      } finally {
-        logLoading.value = false;
-        if (highlightList.value.length) {
-          setTimeout(() => {
-            dataFilterRef.value.getHighlightControl()?.initLightItemList(direction);
-          });
+        if (isCurrentContextLogRequest(requestSeq)) {
+          console.warn(e);
         }
-        if (zero.value) {
-          (0,external_vue_.nextTick)(() => {
-            initLogScrollPosition();
-          });
+      } finally {
+        if (isCurrentContextLogRequest(requestSeq)) {
+          logLoading.value = false;
+          if (highlightList.value.length) {
+            highlightTimer = setTimeout(() => {
+              if (isCurrentContextLogRequest(requestSeq)) {
+                dataFilterRef.value?.getHighlightControl()?.initLightItemList(direction);
+              }
+            });
+          }
+          if (zero.value) {
+            (0,external_vue_.nextTick)(() => {
+              if (isCurrentContextLogRequest(requestSeq)) {
+                initLogScrollPosition();
+              }
+            });
+          }
         }
       }
     };
@@ -117828,8 +117887,11 @@ var json_formatter_component = normalizeComponent(
       reverseLogList.value = handleFormatList(reverseRawList, list);
     };
     const initLogScrollPosition = () => {
+      if (!isContextLogVisible() || !contextLog.value) {
+        return;
+      }
       // 确定第0条的位置
-      firstLogEl = document.querySelector('.dialog-log-markdown .log-init');
+      firstLogEl = contextLog.value.querySelector('.log-init');
       // 没有数据
       if (!firstLogEl) return;
       contextLog.value.removeEventListener('scroll', handleScroll);
@@ -117843,16 +117905,23 @@ var json_formatter_component = normalizeComponent(
       }
       zero.value = false;
       // 避免重复请求
-      setTimeout(() => {
-        contextLog.value.addEventListener('scroll', handleScroll, {
-          passive: true
-        });
+      clearTimeout(scrollBindTimer);
+      scrollBindTimer = setTimeout(() => {
+        if (isContextLogVisible() && contextLog.value) {
+          contextLog.value.addEventListener('scroll', handleScroll, {
+            passive: true
+          });
+        }
       });
     };
-    const handleScroll = () => {
+    handleScroll = () => {
+      if (!isContextLogVisible()) {
+        return;
+      }
       clearTimeout(timer);
+      const requestSeq = contextLogRequestSeq;
       timer = setTimeout(() => {
-        if (logLoading.value) {
+        if (!isCurrentContextLogRequest(requestSeq) || logLoading.value || !contextLog.value) {
           return;
         }
         const {
@@ -117864,6 +117933,9 @@ var json_formatter_component = normalizeComponent(
           // 滚动到顶部
           requestContentLog('top').then(() => {
             (0,external_vue_.nextTick)(() => {
+              if (!isCurrentContextLogRequest(requestSeq) || !contextLog.value) {
+                return;
+              }
               // 记录刷新前滚动位置
               const newScrollHeight = contextLog.value.scrollHeight;
               contextLog.value.scrollTo({
@@ -117910,6 +117982,8 @@ var json_formatter_component = normalizeComponent(
       }, 300);
     };
     const handleChooseRow = data => {
+      cleanupContextLogEffects();
+      contextLogRequestSeq += 1;
       initLogValues();
       deepClone(data);
       requestContentLog();
@@ -117925,6 +117999,7 @@ var json_formatter_component = normalizeComponent(
       });
     });
     (0,external_vue_.onBeforeUnmount)(() => {
+      cleanupContextLogEffects();
       document.removeEventListener('keyup', handleKeyup);
     });
     return () => (0,external_vue_.h)("bk-dialog", {
@@ -121859,9 +121934,24 @@ function use_lazy_render_deepQueryShadowSelector(selector) {
         resetPageState();
       }
     });
-    addEvent([retrieve_events.SEARCH_VALUE_CHANGE, retrieve_events.SEARCH_TIME_CHANGE, retrieve_events.TREND_GRAPH_SEARCH, retrieve_events.SORT_LIST_CHANGED], () => {
+    addEvent([retrieve_events.SEARCH_VALUE_CHANGE, retrieve_events.SEARCH_TIME_CHANGE, retrieve_events.TREND_GRAPH_SEARCH], () => {
       resetPageState();
     });
+    addEvent(retrieve_events.SORT_LIST_CHANGED, () => {
+      /**
+       * SORT_LIST_CHANGED may be fired after the sort query has finished.
+       * In that case tableDataSize has already changed and first-page reveal has already been scheduled/finished.
+       * Resetting first-page layout again here would leave the skeleton pending forever because no new data-size
+       * change will arrive to call scheduleFirstPageTableReveal().
+       *
+       * New sort queries already clear list and set loading in requestIndexSetQuery(), which drives the skeleton
+       * through tableDataSize/isLoading watchers. Therefore this event only needs to force reset while the request
+       * is still in-flight or before any result rows are available.
+       */
+      if (isLoading.value || isPageLoading.value || isRequesting.value || tableDataSize.value === 0) {
+        resetPageState();
+      }
+    });
     addEvent(retrieve_events.AUTO_REFRESH, () => {
       resetPageState();
       store.dispatch('requestIndexSetQuery', {

package/package.json

@@ -1 +1 @@
-{"name":"@blueking/monitor-apm-log","version":"2.3.26","description":"","main":"main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"author":"","license":"MIT"}
+{"name":"@blueking/monitor-apm-log","version":"2.3.27","description":"","main":"main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"author":"","license":"MIT"}