From 1f6a4bda6c29c9e2eaeb8ede865a8826840b7b57 Mon Sep 17 00:00:00 2001
From: caishi <1149225589@qq.com>
Date: Mon, 19 Apr 2021 16:58:30 +0800
Subject: [PATCH] =?UTF-8?q?readme-=E6=96=87=E4=BB=B6=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E4=B8=80=E4=B8=AA=E7=9B=AE=E5=BD=95=E4=B8=8B=E6=8B=89icon?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/forge/Main/CoderDepotReadme.jsx | 44 ++++++++++++++++++++++++++---
 src/forge/Main/Index.scss           | 19 +++++++++++++
 src/modules/tpm/TPMIndex.css        |  1 -
 src/modules/tpm/TPMIndexHOC.js      |  1 +
 4 files changed, 60 insertions(+), 5 deletions(-)

diff --git a/src/forge/Main/CoderDepotReadme.jsx b/src/forge/Main/CoderDepotReadme.jsx
index c46747404..da1435d55 100644
--- a/src/forge/Main/CoderDepotReadme.jsx
+++ b/src/forge/Main/CoderDepotReadme.jsx
@@ -1,13 +1,49 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import RenderHtml from '../../components/render-html';
+import { Dropdown , Menu , Spin } from 'antd';
+import { Link } from 'react-router-dom';
+const $ = window.$;
 
 function CoderDepotReadme({ operate , history , readme , ChangeFile }){
+  const [ menuList ,setMenuList ] = useState(undefined);
+
+  useEffect(()=>{
+    if(readme && readme.content){
+      let path = history.location.pathname;
+      const items = $.map($("#readme").find("h1,h2,h3,h4,h5,h6"), function (el, _) {
+        const anchor = el.id;
+        const level = el.tagName.replace("H", "");
+        const href = `#${anchor}`;
+        return { href:`${path}${href}`,text:el.textContent , level:level }
+      });
+      setMenuList(items);
+    }
+  },[readme])
+
+  function menu(){
+    if(menuList && menuList.length > 0){
+      let hash = history.location.hash;
+      return(
+        <Menu className="menuslist">
+          {
+            menuList.map((item,key)=>{
+              return(
+                <Menu.Item key={item.id} className={decodeURI(hash).indexOf(item.text)>-1 ?"active":""}><Link to={`${item.href}`} style={{paddingLeft:`${item.level *10}px`}} title={item.text}>{item.text}</Link></Menu.Item>
+              )
+            })
+          }
+        </Menu>
+      )
+    }else{
+      return <Spin />
+    }
+  }
   return(
     <div className="commonBox" id="readme">
       <div className="commonBox-title">
-        <span className="mr10">
-          <i className="iconfont icon-wenjian1 font-16 color-grey-9 fl mt3"></i>
-        </span>
+        <Dropdown overlay={menu()}>
+          <i className="iconfont icon-zhangjie1 font-16 color-grey-3 mr10"></i>
+        </Dropdown>
         <span className="commonBox-title-read">README.md</span>
         {
           operate ?
diff --git a/src/forge/Main/Index.scss b/src/forge/Main/Index.scss
index bd19f89c5..f4519191f 100644
--- a/src/forge/Main/Index.scss
+++ b/src/forge/Main/Index.scss
@@ -283,4 +283,23 @@
 .downMenu{
   box-shadow: 0px 0px 9px rgba(134, 134, 134,0.4);
   background-color: #fff;
+}
+
+.menuslist{
+  max-height: 200px;
+  overflow-y: auto;
+  padding:10px 15px;
+  border-radius: 4px;
+  .ant-dropdown-menu-item{
+    border-radius: 8px;
+    a{
+      width: 350px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+  }
+  .ant-dropdown-menu-item.active{
+    background-color: #e6f7ff;
+  }
 }
\ No newline at end of file
diff --git a/src/modules/tpm/TPMIndex.css b/src/modules/tpm/TPMIndex.css
index cabedd510..98db39199 100644
--- a/src/modules/tpm/TPMIndex.css
+++ b/src/modules/tpm/TPMIndex.css
@@ -21,7 +21,6 @@ body>.-task-title {
   height: 100%;
   min-height: 100%;
   overflow: hidden;
-  padding-top:70px;
 }
 .newHeaders{
   max-width: unset;
diff --git a/src/modules/tpm/TPMIndexHOC.js b/src/modules/tpm/TPMIndexHOC.js
index 1ca19cc78..60e36d6ae 100644
--- a/src/modules/tpm/TPMIndexHOC.js
+++ b/src/modules/tpm/TPMIndexHOC.js
@@ -432,6 +432,7 @@ export function TPMIndexHOC(WrappedComponent) {
 						tip={this._gLoadingTip || "加载中..."}
 					>
 						<div className="newContainer newContainers">
+							<div style={{height:"70px"}}></div>
 							{
 								current_user &&
 								<WrappedComponent initCommonState={(user) => this.initCommonState(user)}