|
|
import React,{ Component } from "react";
|
|
|
import { Input,Checkbox,Table, Pagination, Modal,Menu, Tooltip,Spin,Button,Form,Row, Col } from "antd";
|
|
|
import { WordsBtn,on, off, trigger,markdownToHTML,getImageUrl} from 'educoder';
|
|
|
import './myysleduinforms.css'
|
|
|
import axios from 'axios';
|
|
|
import TPMMDEditor from "../../tpm/challengesnew/TPMMDEditor";
|
|
|
import moment from "../new/CoursesNew";
|
|
|
import Fileslistitem from "../Resource/Fileslistitem";
|
|
|
import Modals from "../../modals/Modals";
|
|
|
// 公告栏
|
|
|
class Bullsubdirectory extends Component{
|
|
|
constructor(props){
|
|
|
super(props);
|
|
|
this.messageRef = React.createRef();
|
|
|
|
|
|
this.state={
|
|
|
description:null,
|
|
|
isSpinysl:false,
|
|
|
whethertoeditysl:false,
|
|
|
addonAfter:0,
|
|
|
eduintits:"",
|
|
|
informs:[],
|
|
|
Modalstype:false,
|
|
|
Modalstopval:"是否确认删除?",
|
|
|
ModalCancel:"",
|
|
|
ModalSave:"",
|
|
|
index:0,
|
|
|
|
|
|
}
|
|
|
//不能显示数据编辑的时候没有赋值
|
|
|
//没加initialValue 输入不能赋值到from 上
|
|
|
}
|
|
|
|
|
|
componentDidMount() {
|
|
|
console.log("获取到数据");
|
|
|
console.log(this.props);
|
|
|
let{id,myname,mydescription,index,item} =this.props
|
|
|
this.props.form.setFieldsValue({
|
|
|
id:id,
|
|
|
eduintits:item.name,
|
|
|
description:item.description,
|
|
|
});
|
|
|
// this.contentMdRef.current.setValue(mydescription);
|
|
|
this.setState({
|
|
|
id:id,
|
|
|
eduintits:item.name,
|
|
|
description:item.description,
|
|
|
index:index
|
|
|
})
|
|
|
if(myname!=undefined){
|
|
|
this.setState({
|
|
|
addonAfter:myname.length
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
setModeltrue=()=>{
|
|
|
this.setState({
|
|
|
Modalstype:true,
|
|
|
Modalstopval:"是否确认删除?",
|
|
|
ModalCancel:this.cancelmodel,
|
|
|
ModalSave:this.saveonOpen,
|
|
|
})
|
|
|
}
|
|
|
|
|
|
cancelmodel=()=>{
|
|
|
//取消
|
|
|
this.setState({
|
|
|
Modalstype:false,
|
|
|
Modalstopval:"是否确认删除?",
|
|
|
ModalCancel:"",
|
|
|
ModalSave:"",
|
|
|
})
|
|
|
}
|
|
|
|
|
|
saveonOpen=()=>{
|
|
|
//确认
|
|
|
// /
|
|
|
// 删除公告
|
|
|
var id=this.props.match.params.coursesId
|
|
|
const url =`/courses/${id}/delete_informs.json`;
|
|
|
axios.delete(url, { data: {
|
|
|
inform_id: this.props.id
|
|
|
}})
|
|
|
.then((response) => {
|
|
|
if(response){
|
|
|
if(response.data){
|
|
|
if(response.data.status===0){
|
|
|
this.setState({
|
|
|
Modalstype:false,
|
|
|
Modalstopval:"是否确认删除?",
|
|
|
ModalCancel:"",
|
|
|
ModalSave:"",
|
|
|
})
|
|
|
this.props.showNotification(`删除成功`);
|
|
|
this.props.getinputdata();
|
|
|
}else{
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
}
|
|
|
}else{
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
})
|
|
|
.catch(function (error) {
|
|
|
console.log(error);
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
bianji = (bians,i)=>{
|
|
|
console.log("bianji");
|
|
|
console.log(this.props.myname);
|
|
|
console.log(this.props.mydescription);
|
|
|
this.setState({
|
|
|
whethertoeditysl:bians,
|
|
|
eduintits:this.props.myname,
|
|
|
description:this.props.mydescription,
|
|
|
index:i
|
|
|
});
|
|
|
this.props.form.setFieldsValue({
|
|
|
eduintits:this.props.myname,
|
|
|
description:this.props.mydescription,
|
|
|
});
|
|
|
if(bians===true){
|
|
|
this.props.getyslbooltrue();
|
|
|
}else {
|
|
|
this.props.getyslboolfalse();
|
|
|
}
|
|
|
};
|
|
|
changeTopicName = (e) => {
|
|
|
// console.log("调用了changeTopicName");
|
|
|
let num = e.target.value.length;
|
|
|
|
|
|
if(num>60){
|
|
|
return;
|
|
|
}
|
|
|
this.setState({
|
|
|
addonAfter: num < 0 ? 0 : num
|
|
|
});
|
|
|
if(num<=60){
|
|
|
this.setState({
|
|
|
eduintits: e.target.value
|
|
|
})
|
|
|
|
|
|
this.props.form.setFieldsValue({
|
|
|
eduintits: e.target.value,
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
}
|
|
|
handleSubmit=(e) => {
|
|
|
e.preventDefault();
|
|
|
this.props.form.validateFields((err, values) => {
|
|
|
debugger
|
|
|
if (!err) {
|
|
|
console.log(values.description);
|
|
|
if(values.eduintits === undefined|| values.eduintits === "" || values.eduintits ===null){
|
|
|
this.props.showNotification(`请输入标题`);
|
|
|
return
|
|
|
|
|
|
}
|
|
|
if(values.description === undefined|| values.description === "" || values.description ===null){
|
|
|
this.props.showNotification(`请输入内容`);
|
|
|
return
|
|
|
|
|
|
}
|
|
|
var id=this.props.match.params.coursesId
|
|
|
var titname="";
|
|
|
try {
|
|
|
if(values.eduintits.length>0){
|
|
|
if( values.eduintits.length>60){
|
|
|
var str=values.eduintits;
|
|
|
titname=str.substring(0,60);
|
|
|
}else {
|
|
|
titname=values.eduintits;
|
|
|
}
|
|
|
}else {
|
|
|
titname=values.eduintits;
|
|
|
}
|
|
|
}catch (e) {
|
|
|
titname=values.eduintits;
|
|
|
}
|
|
|
var url = `/courses/${id}/update_informs.json`;
|
|
|
axios.post(url,{
|
|
|
inform_id:this.props.id,
|
|
|
name:titname,
|
|
|
description:values.description,
|
|
|
}).then((result) => {
|
|
|
if(result){
|
|
|
if(result.data){
|
|
|
if(result.data.status === 0){
|
|
|
// this.props.form.setFieldsValue({
|
|
|
// id:this.state.id,
|
|
|
// eduintits:titname,
|
|
|
// description:values.description,
|
|
|
// });
|
|
|
this.setState({
|
|
|
whethertoeditysl:false,
|
|
|
id:this.state.id,
|
|
|
eduintits:titname,
|
|
|
description:values.description,
|
|
|
});
|
|
|
this.props.getinputdata();
|
|
|
this.props.getyslboolfalse();
|
|
|
this.props.showNotification(result.data.message);
|
|
|
}else {
|
|
|
this.props.showNotification(result.data.message);
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}else{
|
|
|
console.log(err);
|
|
|
}
|
|
|
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//上移
|
|
|
Moveupward = (id) => {
|
|
|
let url = `/courses/${this.props.match.params.coursesId}/inform_up.json`;
|
|
|
axios.post(url, {
|
|
|
inform_id: id
|
|
|
}).then((response) => {
|
|
|
if (response) {
|
|
|
if (response.data) {
|
|
|
if (response.data.status === 0) {
|
|
|
this.props.showNotification(`上移成功`);
|
|
|
this.props.getinputdata();
|
|
|
} else {
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
}
|
|
|
} else {
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
}
|
|
|
} else {
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
});
|
|
|
}
|
|
|
//下移
|
|
|
Movedown = (id) => {
|
|
|
let url = `/courses/${this.props.match.params.coursesId}/inform_down.json`;
|
|
|
axios.post(url, {
|
|
|
inform_id: id
|
|
|
}).then((response) => {
|
|
|
if (response) {
|
|
|
if (response.data) {
|
|
|
if (response.data.status === 0) {
|
|
|
this.props.showNotification(`下移成功`);
|
|
|
this.props.getinputdata();
|
|
|
} else {
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
}
|
|
|
} else {
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
}
|
|
|
} else {
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
render(){
|
|
|
let{description,whethertoeditysl,addonAfter,eduintits,informs,isSpinysl,index} =this.state;
|
|
|
let{myname,mydescription,id}=this.props;
|
|
|
const {getFieldDecorator} = this.props.form;
|
|
|
// console.log("Bullsubdirectory");
|
|
|
// console.log(this.props.isAdmin());
|
|
|
// console.log(this.props);
|
|
|
// console.log(whethertoeditysl);
|
|
|
// console.log(this.state.eduintits);
|
|
|
// console.log(this.state.description);
|
|
|
|
|
|
return(
|
|
|
<React.Fragment key={this.props.index} id={this.props.id}>
|
|
|
<div key={this.props.index} id={this.props.id}>
|
|
|
{this.state.Modalstype&&this.state.Modalstype===true?<Modals
|
|
|
modalsType={this.state.Modalstype}
|
|
|
modalsTopval={this.state.Modalstopval}
|
|
|
modalCancel={this.state.ModalCancel}
|
|
|
modalSave={this.state.ModalSave}
|
|
|
/>:""}
|
|
|
<Spin size="large" spinning={isSpinysl} >
|
|
|
<div className="edu-back-white " id={
|
|
|
index
|
|
|
}>
|
|
|
{
|
|
|
whethertoeditysl === false?
|
|
|
<div id={this.props.index}>
|
|
|
<div className="fudonyingxiangysls">
|
|
|
<div className="fudonyingxiangysl">
|
|
|
<div style={{marginRight:"60px"}}>
|
|
|
<span className="ysltitbt">{myname}</span>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span className="fr yslbianji" style={{marginRight:"17px"}}>
|
|
|
{
|
|
|
this.props.isAdmin() === true ?
|
|
|
(this.props.yslbool===false?
|
|
|
<Tooltip placement="bottom" title={<div>
|
|
|
编辑
|
|
|
</div>}>
|
|
|
<i className="iconfont icon-bianji1 newbianji1" onClick={()=>this.bianji(true,this.props.index)}></i>
|
|
|
</Tooltip>
|
|
|
:
|
|
|
""
|
|
|
)
|
|
|
:""
|
|
|
}
|
|
|
</span>
|
|
|
<span className="fr yslbianji" style={{marginRight:"22px"}}>
|
|
|
{
|
|
|
this.props.isAdmin() === true ?
|
|
|
(this.props.yslbool===false?
|
|
|
<Tooltip placement="bottom" title={<div>
|
|
|
删除
|
|
|
</div>}>
|
|
|
<i className="iconfont icon-shanchu newbianji1" style={{ color: "#4CACFF"}} onClick={()=>this.setModeltrue(true)}></i>
|
|
|
</Tooltip>
|
|
|
:
|
|
|
""
|
|
|
)
|
|
|
:""
|
|
|
}
|
|
|
</span>
|
|
|
{
|
|
|
this.props.length - 1 === this.props.index ? "" :
|
|
|
this.props.isAdmin() === true ?
|
|
|
(this.props.yslbool === false ?
|
|
|
<a className="fr yslbianji mr30"
|
|
|
style={{
|
|
|
lineHeight: "31px",
|
|
|
}}
|
|
|
onClick={() => this.Movedown(this.props.id)}
|
|
|
><Tooltip
|
|
|
title="下移"><i
|
|
|
style={{color: "#4CACFF"}}
|
|
|
className=" font-18 iconfont icon-xiangxiayi"></i></Tooltip></a>
|
|
|
:
|
|
|
""
|
|
|
)
|
|
|
: ""
|
|
|
}
|
|
|
{
|
|
|
this.props.index === 0 ? "" :
|
|
|
this.props.isAdmin() === true ?
|
|
|
(this.props.yslbool === false ?
|
|
|
<a className="fr yslbianji mr30"
|
|
|
style={{
|
|
|
lineHeight: "31px",
|
|
|
}}
|
|
|
onClick={() => this.Moveupward(this.props.id)}
|
|
|
><Tooltip
|
|
|
title="上移"><i
|
|
|
style={{color: "#4CACFF"}}
|
|
|
className=" font-18 iconfont icon-xiangshangyi"></i></Tooltip></a>
|
|
|
:
|
|
|
""
|
|
|
)
|
|
|
: ""
|
|
|
}
|
|
|
</div>
|
|
|
<div className="yslclear"></div>
|
|
|
</div>
|
|
|
<div id="MakedownHTML"className="markdown-body fonttext yslmtopcg yslminHeigth markdownysltext" dangerouslySetInnerHTML={{__html: markdownToHTML(mydescription).replace(/▁/g, "▁▁▁")}}/>
|
|
|
</div>
|
|
|
{parseInt(this.props&&this.props.informs.length)===parseInt(this.props&&this.props.index+1)?"":<div className="bor-bottom-greyE mr25 ml25"></div>}
|
|
|
</div>
|
|
|
:
|
|
|
whethertoeditysl === true?
|
|
|
<div className="edu-back-white " key={this.props.index} id={this.props.id}>
|
|
|
<Form layout='vertical' onSubmit={this.handleSubmit} key={this.props.index}>
|
|
|
<style>
|
|
|
{
|
|
|
`.ant-form-item{
|
|
|
margin-bottom:0px !important;
|
|
|
}
|
|
|
.chooseDestwo .ant-form-item{
|
|
|
margin-bottom:0px !important;
|
|
|
}
|
|
|
|
|
|
.chooseDestwo .ant-form-item-control-wrapper .ant-form-item-control .ant-form-explain{
|
|
|
padding-left: 25px !important;
|
|
|
}
|
|
|
.ant-form-vertical .ant-form-item {
|
|
|
margin-bottom:0px !important;
|
|
|
}
|
|
|
`
|
|
|
|
|
|
}
|
|
|
</style>
|
|
|
<Form.Item
|
|
|
style={{"borderBottom":'none'}}
|
|
|
className="chooseDestwo "
|
|
|
key={this.props.index}
|
|
|
>
|
|
|
{getFieldDecorator('eduintits', { initialValue: eduintits}, {
|
|
|
rules: [{
|
|
|
required: true, message: '请在此输入标题,最多60个字符',
|
|
|
}],
|
|
|
})(
|
|
|
<div className="ysleduinwh">
|
|
|
<div className="yslduinlefts">
|
|
|
<span className="yslduincolorred">*</span>
|
|
|
</div>
|
|
|
<div className="yslduinleft">
|
|
|
<style>{
|
|
|
`
|
|
|
.ant-input{
|
|
|
border-right: none !important;
|
|
|
height: 40px !important;
|
|
|
}
|
|
|
`
|
|
|
}</style>
|
|
|
<Input placeholder="请在此输入标题，最多60个字符" key={this.props.index} maxLength="60"
|
|
|
style={{ textAlign: "left",width:"100%",}}
|
|
|
onInput={this.changeTopicName}
|
|
|
autoComplete="off"
|
|
|
addonAfter={String(addonAfter)+"/60"}
|
|
|
value={eduintits}
|
|
|
className="searchViewAfter"></Input>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
)}
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
<div className="edu-back-white " key={this.props.index}>
|
|
|
<div className={"yslmt16px"}>
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.ant-form-item-children {
|
|
|
position: unset;
|
|
|
}
|
|
|
|
|
|
.chooseDes .ant-form-item{
|
|
|
margin-bottom:0px !important;
|
|
|
}
|
|
|
.rememberTip{
|
|
|
position:absolute;
|
|
|
right:0px;
|
|
|
bottom:-10px;
|
|
|
}
|
|
|
.chooseDes .ant-form-explain{
|
|
|
position:absolute;
|
|
|
bottom:-10px;
|
|
|
left:0px;
|
|
|
}
|
|
|
.ant-form-vertical .ant-form-explain {
|
|
|
margin-top: 0px !important;
|
|
|
margin-bottom: 0px !important;
|
|
|
padding-left: 0px !important;
|
|
|
}
|
|
|
.chooseDes .ant-form-item-with-help {
|
|
|
margin-bottom: 24px !important;
|
|
|
}
|
|
|
|
|
|
.courseMessageMD .ant-form-item-with-help {
|
|
|
margin-bottom: 24px !important;
|
|
|
}
|
|
|
.chooseDes .editormd-toolbar {
|
|
|
width: 100%;
|
|
|
min-height: 37px;
|
|
|
background: #fff;
|
|
|
display: none;
|
|
|
position: absolute !important;
|
|
|
left: 0;
|
|
|
z-index: 10;
|
|
|
border-bottom: 1px solid #ddd;
|
|
|
|
|
|
}
|
|
|
.yslmt16px .ant-form-item-with-help
|
|
|
{
|
|
|
margin-bottom: 24px !important;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
<Form.Item
|
|
|
style={{"borderBottom":'none'}}
|
|
|
className="chooseDes "
|
|
|
key={this.props.index}
|
|
|
>
|
|
|
{getFieldDecorator('description', { initialValue: description},{
|
|
|
rules: [{
|
|
|
required: true, message: '请在此输入内容,最多5000个字符',
|
|
|
}, {
|
|
|
len: 5000, message: '最大限制为5000个字符',
|
|
|
}],
|
|
|
})(
|
|
|
<TPMMDEditor ref={this.messageRef}
|
|
|
key={this.props.index}
|
|
|
placeholder={'请在此输入内容,最多5000个字符'}
|
|
|
initValue={description}
|
|
|
mdID={'courseMessageMD'}
|
|
|
className="courseMessageMD "
|
|
|
height={518}
|
|
|
></TPMMDEditor>
|
|
|
|
|
|
|
|
|
)}
|
|
|
</Form.Item>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<Form.Item>
|
|
|
<div className="clearfix mt28 fr pb50 mr25">
|
|
|
<a className="defalutCancelbtn fl mr20 " onClick={()=>this.bianji(false,this.props.index)}>取消</a>
|
|
|
<Button htmlType="submit" className="ant-btn defalutSubmitbtn fl ant-btn-primary">
|
|
|
<span>提 交</span></Button>
|
|
|
</div>
|
|
|
</Form.Item>
|
|
|
</Form>
|
|
|
<div className="bor-bottom-greyE mr25 ml25"></div>
|
|
|
</div>
|
|
|
:""
|
|
|
}
|
|
|
</div>
|
|
|
</Spin>
|
|
|
|
|
|
</div>
|
|
|
</React.Fragment>
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
const Bullsubdirectorys = Form.create({ name: 'bullsubdirectorys' })(Bullsubdirectory);
|
|
|
export default Bullsubdirectorys;
|
