This commit is contained in:
caishi 2021-05-06 10:14:06 +08:00
parent 03370e8a07
commit d49af735f1
1 changed files with 47 additions and 20 deletions

View File

@ -1,6 +1,6 @@
import React , { useEffect , useState } from 'react'; import React , { useEffect , useState } from 'react';
import { WhiteBack , Box , LongWidth , ShortWidth , Gap , AlignCenter , FlexAJ } from '../Component/layout'; 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 { getImageUrl } from "educoder";
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import CloneAddress from '../Branch/CloneAddress'; import CloneAddress from '../Branch/CloneAddress';
@ -20,7 +20,9 @@ import DrawerPanel from '../Component/DrawerPanel';
import UpdateDescModal from './sub/UpdateDescModal'; import UpdateDescModal from './sub/UpdateDescModal';
import Nodata from '../Nodata'; import Nodata from '../Nodata';
/**
* projectDetail.type:0是托管项目1是镜像项目2是同步镜像项目(为2时不支持在线创建在线上传在线修改在线删除创建合并请求等功能)
*/
function CoderDepot(props){ function CoderDepot(props){
const [ projectDetail , setProjectDetail ]= useState(undefined); const [ projectDetail , setProjectDetail ]= useState(undefined);
const [ treeValue , setTreeValue ] = useState(undefined); const [ treeValue , setTreeValue ] = useState(undefined);
@ -42,17 +44,18 @@ function CoderDepot(props){
const [ openModal , setOpenModal ] = useState(false); const [ openModal , setOpenModal ] = useState(false);
const [ desc , setDesc ] = useState(undefined); const [ desc , setDesc ] = useState(undefined);
const [ website , setWebsite ] = useState(undefined); const [ website , setWebsite ] = useState(undefined);
const [ lesson_url , setLessonUrl ] = useState(undefined);
const owner = props.match.params.owner; const owner = props.match.params.owner;
const projectsId = props.match.params.projectsId; const projectsId = props.match.params.projectsId;
const branchName = props.match.params.branchName; const branchName = props.match.params.branchName;
let pathname = props.history.location.pathname; let pathname = props.history.location.pathname;
useEffect(()=>{ useEffect(()=>{
if(props.projectDetail){ if(props.projectDetail){
setProjectDetail(props.projectDetail); setProjectDetail(props.projectDetail);
setDesc(props.projectDetail.description); setDesc(props.projectDetail.description);
setWebsite(props.projectDetail.website); setWebsite(props.projectDetail.website);
setLessonUrl(props.projectDetail.lesson_url);
} }
},[props]) },[props])
@ -65,17 +68,17 @@ function CoderDepot(props){
},[treeValue]) },[treeValue])
useEffect(()=>{ useEffect(()=>{
if (pathname){ if (pathname && projectDetail){
if(pathname.indexOf(`/projects/${owner}/${projectsId}`) > -1 && pathname.indexOf(`/tree/${branchName}/`) > -1) { if(pathname.indexOf(`/projects/${owner}/${projectsId}`) > -1 && pathname.indexOf(`/tree/${branchName}/`) > -1) {
let url = pathname.split(`/tree/${branchName}/`)[1]; let url = pathname.split(`/tree/${branchName}/`)[1];
setTreeValue(url); setTreeValue(url);
getFileInfo(url,branchName); getFileInfo(url,branchName);
}else{ }else{
setTreeValue(undefined); setTreeValue(undefined);
getDirInfo(branchName ||(projectDetail && projectDetail.default_branch)); getDirInfo(branchName ||projectDetail.default_branch);
} }
} }
},[pathname]) },[pathname,projectDetail])
// //
function getDirInfo(branch){ function getDirInfo(branch){
@ -92,7 +95,7 @@ function CoderDepot(props){
setZip_url(result.data.zip_url); setZip_url(result.data.zip_url);
let c = result.data.last_commit let c = result.data.last_commit
setLastCommit(c && c.commit); setLastCommit(c && c.commit);
setLastCommitAuthor(c && (c.author || (c.commit && c.commit.author))); setLastCommitAuthor(c && c.committer);
setMainFlag(true); setMainFlag(true);
setReadOnly(true); setReadOnly(true);
} }
@ -134,7 +137,7 @@ function CoderDepot(props){
} }
let c = result.data.last_commit let c = result.data.last_commit
setLastCommit(c && c.commit); setLastCommit(c && c.commit);
setLastCommitAuthor(c && (c.author || (c.commit && c.commit.author))); setLastCommitAuthor(c && c.committer);
setMainFlag(false); setMainFlag(false);
setReadOnly(true); setReadOnly(true);
} }
@ -216,14 +219,16 @@ function CoderDepot(props){
</Menu> </Menu>
</div> </div>
) )
function okUpdate(d,w){ // website
function okUpdate(d,w,l){
const url = `/${owner}/${projectsId}.json`; const url = `/${owner}/${projectsId}.json`;
axios.put(url,{ axios.put(url,{
description:d,website:w description:d,website:w,lesson_url:l
}).then(result=>{ }).then(result=>{
if(result && result.data && result.data.id){ if(result && result.data && result.data.id){
setDesc(result.data.description); setDesc(result.data.description);
setWebsite(result.data.website); setWebsite(result.data.website);
setLessonUrl(result.data.lesson_url);
} }
}) })
} }
@ -233,7 +238,7 @@ function CoderDepot(props){
return( return(
<WhiteBack> <WhiteBack>
<UpdateDescModal desc={desc} website={website} visible={openModal} onCancel={()=>setOpenModal(false)} onOk={okUpdate}/> <UpdateDescModal desc={desc} website={website} lesson_url={lesson_url} visible={openModal} onCancel={()=>setOpenModal(false)} onOk={okUpdate}/>
<Spin spinning={isSpin}> <Spin spinning={isSpin}>
{ {
(dirInfo || fileInfo) && (dirInfo || fileInfo) &&
@ -248,7 +253,10 @@ function CoderDepot(props){
onClose={()=>setVisible(false)} onClose={()=>setVisible(false)}
list = {mainFlag ? dirInfo : undefined} 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> </React.Fragment>
} }
<div style={{minHeight:"500px"}}> <div style={{minHeight:"500px"}}>
@ -290,11 +298,21 @@ function CoderDepot(props){
</AlignCenter> </AlignCenter>
<AlignCenter> <AlignCenter>
<div className="mr20 addOptionBtn"> <div className="mr20 addOptionBtn">
<a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/pulls/new`)} >+ 合并请求</a> {
projectDetail.type !== 2 &&
<a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/pulls/new`)} >+ 合并请求</a>
}
<a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/issues/new`)} >+ 任务</a> <a onClick={()=>urlLink(`/projects/${owner}/${projectsId}/issues/new`)} >+ 任务</a>
</div> </div>
{ type === "dir" && <Dropdown.Button overlay={fileMenu} className="mr20">文件</Dropdown.Button>} { type === "dir" && projectDetail.type !== 2 &&
<Dropdown.Button overlay={downloadMenu} type={'primary'}>下载</Dropdown.Button> <Dropdown overlay={fileMenu} className="mr20" trigger={['click']}>
<Button type="default">文件 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-grey-9"></i></Button>
</Dropdown>
}
<Dropdown overlay={downloadMenu} placement="bottomRight" trigger={['click']}>
<Button type={'primary'}>下载 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-white"></i></Button>
</Dropdown>
</AlignCenter> </AlignCenter>
</FlexAJ> </FlexAJ>
{ {
@ -303,8 +321,8 @@ function CoderDepot(props){
{ {
lastCommit && lastCommit &&
<div className="listtablehead"> <div className="listtablehead">
<User url={getImageUrl(`/${lastCommitAuthor && lastCommitAuthor.image_url}`)} name={lastCommitAuthor && lastCommitAuthor.name} /> <User url={getImageUrl(`/${lastCommitAuthor && lastCommitAuthor.image_url}`)} name={lastCommitAuthor && lastCommitAuthor.name} id={lastCommitAuthor && lastCommitAuthor.id} login={lastCommitAuthor && lastCommitAuthor.login}/>
<div className={hideBtn && hide ? "ellipsistxt hide" :"ellipsistxt"}><p id="ptxt">{lastCommit && lastCommit.message}</p></div> <div className={hideBtn && hide ? "ellipsistxt hide" :"ellipsistxt"}><pre id="ptxt">{lastCommit && lastCommit.message}</pre></div>
{ hideBtn && <span className="ellipsis" onClick={()=>changeHide(hide)}><i className="iconfont icon-shenglvehao"></i></span> } { hideBtn && <span className="ellipsis" onClick={()=>changeHide(hide)}><i className="iconfont icon-shenglvehao"></i></span> }
<span className="ml12 color-grey-9 mt3">{lastCommit && lastCommit.time_from_now}</span> <span className="ml12 color-grey-9 mt3">{lastCommit && lastCommit.time_from_now}</span>
@ -344,6 +362,7 @@ function CoderDepot(props){
md={mdFlag} md={mdFlag}
onEdit={onEdit} onEdit={onEdit}
currentBranch={branchName || (projectDetail && projectDetail.default_branch)} currentBranch={branchName || (projectDetail && projectDetail.default_branch)}
type={projectDetail.type}
></CoderRootFileDetail> ></CoderRootFileDetail>
} }
</ul> </ul>
@ -354,7 +373,7 @@ function CoderDepot(props){
(dirInfo && dirInfo.length === 0) && (fileInfo && fileInfo.length === 0) ? <Nodata _html="暂未发现文件"/> :"" (dirInfo && dirInfo.length === 0) && (fileInfo && fileInfo.length === 0) ? <Nodata _html="暂未发现文件"/> :""
} }
{/* readme文件显示(显示文件详情时不显示readme文件) */} {/* readme文件显示(显示文件详情时不显示readme文件) */}
{ dirInfo && (projectDetail && projectDetail.readme) ? <ReadMe ChangeFile={ChangeFile} readme={projectDetail && projectDetail.readme} operate={props && (props.isManager || props.isDeveloper)} history={props.history} /> :"" } { dirInfo && (projectDetail && projectDetail.readme) ? <ReadMe ChangeFile={ChangeFile} readme={projectDetail && projectDetail.readme} operate={props && (props.isManager || props.isDeveloper) && projectDetail.type !==2 } history={props.history} /> :"" }
</div> </div>
</LongWidth> </LongWidth>
{ {
@ -365,12 +384,12 @@ function CoderDepot(props){
<FlexAJ className="font-18 color-grey-6 mb20" style={{lineHeight:"28px"}}>简介 <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>} {projectDetail.permission && (projectDetail.permission==="Admin" || projectDetail.permission==="Owner") && <i onClick={()=>setOpenModal(true)} className="iconfont icon-anquanshezhi color-grey-9 font-15"></i>}
</FlexAJ> </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 && website &&
<p className="color-grey-6 df"> <p className="color-grey-6 df">
<i className="iconfont icon-lianjie2 font-15 mr10 color-grey-9"></i> <i className="iconfont icon-lianjie2 font-15 mr10 color-grey-9"></i>
<span style={{wordBreak:"break-all",lineHeight:"20px",marginTop:"5px"}}>{website}</span> <a href={website} target="_blank" style={{wordBreak:"break-all",lineHeight:"20px",marginTop:"5px",textDecoration:"underline"}}>{website}</a>
</p> </p>
} }
<p> <p>
@ -389,6 +408,14 @@ function CoderDepot(props){
</p> </p>
} }
</div> </div>
{
lesson_url &&
<div>
<Divider />
<p className="font-16 color-grey-6">实践课程</p>
<a href={lesson_url} target="_blank" className="color-grey-6" style={{textDecoration:"underline"}}>{lesson_url}</a>
</div>
}
{/* 发布 */} {/* 发布 */}
{ {
projectDetail && projectDetail.release_versions && projectDetail && projectDetail.release_versions &&