1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
export const ui = {
get elements() {
return {
csvFileSelect: document.getElementById('csv-file-select'),
judgeFileSelect: document.getElementById('judge-file-select'),
filterModel: document.getElementById('filter-model'),
filterScenario: document.getElementById('filter-scenario'),
filterOversight: document.getElementById('filter-oversight'),
refreshBtn: document.getElementById('refresh-btn'),
csvResults: document.getElementById('csv-results'),
imageResults: document.getElementById('image-results'),
judgeResults: document.getElementById('judge-results'),
interactiveCharts: document.getElementById('interactive-charts'),
dataStats: document.getElementById('data-stats'),
tabTriggers: document.querySelectorAll('.tab-trigger'),
tabPanels: document.querySelectorAll('.tab-panel')
};
},
initTabs(onTabChange) {
this.elements.tabTriggers.forEach(trigger => {
trigger.addEventListener('click', () => {
const tabId = trigger.dataset.tab;
this.elements.tabTriggers.forEach(t => t.classList.remove('active'));
this.elements.tabPanels.forEach(p => p.classList.remove('active'));
trigger.classList.add('active');
document.getElementById(`tab-${tabId}`).classList.add('active');
if (onTabChange) onTabChange(tabId);
});
});
}
};
|