首页积分置顶项目

2026-06-08 20:08:51 +08:00 · 2026-06-08 20:08:51 +08:00 · 81c8bb6e87
parent 57e07818d8
commit 81c8bb6e87
4 changed files with 128 additions and 27 deletions
--- a/src/forge/Information/Pages/homepage/component/projectByNSCC.jsx
+++ b/src/forge/Information/Pages/homepage/component/projectByNSCC.jsx
@ -1,6 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react';
 import '../index.scss';
-import { getProjectListByScore, getProjectsTypeLists } from '../../../api';
+import { getProjectListByScore, getProjectsTypeLists, getPointsProjectList } from '../../../api';
 import { Carousel, Divider, Pagination, Spin } from 'antd';
 import Nodata from '../../../../Nodata';
 import Slider from 'react-slick';
@ -16,6 +16,7 @@ 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)=>{
@ -24,6 +25,7 @@ function TypeCarousel({pageSize=4, list=[], typeId, onClick}) {
          {page.map((item, i) => {
            const order = index*pageSize+i
            const iconName = {
+              "精选项目": "icon-jingxuanxiangmu",
              "并行计算框架": "icon-binghangjisuankuangjia",
              "异构数据库": "icon-yigoushujuku",
              "性能基准与评测": "icon-xingnengjizhunyupingce",
@ -55,6 +57,7 @@ function Project({ data, nsccTitle }) {
  const [typeList, setTypeList] = useState([]);
  const [typeId, setTypeId] = useState(undefined);
  const [lists, setLists] = useState([]);
+  const [topList, setTopList] = useState([]);
  const [loading, setLoading] = useState(false);
  const [page, setPage] = useState(1);
  const [total, setTotal] = useState(0);
@ -93,20 +96,41 @@ function Project({ data, nsccTitle }) {
  }, []);

  useEffect(() => {
-    id && getProjectsTypeLists(id, {
-      pageNum: 1,
-      pageSize: 100,
-    }).then(result => {
-      if (result) {
-        const rows = result.data.rows;
-        rows[0] && setTypeId(rows[0].id)
-        setTypeList(rows);
+    async function fetchTypeData() {
+      let typeList = [];
+      let typeId = null;
+      if(id) {
+        let res = await getPointsProjectList(id);
+        if(res && Array.isArray(res.data.data) && res.data.data.length){
+          setTopList(res.data.data);
+          typeList.push({id: -1, zoneId: id, name: '精选项目'});
+          typeId = -1;
+        }
+
+        getProjectsTypeLists(id, {
+          pageNum: 1,
+          pageSize: 100,
+        }).then(result => {
+          if (result) {
+            const rows = result.data.rows;
+            if(Array.isArray(rows) && rows.length) {
+              typeList = [...typeList, ...rows];
+              setTypeList(typeList);
+              if (typeId === null) {
+                setTypeId(rows[0].id);
+              } else {
+                setTypeId(typeId);
+              }
+            }
+          }
+        }).catch(() => { })
      }
-    }).catch(() => { })
+    }
+    fetchTypeData();
  }, [id])

  useEffect(() => {
-    if (typeId) {
+    if (typeId && typeId !== -1) { // 非置顶项目查询数据
      setLoading(true);
      getProjectListByScore(id, {
        pageNum: page,
@ -168,25 +192,86 @@ function Project({ data, nsccTitle }) {
    </div>
  }

+  const topDetail = (className="online_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)}>
+      <div className='clearfix'>
+        <span className='font-bd font-16 pointer'>{i.projectProperties && i.projectProperties.name}</span>
+      </div>
+      <div className="task-hide-2 mt5 color5d6 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>}
+          {
+            i.projectProperties && i.projectProperties.topics &&
+              i.projectProperties.topics.split(",").map(t => {
+                return (
+                  <li className='font-13 mt5'>{t}</li>
+                )
+              })
+          }
+        </ul>
+      </div>
+      <p className='df between'>
+        <div className='font-15 font-bd'>
+          {i.projectProperties.language && (
+            <>
+              <span className='color5d6 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>}
+        </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>
+        </div>
+      </p>
+    </div>
+  }
+
  return <div className='project_1_bg_NSCC viewEntry' id="nscc_home4" ref={newsSectionRef}>
    <div className='project_1 width1600 pt50 pb60'>
      {nsccTitle(homepageProjectTitle, 0.1, "font-bd font-30 mb50 align task-hide")}
      <div className='project_list_NSCC'>
        <TypeCarousel pageSize={10} list={typeList} typeId={typeId} onClick={(id)=>{setTypeId(id); setPage(1)}}/>
-        <Spin spinning={loading}>
-          <div className='df gap20'>
-            {lists.slice(0, 3).map((i, index)=>{
-              return projectDetail("online_detail", i, index, 3)
-            })}
-          </div>
-          {lists.length > 3 && <div className='df second_detailBox mt30 wrap'>
-            {lists.slice(3).map((i, index)=>{
-              return projectDetail("second_detail", i, index, lists.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="暂无数据" />}
-        </Spin>
+        {
+          typeId !== -1 && 
+            <Spin spinning={loading}>
+              <div className='df gap20'>
+                {lists.slice(0, 3).map((i, index)=>{
+                  return projectDetail("online_detail", i, index, 3)
+                })}
+              </div>
+              {lists.length > 3 && <div className='df second_detailBox mt30 wrap'>
+                {lists.slice(3).map((i, index)=>{
+                  return projectDetail("second_detail", i, index, lists.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="暂无数据" />}
+            </Spin>
+        }
+        {
+          typeId === -1 && 
+            <Spin spinning={loading}>
+              <div className='df gap20'>
+                {topList.slice(0, 3).map((i, index)=>{
+                  return topDetail("online_detail", i, index, 3)
+                })}
+              </div>
+              {lists.length > 3 && <div className='df second_detailBox mt30 wrap'>
+                {topList.slice(3).map((i, index)=>{
+                  return topDetail("second_detail", i, index, lists.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="暂无数据" />}
+            </Spin>
+        }
+        
      </div>
    </div>
  </div>
--- a/src/forge/Information/Pages/homepage/index.scss
+++ b/src/forge/Information/Pages/homepage/index.scss
@ -984,6 +984,11 @@
    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{
@ -997,6 +1002,9 @@
        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{
@ -1190,4 +1198,5 @@
      }
    }
  }
-}
+}
+
--- a/src/forge/Information/api.js
+++ b/src/forge/Information/api.js
@ -704,3 +704,10 @@ export function getPointsDocList(id){
  })
 }

+// 获取文章列表
+export function getPointsProjectList(id){
+  return fetch({
+    url:`/zone/zoneFront/getTopProject/${id}`,
+    method: 'get',
+  })
+}
--- a/src/forge/Information/fetch.js
+++ b/src/forge/Information/fetch.js
@ -15,7 +15,7 @@ function beforeFetch(actionUrl){

  service.interceptors.request.use(request => {
    let deptId = sessionStorage.getItem('deptId');
-    // request.headers.Authorization = '8786c89c803fc2420f75c19895f0cee794b6f9a3'
+    request.headers.Authorization = '26569459fc34087176a576216e360cd1d27de78e'
    if (deptId) {
      // 用于权限区分
      request.headers['Dept-Id'] = deptId