@@ -203,21 +203,21 @@ function buildChildren(node, depth, renderOpts = {}) {
203203/**
204204 * 创建属性行（key: value）。
205205 * @param {string } key - 属性名或索引。
206- * @param {HTMLElement } valueEl - 值所在的 DOM 节点。
206+ * @param {HTMLElement } valueElement - 值所在的 DOM 节点。
207207 * @returns {HTMLDivElement } 一整行 prop。
208208 */
209- function makeProp ( key , valueEl ) {
209+ function makeProp ( key , valueElement ) {
210210 const prop = document . createElement ( 'div' )
211211 prop . className = 'log-node-prop'
212- const keyEl = document . createElement ( 'span' )
213- keyEl . className = 'log-node-key'
214- keyEl . textContent = key
212+ const keyElement = document . createElement ( 'span' )
213+ keyElement . className = 'log-node-key'
214+ keyElement . textContent = key
215215 const colon = document . createElement ( 'span' )
216216 colon . className = 'log-node-colon'
217217 colon . textContent = ':\u00a0'
218- prop . appendChild ( keyEl )
218+ prop . appendChild ( keyElement )
219219 prop . appendChild ( colon )
220- prop . appendChild ( valueEl )
220+ prop . appendChild ( valueElement )
221221 return prop
222222}
223223
@@ -259,7 +259,7 @@ function buildExpandableNode(node, depth, renderOpts = {}) {
259259
260260 if ( hasChildren ) {
261261 let expanded = false
262- let childrenEl = null
262+ let childrenElement = null
263263 let loading = false
264264
265265 /**
@@ -270,31 +270,31 @@ function buildExpandableNode(node, depth, renderOpts = {}) {
270270 const toggleExpand = async ( e ) => {
271271 e ?. stopPropagation ( )
272272 if ( loading ) return
273- if ( childrenEl ) {
273+ if ( childrenElement ) {
274274 expanded = ! expanded
275275 toggle . classList . toggle ( 'open' , expanded )
276- if ( expanded ) el . appendChild ( childrenEl )
277- else el . removeChild ( childrenEl )
276+ if ( expanded ) el . appendChild ( childrenElement )
277+ else el . removeChild ( childrenElement )
278278 return
279279 }
280280 expanded = true
281281 toggle . classList . add ( 'open' )
282282 const expandRef = renderOpts . requestExpandRef
283283 if ( typeof expandRef === 'function' ) {
284284 loading = true
285- const loadingEl = document . createElement ( 'span' )
286- loadingEl . className = 'log-node-children'
287- loadingEl . textContent = '…'
288- el . appendChild ( loadingEl )
285+ const loadingElement = document . createElement ( 'span' )
286+ loadingElement . className = 'log-node-children'
287+ loadingElement . textContent = '…'
288+ el . appendChild ( loadingElement )
289289 try {
290290 await resolveAllTruncated ( node , expandRef )
291291 } finally {
292292 loading = false
293- if ( loadingEl . parentNode ) el . removeChild ( loadingEl )
293+ if ( loadingElement . parentNode ) el . removeChild ( loadingElement )
294294 }
295295 }
296- childrenEl = buildChildren ( node , depth + 1 , renderOpts )
297- el . appendChild ( childrenEl )
296+ childrenElement = buildChildren ( node , depth + 1 , renderOpts )
297+ el . appendChild ( childrenElement )
298298 }
299299
300300 header . addEventListener ( 'click' , toggleExpand )
@@ -523,23 +523,23 @@ export function renderLogItem(entry, { canOpenEditor = false, onOpenSource, requ
523523 * DOM 元素引用。
524524 * @type {HTMLElement }
525525 */
526- let sourceEl
526+ let sourceElement
527527 if ( canClick ) {
528- const btn = document . createElement ( 'button' )
529- btn . type = 'button'
530- btn . className = 'log-source-btn clickable'
531- btn . textContent = labelText
532- btn . title = titleText
533- btn . addEventListener ( 'click' , ( ) => onOpenSource ( callsite ) )
534- sourceEl = btn
528+ const button = document . createElement ( 'button' )
529+ button . type = 'button'
530+ button . className = 'log-source-btn clickable'
531+ button . textContent = labelText
532+ button . title = titleText
533+ button . addEventListener ( 'click' , ( ) => onOpenSource ( callsite ) )
534+ sourceElement = button
535535 } else {
536536 const span = document . createElement ( 'span' )
537537 span . className = 'log-source-btn'
538538 span . textContent = labelText
539539 span . title = titleText
540- sourceEl = span
540+ sourceElement = span
541541 }
542- meta . appendChild ( sourceEl )
542+ meta . appendChild ( sourceElement )
543543 row . appendChild ( meta )
544544 }
545545
@@ -548,20 +548,19 @@ export function renderLogItem(entry, { canOpenEditor = false, onOpenSource, requ
548548
549549/**
550550 * 创建日志工具栏并绑定过滤逻辑。
551- * @param {object } opts - 工具栏配置。
552- * @param {() => void } opts .onClear - 用户点击清空时调用。
553- * @param {(filterText: string, levelFilter: string) => void } opts .onFilter - 文本或级别变更时调用。
551+ * @param {object } options - 工具栏配置。
552+ * @param {() => void } options .onClear - 用户点击清空时调用。
553+ * @param {(filterText: string, levelFilter: string) => void } options .onFilter - 文本或级别变更时调用。
554554 * @returns {HTMLElement } 工具栏根元素。
555555 */
556556export function createLogToolbar ( { onClear, onFilter } ) {
557557 const toolbar = document . createElement ( 'div' )
558558 toolbar . className = 'log-toolbar'
559559
560- // 清空按钮
561- const clearBtn = document . createElement ( 'button' )
562- clearBtn . className = 'log-clear-btn'
563- clearBtn . dataset . i18n = 'log_viewer.logs.toolbar.clear'
564- clearBtn . addEventListener ( 'click' , ( ) => onClear ?. ( ) )
560+ const clearButton = document . createElement ( 'button' )
561+ clearButton . className = 'log-clear-btn'
562+ clearButton . dataset . i18n = 'log_viewer.logs.toolbar.clear'
563+ clearButton . addEventListener ( 'click' , ( ) => onClear ?. ( ) )
565564
566565 // 过滤输入框
567566 const filterInput = document . createElement ( 'input' )
@@ -570,32 +569,32 @@ export function createLogToolbar({ onClear, onFilter }) {
570569 filterInput . dataset . i18n = 'log_viewer.logs.toolbar.filter'
571570
572571 // 级别过滤按钮
573- const levelBtns = document . createElement ( 'div' )
574- levelBtns . className = 'log-level-btns'
572+ const levelButtons = document . createElement ( 'div' )
573+ levelButtons . className = 'log-level-btns'
575574
576575 let activeLevel = 'all'
577576 const levelIds = [ 'all' , 'log' , 'info' , 'warn' , 'error' , 'debug' ]
578577
579- const btnEls = { }
578+ const levelButtonById = { }
580579 for ( const id of levelIds ) {
581- const btn = document . createElement ( 'button' )
582- btn . type = 'button'
583- btn . className = `log-level-btn${ id === 'all' ? ' active' : '' }
584- btn . dataset . lvl = id
585- btn . dataset . i18n = `log_viewer.logs.levels.${ id }
586- btn . addEventListener ( 'click' , ( ) => {
580+ const button = document . createElement ( 'button' )
581+ button . type = 'button'
582+ button . className = `log-level-btn${ id === 'all' ? ' active' : '' }
583+ button . dataset . lvl = id
584+ button . dataset . i18n = `log_viewer.logs.levels.${ id }
585+ button . addEventListener ( 'click' , ( ) => {
587586 activeLevel = id
588- for ( const [ k , el ] of Object . entries ( btnEls ) )
589- el . classList . toggle ( 'active' , k === id )
587+ for ( const [ k , levelButton ] of Object . entries ( levelButtonById ) )
588+ levelButton . classList . toggle ( 'active' , k === id )
590589 onFilter ?. ( filterInput . value , activeLevel )
591590 } )
592- btnEls [ id ] = btn
593- levelBtns . appendChild ( btn )
591+ levelButtonById [ id ] = button
592+ levelButtons . appendChild ( button )
594593 }
595594
596- toolbar . appendChild ( clearBtn )
595+ toolbar . appendChild ( clearButton )
597596 toolbar . appendChild ( filterInput )
598- toolbar . appendChild ( levelBtns )
597+ toolbar . appendChild ( levelButtons )
599598
600599 filterInput . addEventListener ( 'input' , ( ) => onFilter ?. ( filterInput . value , activeLevel ) )
601600
0 commit comments