uni-oaview 1.9.14 → 1.9.16

package/components/oa-page/oa-page.vue

@@ -1,5 +1,4 @@
 <template>
-  <oa-vconsole v-if="showLog" />
   <view class="oa-page" :style="{ height: windowHeight }" @click="clickHandler">
     <NetworkError />
     <slot />

package/components/oa-vconsole/native-event-state.ts

@@ -0,0 +1,104 @@
+export interface NativeEventLog {
+  key: string;
+  params: unknown;
+  response: unknown;
+  startTime: number;
+  endTime: number;
+}
+
+export interface NativeEventLogMeta {
+  id: string;
+  key: string;
+  title: string;
+}
+
+export interface NativeEventState {
+  detailMap: Map<string, NativeEventLog>;
+  metas: NativeEventLogMeta[];
+  expandedIds: Set<string>;
+}
+
+export interface NativeEventIdStore {
+  ids: WeakMap<NativeEventLog, string>;
+  nextId: number;
+}
+
+export const MAX_NATIVE_EVENT_LOGS = 200;
+
+export const createNativeEventIdStore = (): NativeEventIdStore => {
+  return {
+    ids: new WeakMap<NativeEventLog, string>(),
+    nextId: 0,
+  };
+};
+
+export const buildNativeEventLogId = (log: NativeEventLog): string => {
+  return `${log.startTime}|${log.endTime}|${log.key}`;
+};
+
+const getStableNativeEventLogId = (log: NativeEventLog, idStore?: NativeEventIdStore): string => {
+  if (!idStore) {
+    return buildNativeEventLogId(log);
+  }
+
+  const cachedId = idStore.ids.get(log);
+  if (cachedId) {
+    return cachedId;
+  }
+
+  idStore.nextId += 1;
+  const nextId = `native-event-${idStore.nextId}`;
+  idStore.ids.set(log, nextId);
+  return nextId;
+};
+
+const formatStartTime = (timestamp: number): string => {
+  const date = new Date(timestamp);
+  return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}:${String(
+    date.getSeconds(),
+  ).padStart(2, '0')}`;
+};
+
+const getTitle = (log: NativeEventLog): string => {
+  const { startTime, endTime, key } = log;
+  if (startTime && endTime) {
+    return `${formatStartTime(startTime)} ${key}；${(endTime - startTime) / 1000}s`;
+  }
+  return key;
+};
+
+const buildMetaFromLog = (log: NativeEventLog, id: string): NativeEventLogMeta => {
+  return {
+    id,
+    key: log.key,
+    title: getTitle(log),
+  };
+};
+
+export const buildNativeEventState = (
+  logs: NativeEventLog[],
+  expandedIds: Iterable<string>,
+  _idStore?: NativeEventIdStore,
+): NativeEventState => {
+  const nextLogs = logs.slice(-MAX_NATIVE_EVENT_LOGS);
+  const detailMap = new Map<string, NativeEventLog>();
+  const metas = nextLogs.map((log) => {
+    const id = getStableNativeEventLogId(log, _idStore);
+    detailMap.set(id, log);
+    return buildMetaFromLog(log, id);
+  });
+  const keepIds = new Set(metas.map((meta) => meta.id));
+  const nextExpandedIds = new Set<string>();
+
+  for (const id of expandedIds) {
+    if (keepIds.has(id)) {
+      nextExpandedIds.add(id);
+    }
+  }
+
+  return {
+    detailMap,
+    metas,
+    expandedIds: nextExpandedIds,
+  };
+};

package/components/oa-vconsole/native-event.vue

@@ -38,24 +38,14 @@
 <script lang="ts" setup>
   import { computed, onBeforeUnmount, ref, shallowRef } from 'vue';
   import awesomeDisplayInfo from './awesome-display-info.vue';
+  import {
+    buildNativeEventState,
+    createNativeEventIdStore,
+    type NativeEventLog,
+    type NativeEventLogMeta,
+  } from './native-event-state';
   import { stringifyForSearch } from './utils';
   import { nativeEventSubject, getNativeEventLogs } from 'uniapp-log-sdk';
-
-  interface NativeEventLog {
-    key: string;
-    params: unknown;
-    response: unknown;
-    startTime: number;
-    endTime: number;
-  }
-
-  interface NativeEventLogMeta {
-    id: string;
-    key: string;
-    title: string;
-  }
-
-  const MAX_NATIVE_EVENT_LOGS = 200;
   const FLUSH_DELAY_FOREGROUND = 16;
   const FLUSH_DELAY_BACKGROUND = 100;
   const MAX_EXPANDED_ITEMS = 20; // 限制最大展开项数
@@ -71,38 +61,12 @@
 
   let flushTimer: ReturnType<typeof setTimeout> | null = null;
   let pendingLogs: NativeEventLog[] | null = null;
+  const nativeEventIdStore = createNativeEventIdStore();
 
   // 订阅和监听器取消函数
   let unsubscribeLogs: (() => void) | null = null;
   const cleanupFunctions: (() => void)[] = [];
 
-  const buildNativeEventLogId = (log: NativeEventLog): string => {
-    return `${log.startTime}|${log.endTime}|${log.key}`;
-  };
-
-  const formatStartTime = (timestamp: number): string => {
-    const date = new Date(timestamp);
-    return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}:${String(
-      date.getSeconds(),
-    ).padStart(2, '0')}`;
-  };
-
-  const getTitle = (log: NativeEventLog): string => {
-    const { startTime, endTime, key } = log;
-    if (startTime && endTime) {
-      return `${formatStartTime(startTime)} ${key}；${(endTime - startTime) / 1000}s`;
-    }
-    return key;
-  };
-
-  const buildMetaFromLog = (log: NativeEventLog): NativeEventLogMeta => {
-    return {
-      id: buildNativeEventLogId(log),
-      key: log.key,
-      title: getTitle(log),
-    };
-  };
-
   const isExpanded = (id: string): boolean => expandedIds.value.has(id);
 
   const toggleExpand = (id: string): void => {
@@ -188,34 +152,10 @@
       return;
     }
 
