详情页暂存

src/factory/components/Resource/index.jsx

@@ -20,7 +20,7 @@ const resourceInfo = [
   { name: '软件', title: '开源社区软件', icon: 'icon-gongju', desc: '来自开源社区，可按授权许可使用和复用的各类软件', path: '/sf/resources/devtools' },
 ]
 
-const Resource = forwardRef(({ zoneId }, ref) => {
+const Resource = forwardRef(({ zoneId, history }, ref) => {
   const r1Ref = useRef(null);
   const r2Ref = useRef(null);
   const r3Ref = useRef(null);
@@ -315,10 +315,8 @@ const Resource = forwardRef(({ zoneId }, ref) => {
                       <div className="item-name" title={item.name}>{item.name}</div>
                       <div className="item-desc" title={item.summary}>{item.summary}</div>
                       <button onClick={() => {
-                        if (item.fileIds) {
-                          downloadFunc(`${httpUrl}/file/open/download/${item.fileIds}`)
-                        }
-                      }} disabled={!item.fileIds} className={!item.fileIds && 'disabled'} >{item.fileIds ? '下载' : '稍后下载'}</button>
+                        history.push(`/sf/resources/releases`)
+                      }} disabled={!item.fileIds}>查看</button>
                     </div>
                   })
                 }

src/factory/index.jsx

@@ -298,7 +298,7 @@ function Index(props) {
 
       <News zoneId={factoryZoneId} />
       <Feature />
-      <Resource zoneId={factoryZoneId} ref={resourceRef} />
+      <Resource zoneId={factoryZoneId} history={ props.history } ref={resourceRef} />
       <Resource2 zoneId={factoryZoneId} ref={resource2Ref} />
       {/* <Scene zoneId={factoryZoneId} /> */}
     </div>

src/factory/resource/factoryVersion/detail/index.jsx

@@ -104,35 +104,36 @@ function Index(props) {
           <Breadcrumb.Item> <span className="breacrumb-name">{detail.name}</span> </Breadcrumb.Item>
         </Breadcrumb>
         <div className="header-content">
-          <Tooltip title={ detail.name } placement="topLeft">
-            <h3>{detail.name}</h3>
-          </Tooltip>
-          <Tooltip title={ detail.summary } placement="topLeft">
-            <p>{detail.summary}</p>
-          </Tooltip>
-          <div className="tools-info">
-            <div>
-              <span>{detail.downloadCount}</span>
-              <span>下载量</span>
-            </div>
-            <div>
-              <span>{totalFileSize || (detail.fileList && detail.fileList[0] ? detail.fileList[0].fileSizeInfo : 0)}</span>
-              <span>文件大小</span>
-            </div>
-            <div>
-              <span>{detail.fileList ? detail.fileList.length : 0}</span>
-              <span>文件数量</span>
-            </div>
-            <div>
-              <span>{detail.domainName}</span>
-              <span>工具类型</span>
+          <div className="header-info">
+            <Tooltip title={ detail.name } placement="topLeft">
+              <h3>{detail.name}</h3>
+            </Tooltip>
+            <Tooltip title={ detail.summary } placement="topLeft">
+              <p>{detail.summary}</p>
+            </Tooltip>
+            <div className="tools-info">
+              <div>
+                <span>{detail.downloadCount}</span>
+                <span>下载量</span>
+              </div>
+              <div>
+                <span>{totalFileSize || (detail.fileList && detail.fileList[0] ? detail.fileList[0].fileSizeInfo : 0)}</span>
+                <span>文件大小</span>
+              </div>
+              <div>
+                <span>{detail.fileList ? detail.fileList.length : 0}</span>
+                <span>文件数量</span>
+              </div>
+              <div>
+                <span>{detail.domainName}</span>
+                <span>工具类型</span>
+              </div>
             </div>
           </div>
           
           {/* 文件列表展示 */}
           {detail.fileList && detail.fileList.length > 0 && (
             <div className="file-list">
-              <h6>文件列表</h6>
               <div className="file-list-content">
                 {detail.fileList.map((file, index) => (
                   <div key={file.fileId || index} className="file-item">
@@ -155,13 +156,6 @@ function Index(props) {
               </div>
             </div>
           )}
-
-          <div className="header-img">
-            <div className="header-img-wrapper">
-              <img src={detail.headImg || imageBack1} alt="" />
-              {!detail.headImg && <img src={imageGif} alt="" />}
-            </div>
-          </div>
         </div>
       </div>
       <div className="news-detail-content">

src/factory/resource/factoryVersion/detail/index.scss

@@ -40,20 +40,19 @@
     .header-content {
       margin-top: 30px;
       width: 1600px;
-      min-height: 481px;
+      height: 460px;
       position: relative;
-      border-radius: 16px;
       padding: 60px 45px;
-      background: linear-gradient(106.16deg, #f7fbff 2.47%, #f5faff 95.98%);
-      border: 2px solid;
-      border-color: #ffffff;
+      background: url('../../../../images/factory/resource/version-detail-header.webp');
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+      display: flex;
 
       h3 {
         line-height: 47px;
         font-family: alibabaBold;
-        font-weight: 700;
-        color: #091221;
-        font-size: 34px;
+        color: #ffffff;
+        font-size: 30px;
         max-width: 650px;
         white-space: nowrap;
         text-overflow: ellipsis;
@@ -65,7 +64,7 @@
         max-width: 650px;
         line-height: 22px;
         font-family: alibabareg;
-        color: #5d6a80;
+        color: #ffffff;
         font-size: 16px;
         display: -webkit-box;
         -webkit-line-clamp: 2;
@@ -76,26 +75,29 @@
       .tools-info {
         display: flex;
         margin-top: 35px;
+        flex-wrap: wrap;
+        width: 400px;
 
         div {
           display: flex;
           flex-direction: column;
           position: relative;
-          margin-right: 78px;
+          min-width: 140px;
+          margin-bottom: 40px;
 
           span:nth-child(1) {
             line-height: 32px;
             font-family: alibabaBold;
             font-weight: 700;
-            color: #164ce4;
-            font-size: 24px;
+            color: #ffd88e;
+            font-size: 22px;
           }
 
           span:nth-child(2) {
             line-height: 20px;
             font-family: alibabareg;
-            color: #5d6a80;
-            font-size: 14px;
+            color: #ffffff;
+            font-size: 16px;
             margin-top: 8px;
           }
 
@@ -143,22 +145,26 @@
         }
 
         &-content {
-          background: #f7fbff;
-          border-radius: 8px;
+          width: 1147px;
+          height: 404px;
+          background: linear-gradient(108.75deg,#f7fbff 2.52%,#f5faff 95.95%);
+          border-radius: 16px;
+          backdrop-filter: blur(30px);
           padding: 15px;
-          border: 1px solid rgba(22, 76, 228, 0.1);
           margin-top: 15px;
 
           .file-item {
             display: flex;
             align-items: center;
             justify-content: space-between;
-            padding: 12px 15px;
-            background: #ffffff;
-            border-radius: 6px;
-            margin-bottom: 10px;
-            border: 1px solid rgba(22, 76, 228, 0.08);
-
+            width: 510px;
+            height: 105px;
+            background: url('../../../../images/factory/resource/version-item-bg.webp'), #ffffff;
+            background-repeat: no-repeat;
+            background-size: 100% 100%;
+            border: 2px solid;
+            border-color: #ffffff;
+            border-radius: 8px;
             &:last-child {
               margin-bottom: 0;
             }
@@ -322,9 +328,9 @@
     }
 
     .news-detail-content-wrapper {
-      background-image: url('../../../../images/factory/resource/detail-bg.png');
-      background-repeat: no-repeat;
-      background-size: 100% 100%;
+      // background-image: url('../../../../images/factory/resource/detail-bg.png');
+      // background-repeat: no-repeat;
+      // background-size: 100% 100%;
       padding: 30px;
       border-radius: 16px;
       margin-bottom: 60px;