forked from Gitlink/forgeplus-react
86 lines
3.6 KiB
JavaScript
86 lines
3.6 KiB
JavaScript
import React ,{useEffect,useState } from 'react';
|
||
import { truncateCommitId } from '../common/util';
|
||
import { AlignCenter , FlexAJ } from '../Component/layout';
|
||
import { Button } from 'antd';
|
||
import './merge.css';
|
||
|
||
function Files({data,history,owner,projectsId}){
|
||
const [ files , setFiles ] = useState(data && data.files);
|
||
|
||
useEffect(()=>{
|
||
if(data){
|
||
setFiles(data.files);
|
||
}
|
||
},[data])
|
||
|
||
function showDown(flag,index,isBin){
|
||
if(!isBin){
|
||
var lists = files.concat();
|
||
lists[index].flag = !flag ? true : false;
|
||
lists.splice();
|
||
setFiles(lists);
|
||
}
|
||
}
|
||
|
||
return(
|
||
<div>
|
||
<AlignCenter className="color-grey-9 pb10" style={{borderBottom:"1px solid #eee"}}>
|
||
<i className="iconfont icon-sanjiaoxing-down mr5"></i>
|
||
<span>
|
||
共有<span className="color-grey-3"> {data && data.files_count} 个文件被更改</span>，包括
|
||
{ data && data.total_addition ? <span className="color-green"> {data && data.total_addition} 次插入</span>:"" }
|
||
{ data && data.total_addition && data.total_deletion ? " 和 ":""}
|
||
{ data && data.total_deletion ? <span className="color-red"> {data && data.total_deletion} 次删除</span>:""}
|
||
</span>
|
||
</AlignCenter>
|
||
{
|
||
files && files.length>0 &&
|
||
<div>
|
||
{
|
||
files.map((item,key)=>{
|
||
return(
|
||
<div className="files" key={key}>
|
||
<FlexAJ className="filesInfo" style={{cursor:item.isBin ? "default":"pointer"}} onClick={()=>showDown(item.flag,key,item.isBin)}>
|
||
<AlignCenter>
|
||
{!item.isBin ? <i className={!item.flag?"iconfont icon-xiajiantou font-16 mr15 color-grey-9":"iconfont icon-youjiantou font-16 mr15 color-grey-9"}></i>:""}
|
||
<i className="iconfont icon-wenjia font-16 mr8 color-grey-9"></i>
|
||
<span>{item.name}</span>
|
||
</AlignCenter>
|
||
<span>
|
||
<Button className="mr20" onClick={()=>{history.push(`/projects/${owner}/${projectsId}/tree/${truncateCommitId(item.sha)}/${item.name}`)}}>查看文件</Button>
|
||
<span className="color-green">+{item.addition}</span>
|
||
<span className="color-red ml20">-{item.deletion}</span>
|
||
</span>
|
||
</FlexAJ>
|
||
{
|
||
item.sections && item.sections.length >= 1 && !item.flag &&
|
||
<div className="filesContent">
|
||
{
|
||
item.sections.map((i,k)=>{
|
||
return(
|
||
i.lines && i.lines.length>0 && i.lines.map((item,key)=>{
|
||
return(
|
||
<div key={k+key} className={(item.type === 2) ? "linesContent add" : item.type === 3 ? "linesContent reduce": item.type===4?"linesContent translate":"linesContent"}>
|
||
<span className="lines">
|
||
<span>{item.leftIdx && item.leftIdx !=="0" ? item.leftIdx :"" }</span>
|
||
<span>{item.rightIdx && item.rightIdx !=="0" ? item.rightIdx :"" }</span>
|
||
</span>
|
||
<p>{item.content}</p>
|
||
</div>
|
||
)
|
||
})
|
||
)
|
||
})
|
||
}
|
||
</div>
|
||
}
|
||
</div>
|
||
)
|
||
})
|
||
}
|
||
</div>
|
||
}
|
||
</div>
|
||
)
|
||
}
|
||
export default Files; |