Доработан js2

SQLLinter/Infrastructure/Reporters/Formatters/Html/v2/HtmlFormatter_v2.css

@@ -1868,3 +1868,21 @@ svg .flowchart-link {
     background-color: var(--color-primary);
     color: #ffffff;
 }
+
+    .file-card.clickable:hover {
+        transform: translateY(-2px);
+        box-shadow: var(--shadow-8);
+        border-color: var(--primary-color);
+    }
+
+    .file-card.clickable:active {
+        transform: translateY(0);
+    }
+
+.file-card-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: var(--spacing-xs);
+    font-size: var(--font-size-xs);
+}

SQLLinter/Infrastructure/Reporters/Formatters/Html/v2/HtmlFormatter_v2.js

@@ -37,6 +37,25 @@ class ReportRenderer {
             // Блок с closeBtn полностью удалён — он больше не нужен
         });
 
+        document.addEventListener('click', (e) => {
+            const cardBtn = e.target.closest('.file-card.clickable');
+            if (cardBtn) {
+                e.preventDefault();
+                const targetId = cardBtn.dataset.target;
+                if (targetId) {
+                    this.activateTabById(targetId);
+
+                    // Обновляем активный таб визуально
+                    this.tabsList.querySelectorAll('.tab').forEach(tab => {
+                        tab.classList.toggle('active', tab.dataset.target === targetId);
+                    });
+
+                    // Прокрутка вверх (опционально)
+                    window.scrollTo({ top: 0, behavior: 'smooth' });
+                }
+            }
+        });
+
         // Переключение табов (делегирование)
         this.tabsList.addEventListener('click', (e) => {
             const tab = e.target.closest('.tab');
@@ -398,7 +417,7 @@ class ReportRenderer {
             percents[maxIdx] = 100 - percents.reduce((a, b, i) => i !== maxIdx ? a + b : a, 0);
         }
 
-        const fileCards = this.files.map(file => {
+        const fileCards = this.files.map((file, index) => {
             const c = file.v?.c?.length || 0;
             const w = file.v?.w?.length || 0;
             const i = file.v?.i?.length || 0;
@@ -409,8 +428,12 @@ class ReportRenderer {
                 const maxI = fp.indexOf(Math.max(...fp));
                 fp[maxI] = 100 - fp.reduce((a, b, j) => j !== maxI ? a + b : a, 0);
             }
-            return `<div class="file-card">
-                <div class="file-card-header"><span class="file-name-small" title="${this.escapeHtml(file.n)}">${this.escapeHtml(file.n)}</span></div>
+            const fileId = `file_${index}`; // ID вкладки файла
+
+            return `<div class="file-card clickable" data-target="${fileId}" title="Перейти к детальному отчёту: ${this.escapeHtml(file.n)}">
+                <div class="file-card-header">
+                    <span class="file-name-small" title="${this.escapeHtml(file.n)}">${this.escapeHtml(file.n)}</span>
+                </div>
                 <div class="progress-bar">
                     <div class="progress-fill critical" style="width:${fp[0]}%"></div>
                     <div class="progress-fill warning" style="width:${fp[1]}%"></div>