赛事中心优化

src/pages/2026/center/index.jsx

@@ -5,6 +5,10 @@ import icon1 from '../img/center/icon1.webp'
 import icon2 from '../img/center/icon2.webp'
 import icon3 from '../img/center/icon3.webp'
 import icon4 from '../img/center/icon4.webp'
+import icon5 from '../img/center/icon5.webp'
+import icon6 from '../img/center/icon6.webp'
+import icon7 from '../img/center/icon7.webp'
+import icon8 from '../img/center/icon8.webp'
 import { directions } from './info'
 
 function Center(props) {
@@ -44,7 +48,7 @@ function Center(props) {
     return getActiveTrack(directionId) === trackName;
   };
 
-  const icons = [icon1, icon2, icon3, icon4];
+  const icons = [icon1, icon2, icon3, icon4, icon5, icon6, icon7, icon8];
 
   return <div className={styles.center}>
     <SpeTitle className={styles.title} first={'两个方向'} last={'四个赛道'} english={'four tracks'}></SpeTitle>
@@ -67,13 +71,13 @@ function Center(props) {
             <div className={ styles.directions_left_tracks }>
               {
                 e.tasks && Object.entries(e.tasks).map(([trackName, trackItems], index) => {
-                  const isActive = isTrackActive(e.id, trackName);
+                  const isActive = isTrackActive(e.id, trackName);                  
                   return <div 
                     key={trackName} 
                     className={`${styles.track_item} ${isActive ? styles.track_item_active : ''}`}
                     onClick={() => handleTrackClick(e.id, trackName)}
                   >
-                    <img className={ styles.track_icon } src={icons[index % 4]}></img>
+                    <img className={ styles.track_icon } src={icons[isActive ? index % 4 : index % 4 + 4]}></img>
                     <div className={ styles.track_name }>{trackName}</div>
                     <div className={ styles.track_arrow }>{isActive ? '▶' : ''}</div>
                   </div>
@@ -88,7 +92,7 @@ function Center(props) {
                   {e.tasks[activeTrack]
                     .filter(item => searchKeyword === '' || item.name.includes(searchKeyword))
                     .map((item, index) => (
-                    <div key={index} className={ styles.task_card }>
+                    <div key={index} className={ styles.task_card } onClick={() => { window.open(item.url)}}>
                       <div className={ styles.task_name }>{item.name}</div>
                       <div className={ styles.task_info }>
                         <span className={`${styles.task_level} ${styles[`level_${item.level}`]}`}>

src/pages/2026/center/index.less

@@ -143,6 +143,8 @@
                     margin-bottom: 12px;
                     cursor: pointer;
                     transition: all 0.3s ease;
+                    position: relative;
+                    overflow: hidden;
 
                     &:hover {
                         background:linear-gradient(90.17deg,rgba(255, 255, 255, 0.15) 1.6%,rgba(255, 255, 255, 0) 99.97%);
@@ -173,6 +175,15 @@
                 .track_item_active {
                     background:linear-gradient(90.17deg,rgba(255, 255, 255, 0.15) 1.6%,rgba(255, 255, 255, 0) 99.97%);
 
+                    &::before {
+                        position: absolute;
+                        left: 0;
+                        content: "";
+                        width: 3px;
+                        height: 54px;
+                        background: linear-gradient(180.3deg,rgba(255, 255, 255, 0.15) 0.87%,#ffffff 48.23%,rgba(255, 255, 255, 0) 99.99%);
+                    }
+
                     .track_name {
                         background: linear-gradient(268.74deg,#ffc3a8 1.29%,#dadfff 51.78%,#7cabff 101.78%);
                         -webkit-background-clip: text;
@@ -209,6 +220,7 @@
                         display: flex;
                         flex-direction: column;
                         justify-content: space-between;
+                        cursor: pointer;
                         &:hover {
                             background: url('../img/center/item-bg.webp');
                             background-position: center;
@@ -218,9 +230,12 @@
                             transform: translateY(-2px);
                             border: 2px solid transparent;
 
-                            .task_name, .task_owner, .task_level {
+                            .task_name, .task_owner {
                                 color: #ffffff !important;
                             }
+                            .task_level {
+                                background: #ffffff !important;
+                            }
                             .task_info {
                                 div {
                                     border-color: rgba(255, 255, 255, 0.18);

src/pages/2026/center/info.js

@@ -4,44 +4,44 @@ export const directions = [{
     desc: '聚焦人工智能前沿技术与应用，探索大模型、智能算法在开源场景下的创新实践',
     tasks: {
       '开源案例教学赛道': [
-        { name: 'InVision虚拟化工平台上支持Asterinas（显锐）操作系统的容器运行时', level: 3, owner: '西北工业大学' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: 'OpenTiny NEXT前端智能应用贡戴赛', level: 2, owner: '西北工业大学' },
-        { name: 'ylong_http支持https代理', level: 2, owner: '小米' },
-        { name: 'ModelEngine开源项目贡戴赛', level: 1, owner: '华为' },
-        { name: 'openUBMC开源项目贡戴赛', level: 3, owner: '西北工业大学' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: 'InVision虚拟化工平台上支持Asterinas（显锐）操作系统的容器运行时', level: 3, owner: '西北工业大学', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: 'OpenTiny NEXT前端智能应用贡戴赛', level: 2, owner: '西北工业大学', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: 'ylong_http支持https代理', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: 'ModelEngine开源项目贡戴赛', level: 1, owner: '华为', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: 'openUBMC开源项目贡戴赛', level: 3, owner: '西北工业大学', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源任务挑战赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源代码评注赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源代码评论赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ]
     }
   },
@@ -54,41 +54,41 @@ export const directions = [{
         { name: '基于openvela的音视频识别系统', level: 1, owner: '华为' },
         { name: '基于openvela的音视频识别系统', level: 1, owner: '华为' },
         { name: 'OpenTiny NEXT前端智能应用贡戴赛', level: 2, owner: '西北工业大学' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
         { name: 'ModelEngine开源项目贡戴赛', level: 1, owner: '华为' },
         { name: 'ModelEngine开源项目贡戴赛', level: 3, owner: '西北工业大学' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源任务挑战赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
         { name: '基于openvela的音视频识别系统', level: 2, owner: '华为' },
         { name: 'ModelEngine开源项目贡戴赛', level: 3, owner: '西北工业大学' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源代码评注赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ],
       '开源代码评论赛道': [
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' },
-        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米' }
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'},
+        { name: '基于AI/Agent的NPU算子自动生成', level: 2, owner: '小米', url: 'https://www.gitlink.org.cn/competitions'}
       ]
     }
   }