教学案例-附件列表-单独组件

public/react/src/common/components/attachment/AttachmentList.js

@@ -0,0 +1,33 @@
+import React,{ Component } from "react";
+
+class AttachmentsList extends Component{
+  constructor(props){
+    super(props);
+  }
+  render(){
+    let { attachments } = this.props;
+    return(
+      <React.Fragment>
+        {
+          attachments.map((item,key)=>{
+            return(
+              <p key={key}>
+                <a className="color-grey">
+                  <i className="font-14 color-green iconfont icon-fujian mr8"></i>
+                </a>
+                {
+                  item.is_pdf && item.is_pdf == true ?
+                  <a href={item.url} className="mr12" length="58" target="_blank">{item.title}</a>
+                  :
+                  <a href={item.url} className="mr12" length="58">{item.title}</a>
+                }
+                <span className="color-grey mt2 color-grey-6 font-12">{item.filesize}</span>
+              </p>
+            )
+          })
+        }
+      </React.Fragment>
+    )
+  }
+}
+export default AttachmentsList;

public/react/src/common/educoder.js

@@ -30,6 +30,9 @@ export { trace_collapse, trace, debug, info, warn, error, trace_c, debug_c, info
 export { EDU_ADMIN, EDU_BUSINESS, EDU_SHIXUN_MANAGER, EDU_SHIXUN_MEMBER, EDU_CERTIFICATION_TEACHER
     , EDU_GAME_MANAGER, EDU_TEACHER, EDU_NORMAL} from 	'./Const'
 
+    
+export { default as AttachmentList } from './components/attachment/AttachmentList'
+
 export { themes, ThemeContext } from 	'./context/ThemeContext'
 
 export { ModalHOC } from 	'./components/ModalHOC'

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

@@ -2,13 +2,15 @@ import React,{ Component } from "react";
 import './css/moopCases.css'
 import '../courses/css/Courses.css'
 
-import { getImageUrl , MarkdownToHtml , ActionBtn } from 'educoder';
+import { getImageUrl , MarkdownToHtml , ActionBtn , AttachmentList } from 'educoder';
 
 import Tags from './CaseTags'
 
 import axios from 'axios';
 import Modals from '../modals/Modals'
 
+// import AttachmentList from '../../common/components/attachment/AttachmentList'
+
 class CaseDetail extends Component{
   constructor(props){
     super(props);
@@ -141,19 +143,7 @@ class CaseDetail extends Component{
                 </div>
                 { attachments && 
                   <div className="mt10">
-                    {
+                    <AttachmentList {...this.props} {...this.state} attachments={attachments}></AttachmentList>
-                      attachments.map((item,key)=>{
-                        return(
-                          <p>
-                            <a className="color-grey">
-                              <i className="font-14 color-green iconfont icon-fujian mr8"></i>
-                            </a>
-                            <a href={item.url} className="mr12" length="58">{item.title}</a>
-                            <span className="color-grey mt2 color-grey-6 font-12">{item.filesize}</span>
-                          </p>
-                        )
-                      })
-                    }
                   </div>
                 }     
                 <div class="mt40">