@blueking/monitor-apm-log 2.3.26 → 2.3.28

package/css/main.css

@@ -86,7 +86,7 @@ ul.search-items{display:inline-flex;flex-wrap:wrap;width:100%;max-height:135px;p
 .kv-list-wrapper[data-v-0e8a994f]{max-height:50vh;overflow-y:auto;font-family:var(--table-fount-family);font-size:var(--table-fount-size)}.kv-list-wrapper .log-item[data-v-0e8a994f]:nth-child(even){background-color:#f5f7fa}.kv-list-wrapper .log-item[data-v-0e8a994f]:nth-child(odd){background-color:#fff}.kv-list-wrapper .log-item[data-v-0e8a994f]{display:flex;align-items:center;justify-content:center;min-height:24px;padding-left:8px}.kv-list-wrapper .log-item .field-value[data-v-0e8a994f]{display:flex;align-items:flex-start;color:#16171a;word-break:break-all}.kv-list-wrapper .log-item .field-value[data-v-0e8a994f] .valid-text:hover{text-decoration:underline;text-decoration-color:#498eff}.kv-list-wrapper .log-item .field-label[data-v-0e8a994f]{display:flex;flex-shrink:0;flex-wrap:nowrap;align-items:stretch;height:100%;margin:5px 0;margin-right:18px;align-self:flex-start;width:300px}.kv-list-wrapper .log-item .field-label .field-eye-icon[data-v-0e8a994f]{display:inline-flex;align-items:center;justify-content:center;width:12px;margin-right:8px;font-size:12px;color:#4d4f56;border-radius:2px}.kv-list-wrapper .log-item .field-label .field-eye-icon[data-v-0e8a994f]:hover{color:#3a84ff}.kv-list-wrapper .log-item .field-label .field-type-icon[data-v-0e8a994f]{display:inline-flex;align-items:center;justify-content:center;width:16px;min-width:16px;margin:0 5px 0 0;font-size:14px;color:#63656e;background:#dcdee5;border-radius:2px}.kv-list-wrapper .log-item .field-label .field-text[data-v-0e8a994f]{display:block;width:auto;overflow:hidden;font-family:Roboto-Regular;color:#313238;word-break:normal;word-wrap:break-word}.kv-list-wrapper .log-item .field-label[data-v-0e8a994f] .bklog-ext{min-width:22px;height:22px;transform:translateX(-3px) scale(0.7)}.kv-list-wrapper .relation-monitor-btn[data-v-0e8a994f]{display:flex;column-gap:2px;align-items:center;min-width:fit-content;padding-top:1px;padding-right:6px;font-size:12px;line-height:22px;color:#3a84ff;cursor:pointer}.kv-list-wrapper .relation-monitor-btn .bklog-jump[data-v-0e8a994f]{font-size:14px}.kv-list-wrapper .load-more-btn[data-v-0e8a994f]{display:flex;align-items:center;color:#3a84ff;margin-top:8px;margin-left:4px;cursor:pointer;font-size:12px}.kv-list-wrapper .load-more-btn span[data-v-0e8a994f]{font-size:12px}.kv-list-wrapper .load-more-btn .bklog-more[data-v-0e8a994f],.kv-list-wrapper .load-more-btn .bklog-log-loading[data-v-0e8a994f]{margin-right:4px;font-size:12px;color:#3a84ff}.kv-list-wrapper .load-more-btn .bklog-more[data-v-0e8a994f]{font-size:18px;transform:rotate(90deg)}.kv-list-wrapper .skeleton-list-wrapper[data-v-0e8a994f]{padding:2px 15px 14px 15px}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item[data-v-0e8a994f]{display:flex;align-items:center;justify-content:center;min-height:24px;padding-left:8px;margin:0}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item[data-v-0e8a994f]:nth-child(even){background-color:#f5f7fa}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item[data-v-0e8a994f]:nth-child(odd){background-color:#fff}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-label[data-v-0e8a994f]{display:flex;flex-shrink:0;flex-wrap:nowrap;align-items:center;height:100%;margin:5px 0;margin-right:18px;align-self:flex-start;width:300px}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-label .skeleton-icon[data-v-0e8a994f]{width:12px;min-width:12px;height:12px;margin-right:8px;border-radius:2px}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-label[data-v-0e8a994f]::before{content:"";display:inline-block;width:16px;min-width:16px;height:16px;margin-right:5px;border-radius:2px;background:linear-gradient(90deg, #f0f2f5 25%, #e6e9ed 50%, #f0f2f5 70%);background-size:400% 100%;animation:shimmer-0e8a994f 1.8s infinite linear}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-label .skeleton-text[data-v-0e8a994f]{flex:1;height:14px;min-width:80px;max-width:200px;border-radius:2px}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-value[data-v-0e8a994f]{display:flex;align-items:flex-start;flex:1;min-width:0;color:#16171a;word-break:break-all}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton-field-value .skeleton-value[data-v-0e8a994f]{height:14px;width:100%;min-width:100px;max-width:500px;border-radius:2px}.kv-list-wrapper .skeleton-list-wrapper .skeleton-list-item .skeleton[data-v-0e8a994f]{background:linear-gradient(90deg, #f0f2f5 25%, #e6e9ed 50%, #f0f2f5 70%);background-size:400% 100%;animation:shimmer-0e8a994f 1.8s infinite linear}@keyframes shimmer-0e8a994f{0%{background-position:200% 0}100%{background-position:-200% 0}}
 .expand-view-wrapper[data-v-d72c98f0]{width:100%;color:#313238;background-color:#f5f7fa}.expand-view-wrapper .view-tab[data-v-d72c98f0]{display:flex;justify-content:space-between;padding-right:15px;font-size:0;background-color:#f5f7fa}.expand-view-wrapper .view-tab .tab-left span[data-v-d72c98f0]{display:inline-block;width:46px;height:23px;font-size:12px;line-height:23px;color:#313238;text-align:center;cursor:pointer;border-top:0}.expand-view-wrapper .view-tab .tab-left span[data-v-d72c98f0]:first-child{border-left:0}.expand-view-wrapper .view-tab .tab-left span.activeKv[data-v-d72c98f0],.expand-view-wrapper .view-tab .tab-left span.activeJson[data-v-d72c98f0]{position:relative;font-size:12px;font-weight:700}.expand-view-wrapper .view-tab .tab-left span.activeKv[data-v-d72c98f0]::after{position:absolute;top:-2px;left:14px;width:17px;height:2px;content:"";background-color:#313238}.expand-view-wrapper .view-tab .tab-left span.activeJson[data-v-d72c98f0]::after{position:absolute;top:-2px;left:10px;width:30px;height:2px;content:"";background-color:#313238}.expand-view-wrapper .view-tab .tab-right[data-v-d72c98f0]{position:sticky;right:20px;display:flex;align-items:center}.expand-view-wrapper .view-tab .tab-right .search-input[data-v-d72c98f0]{margin-right:10px}.expand-view-wrapper .view-tab .tab-right .search-input[data-v-d72c98f0] .bk-form-input{width:200px;height:22px;background:#f5f7fa;padding:0;border:none;border-bottom:1px solid #c4c6cc}.expand-view-wrapper .view-tab .tab-right .search-input[data-v-d72c98f0] .bk-form-input:focus{background:#f5f7fa !important}.expand-view-wrapper .view-tab .tab-right .search-input[data-v-d72c98f0] .right-icon{right:0px !important}.expand-view-wrapper .view-tab .tab-right .bklog-icon[data-v-d72c98f0]{font-size:16px;color:#63656e;cursor:pointer}.expand-view-wrapper .view-tab .tab-right .bklog-icon[data-v-d72c98f0]:hover{color:#3a84ff}.expand-view-wrapper .view-content[data-v-d72c98f0]{padding:2px 15px 14px 15px;background-color:#f5f7fa}.expand-view-wrapper .view-content[data-v-d72c98f0] .vjs-tree{font-size:var(--table-fount-size) !important}.expand-view-wrapper .view-content[data-v-d72c98f0] .vjs-tree .vjs-tree-node{line-height:22px}.expand-view-wrapper .view-content[data-v-d72c98f0] .vjs-tree .vjs-tree-node .vjs-value.vjs-value-string{white-space:pre-wrap}.expand-view-wrapper .view-content[data-v-d72c98f0] .kv-content .bklog-text-segment.bklog-root-field{max-height:fit-content}
 .json-view-content .vjs-tree-brackets,.json-view-content .vjs-key{color:#9d694c !important}.json-view-content .vjs-value-string{color:#357a94}.json-view-content .vjs-value-number{color:#2caf5e}.json-view-content .vjs-indent-unit.has-line{border-left:1px solid #bfcbd9}
-.handle-content[data-v-e9e5db3e]{position:absolute;right:0;display:flex;align-items:flex-start;justify-content:center;width:84px;overflow:hidden}.handle-content .handle-card[data-v-e9e5db3e]{display:flex;align-items:center;justify-content:center;width:18px;height:20px;margin-left:10px;font-size:18px;color:#8b92a5}.handle-content .handle-card .bklog-icon[data-v-e9e5db3e]{cursor:pointer}.handle-content .handle-card.ai-assistant[data-v-e9e5db3e]{position:relative}.handle-content .handle-card.ai-assistant img[data-v-e9e5db3e]{position:absolute;top:0;left:0;width:20px;height:20px;cursor:pointer;background-color:#fff;opacity:0}.fix-content[data-v-e9e5db3e]{width:auto;background-color:#f5f7fa}.icon-exclamation-circle-shape[data-v-e9e5db3e]{color:#d7473f}.icon-more[data-v-e9e5db3e]{transform:translateY(2px) translateX(4px)}.is-disable[data-v-e9e5db3e]{color:#eceef2 !important;cursor:no-drop !important}.clean-str[data-v-e9e5db3e]{color:#3a84ff;cursor:pointer}.union-icon[data-v-e9e5db3e]{margin-right:8px}.bklog-handle[data-v-e9e5db3e]{font-size:14px;color:#979ba5;cursor:pointer}.bklog-handle[data-v-e9e5db3e]:hover{color:#3a84ff}
+.handle-content[data-v-7d414dc8]{position:absolute;right:0;display:flex;align-items:flex-start;justify-content:center;width:84px;overflow:hidden}.handle-content .handle-card[data-v-7d414dc8]{display:flex;align-items:center;justify-content:center;width:18px;height:20px;margin-left:10px;font-size:18px;color:#8b92a5}.handle-content .handle-card .bklog-icon[data-v-7d414dc8]{cursor:pointer}.handle-content .handle-card.ai-assistant[data-v-7d414dc8]{position:relative}.handle-content .handle-card.ai-assistant img[data-v-7d414dc8]{position:absolute;top:0;left:0;width:20px;height:20px;cursor:pointer;background-color:#fff;opacity:0}.fix-content[data-v-7d414dc8]{width:auto;background-color:#f5f7fa}.icon-exclamation-circle-shape[data-v-7d414dc8]{color:#d7473f}.icon-more[data-v-7d414dc8]{transform:translateY(2px) translateX(4px)}.is-disable[data-v-7d414dc8]{color:#eceef2 !important;cursor:no-drop !important}.clean-str[data-v-7d414dc8]{color:#3a84ff;cursor:pointer}.union-icon[data-v-7d414dc8]{margin-right:8px}.bklog-handle[data-v-7d414dc8]{font-size:14px;color:#979ba5;cursor:pointer}.bklog-handle[data-v-7d414dc8]:hover{color:#3a84ff}
 .bklog-v3-btn-scroll-top{position:fixed;right:30px;bottom:50px;z-index:3;display:none;align-items:center;justify-content:center;width:48px;height:48px;cursor:pointer;background:#fff;border:1px solid #e9ecf1;border-radius:50%;box-shadow:0 3px 10px 0 rgba(0,0,0,.1215686275);transition:.3s}.bklog-v3-btn-scroll-top.show-box{display:flex}.bklog-v3-btn-scroll-top i{font-size:24px;color:#3a84ff}
 .bklog-row-observe{position:relative;height:fit-content}
 .bklog-scroll-x{position:fixed;right:var(--right);bottom:0;z-index:4;height:14px;overflow-x:auto;background-color:rgba(0,0,0,0)}.bklog-scroll-x>div{height:1px;background-color:rgba(0,0,0,0)}

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", {
@@ -120035,8 +120110,8 @@ var expand_view_component = normalizeComponent(
 )
 
 /* harmony default export */ const expand_view = (expand_view_component.exports);
-;// ./node_modules/thread-loader/dist/cjs.js??clonedRuleSet-3.use[0]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-3.use[1]!./node_modules/ifdef-loader/ifdef-loader.js??clonedRuleSet-3.use[2]!./node_modules/vue-loader/lib/loaders/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/views/retrieve-v2/components/result-cell-element/operator-tools.vue?vue&type=template&id=e9e5db3e&scoped=true
-var operator_toolsvue_type_template_id_e9e5db3e_scoped_true_render = function render() {
+;// ./node_modules/thread-loader/dist/cjs.js??clonedRuleSet-3.use[0]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-3.use[1]!./node_modules/ifdef-loader/ifdef-loader.js??clonedRuleSet-3.use[2]!./node_modules/vue-loader/lib/loaders/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/views/retrieve-v2/components/result-cell-element/operator-tools.vue?vue&type=template&id=7d414dc8&scoped=true
+var operator_toolsvue_type_template_id_7d414dc8_scoped_true_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('div', {
@@ -120224,7 +120299,7 @@ var operator_toolsvue_type_template_id_e9e5db3e_scoped_true_render = function re
     }
   })])] : _vm._e()], 2);
 };
-var operator_toolsvue_type_template_id_e9e5db3e_scoped_true_staticRenderFns = [];
+var operator_toolsvue_type_template_id_7d414dc8_scoped_true_staticRenderFns = [];
 
 ;// ./node_modules/thread-loader/dist/cjs.js??clonedRuleSet-3.use[0]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-3.use[1]!./node_modules/ifdef-loader/ifdef-loader.js??clonedRuleSet-3.use[2]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/views/retrieve-v2/components/result-cell-element/operator-tools.vue?vue&type=script&lang=js
 
@@ -120253,6 +120328,7 @@ function operator_toolsvue_type_script_lang_js_objectSpread(e) { for (var r = 1;
     handleClick: Function
   },
   emits: ['handleAi'],
+  inject: ['handleRelatedTraceClick'],
   data: function data() {
     return {
       showAllHandle: false,
@@ -120386,6 +120462,14 @@ function operator_toolsvue_type_script_lang_js_objectSpread(e) { for (var r = 1;
           var _apmRelation$extra = apmRelation.extra,
             appName = _apmRelation$extra.app_name,
             bkBizId = _apmRelation$extra.bk_biz_id;
+          if (this.isMonitorApm) {
+            this.handleRelatedTraceClick({
+              appName: appName,
+              bkBizId: bkBizId,
+              traceId: traceId
+            });
+            return;
+          }
           var path = "/?bizId=".concat(bkBizId, "#/trace/home?app_name=").concat(appName, "&search_type=accurate&trace_id=").concat(traceId);
           if (path) {
             var _window$MONITOR_URL;
@@ -120417,11 +120501,11 @@ function operator_toolsvue_type_script_lang_js_objectSpread(e) { for (var r = 1;
 
 var operator_tools_component = normalizeComponent(
   result_cell_element_operator_toolsvue_type_script_lang_js,
-  operator_toolsvue_type_template_id_e9e5db3e_scoped_true_render,
-  operator_toolsvue_type_template_id_e9e5db3e_scoped_true_staticRenderFns,
+  operator_toolsvue_type_template_id_7d414dc8_scoped_true_render,
+  operator_toolsvue_type_template_id_7d414dc8_scoped_true_staticRenderFns,
   false,
   null,
-  "e9e5db3e",
+  "7d414dc8",
   null
   
 )
@@ -121859,9 +121943,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', {
@@ -147533,11 +147632,16 @@ var sub_bar_component = normalizeComponent(
     handleChartDataZoom: {
       type: Function,
       default: null
+    },
+    handleRelatedTraceClick: {
+      type: Function,
+      default: null
     }
   },
   setup(props) {
     const store = use_store();
     (0,external_vue_.provide)('handleChartDataZoom', props.handleChartDataZoom);
+    (0,external_vue_.provide)('handleRelatedTraceClick', props.handleRelatedTraceClick);
     const {
       isSearchContextStickyTop,
       isSearchResultStickyTop,

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.28","description":"","main":"main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"author":"","license":"MIT"}