update leaderboard

Author: boyugou

static/css/index.css

@@ -825,11 +825,16 @@ tr:hover {
 .leaderboard-table-wrapper {
   max-height: 600px; /* Set your desired maximum height here */
   overflow-y: auto;   /* Enable vertical scrolling for entire container */
-  overflow-x: auto; /* Hide horizontal overflow */
+  overflow-x: auto; /* Enable horizontal scrolling */
   border: 2px solid #ddd;
   border-radius: 8px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   background: white;
+  /* 创建新的堆叠上下文来解决重合问题 */
+  position: relative;
+  z-index: 1;
+  /* 确保滚动时背景不透明 */
+  background-clip: padding-box;
 }
 
 
@@ -860,7 +865,8 @@ tr:hover {
   border-right: none;
   position: sticky;
   top: 0;
-  z-index: 11;
+  z-index: 15;  /* 确保表头在Human行之上 */
+  background-clip: padding-box;
 }
 
 
@@ -1041,3 +1047,57 @@ tr:hover {
 .agent-link strong {
     font-weight: 600;
 }
+
+/* Human row special styling */
+.human-row {
+    background-color: #f8f9fa !important;  /* 更柔和的灰色背景 */
+    border-top: 1px solid #dee2e6 !important;  /* 更细的灰色边框 */
+    border-bottom: 1px solid #dee2e6 !important;
+    font-style: italic;
+    opacity: 0.85;  /* 稍微提高不透明度 */
+    position: sticky;
+    top: 41px; /* Position below the header */
+    z-index: 9; /* Below header but above other content */
+    box-shadow: 0 1px 2px rgba(0,0,0,0.05);  /* 更轻微的阴影 */
+    /* 确保在水平滚动时也能正确显示 */
+    background-clip: padding-box;
+    isolation: isolate;
+}
+
+.human-row td {
+    font-weight: 450;  /* 稍微加重字体 */
+    color: #495057;  /* 更深的灰色文字 */
+    background-color: #f8f9fa !important;  /* 确保每个td都有背景色 */
+    /* 防止背景透明导致重合 */
+    background-clip: padding-box;
+    position: relative;
+    z-index: 1;
+}
+
+.human-row:hover {
+    background-color: #e9ecef !important;  /* hover时更柔和的灰色 */
+}
+
+.human-row:hover td {
+    background-color: #e9ecef !important;  /* hover时td也要变色 */
+}
+
+.human-indicator {
+    color: #495057;  /* 更深的灰色图标 */
+    margin-left: 8px;
+    font-size: 0.8em;  /* 更小的图标 */
+}
+
+.human-reference-badge {
+    background-color: #495057;  /* 更深的灰色背景 */
+    color: white;
+    padding: 2px 6px;  /* 更小的padding */
+    border-radius: 3px;  /* 更小的圆角 */
+    font-size: 0.7em;  /* 更小的字体 */
+    font-weight: normal;  /* 普通字体重量 */
+    font-style: normal;
+}
+
+
+
+

static/js/leaderboard.js

@@ -2,7 +2,7 @@ class LeaderboardTable {
     constructor() {
         this.data = null;
         this.currentSet = 'eval_set';
-        this.sortColumn = 'success_rate';
+        this.sortColumn = 'partial_completion';  // 改为默认按 partial_completion 排序
         this.sortDirection = 'desc';
         this.init();
     }
@@ -116,6 +116,7 @@ class LeaderboardTable {
             sortedData.forEach((model, index) => {
                 const info = model.info;
                 const results = model[this.currentSet];
+                const isHuman = info.name === 'Human';  // 检查是否是 Human 行
 
                 let agentNameHtml;
                 if (info.url && info.url.trim() !== "") {
@@ -128,17 +129,22 @@ class LeaderboardTable {
                     agentNameHtml = `${info.name}`;
                 }
 
+                // 为 Human 行添加特殊的 class 和样式
+                const rowClass = isHuman ? 'model-row human-row' : 'model-row';
+                const rankDisplay = isHuman ? '<span class="human-reference-badge">Reference</span>' : `${index + 1}`;
+
                 tableHtml += `
-                    <tr class="model-row" data-rank="${index + 1}">
+                    <tr class="${rowClass}" data-rank="${index + 1}">
                         <td class="model-name-cell">
                             <div class="model-info">
                                 ${agentNameHtml}
+                                ${isHuman ? ' <span class="human-indicator"><i class="fas fa-user"></i></span>' : ''}
                             </div>
                         </td>
                         <td class="has-text-centered">${info.date}</td>
-                        <td class="has-text-centered metric-cell">${this.formatMetric(results.partial_completion, maxValues.partial_completion)}</td>
-                        <td class="has-text-centered metric-cell">${this.formatMetric(results.success_rate, maxValues.success_rate)}</td>
-                        <td class="has-text-centered metric-cell">${this.formatMetric(results.pass3, maxValues.pass3)}</td>
+                        <td class="has-text-centered metric-cell">${this.formatMetric(results.partial_completion, isHuman ? null : maxValues.partial_completion)}</td>
+                        <td class="has-text-centered metric-cell">${this.formatMetric(results.success_rate, isHuman ? null : maxValues.success_rate)}</td>
+                        <td class="has-text-centered metric-cell">${this.formatMetric(results.pass3, isHuman ? null : maxValues.pass3)}</td>
                         <td class="has-text-centered metric-cell">${this.formatMetric(results.time)}</td>
                         <td class="has-text-centered metric-cell">${this.formatMetric(results.answer_length)}</td>
                     </tr>
@@ -190,6 +196,11 @@ class LeaderboardTable {
         };
 
         data.forEach(model => {
+            // 跳过 Human 数据
+            if (model.info?.name === 'Human') {
+                return;
+            }
+            
             const results = model[this.currentSet];
 
             // Check each metric
@@ -249,9 +260,12 @@ class LeaderboardTable {
             return [];
         }
 
-        let sortedData = [...this.data];
+        // 先分离出 Human 和其他条目
+        const humanData = this.data.filter(item => item.info?.name === 'Human');
+        const otherData = this.data.filter(item => item.info?.name !== 'Human');
 
-        return sortedData.sort((a, b) => {
+        // 对非 Human 条目进行排序
+        const sortedOtherData = otherData.sort((a, b) => {
             let aValue, bValue;
 
             if (this.sortColumn === 'date') {
@@ -278,6 +292,9 @@ class LeaderboardTable {
                 return aValue > bValue ? -1 : aValue < bValue ? 1 : 0;
             }
         });
+        
+        // Human 总是在最前面
+        return [...humanData, ...sortedOtherData];
     }
 
     setupSorting() {