forked from Gitlink/forgeplus-react
readme-文件增加一个目录下拉icon
This commit is contained in:
parent
487a2f0495
commit
b8d40259e5
|
@ -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 ?
|
||||
|
|
|
@ -286,4 +286,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;
|
||||
}
|
||||
}
|
|
@ -21,7 +21,6 @@ body>.-task-title {
|
|||
height: 100%;
|
||||
min-height: 100%;
|
||||
overflow: hidden;
|
||||
padding-top:70px;
|
||||
}
|
||||
.newHeaders{
|
||||
max-width: unset;
|
||||
|
|
|
@ -427,6 +427,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)}
|
||||
|
|
Loading…
Reference in New Issue