案例提交保存-以及保存成功页

public/react/src/App.js

@@ -357,23 +357,19 @@ class App extends Component {
 							{/*课堂*/}
 							<Route path="/courses" component={CoursesIndex} {...this.props}></Route>
 
-<<<<<<< HEAD
 							{/* <Route path="/forums" component={ForumsIndexComponent}>
 							</Route> */}
 							{/* 教学案例 */}
 							<Route path="/moop_cases"render={
 									(props) => (<MoopCases {...this.props} {...props} {...this.state} />)
 							}/>
-=======
-
+							
 							<Route path="/forums" 
 								render={
 									(props)=>(<ForumsIndexComponent {...this.props} {...props} {...this.state}></ForumsIndexComponent>)
 								}
 							>
 							</Route>
-							
->>>>>>> dev_aliyun
 							<Route path="/comment" component={CommentComponent}/>
 							<Route path="/testMaterial" component={TestMaterialDesignComponent}/>
 							<Route path="/test" component={TestIndex}/>

public/react/src/modules/moop_cases/CaseDetail.js

@@ -47,7 +47,7 @@ class CaseDetail extends Component{
     let url =`/libraries/${caseID}.json`;
     axios.delete(url).then((result)=>{
       if(result){
-        this.props.showNotification("删除成功")
+        this.props.showNotification("删除成功");
         this.props.history.push("/moop_cases");
       }
     }).catch((error)=>{
@@ -82,7 +82,9 @@ class CaseDetail extends Component{
           </span>
           <span className="mt5 fl">
             <Tags tags={tags}></Tags>
-            <span class="edu-filter-btn fl cdefault edu-activity-green ml10">草稿</span>
+            {
+              CaseDetail && CaseDetail.status == "pending" && <span class="edu-filter-btn fl cdefault edu-activity-green ml10">草稿</span>
+            }
           </span> 
           <a href="/moop_cases" className="fr color-grey-9 mt5">返回</a>
         </p>
@@ -98,7 +100,7 @@ class CaseDetail extends Component{
                   }
                   
                   {
-                    operation && operation.can_editable ? <ActionBtn style="colorBlue" className="fr mr20">编辑</ActionBtn>:""
+                    operation && operation.can_editable ? <ActionBtn style="colorBlue" to={`/moop_cases/${this.props.match.params.caseID}/edit`} className="fr mr20">编辑</ActionBtn>:""
                   }
                 </li>
                 <li className="clearfix">

public/react/src/modules/moop_cases/CaseNew.js

@@ -9,7 +9,7 @@ import Tags from './CaseTags'
 
 import axios from 'axios';
 import TPMMDEditor from '../tpm/challengesnew/TPMMDEditor';
-
+import _ from 'lodash'
 const { Dragger } = Upload;
 function beforeUpload(file) {
   const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
@@ -34,9 +34,9 @@ class CaseNew extends Component{
     this.DescMdRef = React.createRef();
 
     this.state={
-      goldCases:false,
-      bankCases:false,
+      casesTags:[],
       contentFileList:[],
+      filesID:[],
       imageUrl:undefined,
       loading: false,
       checkTag:false,
@@ -88,6 +88,16 @@ class CaseNew extends Component{
   handleContentUploadChange = (info) => {
     let contentFileList = info.fileList;
     this.setState({ contentFileList: appendFileSizeToUploadFileAll(contentFileList)});
+    let list = appendFileSizeToUploadFileAll(contentFileList);
+    this.setState({
+      filesID:list.map(item=>{
+        return ( item.response && item.response.id )
+      })
+    })
+    console.log("fujian");
+    console.log(list.map(item=>{
+      return ( item.response && item.response.id )
+    }));
   }
 
   // 上传封面图-change
@@ -137,14 +147,10 @@ class CaseNew extends Component{
           }
         }),
         coverID:this.props.cover && this.props.cover.id,
-        imageUrl:this.props.CaseDetail.cover && getImageUrl(this.props.CaseDetail.cover.url)
-      })
-      this.props.tags.map((item)=>{
-        if(item.name=="入库案例"){
-          this.setState({bankCases:true})
-        }else{
-          this.setState({goldCases:true})
-        }
+        imageUrl:this.props.CaseDetail.cover && getImageUrl(this.props.CaseDetail.cover.url),
+        casesTags:this.props.tags.map(item=>{
+          return (item.id);
+        })
       })
     }
   }
@@ -156,44 +162,80 @@ class CaseNew extends Component{
 
   // 申请提交和保存
   handleSubmit = (type) => {
+    let caseID = this.props.match.params.caseID;
     console.log(type);    
     this.props.form.validateFieldsAndScroll((err, values) => {
-      let { goldCases , bankCases } = this.state;
-      if(!goldCases && !bankCases){
+      let { casesTags } = this.state;
+      if(casesTags.length == 0){
         $("html").animate({ scrollTop: $("#tagFormItem").offset().top - 100 });
         this.setState({
           checkTag:true
         })
         return;
       }
-      const mdContnet = this.DescMdRef.current.getValue().trim();
+      //const mdContnet = this.DescMdRef.current.getValue().trim();
       console.log(values);
-      let url=`/libraries/:id.json`;
-      // axios.put(())
+      let url = caseID ? `/libraries/${caseID}.json`: `/libraries.json`;
+      if(caseID){
+        axios.put((url),{
+          title:values.caseTitle,
+          author_name:values.userName,
+          author_school_name:values.userUnit,
+          content:values.description,
+          attachment_ids:this.state.filesID,
+          tag_ids:this.state.casesTags,
+          cover_id:this.state.coverID,
+          publish:type == 'save' ? false : true 
+        }).then((result)=>{
+          if(result){
+            this.props.showNotification(type == 'save' ? `案例保存成功！`: `提交成功！`);
+            this.props.history.push(type == 'save' ? `/moop_cases/${result.data.id}` : `/moop_cases/${result.data.id}/publish_success`);
+          }
+        }).catch((error)=>{
+          console.log(error);
+        })
+      }else{
+        axios.post((url),{
+          title:values.caseTitle,
+          author_name:values.userName,
+          author_school_name:values.userUnit,
+          content:values.description,
+          attachment_ids:this.state.filesID,
+          tag_ids:this.state.casesTags,
+          cover_id:this.state.coverID,
+          publish:type == 'save' ? false : true 
+        }).then((result)=>{
+          if(result){
+            this.props.showNotification(type == 'save' ? `案例保存成功！`: `提交成功！`);
+            this.props.history.push(type == 'save' ? `/moop_cases/${result.data.id}` : `/moop_cases/${result.data.id}/publish_success`);
+          }
+        }).catch((error)=>{
+          console.log(error);
+        })
+      }
+      
     })
   }
 
   // 选择标签
   changeType=(type)=>{
-    let { goldCases , bankCases } = this.state;
-    if(type=="gold"){
-      this.setState({
-        goldCases:!goldCases
-      })
+    let tags = [];
+    if(this.state.casesTags.indexOf(type) > -1){
+      tags = this.state.casesTags.filter(item => item != type);
     }else{
-      this.setState({
-        bankCases:!bankCases
-      })
-    }
-    if(!goldCases == true || !bankCases == true){
-      this.setState({checkTag:false})
+      tags = this.state.casesTags.concat(type);
     }
+    const tagUniqed = _.uniq(tags);
+    this.setState({
+      casesTags: tagUniqed,
+      checkTag:tags.length > 0 ? false : true
+    })
   }
 
   render(){
     let { caseID } = this.props.match.params;
     let { CaseDetail } = this.props;
-    let { goldCases , bankCases , contentFileList , imageUrl , checkTag } = this.state;
+    let { casesTags , contentFileList , imageUrl , checkTag } = this.state;
     const {getFieldDecorator} = this.props.form;
 
 
@@ -267,9 +309,6 @@ class CaseNew extends Component{
             }
             .newCases .resetBottom .ant-form-explain{
               bottom:2px;
-            }
-            .markdown-body table{
-
             }
             `
           }
@@ -307,8 +346,8 @@ class CaseNew extends Component{
               <div className={checkTag==true ? "clearfix mb20 pr has-error" : "clearfix mb20"} id="tagFormItem">
                 <span className="upload_Title must">标签</span>
                 <ul className="fl libraries_tab">
-                    <li className={ goldCases ? "active" :"" } onClick={()=>this.changeType("gold")}>获奖案例</li>
-                    <li className={ bankCases ? "active" :"" } onClick={()=>this.changeType("bank")}>入库案例</li>
+                    <li className={ casesTags.indexOf(1) > -1 ? "active" :"" } onClick={()=>this.changeType(1)}>获奖案例</li>
+                    <li className={ casesTags.indexOf(2) > -1 ? "active" :"" } onClick={()=>this.changeType(2)}>入库案例</li>
                 </ul>
                 {
                   checkTag && <div class="ant-form-explain">请选择标签</div>

public/react/src/modules/moop_cases/Success.js

@@ -0,0 +1,28 @@
+import React,{ Component } from "react";
+import './css/moopCases.css'
+import '../courses/css/Courses.css'
+import { getImageUrl } from 'educoder';
+import success from '../../images/moop_cases/success.png'
+
+class Success extends Component{
+  constructor(props){
+    super(props);
+  }
+  render(){
+    return(
+      <div className="educontent edu-back-white mt20 successPage">
+        <div>
+          <img src={success} width="100" className="mb30" />
+          <p className="lineh-30 ed-txt-center font-24 color-grey-3 font-bd">恭喜!</p>
+          <p className="lineh-30 ed-txt-center font-24 color-grey-3 font-bd mb20">提交成功</p>
+          <p className="lineh-30 ed-txt-center font-16 color-grey-9 font-bd mb20">平台正在审核您的申请，审核结果将以平台消息的形式通知您</p>
+          <li className="inline">
+            <a href={`/moop_cases/${this.props.match.params.caseID}`} className="white-btn edu-blueline-btn changebtn mr20 fl">查看已上传文档</a>
+            <a href="/moop_cases/new" className="white-btn edu-blueback-btn changebtn fl">继续上传</a>
+          </li>
+        </div>
+      </div>
+    )
+  }
+}
+export default Success;

public/react/src/modules/moop_cases/css/moopCases.css

@@ -138,4 +138,18 @@
 }
 .uploadImage .ant-upload.ant-upload-select-picture-card > .ant-upload{
   padding:0px!important;
+}
+.successPage {
+  justify-content: center;
+  align-items: center;
+  display: -webkit-flex;
+  height: 570px;
+  text-align: center;
+  margin-bottom: 50px;
+}
+.changebtn {
+  width:166px;
+  font-size: 16px;
+  height: 45px;
+  line-height: 45px;
 }

public/react/src/modules/moop_cases/index.js

@@ -25,6 +25,11 @@ const CaseNew = Loadable({
 	loader: () => import('./CaseNew'),
 	loading:Loading,
 })
+const CaseSuccess = Loadable({
+	loader: () => import('./Success'),
+	loading:Loading,
+})
+
 
 
 class Index extends Component{
@@ -111,6 +116,12 @@ class Index extends Component{
             }
           ></Route>
 
+          <Route exact path="/moop_cases/:caseID/publish_success"
+            render={
+              (props) => (<CaseSuccess {...this.props} {...props} {...this.state} getDetail={this.getDetail}  />)
+            }
+          ></Route>
+
         </Switch>
       </div>
     )