替换文件

src/forge/Main/CoderRootFileDetail.js

@@ -6,6 +6,8 @@ import Meditor from "../Newfile/m_editor";
 import RenderHtml from "../../components/render-html";
 import ReadmeCatelogue from "./sub/ReadmeCatelogue";
 import { Base64 } from "js-base64";
+import ReplaceModal from "./Modal/ReplaceModal";
+import {returnbar} from 'educoder';
 
 const $ = window.$;
 function bytesToSize(bytes) {
@@ -23,7 +25,8 @@ class CoderRootFileDetail extends Component {
       language: undefined,
       languages: undefined,
       description: props.detail.replace_content,
-      menuList:undefined
+      menuList:undefined,
+      replaceVisible:false
     };
   }
 
@@ -212,6 +215,43 @@ class CoderRootFileDetail extends Component {
     }
   }
 
+  //------------- 替换原始文件相关
+  showReplaceBox=()=>{
+    this.setState({
+      replaceVisible:true
+    })
+  }
+
+  replaceSure=(e)=>{
+    const { projectsId, owner , branchName } = this.props.match.params;
+    const { detail } = this.props;
+    const url = `/${owner}/${projectsId}/replace_file.json`;
+    const path = `/${detail.path && detail.path.replace(detail.name,"")}${e.fileName}`;
+    const msg = detail.commit && detail.commit.message;
+    const params={
+      filepath: returnbar(path.substr(1)),
+      base64_filepath:Base64.encode(returnbar(path.substr(1))),
+      branch: returnbar(branchName),
+      content:Base64.encode(e.fileContent),
+      message: msg,
+      delete_file:{
+        filepath: detail.path,
+        base64_filepath:Base64.encode(detail.path),
+        branch:branchName,
+        sha: detail.sha,
+      }
+    };
+    console.log(params,detail);
+    axios.post(url, {
+      ...params
+    }).then(result=>{
+      if(result){
+
+      }
+    }).catch(error=>{})
+  }
+
+
   render() {
     const {
       detail,
@@ -225,11 +265,16 @@ class CoderRootFileDetail extends Component {
     } = this.props;
     // 文件只读状态
     const readOnly = this.props.history.location.search.indexOf('edit') === -1
-    const { language, languages, description } = this.state;
+    const { language, languages, description , replaceVisible } = this.state;
     let flag = current_user && current_user.login && (isManager || isDeveloper);
     const Option = Select.Option;
     return (
       <React.Fragment>
+        <ReplaceModal 
+          visible={replaceVisible} 
+          onCancel={()=>{this.setState({replaceVisible:false})}}
+          onOk={this.replaceSure}
+        />
         <Anchor className="griditemAnchor" offsetTop={58}>
           <div className="griditemCate">
             {
@@ -318,10 +363,11 @@ class CoderRootFileDetail extends Component {
               <img alt="" src={detail.download_url} style={{ maxWidth: "80%" }} />
             </div>
           ) : detail.direct_download ? (
-            <div className="mt20 text-center">
+            <div className="pt10 text-center pb10">
               <a onClick={() => this.DownLoadFile(detail.download_url)} className="color-blue font-15">
                 下载原始文件
               </a>
+              <a onClick={this.showReplaceBox} className="color-blue font-15" style={{marginLeft:"120px"}}>替换原始文件</a>
             </div>
           ) : (
             md && readOnly ?

src/forge/Main/Index.scss

@@ -547,4 +547,8 @@
     line-height: 24px;
     color: $primary-color;
   }
+}
+
+.replaceStyle{
+  height: 140px!important;
 }

src/forge/Main/Modal/ReplaceModal.jsx

@@ -0,0 +1,44 @@
+import React , { useState } from 'react';
+import { Modal } from 'antd';
+import Upload from "../../Upload/read";
+import UploadImg from "../../Images/upload.png";
+import '../Index.scss';
+
+function ReplaceModal(props){
+  const { visible , onCancel , onOk } = props;
+  const [ content , setContent ] = useState(undefined);
+
+  function UploadFunc(e){
+    console.log(e);
+    setContent(e);
+  }
+  function onSure() {
+    onOk && onOk(content);
+  }
+  return(
+    <Modal 
+      title={"替换文件"}
+      width="500px"
+      visible={visible}
+      onCancel={onCancel}
+      onOk={onSure}
+    >
+      <Upload
+        className="replaceStyle"
+        load={UploadFunc}
+        icon={
+          <img
+            src={UploadImg}
+            width="58"
+            alt=""
+            style={{ marginBottom: 15 }}
+          />
+        }
+        size={1}
+        showNotification={props.showNotification}
+        {...props}
+      />
+    </Modal>
+  )
+}
+export default ReplaceModal;