-    const nextLogs = visibleLogs.slice(-MAX_NATIVE_EVENT_LOGS);
-    const detailMap = nativeEventDetailMap.value;
-
-    const nextMetas: NativeEventLogMeta[] = [];
-    for (const log of nextLogs) {
-      const id = buildNativeEventLogId(log);
-      detailMap.set(id, log);
-      nextMetas.push(buildMetaFromLog(log));
-    }
-
-    // 创建新的 Map 触发响应式更新
-    nativeEventDetailMap.value = new Map(detailMap);
-    nativeEventLogMetas.value = nextMetas;
-
-    // 清理过期的详情数据
-    const keepIds = new Set(nextMetas.map((m) => m.id));
-    for (const key of detailMap.keys()) {
-      if (!keepIds.has(key)) detailMap.delete(key);
-    }
-
-    // 清理已不存在的展开项
-    const newExpandedIds = new Set(expandedIds.value);
-    for (const id of newExpandedIds) {
-      if (!keepIds.has(id)) {
-        newExpandedIds.delete(id);
-      }
-    }
-    expandedIds.value = newExpandedIds;
+    const nextState = buildNativeEventState(visibleLogs, expandedIds.value, nativeEventIdStore);
+    nativeEventDetailMap.value = nextState.detailMap;
+    nativeEventLogMetas.value = nextState.metas;
+    expandedIds.value = nextState.expandedIds;
   };
 
   const flushPendingLogs = (): void => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uni-oaview",
-  "version": "1.9.14",
+  "version": "1.9.16",
   "description": "uniapp小程序组件库",
   "main": "dist/index.esm.js",
   "typings": "dist/index.d.ts",