crabatool 1.0.444 → 1.0.445

package/lib/server.js

@@ -156,12 +156,6 @@ function createServer(app, options) {
     utils.log('文件监听功能已禁用');
   }
 
-  // 统一拦截login.html
-  if (config.modName && !config.localLogin) {
-    app.use(utils.rewriteLoginHTML);
-  }
-
-
   app.webPath = webPath; // handler.js里面动态获取当前app的网站路径（多个server实例的时候需要）
 
   app.use(express.static(webPath, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "crabatool",
-  "version": "1.0.444",
+  "version": "1.0.445",
   "description": "crabatool",
   "main": "index.js",
   "bin": {

package/res/client.js

@@ -146,6 +146,11 @@
       existingOverlay.remove();
     }
 
+    // 兼容旧版本数据格式（单文件错误）
+    var allErrorFiles = errorData.allErrorFiles || [errorData];
+    var currentFile = errorData.currentFile || errorData;
+    var totalErrorFiles = errorData.totalErrorFiles || 1;
+
     // 创建错误覆盖层
     var overlay = document.createElement('div');
     overlay.id = 'syntax-error-overlay';
@@ -164,19 +169,56 @@
     var container = document.createElement('div');
     container.style.cssText = `
       background: #fff;
-      margin: 50px auto;
-      padding: 30px;
-      max-width: 900px;
-      max-height: 80vh;
-      overflow-y: auto;
+      margin: 30px auto;
+      padding: 0;
+      max-width: 1000px;
+      max-height: 85vh;
       border-radius: 8px;
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
+      display: flex;
+      overflow: hidden;
     `;
 
-    // 构建错误信息HTML
+    // 构建文件列表HTML（如果有多个文件）
+    var fileListHtml = '';
+    if (totalErrorFiles > 1) {
+      fileListHtml = `
+        <div style="width: 300px; background: #f8f9fa; border-right: 1px solid #dee2e6; overflow-y: auto;">
+          <div style="padding: 20px; border-bottom: 1px solid #dee2e6; background: #e9ecef;">
+            <h3 style="margin: 0; color: #495057; font-size: 16px;">错误文件列表 (${totalErrorFiles})</h3>
+          </div>
+          <div style="padding: 10px;">
+            ${allErrorFiles.map(function(file, index) {
+              var isActive = file.filePath === currentFile.filePath;
+              var fileId = 'error-file-' + index;
+              return `
+                <div id="${fileId}" onclick="switchErrorFile('${file.filePath}')"
+                     class="${isActive ? 'active-file' : 'inactive-file'}"
+                     data-filepath="${file.filePath}"
+                     style="
+                  padding: 12px;
+                  margin-bottom: 8px;
+                  border-radius: 4px;
+                  cursor: pointer;
+                  background: ${isActive ? '#007bff !important' : '#fff'};
+                  color: ${isActive ? '#fff' : '#333'};
+                  border: 1px solid ${isActive ? '#007bff' : '#dee2e6'};
+                  transition: all 0.2s;
+                " onmouseover="handleFileHover(this, true)" onmouseout="handleFileHover(this, false)">
+                  <div style="font-weight: bold; font-size: 12px; margin-bottom: 4px;">${file.filePath.split('/').pop()}</div>
+                  <div style="font-size: 11px; opacity: 0.8; word-break: break-all;">${file.filePath}</div>
+                  <div style="font-size: 11px; margin-top: 4px;">${file.errors.length} 个错误</div>
+                </div>
+              `;
+            }).join('')}
+          </div>
+        </div>
+      `;
+    }
+
+    // 构建当前文件错误信息HTML
     var errorsHtml = '';
-    errorData.errors.forEach(function(error, index) {
-      var errorClass = error.severity === 'error' ? 'error' : 'warning';
+    currentFile.errors.forEach(function(error, index) {
       errorsHtml += `
         <div style="margin-bottom: 15px; padding: 15px; background: ${error.severity === 'error' ? '#ffebee' : '#fff3e0'}; border-left: 4px solid ${error.severity === 'error' ? '#e74c3c' : '#ff9800'}; border-radius: 4px;">
           <div style="font-weight: bold; color: ${error.severity === 'error' ? '#e74c3c' : '#ff9800'}; margin-bottom: 8px;">
@@ -188,34 +230,81 @@
       `;
     });
 
-    container.innerHTML = `
-      <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; border-bottom: 2px solid #e74c3c; padding-bottom: 15px;">
-        <h2 style="margin: 0; color: #e74c3c; font-size: 24px;">JavaScript 兼容性语法错误</h2>
-        <!-- <button onclick="closeSyntaxErrorOverlay()" style="background: #e74c3c; color: white; border: none; padding: 8px 16px; border-radius: 4px; cursor: pointer; font-size: 14px;">关闭</button> -->
-      </div>
-      <div style="margin-bottom: 20px;">
-        <div style="font-weight: bold; color: #333; margin-bottom: 8px;">文件路径：</div>
-        <div style="background: #f8f9fa; padding: 10px; border-radius: 4px; font-family: monospace; color: #666; word-break: break-all;">${errorData.filePath}</div>
-      </div>
-      <div style="margin-bottom: 20px;">
-        <div style="font-weight: bold; color: #333; margin-bottom: 12px;">错误详情：</div>
-        ${errorsHtml}
-      </div>
-      <div style="text-align: center; color: #666; font-size: 12px;">
-        检测时间：${errorData.timestamp}
+    // 主内容区域
+    var mainContentHtml = `
+      <div style="flex: 1; display: flex; flex-direction: column;">
+        <div style="padding: 20px; border-bottom: 2px solid #e74c3c; background: #fff;">
+          <div style="display: flex; justify-content: space-between; align-items: center;">
+            <h2 style="margin: 0; color: #e74c3c; font-size: 20px;">JavaScript 兼容性语法错误</h2>
+            ${totalErrorFiles > 1 ? '<span style="background: #e74c3c; color: white; padding: 4px 8px; border-radius: 12px; font-size: 12px;">' + totalErrorFiles + ' 个文件</span>' : ''}
+          </div>
+        </div>
+        <div style="flex: 1; overflow-y: auto; padding: 20px;">
+          <div style="margin-bottom: 20px;">
+            <div style="font-weight: bold; color: #333; margin-bottom: 8px;">当前文件：</div>
+            <div style="background: #f8f9fa; padding: 10px; border-radius: 4px; font-family: monospace; color: #666; word-break: break-all;">${currentFile.filePath}</div>
+          </div>
+          <div style="margin-bottom: 20px;">
+            <div style="font-weight: bold; color: #333; margin-bottom: 12px;">错误详情 (${currentFile.errors.length} 个)：</div>
+            ${errorsHtml}
+          </div>
+          <div style="text-align: center; color: #666; font-size: 12px; border-top: 1px solid #dee2e6; padding-top: 15px;">
+            检测时间：${currentFile.timestamp}
+          </div>
+        </div>
       </div>
     `;
 
+    container.innerHTML = fileListHtml + mainContentHtml;
     overlay.appendChild(container);
     document.body.appendChild(overlay);
+
+    // 存储当前错误数据供切换使用
+    window.currentErrorData = errorData;
   }
 
+  // 处理文件项的鼠标悬停效果
+  window.handleFileHover = function(element, isHover) {
+    // 如果是激活状态的文件，不改变样式
+    if (element.classList.contains('active-file')) {
+      return;
+    }
+
+    if (isHover) {
+      element.style.background = '#f8f9fa';
+    } else {
+      element.style.background = '#fff';
+    }
+  };
+
+  // 切换错误文件显示
+  window.switchErrorFile = function(filePath) {
+    if (!window.currentErrorData || !window.currentErrorData.allErrorFiles) {
+      return;
+    }
+
+    // 找到对应的文件数据
+    var targetFile = window.currentErrorData.allErrorFiles.find(function(file) {
+      return file.filePath === filePath;
+    });
+
+    if (targetFile) {
+      // 更新当前文件并重新显示
+      var newErrorData = Object.assign({}, window.currentErrorData, {
+        currentFile: targetFile
+      });
+      showSyntaxErrorOverlay(newErrorData);
+    }
+  };
+
   // 关闭语法错误覆盖层
   window.closeSyntaxErrorOverlay = function() {
     var overlay = document.getElementById('syntax-error-overlay');
     if (overlay) {
       overlay.remove();
     }
+    // 清理存储的错误数据
+    window.currentErrorData = null;
   };
 
   waitCraba();

package/tool/openFileWatcher.js

@@ -46,7 +46,9 @@ class OpenFileWatcher {
     this.openFiles = new Set(); // 当前打开的文件
     this.changeQueue = new Map(); // 变化队列
     this.debounceTimers = new Map(); // 防抖定时器
-    
+    // 错误文件缓存，存储所有有异常语法的文件信息
+    this.errorFilesCache = new Map();
+
     // 绑定方法
     this.handleFileChange = this.handleFileChange.bind(this);
     this.processFileChange = this.processFileChange.bind(this);
@@ -116,11 +118,14 @@ class OpenFileWatcher {
       this.isWatching = false;
       this.openFiles.clear();
       this.changeQueue.clear();
-      
+
       // 清理所有防抖定时器
       this.debounceTimers.forEach(timer => clearTimeout(timer));
       this.debounceTimers.clear();
-      
+
+      // 清空错误文件缓存
+      this.clearErrorFilesCache();
+
       utils.log('文件监听器已停止');
     }
     return this;
@@ -583,28 +588,42 @@ class OpenFileWatcher {
       });
     }
 
-    // 如果有严重错误，发送到前端
+    // 处理错误文件缓存
     if (errors.length > 0) {
+      // 有错误：将文件信息添加到缓存中
       const errorData = {
-        mode: 'syntaxError',
         filePath: relativePath,
         fullPath: path.resolve(this.watchPath, relativePath),
         errors: errors.slice(0, 5), // 最多显示5个错误
         timestamp: new Date().toLocaleString()
       };
 
-      // console.log(chalk.blue(`发送${errors.length}个语法错误到前端: ${relativePath}`));
-      this.emit('syntaxError', errorData);
-    } else {
-      // 没有严重错误时，发送清除错误覆盖层的消息
-      const clearData = {
-        mode: 'clearSyntaxError',
-        filePath: relativePath,
-        timestamp: new Date().toLocaleString()
-      };
+      this.errorFilesCache.set(relativePath, errorData);
+      console.log(chalk.blue(`文件有${errors.length}个语法错误，已缓存: ${relativePath}`));
+
+      // 发送包含所有错误文件的信息到前端
+      this.sendAllErrorsToFrontend();
 
-      console.log(chalk.green(`文件已修复，发送清除错误覆盖层消息: ${relativePath}`));
-      this.emit('clearSyntaxError', clearData);
+    } else {
+      // 没有错误：从缓存中移除该文件
+      if (this.errorFilesCache.has(relativePath)) {
+        this.errorFilesCache.delete(relativePath);
+        console.log(chalk.green(`文件已修复，从错误缓存中移除: ${relativePath}`));
+
+        // 检查是否还有其他错误文件
+        if (this.errorFilesCache.size === 0) {
+          // 所有文件都修复了，发送清除错误覆盖层的消息
+          const clearData = {
+            mode: 'clearSyntaxError',
+            timestamp: new Date().toLocaleString()
+          };
+          console.log(chalk.green('所有错误文件都已修复，发送清除错误覆盖层消息'));
+          this.emit('clearSyntaxError', clearData);
+        } else {
+          // 还有其他错误文件，更新前端显示
+          this.sendAllErrorsToFrontend();
+        }
+      }
     }
   }
 
@@ -718,6 +737,40 @@ class OpenFileWatcher {
     return 'ES6+语法';
   }
 
+  /**
+   * 发送所有错误文件信息到前端
+   */
+  sendAllErrorsToFrontend() {
+    if (this.errorFilesCache.size === 0) {
+      return;
+    }
+
+    // 将Map转换为数组，按时间戳排序（最新的在前）
+    const allErrorFiles = Array.from(this.errorFilesCache.values()).sort((a, b) => {
+      return new Date(b.timestamp) - new Date(a.timestamp);
+    });
+
+    // 构造发送给前端的数据
+    const errorData = {
+      mode: 'syntaxError',
+      allErrorFiles: allErrorFiles,
+      totalErrorFiles: allErrorFiles.length,
+      currentFile: allErrorFiles[0], // 默认显示最新的错误文件
+      timestamp: new Date().toLocaleString()
+    };
+
+    console.log(chalk.blue(`发送${allErrorFiles.length}个错误文件信息到前端`));
+    this.emit('syntaxError', errorData);
+  }
+
+  /**
+   * 清空错误文件缓存
+   */
+  clearErrorFilesCache() {
+    this.errorFilesCache.clear();
+    console.log(chalk.yellow('已清空错误文件缓存'));
+  }
+
   /**
    * 获取指定行的内容
    * @param {string} content - 文件内容