Update src/Console/Console.js

src/Console/Console.js

@@ -175,20 +175,57 @@ export default class Console extends Tool {
       _$filterText: $el.find(c('.filter-text')),
     })
   }
-  _initLogger() {
-    const cfg = this.config
-    let maxLogNum = cfg.get('maxLogNum')
-    maxLogNum = maxLogNum === 'infinite' ? 0 : +maxLogNum
-
-    const $level = this._$control.find(c('.level'))
-    const logger = new LunaConsole(this._$logs.get(0), {
-      asyncRender: cfg.get('asyncRender'),
-      maxNum: maxLogNum,
-      showHeader: cfg.get('displayExtraInfo'),
-      unenumerable: cfg.get('displayUnenumerable'),
-      accessGetter: cfg.get('displayGetterVal'),
-      lazyEvaluation: cfg.get('lazyEvaluation'),
-    })
+_initLogger() {
+  const cfg = this.config
+  let maxLogNum = cfg.get('maxLogNum')
+  maxLogNum = maxLogNum === 'infinite' ? 0 : +maxLogNum
+
+  const $level = this._$control.find(c('.level'))
+  const logger = new LunaConsole(this._$logs.get(0), {
+    asyncRender: cfg.get('asyncRender'),
+    maxNum: maxLogNum,
+    showHeader: cfg.get('displayExtraInfo'),
+    unenumerable: cfg.get('displayUnenumerable'),
+    accessGetter: cfg.get('displayGetterVal'),
+    lazyEvaluation: cfg.get('lazyEvaluation'),
+  })
+
+  // 初期状態を設定
+  this._updateLevelUI(['verbose', 'info', 'warning', 'error'])
+
+  logger.on('optionChange', (name, val) => {
+    switch (name) {
+      case 'level':
+        this._updateLevelUI(val)
+        break
+    }
+  })
+
+  if (cfg.get('overrideConsole')) this.overrideConsole()
+
+  this._logger = logger
+}
+  _updateLevelUI(levels) {
+  const $level = this._$control.find(c('.level'))
+  
+  $level.each(function() {
+    const $this = $(this)
+    const level = $this.data('level')
+    let isMatch = false
+    
+    if (level === 'all') {
+      isMatch = Array.isArray(levels) && 
+                levels.includes('verbose') && 
+                levels.includes('info') && 
+                levels.includes('warning') && 
+                levels.includes('error')
+    } else {
+      isMatch = Array.isArray(levels) ? levels.includes(level) : level === levels
+    }
+    
+    $this.toggleClass(c('active'), isMatch)
+  })
+}
 
     logger.on('optionChange', (name, val) => {
       switch (name) {
@@ -233,13 +270,17 @@ export default class Console extends Tool {
 
     $control
       .on('click', c('.clear-console'), () => logger.clear(true))
-      .on('click', c('.level'), function () {
-        let level = $(this).data('level')
-        if (level === 'all') {
-          level = ['verbose', 'info', 'warning', 'error']
-        }
-        logger.setOption('level', level)
-      })
+.on('click', c('.level'), function() {
+  const $this = $(this)
+  let level = $this.data('level')
+  
+  if (level === 'all') {
+    level = ['verbose', 'info', 'warning', 'error']
+  }
+  
+  this._logger.setOption('level', level)
+  // UIの更新はoptionChangeイベントハンドラで行われるのでここでは不要
+}.bind(this))
       .on('click', c('.filter'), () => {
         LunaModal.prompt('Filter').then((filter) => {
           if (isNull(filter)) return