From ba8244006a945447e4a5e2cfd767c94fe428fe0f Mon Sep 17 00:00:00 2001
From: caicai8 <1149225589@qq.com>
Date: Fri, 7 Feb 2020 13:05:07 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=96=87=E4=BB=B6=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/forge/Main/CoderRootDirectory.js      | 44 ++++++++++++++++---
 .../src/forge/Main/CoderRootFileDetail.js     | 39 ++++++++++++++--
 public/react/src/forge/Main/list.css          | 14 ++++++
 3 files changed, 88 insertions(+), 9 deletions(-)

diff --git a/public/react/src/forge/Main/CoderRootDirectory.js b/public/react/src/forge/Main/CoderRootDirectory.js
index 80a12f257..1f37811a7 100644
--- a/public/react/src/forge/Main/CoderRootDirectory.js
+++ b/public/react/src/forge/Main/CoderRootDirectory.js
@@ -1,6 +1,6 @@
 import React , { Component } from 'react';
 import { Menu } from 'antd';
-import { getImageUrl } from 'educoder';
+import { getImageUrl , markdownToHTML } from 'educoder';
 import { Router , Route , Link } from 'react-router-dom';
 
 
@@ -17,6 +17,8 @@ import axios from 'axios';
  * branch:当前分支
  * filePath:点击目录时当前目录的路径
  * subfileType:保存当前点击目录的文件类型（显示目录列表时才显示新建文件，如果点击的是文件就不显示新建文件按钮）
+ * readMeContent:根目录下面的readme文件内容
+ * current_path:当前文件路径
  */
 class CoderRootDirectory extends Component{
   constructor(props){
@@ -27,6 +29,8 @@ class CoderRootDirectory extends Component{
       filePath:[],
       http_url:undefined,
       subFileType:"",
+      readMeContent:undefined,
+      current_path:undefined,
 
       branchList:undefined,
       fileDetail:undefined,
@@ -68,7 +72,8 @@ class CoderRootDirectory extends Component{
     this.renderUrl(arr.name,arr.path,arr.type);
     this.getFileDetail(arr);
     this.setState({
-      subFileType:arr.type
+      subFileType:arr.type,
+      current_path:arr.path
     })
   }
 
@@ -133,17 +138,43 @@ class CoderRootDirectory extends Component{
 
   renderData=(data)=>{
     const rootList = [];
+    const readMeContent = [];
     data && data.map((item,key)=>{
       rootList.push({
         key,
         ...item
       })
+      if(item.name === 'README.md'){
+        readMeContent.push({...item})
+      }
     })
     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)=>{
     const { branchList } = this.props;
@@ -158,7 +189,7 @@ class CoderRootDirectory extends Component{
     })
   }
   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 { projectsId } = this.props.match.params;
@@ -256,8 +287,11 @@ class CoderRootDirectory extends Component{
 
         {
           fileDetail &&
-            <CoderRootFileDetail detail = {fileDetail}></CoderRootFileDetail>
+            <CoderRootFileDetail detail = {fileDetail} current_path={current_path} {...this.props} {...this.state}></CoderRootFileDetail>
         }
+
+        {/* readme.txt */}
+        { this.renderReadMeContent(readMeContent) }
         
       </div>
     )
diff --git a/public/react/src/forge/Main/CoderRootFileDetail.js b/public/react/src/forge/Main/CoderRootFileDetail.js
index c502396fc..666d3d15a 100644
--- a/public/react/src/forge/Main/CoderRootFileDetail.js
+++ b/public/react/src/forge/Main/CoderRootFileDetail.js
@@ -1,9 +1,11 @@
 import React , { Component } from "react";
 import Editor from "react-monaco-editor";
 
-import { Popconfirm } from 'antd';
+import { Popconfirm, Result } from 'antd';
 
 import './list.css';
+
+import axios from 'axios';
 function bytesToSize(bytes) {
   if (bytes === 0) return '0 B';
   let k = 1024,
@@ -24,9 +26,29 @@ class CoderRootFileDetail extends Component{
       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(){
@@ -38,8 +60,17 @@ class CoderRootFileDetail extends Component{
         <p className="branchTitle f-wrap-alignCenter f-wrap-between">
           <span>{bytesToSize(detail && detail.size)}</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>
             </Popconfirm>
           </span>
diff --git a/public/react/src/forge/Main/list.css b/public/react/src/forge/Main/list.css
index dbf75010a..bee986050 100644
--- a/public/react/src/forge/Main/list.css
+++ b/public/react/src/forge/Main/list.css
@@ -413,6 +413,20 @@ body,#root{
     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){
   .p-r-tags,.p-r-btn{