xxq250
/
forgeplus-react
forked from Gitlink/forgeplus-react
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'develop' into develop_educoder

This commit is contained in:
caishi 2021-03-30 11:51:06 +08:00
parent 29f37b9760 2c83221376
commit 1182a45cdc
11 changed files with 83 additions and 533 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/forge/Component/User.jsx
View File

@ -20,7 +20,7 @@ export default ({ url , name , column })=>{
`;
return(
<Img>
<img src={url} alt=""/>
{ url && <img src={url} alt=""/> }
<span>{name}</span>
</Img>
)

19
src/forge/Main/CoderDepot.jsx
View File

@ -1,6 +1,6 @@
import React , { useEffect , useState } from 'react';
import { WhiteBack , Box , LongWidth , ShortWidth , Gap , AlignCenter , FlexAJ } from '../Component/layout';
import { Dropdown , Menu , Divider , Spin } from 'antd';
import { Dropdown , Menu , Divider , Spin, Button } from 'antd';
import { getImageUrl } from "educoder";
import { Link } from 'react-router-dom';
import CloneAddress from '../Branch/CloneAddress';
@ -242,7 +242,10 @@ function CoderDepot(props){
onClose={()=>setVisible(false)}
list = {mainFlag ? dirInfo : undefined}
/>
<div className="drawerBtn" onClick={()=>setVisible(true)}><i className="iconfont icon-youjiantou"></i></div>
<div className="drawerBtn" onClick={()=>setVisible(true)}>
<i className="iconfont icon-youjiantou font-16"></i>
<span>目录</span>
</div>
</React.Fragment>
}
<div style={{minHeight:"500px"}}>
@ -287,8 +290,14 @@ function CoderDepot(props){
<a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/pulls/new`)} >+ 合并请求</a>
<a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/issues/new`)} >+ 任务</a>
</div>
{ type === "dir" && <Dropdown.Button overlay={fileMenu} className="mr20">文件</Dropdown.Button>}
<Dropdown.Button overlay={downloadMenu} type={'primary'}>下载</Dropdown.Button>
{ type === "dir" &&
<Dropdown overlay={fileMenu} className="mr20">
<Button type="default">文件 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-grey-9"></i></Button>
</Dropdown>
}
<Dropdown overlay={downloadMenu} placement="bottomRight">
<Button type={'primary'}>下载 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-white"></i></Button>
</Dropdown>
</AlignCenter>
</FlexAJ>
{
@ -358,7 +367,7 @@ function CoderDepot(props){
<FlexAJ className="font-18 color-grey-6 mb20" style={{lineHeight:"28px"}}>简介
{projectDetail.permission && (projectDetail.permission==="Admin" || projectDetail.permission==="Owner") && <i onClick={()=>setOpenModal(true)} className="iconfont icon-anquanshezhi color-grey-9 font-15"></i>}
</FlexAJ>
{desc && <p className="font-14 color-grey-9 mb15 task-hide-2" style={{lineHeight:"22px",WebkitLineClamp:"4",textAlign:"justify"}}>{desc}</p>}
{desc && <p className="font-14 color-grey-9 mb15 task-hide-2" style={{lineHeight:"22px",WebkitLineClamp:"4",textAlign:"justify",wordBreak:"break-all"}}>{desc}</p>}
{
website &&
<p className="color-grey-6 df">

516
src/forge/Main/CoderRootDirectory.js
View File

@ -1,516 +0,0 @@
import React, { Component } from "react";
import { Menu, Spin } from "antd";
import { getImageUrl } from "educoder";
import { Link } from "react-router-dom";
import './list.css';
import SelectBranch from '../Branch/Select';
import CloneAddress from '../Branch/CloneAddress';
import RootTable from './RootTable';
import CoderRootFileDetail from './CoderRootFileDetail';
import { truncateCommitId } from '../common/util';
import RenderHtml from '../../components/render-html';
import Nodata from '../Nodata';
import axios from "axios";
/**
* address:http和SSH，http_url(对应git地址)
* filePath:点击目录时当前目录的路径
* subfileType:保存当前点击目录的文件类型（显示目录列表时才显示新建文件，如果点击的是文件就不显示新建文件按钮）
* readMeContent:根目录下面的readme文件内容
*/
function getPathUrl(array,index){
if(array && array.length>0 && index){
let str = "";
for(let i=0;i<index;i++){
str += `/${array[i]}`;
}
return str.substr(1);
}
}
class CoderRootDirectory extends Component {
constructor(props) {
super(props);
this.state = {
address: "http",
filePath: undefined,
subFileType: undefined,
readMeContent: undefined,
readMeFile: undefined,
isSpin: true,
branchList: undefined,
fileDetail: undefined,
branchLastCommit: undefined,
lastCommitAuthor: undefined,
rootList: undefined,
readOnly: true,
zip_url:undefined,
tar_url:undefined,
chooseType:undefined,
md:false,
treeValue:undefined
}
}
changeAddress = (address) => {
this.setState({
address,
});
};
componentDidMount = () => {
this.Init();
this.getBranchs();
};
// 获取分支列表
getBranchs=()=>{
const { projectsId , owner } = this.props.match.params;
axios.get(`/${owner}/${projectsId}/branches.json`).then(result=>{
this.setState({
branchList:result.data
})
}).catch((error)=>{})
}
componentDidUpdate = (prevState) => {
const { location } = this.props;
const prevlocation = prevState && prevState.location;
if (location !== prevlocation) {
this.setState({
isSpin: true,
});
this.Init();
}
};
Init = () => {
let { pathname } = this.props.history.location;
const { branchName , owner , projectsId } = this.props.match.params;
const { defaultBranch } = this.props;
let branch = branchName || defaultBranch;
if (pathname && (pathname.indexOf(`/projects/${owner}/${projectsId}`) > -1 && pathname.indexOf(`/tree/${branchName}/`) > -1)) {
let url = pathname.split(`/tree/${branchName}/`)[1];
this.setState({treeValue:url})
this.getFileDetail(decodeURI(url),branch);
} else {
this.getProjectRoot(branch);
}
};
// 页面地址返回到主目录
returnMain = (branch) => {
const { projectsId , owner , branchName } = this.props.match.params;
this.setState({
readOnly:true,
treeValue:undefined
})
this.props.history.push(`/projects/${owner}/${projectsId}${branchName?`/tree/${branchName}`:""}`);
this.getProjectRoot(branch);
};
// 获取根目录
getProjectRoot = (branch) => {
const { projectsId , owner } = this.props.match.params;
const url = `/${owner}/${projectsId}/entries.json`;
axios.get(url, { params: { ref: branch } })
.then((result) => {
if (result) {
let last_commit = result.data && result.data.last_commit;
let entries = result.data && result.data.entries;
this.setState({
filePath: undefined,
fileDetail: [],
isSpin: false,
branchLastCommit: last_commit && last_commit.commit,
lastCommitAuthor:
last_commit && (last_commit.author || (last_commit.commit && last_commit.commit.author)),
zip_url: result.data.zip_url,
tar_url: result.data.tar_url
});
if (entries && entries.length > 0) {
this.renderData(entries);
}
this.setState({
rootList: entries,
subFileType: true,
});
}
}).catch((error) => {});
};
ChangeFile = (arr, readOnly) => {
const { projectsId , owner } = this.props.match.params;
//点击直接跳转页面 加载一次路由
this.props.history.push(`/projects/${owner}/${projectsId}/tree/${arr.path}`);
this.setState({
readOnly: readOnly,
chooseType:"file"
});
};
// 获取子目录
getFileDetail = (path, ref) => {
this.setState({
filePath: decodeURI(path),
});
const { projectsId , owner , branchName } = this.props.match.params;
const { chooseType } = this.state;
const url = `/${owner}/${projectsId}/sub_entries.json`;
axios.get(url,{
params:{
filepath:path,
ref:ref || branchName,
type:chooseType
}
}).then((result)=>{
let entries = result.data && result.data.entries;
this.setState({
isSpin:false
})
if(result){
if(entries){
// 返回对象entries.type则是文件类型，否则是文件夹
if(entries.type){
this.setState({
fileDetail:[entries],
rootList:[],
subFileType:false
})
}else{
this.setState({
fileDetail:[],
rootList:entries,
branchLastCommit:result.data.last_commit && result.data.last_commit.commit,
lastCommitAuthor:result.data.last_commit && (result.data.last_commit.author || (result.data.last_commit.commit && result.data.last_commit.commit.author))
})
this.renderData(entries);
}
}else{
this.setState({
fileDetail:[],
rootList:[],
isSpin:false,
subFileType:false
})
}
}
})
.catch((error) => {
this.setState({
isSpin:false
})
console.log(error);
});
};
renderData = (data) => {
const rootList = [];
const readMeContent = [];
const readMeFile = [];
data && data.map((item, key) => {
rootList.push({
key,
message: item.commit && item.commit.message,
...item,
});
if (item.is_readme_file) {
readMeContent.push({ ...item });
readMeFile.push({ ...item });
}
});
this.setState({
rootList: rootList,
readMeContent,
readMeFile,
});
};
// 点击跳转到子目录
goToSubRoot=(path,type,filename)=>{
this.setState({
chooseType:type
})
const { projectsId, owner , branchName } = this.props.match.params;
const { defaultBranch } = this.props;
this.props.history.push(`/projects/${owner}/${projectsId}${`/tree/${branchName || defaultBranch}`}${path?`/${path}`:""}`);
if(filename.substring(filename.length - 3) === ".md"){
this.setState({
md:true
})
}else{
this.setState({
md:false
})
}
};
// readme文件内容
renderReadMeContent = (readMeContent, permission) => {
const { fileDetail, readMeFile } = this.state;
if (fileDetail && fileDetail.length !== 0) {
return;
}
if (readMeContent && readMeContent.length > 0) {
return (
<div className="commonBox">
<div className="commonBox-title">
<span className="mr10">
<i className="iconfont icon-wenjian1 font-16 color-grey-9 fl mt3"></i>
</span>
<span className="commonBox-title-read">
{readMeContent[0].name}
</span>
{permission ?
<a
onClick={() => this.ChangeFile(readMeFile[0], false)}
className="ml20 pull-right"
>
<i className="iconfont icon-bianji6 font-16 color-blue"></i>
</a>
:
""
}
</div>
<div className="commonBox-info">
{readMeContent[0].content ?
<RenderHtml className="break_word_comments imageLayerParent" value={readMeContent[0].content} url={this.props.history.location}/>
:
<span>暂无~</span>
}
</div>
</div>
);
}
};
// 选择分支
changeBranch = (value) => {
const { projectsId , owner } = this.props.match.params;
const { treeValue } = this.state;
let url = `/projects/${owner}/${projectsId}${value && `/tree/${value}`}${treeValue ? `/${treeValue}`:""}`;
this.props.history.push(url);
}
// 子目录路径返回链接
returnUlr=(url)=>{
this.setState({
chooseType:"dir",
readOnly:true,
treeValue:url
})
const { projectsId , owner , branchName } = this.props.match.params;
this.props.history.push(`/projects/${owner}/${projectsId}/tree${branchName?`/${branchName}`:""}/${url}`);
}
onEdit=(readOnly)=>{
this.setState({
readOnly
})
}
downloadUrl = (zip_url,tar_url) => {
return(
<Menu>
{zip_url && (
<Menu.Item>
<a href={zip_url}>ZIP</a>
</Menu.Item>
)}
{tar_url && (
<Menu.Item>
<a href={tar_url}>TAR.GZ</a>
</Menu.Item>
)}
</Menu>
)
}
title = (branchLastCommit,lastCommitAuthor) => {
if (branchLastCommit) {
const { projectsId , owner } = this.props.match.params;
return (
<div className="f-wrap-alignCenter">
{lastCommitAuthor ? (
<React.Fragment>
{lastCommitAuthor.login ? (
<Link
to={`/users/${lastCommitAuthor.login}/projects`}
className="show-user-link"
>
<img
src={getImageUrl(`images/${lastCommitAuthor.image_url}`)}
className="radius mr10"
width="32"
height="32"
alt=""
/>
<span className="mr15">{lastCommitAuthor.name}</span>
</Link>
) : (
<span className="mr15">{lastCommitAuthor.name}</span>
)}
</React.Fragment>
) : (
""
)}
<Link to={`/projects/${owner}/${projectsId}/commits/${truncateCommitId(`${branchLastCommit.sha}`)}`} className="color-blue flex-1 hide-1">
{branchLastCommit.message}
</Link>
<span>{branchLastCommit.time_from_now}</span>
<Link to={`/projects/${owner}/${projectsId}/commits/${truncateCommitId(`${branchLastCommit.sha}`)}`} className="commitKey">
{truncateCommitId(branchLastCommit.sha)}
</Link>
</div>
);
}else{
return false;
}
}
render(){
const { branchLastCommit , lastCommitAuthor , rootList ,filePath , fileDetail , subFileType , readMeContent, isSpin , zip_url , tar_url , branchList} = this.state;
const { isManager , isDeveloper , projectDetail , platform , defaultBranch } = this.props;
const { projectsId , owner , branchName } = this.props.match.params;
let branch = branchName || defaultBranch;
const columns = [
{
key:"name",
dataIndex: 'name',
width:"30%",
render: (text,item) => (
<a onClick={()=>this.goToSubRoot(item.path,item.type,text)} className="ml12 task-hide" style={{ display: "block", maxWidth: "345px" }}>
<i className={ item.type === "file" ? "iconfont icon-wenjia font-15 color-green-file mr5" : "iconfont icon-wenjianjia1 color-green-file font-15 mr5"}></i>{text}
</a>
),
},
{
key:"message",
dataIndex: "message",
width: "60%",
render: (text, item) =>
item.commit && item.commit.message ?
<Link to={`/projects/${owner}/${projectsId}/commits/${truncateCommitId(`${item.commit.sha}`)}`} title={item.commit.message} className="task-hide" style={{ display: "block", maxWidth: "670px" }} >
{item.commit.message}
</Link>
: ""
},
{
key:"time_from_now",
dataIndex: "time_from_now",
width: "10%",
className: "edu-txt-right",
render: (text, item) =>
item.commit && item.commit.time_from_now ?
<a title={item.commit.created_at} className="mr12" style={{ cursor: "default", color: "#888" }} >
{item.commit.time_from_now}
</a>
:""
},
];
const urlRoot = filePath === undefined ? "" : `/${filePath}`;
let array = filePath && filePath.split("/");
return (
<Spin spinning={isSpin}>
<div className="main" style={{minHeight:'400px'}}>
<div className="f-wrap-between mb20">
<div className="f-wrap-alignCenter">
{
platform ?
<SelectBranch
repo_id={projectDetail && projectDetail.repo_id}
projectsId={projectsId}
branch={branch}
changeBranch={this.changeBranch}
owner={owner}
history={this.props.history}
branchList={branchList}
></SelectBranch>
:
<span>分支：<span className="color-grey-6">master</span></span>
}
{filePath && (
<span className="ml20 font-16">
<a
onClick={() => this.returnMain(branch)}
className="color-blue"
>
{projectDetail && projectDetail.identifier}
</a>
{array &&
array.map((item, key) => {
return (
<React.Fragment>
{
key === array.length-1 ?
<span className="color-grey-6 subFileName" key={key}>{item}</span>
:
<a onClick={()=>this.returnUlr(`${getPathUrl(array,key+1)}`)} className="color-blue subFileName">{item}</a>
}
</React.Fragment>
);
})}
</span>
)}
</div>
<div className="f-wrap-alignCenter">
{subFileType && (projectDetail && parseInt(projectDetail.type)) !== 2 && (isManager || isDeveloper) && platform && (
<div>
<span>
<Link to={`/projects/${owner}/${projectsId}/${branch}/uploadfile${urlRoot}`} >
<span className="color-green mr30">上传文件</span>
</Link>
</span>
<span className="mr30">
<Link
to={`/projects/${owner}/${projectsId}/${branch}/newfile${urlRoot}`}
>
<span className="color-blue">新建文件</span>
</Link>
</span>
</div>
)}
{projectDetail && projectDetail.clone_url && (
<CloneAddress
http_url={projectDetail.clone_url}
downloadUrl={this.downloadUrl(zip_url,tar_url)}
showNotification={this.props.showNotification}
></CloneAddress>
)}
</div>
</div>
{/* 主目录列表 */}
{rootList && rootList.length > 0 && (
<RootTable
columns={columns}
data={rootList}
title={() => this.title(branchLastCommit,lastCommitAuthor)}
></RootTable>
)}
{/* 子目录列表、文件 */}
{fileDetail && fileDetail.length > 0 && (
<CoderRootFileDetail
detail={fileDetail[0]}
{...this.props}
{...this.state}
readOnly={this.state.readOnly}
onEdit={this.onEdit}
currentBranch={branch}
></CoderRootFileDetail>
)}
{
(rootList && rootList.length === 0) && (fileDetail && fileDetail.length === 0) && <Nodata _html="暂未发现文件！"/>
}
{ rootList && this.renderReadMeContent(readMeContent, isManager || isDeveloper)}
</div>
</Spin>
);
}
}
export default CoderRootDirectory;

4
src/forge/Main/CoderRootIndex.js
View File

@ -13,10 +13,6 @@ const UploadFile = Loadable({
loader: () => import('../Newfile/upload_file'),
loading: Loading,
})
const CoderRootDirectory = Loadable({
loader: () => import('./CoderRootDirectory'),
loading: Loading,
})
const CoderRootCommit = Loadable({
loader: () => import('./CoderRootCommit'),
loading: Loading,

12
src/forge/Main/Detail.js
View File

@ -120,6 +120,10 @@ const DevAbout = Loadable({
loader: () => import('../About/Index'),
loading: Loading,
})
const Source = Loadable({
loader: () => import('../Source/Index'),
loading: Loading,
})
const DevIndex = Loadable({
loader: () => import('../DevOps/Index'),
loading: Loading,
@ -145,6 +149,8 @@ function checkPathname(projectsId,owner,pathname){
name="setting"
}else if(url.indexOf(`/devops`)>-1){
name="devops"
}else if(url.indexOf(`/source`)>-1){
name="source"
}
}
return name;
@ -532,6 +538,12 @@ class Detail extends Component {
:
<Spin spinning={secondSync} className="spinstyle" tip="正在同步镜像" size="large">
<Switch {...this.props}>
{/* 资源 */}
<Route path="/projects/:owner/:projectsId/source"
render={
() => (<Source {...this.props} {...this.state} {...common} />)
}
></Route>
{/* 主页 */}
<Route path="/projects/:owner/:projectsId/about"
render={

22
src/forge/Main/Index.scss
View File

@ -83,10 +83,10 @@
}
.addOptionBtn{
height: 32px;
line-height: 32px;
line-height: 30px;
display: flex;
border:1px solid #d9d9d9;
border-radius: 4px;
border-radius: 2px;
a{
padding:0px 13px;
color: rgba(0, 0, 0, 0.65);
@ -254,20 +254,30 @@
.drawerBtn{
position: fixed;
left: -13px;
border:1px solid #d9d9d9;
border:1px solid rgb(207,205,223);
width: 34px;
border-radius: 0px 12px 12px 0px;
text-align: right;
height: 70px;
line-height: 70px;
top:50%;
margin-top: -35px;
cursor: pointer;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
&:hover{
box-shadow: 1px 0px 7px rgba(0,0,0,0.1);
}
span{
writing-mode: vertical-lr;
color: #202429;
width: 25px;
}
i{
color: #d9d9d9;
color: #24292e;
height: 18px;
line-height: 18px;
width: 18px;
}
}
.downMenu{

1
src/forge/Main/list.css
View File

@ -670,6 +670,7 @@ a.color-grey-ccc:hover{
.commitList{
padding:0px 30px;
min-height: 400px;
}
.commitList > div{
border-bottom: 1px solid #EEEEEE;

10
src/forge/Main/sub/DetailBanner.jsx
View File

@ -66,6 +66,16 @@ function DetailBanner({ list , owner , projectsId , isManager , url , pathname ,
</li>
:""
}
{
item.menu_name === "source" &&
<li className={pathname==="source" ? "active" : ""}>
<Link to={{ pathname: `/projects/${owner}/${projectsId}/source`, state }}>
<i className={pathname==="source" ? "iconfont icon-ziyuanpaihanghetuijian color-grey-3 mr5 font-14":"iconfont icon-ziyuanpaihanghetuijian color-grey-6 font-14 mr5"}></i>
<span>资源库</span>
{projectDetail && projectDetail.source_count ? <span className="num">{projectDetail.source_count}</span> :""}
</Link>
</li>
}
{
item.menu_name === "versions" &&
<li className={pathname==="milestones" ? "active" : ""}>

2
src/forge/Settings/Collaborator.js
View File

@ -11,7 +11,7 @@ function Collaborator(props){
const [ newGroupId , setNewGroupId] = useState(undefined);
const {projectsId ,owner} = props.match.params;
const author = props.projectDetail && props.projectDetail.author;
const author = props && props.projectDetail && props.projectDetail.author;
function getID(id){
setNewId(id);

17
src/forge/Source/Index.jsx Normal file
View File

@ -0,0 +1,17 @@
import React from 'react';
import './Index.scss';
import { Blueback , FlexAJ } from '../Component/layout';
function Index(props){
return(
<div className="sourcePanel">
<div className="headtitle">
<FlexAJ>
<span className="font-18">资源库</span>
<Blueback>上传资源</Blueback>
</FlexAJ>
</div>
</div>
)
}
export default Index;

11
src/forge/Source/Index.scss Normal file
View File

@ -0,0 +1,11 @@
.sourcePanel{
width: 1200px;
margin: 20px auto;
background: #fff;
border-radius: 2px;
box-shadow: 0px 0px 4px rgba(0,0,0,0.1);
.headtitle{
padding:15px 20px;
border-bottom: 1px solid #eee;
}
}