|
|
|
@ -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);
|
|
|
|
@ -65,6 +67,9 @@ class CaseDetail extends Component{
|
|
|
|
|
} = this.state;
|
|
|
|
|
return(
|
|
|
|
|
<div className="educontent mt10 mb50">
|
|
|
|
|
{
|
|
|
|
|
CaseDetail &&
|
|
|
|
|
<React.Fragment>
|
|
|
|
|
<Modals
|
|
|
|
|
modalsType={modalsType}
|
|
|
|
|
modalsTopval={modalsTopval}
|
|
|
|
@ -74,22 +79,22 @@ class CaseDetail extends Component{
|
|
|
|
|
>
|
|
|
|
|
</Modals>
|
|
|
|
|
<p className="mt10 mb20 clearfix lineh-20">
|
|
|
|
|
<a href="/moop_cases" className="color-grey-9">教学案例</a> > <span className="color-grey-3">{ CaseDetail && CaseDetail.title}</span>
|
|
|
|
|
<a href="/moop_cases" className="color-grey-9">教学案例</a> > <span className="color-grey-3">{ CaseDetail.title}</span>
|
|
|
|
|
</p>
|
|
|
|
|
<p className="lineh-25 mb20 clearfix">
|
|
|
|
|
<span className="font-22 fl mr10 task-hide" style={{maxWidth:"800px"}}>
|
|
|
|
|
{ CaseDetail && CaseDetail.title}
|
|
|
|
|
{ CaseDetail.title}
|
|
|
|
|
</span>
|
|
|
|
|
<span className="mt5 fl">
|
|
|
|
|
<Tags tags={tags}></Tags>
|
|
|
|
|
{
|
|
|
|
|
CaseDetail && CaseDetail.status == "pending" && <span class="edu-filter-btn fl cdefault edu-activity-green ml10">草稿</span>
|
|
|
|
|
CaseDetail.status == "pending" && <span class="edu-filter-btn fl cdefault edu-activity-green ml10">草稿</span>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
CaseDetail && CaseDetail.status == "processing" && <span class="edu-filter-btn fl cdefault edu-activity-green ml10">审核中</span>
|
|
|
|
|
CaseDetail.status == "processing" && <span class="edu-filter-btn fl cdefault edu-activity-green ml10">审核中</span>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
CaseDetail && CaseDetail.status == "refused" && <span class="edu-filter-btn fl cdefault edu-activity-orange ml10">未通过</span>
|
|
|
|
|
CaseDetail.status == "refused" && <span class="edu-filter-btn fl cdefault edu-activity-orange ml10">未通过</span>
|
|
|
|
|
}
|
|
|
|
|
</span>
|
|
|
|
|
<a href="/moop_cases" className="fr color-grey-9 mt5">返回</a>
|
|
|
|
@ -112,19 +117,19 @@ class CaseDetail extends Component{
|
|
|
|
|
<li className="clearfix lineh-20">
|
|
|
|
|
<span className="fl color-grey-9 mr20">{creator && creator.school_name}</span>
|
|
|
|
|
<span className="fr">
|
|
|
|
|
<span className="fl color-grey-9 mr30">编码:<span className="color-grey-6">{CaseDetail && CaseDetail.uuid}</span></span>
|
|
|
|
|
<span className="fl color-grey-9 mr30">编码:<span className="color-grey-6">{CaseDetail.uuid}</span></span>
|
|
|
|
|
{
|
|
|
|
|
CaseDetail && CaseDetail.status=="published" ?
|
|
|
|
|
<span className="fl color-grey-9">发布时间:<span className="color-grey-6">{CaseDetail && CaseDetail.published_at}</span></span>
|
|
|
|
|
<span className="fl color-grey-9">发布时间:<span className="color-grey-6">{CaseDetail.published_at}</span></span>
|
|
|
|
|
:
|
|
|
|
|
<span className="fl color-grey-9">上传时间:<span className="color-grey-6">{CaseDetail && CaseDetail.created_at}</span></span>
|
|
|
|
|
<span className="fl color-grey-9">上传时间:<span className="color-grey-6">{CaseDetail.created_at}</span></span>
|
|
|
|
|
}
|
|
|
|
|
</span>
|
|
|
|
|
</li>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<span className="fl color-grey-9">作者:</span>{CaseDetail && CaseDetail.author_name}/{CaseDetail && CaseDetail.author_school_name}
|
|
|
|
|
<span className="fl color-grey-9">作者:</span>{CaseDetail.author_name}/{CaseDetail.author_school_name}
|
|
|
|
|
</div>
|
|
|
|
|
<style>
|
|
|
|
|
{`
|
|
|
|
@ -134,23 +139,11 @@ class CaseDetail extends Component{
|
|
|
|
|
`}
|
|
|
|
|
</style>
|
|
|
|
|
<div class="mt20 setMDStyle">
|
|
|
|
|
{ CaseDetail && CaseDetail.content && <MarkdownToHtml content={CaseDetail.content} id="casesDetail" selector="casesDetail" style={{width:"100%!important"}}></MarkdownToHtml>}
|
|
|
|
|
{ CaseDetail.content && <MarkdownToHtml content={CaseDetail.content} id="casesDetail" selector="casesDetail" style={{width:"100%!important"}}></MarkdownToHtml>}
|
|
|
|
|
</div>
|
|
|
|
|
{ attachments &&
|
|
|
|
|
<div className="mt10">
|
|
|
|
|
{
|
|
|
|
|
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>
|
|
|
|
|
)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
<AttachmentList {...this.props} {...this.state} attachments={attachments}></AttachmentList>
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
<div class="mt40">
|
|
|
|
@ -169,6 +162,8 @@ class CaseDetail extends Component{
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</React.Fragment>
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|