删除文件接口

dev_forge
caicai8 5 years ago
parent 947cb4302d
commit ba8244006a

@ -1,6 +1,6 @@
import React , { Component } from 'react'; import React , { Component } from 'react';
import { Menu } from 'antd'; import { Menu } from 'antd';
import { getImageUrl } from 'educoder'; import { getImageUrl , markdownToHTML } from 'educoder';
import { Router , Route , Link } from 'react-router-dom'; import { Router , Route , Link } from 'react-router-dom';
@ -17,6 +17,8 @@ import axios from 'axios';
* branch:当前分支 * branch:当前分支
* filePath:点击目录时当前目录的路径 * filePath:点击目录时当前目录的路径
* subfileType:保存当前点击目录的文件类型显示目录列表时才显示新建文件如果点击的是文件就不显示新建文件按钮 * subfileType:保存当前点击目录的文件类型显示目录列表时才显示新建文件如果点击的是文件就不显示新建文件按钮
* readMeContent:根目录下面的readme文件内容
* current_path:当前文件路径
*/ */
class CoderRootDirectory extends Component{ class CoderRootDirectory extends Component{
constructor(props){ constructor(props){
@ -27,6 +29,8 @@ class CoderRootDirectory extends Component{
filePath:[], filePath:[],
http_url:undefined, http_url:undefined,
subFileType:"", subFileType:"",
readMeContent:undefined,
current_path:undefined,
branchList:undefined, branchList:undefined,
fileDetail:undefined, fileDetail:undefined,
@ -68,7 +72,8 @@ class CoderRootDirectory extends Component{
this.renderUrl(arr.name,arr.path,arr.type); this.renderUrl(arr.name,arr.path,arr.type);
this.getFileDetail(arr); this.getFileDetail(arr);
this.setState({ this.setState({
subFileType:arr.type subFileType:arr.type,
current_path:arr.path
}) })
} }
@ -133,17 +138,43 @@ class CoderRootDirectory extends Component{
renderData=(data)=>{ renderData=(data)=>{
const rootList = []; const rootList = [];
const readMeContent = [];
data && data.map((item,key)=>{ data && data.map((item,key)=>{
rootList.push({ rootList.push({
key, key,
...item ...item
}) })
if(item.name === 'README.md'){
readMeContent.push({...item})
}
}) })
this.setState({ this.setState({
rootList:rootList rootList:rootList,
readMeContent
}) })
} }
// readme文件内容
renderReadMeContent=(readMeContent)=>{
const { fileDetail } = this.state;
if(fileDetail){return;}
if(readMeContent && readMeContent.length > 0){
return(
<div className="commonBox">
<div className="commonBox-title">{readMeContent[0].name}</div>
<div className="commonBox-info">
{
readMeContent[0].content ?
<div className={"markdown-body"} dangerouslySetInnerHTML={{__html: markdownToHTML(readMeContent[0].content).replace(/▁/g, "▁▁▁")}}></div>
:
<span>暂无~</span>
}
</div>
</div>
)
}
}
// 选择分支 // 选择分支
changeBranch=(value)=>{ changeBranch=(value)=>{
const { branchList } = this.props; const { branchList } = this.props;
@ -158,7 +189,7 @@ class CoderRootDirectory extends Component{
}) })
} }
render(){ render(){
const { rootList , branch ,filePath , fileDetail , subFileType } = this.state; const { rootList , branch ,filePath , fileDetail , subFileType , readMeContent , current_path } = this.state;
const { branchLastCommit , http_url , isManager , isDeveloper } = this.props; const { branchLastCommit , http_url , isManager , isDeveloper } = this.props;
const { projectsId } = this.props.match.params; const { projectsId } = this.props.match.params;
@ -256,8 +287,11 @@ class CoderRootDirectory extends Component{
{ {
fileDetail && fileDetail &&
<CoderRootFileDetail detail = {fileDetail}></CoderRootFileDetail> <CoderRootFileDetail detail = {fileDetail} current_path={current_path} {...this.props} {...this.state}></CoderRootFileDetail>
} }
{/* readme.txt */}
{ this.renderReadMeContent(readMeContent) }
</div> </div>
) )

@ -1,9 +1,11 @@
import React , { Component } from "react"; import React , { Component } from "react";
import Editor from "react-monaco-editor"; import Editor from "react-monaco-editor";
import { Popconfirm } from 'antd'; import { Popconfirm, Result } from 'antd';
import './list.css'; import './list.css';
import axios from 'axios';
function bytesToSize(bytes) { function bytesToSize(bytes) {
if (bytes === 0) return '0 B'; if (bytes === 0) return '0 B';
let k = 1024, let k = 1024,
@ -24,9 +26,29 @@ class CoderRootFileDetail extends Component{
readOnly:false readOnly:false
}) })
} }
CancelEdit=()=>{
this.setState({
readOnly:true
})
}
deleteFile=()=>{
const { current_path , current_user , branch}= this.props;
const { projectsId } = this.props.match.params;
detail=()=>{ const url = `/api/${current_user.login}/${projectsId}/contents/files/delete.json`;
axios.delete(url,{
params:{
filepath:current_path,
branch
}
}).then(result=>{
if(result){
}
}).catch(error=>{
console.log(error);
})
} }
render(){ render(){
@ -38,8 +60,17 @@ class CoderRootFileDetail extends Component{
<p className="branchTitle f-wrap-alignCenter f-wrap-between"> <p className="branchTitle f-wrap-alignCenter f-wrap-between">
<span>{bytesToSize(detail && detail.size)}</span> <span>{bytesToSize(detail && detail.size)}</span>
<span> <span>
<a onClick={this.EditFile} className="ml20"><i className="iconfont icon-bianji font-15 color-grey-6"></i></a> {
<Popconfirm title="确认删除这个文件?" className="ml20" okText="确定" cancelText="取消" onConfirm={this.detail}> readOnly ?
<a onClick={this.EditFile} className="ml20"><i className="iconfont icon-bianji font-15 color-grey-6"></i></a>
:
<React.Fragment>
<button type="button" class="ant-btn ant-btn-sm mr10" onClick={this.CancelEdit}><span> </span></button>
<button type="button" class="ant-btn ant-btn-primary ant-btn-sm"><span> </span></button>
</React.Fragment>
}
<Popconfirm title="确认删除这个文件?" className="ml20" okText="确定" cancelText="取消" onConfirm={this.deleteFile}>
<a><i className="iconfont icon-shanchu font-15 color-grey-6"></i></a> <a><i className="iconfont icon-shanchu font-15 color-grey-6"></i></a>
</Popconfirm> </Popconfirm>
</span> </span>

@ -413,6 +413,20 @@ body,#root{
max-width: 100%; max-width: 100%;
} }
} }
.commonBox{
border:1px solid #f4f4f4;
border-radius: 4px;
margin-top: 25px;
}
.commonBox .commonBox-title{
padding:10px 15px;
box-sizing: border-box;
font-size: 18px;
background: #f0f0f0;
}
.commonBox .commonBox-info{
padding:20px 15px;
}
@media screen and (max-width: 370px){ @media screen and (max-width: 370px){
.p-r-tags,.p-r-btn{ .p-r-tags,.p-r-btn{

Loading…
Cancel
Save