首页推荐项目

2026-06-09 17:30:28 +08:00 · 2026-06-09 17:30:28 +08:00 · 7441f4de7b
parent 65e7db5551
commit 7441f4de7b
7 changed files with 128 additions and 43 deletions
--- a/src/forge/Information/Pages/homepage/component/newsByNSCC.jsx
+++ b/src/forge/Information/Pages/homepage/component/newsByNSCC.jsx
@ -86,18 +86,7 @@ function News(props) {
        });
      }

-      if(rowId) {
-        getSubDocList(rowId,{pageSize:3,pageNum:1,auditStatus:1}).then(result=>{
-          if(result && result.data.rows){
-            let rows = result.data.rows;
-            const existIds = new Set(docList.map(item => item.id));
-            const newRows = rows.filter(row => !existIds.has(row.id));
-            docList = [...docList, ...newRows];
-          }
-        }).finally(() => {
-          setDocListBySecondDir(docList);
-        })
-      }
+      setDocListBySecondDir(docList);
    });
  }
  
--- a/src/forge/Information/Pages/homepage/component/projectByNSCC.jsx
+++ b/src/forge/Information/Pages/homepage/component/projectByNSCC.jsx
@ -16,7 +16,6 @@ function TypeCarousel({pageSize=4, list=[], typeId, onClick}) {
    const start = i * pageSize;
    const end = start + pageSize;
    pages.push(list.slice(start, end));
-    console.log('ppp', pages)
  }
  return <Slider {...setting} className='mb60'>
    {pages.map((page, index)=>{
@ -25,7 +24,7 @@ function TypeCarousel({pageSize=4, list=[], typeId, onClick}) {
          {page.map((item, i) => {
            const order = index*pageSize+i
            const iconName = {
-              "精选项目": "icon-jingxuanxiangmu",
+              "精选项目": "icon-jingxuanxiangmu1",
              "并行计算框架": "icon-binghangjisuankuangjia",
              "异构数据库": "icon-yigoushujuku",
              "性能基准与评测": "icon-xingnengjizhunyupingce",
@ -192,18 +191,17 @@ function Project({ data, nsccTitle }) {
    </div>
  }

-  const topDetail = (className="online_detail", i, index, length) => {
+  const topDetail = (className="top_detail", i, index, length) => {
    const { extra: { } } = i || {}
-    return <div className={`${className} ${className === "second_detail" && index <3 && index<length-1 && 'pb30'} ${index === length && 'noBor'}`} key={i.id} onClick={() => window.open(i.projectURL)}>
+    return <div className={`${className} ${className === "second_detail" && index <3 && index<length-1 && 'pb30'} ${(index === length && index%3 === 0) && 'noBor'}`} key={i.id} onClick={() => window.open(i.projectURL)}>
      <div className='clearfix'>
-        <span className='font-bd font-16 pointer'>{i.projectProperties && i.projectProperties.name}</span>
+        <span className='topTitle'>{i.projectProperties && i.projectProperties.name}</span>
      </div>
-      <div className="task-hide-2 mt5 color5d6 mb12">
+      <div className="task-hide-2 mt5 mb12">
        {i.projectProperties.description || "暂无描述"}
      </div>
      <div style={{ minHeight: 46 }}>
-        <ul className="pd_tag_NSCC pb15 df wrap">
-          {i.projectProperties.language && <li className='font-13 mt5'>{i.projectProperties.language}</li>}
+        <ul className="top_tag_NSCC pb15 df wrap">
          {
            i.projectProperties && i.projectProperties.topics &&
              i.projectProperties.topics.split(",").map(t => {
@ -214,19 +212,20 @@ function Project({ data, nsccTitle }) {
          }
        </ul>
      </div>
-      <p className='df between'>
-        <div className='font-15 font-bd'>
+      <p className='df between baseline'>
+        <div className='df font-15 font-bd' style={{alignItems: 'center'}}>
          {i.projectProperties.language && (
            <>
-              <span className='color5d6 mr5 font-14 font-n'>{i.projectProperties.language}</span>
+              <div className='pythonicon'></div>
+              <span className='mr5 font-14 font-n'>{i.projectProperties.language}</span>
              <Divider type="vertical" style={{ margin: '0 15px' }} />
            </>
          )}
-          {i.projectProperties.timeAgo && <span className='color5d6 mr5 font-14 font-n'>更新于{i.projectProperties.timeAgo}</span>}
+          {i.projectProperties.timeAgo && <span className='mr5 font-14 font-n'>更新于{i.projectProperties.timeAgo}</span>}
        </div>
        <div>
-          <span className='topitem mr10'><i className="iconfont icon-xingzhuang mr3 font-14" style={{color: '#e7d1b9'}}></i> 赞{i.projectProperties.praisesCount}</span>
-          <span className='topitem'><i className="iconfont icon-yifuke_icon mr3 font-14" style={{color: '#5857cd'}}></i> fork{i.projectProperties.forkedCount}</span>
+          <span className='topitem mr10'><i className="iconfont icon-xingzhuang mr3 font-14" style={{color: '#d18733'}}></i> 赞 {i.projectProperties.praisesCount}</span>
+          <span className='topitem'><i className="iconfont icon-yifuke_icon mr3 font-14" style={{color: '#5545bd'}}></i> fork {i.projectProperties.forkedCount}</span>
        </div>
      </p>
    </div>
@ -259,16 +258,16 @@ function Project({ data, nsccTitle }) {
            <Spin spinning={loading}>
              <div className='df gap20'>
                {topList.slice(0, 3).map((i, index)=>{
-                  return topDetail("online_detail", i, index, 3)
+                  return topDetail("top_detail", i, index, 3)
                })}
              </div>
-              {lists.length > 3 && <div className='df second_detailBox mt30 wrap'>
+              {topList.length > 3 && <div className='top_detailBox mt20'>
                {topList.slice(3).map((i, index)=>{
-                  return topDetail("second_detail", i, index, lists.slice(4).length)
+                  return topDetail("top_detail", i, index, topList.slice(4).length)
                })}
              </div>}
-              <Pagination pageSize={9} total={total} hideOnSinglePage={true} current={page} onChange={(page)=>{setPage(page)}} className='center mt30'/>
-              {!loading && lists.length === 0 && <Nodata _html="暂无数据" />}
+              {/* <Pagination pageSize={9} total={total} hideOnSinglePage={true} current={page} onChange={(page)=>{setPage(page)}} className='center mt30'/> */}
+              {!loading && topList.length === 0 && <Nodata _html="暂无数据" />}
            </Spin>
        }
        
--- a/src/forge/Information/Pages/homepage/image/projectBk4.png
+++ b/src/forge/Information/Pages/homepage/image/projectBk4.png
--- a/src/forge/Information/Pages/homepage/image/python_color.png
+++ b/src/forge/Information/Pages/homepage/image/python_color.png
--- a/src/forge/Information/Pages/homepage/image/python_white.png
+++ b/src/forge/Information/Pages/homepage/image/python_white.png
--- a/src/forge/Information/Pages/homepage/index.scss
+++ b/src/forge/Information/Pages/homepage/index.scss
@ -829,7 +829,7 @@
    }
  }
  .firstDir_NSCC{
-    width:690px;
+    width:910px;
    background-color: #F6F8FD;
    border-radius:15px;
    box-shadow:0px 0px 12px rgba(33, 73, 212, 0.1);
@ -875,7 +875,7 @@
    
  }
  .firstDoc_Img{
-    width:690px;
+    width:910px;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
@ -896,8 +896,32 @@
    padding: 30px 25px;
    max-height:653px;
    overflow-y: auto;
+    position: relative;
+    overflow: hidden;
+    backdrop-filter: blur(12px);
+    &::before{
+      content: '';
+      position: absolute;
+      left: 0; right: 0;
+      height: 60px;
+      z-index: 3;
+      pointer-events: none;
+      top: 0;
+      background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), transparent);
+    }
+    &::after{
+      content: '';
+      position: absolute;
+      left: 0; right: 0;
+      height: 60px;
+      z-index: 3;
+      pointer-events: none;
+      bottom: 0;
+      background: linear-gradient(to top, rgba(255, 255, 255, 0.8), transparent);
+    }
  }
  .docBySecondDir_NSCC{
+    cursor: pointer;
    background-image:linear-gradient(180deg,#f4f7ff 0%,#ffffff 100%);
    border-radius:15px;
    box-shadow:0px 0px 12px rgba(33, 73, 212, 0.06);
@ -984,11 +1008,6 @@
    padding: 22px 20px 20px 20px;
    border-radius:15px;
    box-shadow:0px 0px 12px rgba(33, 73, 212, 0.1);
-    .topitem{
-      background-color: rgba(0, 0, 0, 0.08);
-      padding: 4px 8px;
-      border-radius: 4px;
-    }
    &:hover{ 
      background-image: url('./image/projectBk2.png');
      span, div{
@ -1002,9 +1021,6 @@
        background-color:rgba(255, 255, 255, 0.12);
        border: 1px solid rgba(255, 255, 255, 0.5);
      }
-      .topitem{
-        background-color: rgba(255, 255, 255, 0.12);
-      }
    }
  }
  .second_detail{
@ -1049,6 +1065,87 @@
      }
    }
  }
+  .top_detail{
+    background-image: url('./image/projectBk1.png');
+    background-size: 100% 100%;
+    flex: 0 0 calc(33.333% - 15px);
+    padding: 22px 20px 20px 20px;
+    border-radius:15px;
+    box-shadow:0px 0px 12px rgba(33, 73, 212, 0.1);
+    font-family: alibabaReg;
+    color: #091221;
+    .topitem{
+      background-color: rgba(76, 88, 118, 0.04);
+      padding: 4px 8px;
+      border-radius: 4px;
+    }
+    .topTitle{
+      font-family: alibaba;
+      font-size: 16px;
+    }
+    .pythonicon{
+      width: 14px;
+      height: 14px;
+      margin-right: 6px;
+      background-image: url('./image/python_color.png');
+      background-position: center;
+      background-size: 100% 100%;
+    }
+    &:hover{ 
+      cursor: pointer;
+      background-image: url('./image/projectBk4.png');
+      span, div{
+        color: white;
+      }
+      .color5d6:not(.task-hide-2){
+        opacity: 0.8;
+      }
+      .pd_tag_NSCC li{
+        color:#ffffff;
+        background-color:rgba(255, 255, 255, 0.12);
+        border: 1px solid rgba(255, 255, 255, 0.5);
+      }
+      .topitem{
+        background-color: rgba(255, 255, 255, 0.1);
+      }
+      .top_tag_NSCC{
+        li{
+          padding: 0 8px;
+          border-radius:4px;
+          margin-right: 8px;
+          color:#ffffff;
+            background-color:rgba(255, 255, 255, 0.12);
+            border: 1px solid rgba(255, 255, 255, 0.5);
+        }
+      }
+      .pythonicon{
+        width: 14px;
+        height: 14px;
+        margin-right: 6px;
+        background-image: url('./image/python_white.png');
+        background-position: center;
+        background-size: 100% 100%;
+      }
+    }
+    &.top:hover{
+      background-image: url('./image/projectBk4.png');
+    }
+    .top_tag_NSCC{
+      li{
+        padding: 0 8px;
+        border-radius:4px;
+        border: 1px solid transparent;
+        background:linear-gradient(281.55deg,rgba(10, 145, 255, 0.08) 1.48%,rgba(43, 103, 238, 0.08) 53.53%,rgba(133, 110, 250, 0.08) 95.62%);
+        margin-right: 8px;
+      }
+    }
+  }
+  .top_detailBox{
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    column-gap: 20px;
+    row-gap: 20px;
+  }
 }
 .source_1_bg_NSCC{
  background-image: url('./image/bkImg9.png');
--- a/src/forge/Information/api.js
+++ b/src/forge/Information/api.js
@ -699,7 +699,7 @@ export function doProjectTop(data) {
 // 获取文章列表
 export function getPointsDocList(id){
  return fetch({
-    url:`/zone/zoneFront/getTopDoc/${id}`,
+    url:`/zone/open/getTopDoc/${id}`,
    method: 'get',
  })
 }
@ -707,7 +707,7 @@ export function getPointsDocList(id){
 // 获取文章列表
 export function getPointsProjectList(id){
  return fetch({
-    url:`/zone/zoneFront/getTopProject/${id}`,
+    url:`/zone/open/getTopProject/${id}`,
    method: 'get',
  })
 }