m52mxtq3o
/
educoder
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

调整 公告栏

Browse Source
dev_hs
杨树林 5 years ago
parent 58b4005fbe
commit da03ded9ea
3 changed files with 565 additions and 80 deletions
Show Stats Download Patch File Download Diff File

302
public/react/src/modules/courses/gradinforms/Bullsubdirectory.js
Unescape View File

@ -0,0 +1,302 @@
import React,{ Component } from "react";
import { Input,Checkbox,Table, Pagination, Modal,Menu, Tooltip,Spin,Button,Form } 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";
// 公告栏
class Bullsubdirectory extends Component{
constructor(props){
super(props);
this.messageRef = React.createRef();
this.state={
description:null,
isSpinysl:false,
whethertoeditysl:false,
addonAfter:0,
eduintits:"",
informs:[],
}
}
componentDidMount() {
console.log("获取到数据");
console.log(this.props);
let{id,myname,mydescription} =this.props
this.props.form.setFieldsValue({
id:id,
eduintits:myname,
description:mydescription,
});
this.setState({
id:id,
eduintits:myname,
description:mydescription,
})
}
bianji = (bians)=>{
this.setState({
whethertoeditysl:bians,
})
if(bians===true){
this.props.getyslbooltrue();
}else {
this.props.getyslboolfalse();
}
};
changeTopicName = (e) => {
console.log("调用了changeTopicName");
let num = parseInt(e.target.value.length);
if(num>60){
return;
}
this.setState({
addonAfter: num < 0 ? 0 : num
});
this.setState({
eduintits: e.target.value
})
this.props.form.setFieldsValue({
eduintits: e.target.value,
});
}
handleSubmit=(e) => {
e.preventDefault();
this.props.form.validateFields((err, values) => {
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 url = `/courses/${id}/update_informs.json`;
axios.post(url,{
inform_id:this.state.id,
name:values.eduintits,
description:values.description,
}).then((result) => {
if(result){
if(result.data){
if(result.data.status === 0){
this.props.form.setFieldsValue({
id:this.state.id,
eduintits:values.eduintits,
description:values.description,
});
this.setState({
whethertoeditysl:false,
id:this.state.id,
eduintits:values.eduintits,
description:values.description,
});
this.props.getinputdata();
this.props.showNotification(result.data.message);
}else {
this.props.showNotification(result.data.message);
}
}
}
}).catch((error) => {
console.log(error)
})
}else{
console.log(err);
}
});
}
render(){
let{description,whethertoeditysl,addonAfter,eduintits,informs,isSpinysl} =this.state;
let{myname,mydescription}=this.props;
const {getFieldDecorator} = this.props.form;
return(
<React.Fragment >
<div >
<Spin size="large" spinning={isSpinysl} >
<div className="edu-back-white ">
{
whethertoeditysl === false?
<div className="bor-bottom-greyE" >
<div className="fudonyingxiangysl"><div className="ysltitbt fl"><span >{myname}</span></div>
{
this.props.isAdmin() === true ?
(this.props.yslbool===false?
<i className="iconfont icon-bianji1 newbianji1 fr pr25 yslbianji" onClick={()=>this.bianji(true)}></i>
:
""
)
:""
}
</div>
<div id="MakedownHTML"className={"markdown-body fonttext yslmtopcg yslminHeigth markdownysltext"} dangerouslySetInnerHTML={{__html: markdownToHTML(mydescription).replace(/▁/g, "▁▁▁")}}/>
</div>
:
<div className="edu-back-white bor-bottom-greyE">
<Form layout='vertical' onSubmit={this.handleSubmit} >
<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 "
>
{getFieldDecorator('eduintits', {
rules: [{
required: true, message: '请在此输入标题,最多60个字符',
}, {
max: 60, message: '最大限制为60个字符',
}],
})(
<div className="ysleduinwh">
<div className="yslduinlefts">
<span className="yslduincolorred">*</span>
</div>
<div className="yslduinleft">
<Input placeholder="请在此输入标题，最多60个字符" maxLength="60"
style={{ textAlign: "left",width:"100%",}}
onInput={this.changeTopicName}
autoComplete="off"
suffix={String(addonAfter)+"/60"}
value={eduintits}
className="searchViewAfter"></Input>
</div>
</div>
)}
</Form.Item>
<div className="edu-back-white ">
<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 "
>
{getFieldDecorator('description', {
rules: [{
required: true, message: '请在此输入内容,最多5000个字符',
}, {
max: 5000, message: '最大限制为5000个字符',
}],
})(
<TPMMDEditor ref={this.messageRef}
placeholder={'请在此输入内容,最多5000个字符'}
initValue={description}
mdID={'courseMessageMD'}
className="courseMessageMD "
height={518}
></TPMMDEditor>
)}
</Form.Item>
</div>
</div>
<Form.Item>
<div className="clearfix mt28 fr pb50 mr25" style={{display:"block;"}}>
<a className="defalutCancelbtn fl mr20 " onClick={()=>this.bianji(false)}>取消</a>
<Button htmlType="submit" className="ant-btn defalutSubmitbtn fl ant-btn-primary">
<span>提 交</span></Button>
</div>
</Form.Item>
</Form>
</div>
}
</div>
</Spin>
</div>
</React.Fragment>
)
}
}
const Bullsubdirectorys = Form.create({ name: 'bullsubdirectorys' })(Bullsubdirectory);
export default Bullsubdirectorys;

278
public/react/src/modules/courses/gradinforms/Eduinforms.js
Unescape View File

@ -4,6 +4,9 @@ import { WordsBtn,on, off, trigger,markdownToHTML,getImageUrl} from 'educoder';
import './myysleduinforms.css'
import axios from 'axios';
import TPMMDEditor from "../../tpm/challengesnew/TPMMDEditor";
import Bullsubdirectory from "./Bullsubdirectory";
import moment from "../new/CoursesNew";
import Fileslistitem from "../Resource/Fileslistitem";
// 公告栏
class Eduinforms extends Component{
constructor(props){
@ -14,33 +17,57 @@ class Eduinforms extends Component{
description:null,
isSpin:true,
whethertoedit:false,
addonAfter:0,
eduintit:"",
informs:[],
yslbool:false,
}
}
componentDidMount() {
console.log("获取到数据");
console.log(this.props);
let url = `/courses/${this.props.match.params.coursesId}/informs.json`;
this.getinputdata();
}
getyslbooltrue(){
console.log("调用了getyslbooltrue");
this.setState({
yslbool:true,
});
}
getyslboolfalse(){
console.log("调用了getyslboolfalse");
this.setState({
yslbool:false,
});
}
getinputdata=()=>{
this.setState({
isSpin:true,
})
let url = `/courses/${this.props.match.params.coursesId}/informs.json`;
//
axios.get(url).then((response) => {
if(response){
if(response.data){
this.setState({
description:response.data.description,
isSpin:false,
})
}else {
this.setState({
description:null,
isSpin:false,
})
}
if(response.data){
this.setState({
informs:response.data.informs,
isSpin:false,
})
}else {
this.setState({
informs:[],
isSpin:false,
})
}
}else {
this.setState({
description:null,
informs:[],
isSpin:false,
})
@ -48,14 +75,12 @@ class Eduinforms extends Component{
}).catch((error) => {
console.log(error)
this.setState({
description:null,
informs:[],
isSpin:false,
})
});
}
componentDidUpdate = (prevProps) => {
@ -65,32 +90,60 @@ class Eduinforms extends Component{
this.setState({
whethertoedit:bians,
})
if(bians===true){
this.getyslbooltrue();
}else {
this.getyslboolfalse();
}
};
changeTopicName = (e) => {
console.log("调用了changeTopicName");
let num = parseInt(e.target.value.length);
if(num>60){
return;
}
this.setState({
addonAfter: num < 0 ? 0 : num
});
this.setState({
eduintit: e.target.value
})
this.props.form.setFieldsValue({
eduintits: e.target.value,
});
}
handleSubmit=(e) => {
e.preventDefault();
this.props.form.validateFields((err, values) => {
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(`请输入提交内容`);
this.props.showNotification(`请输入内容`);
return
}
var id=this.props.match.params.coursesId
var url = `/courses/${id}/update_informs.json`;
var url = `/courses/${id}/new_informs.json`;
axios.post(url,{
name:values.eduintits,
description:values.description,
}).then((result) => {
if(result){
if(result.data){
if(result.data.status === 0){
this.setState({
description:values.description,
whethertoedit:false,
})
});
this.getinputdata();
this.getyslboolfalse();
this.props.showNotification(result.data.message);
}else {
this.props.showNotification(result.data.message);
@ -111,7 +164,7 @@ class Eduinforms extends Component{
render(){
let{description,whethertoedit} =this.state;
let{description,whethertoedit,addonAfter,eduintit,informs,yslbool} =this.state;
const {getFieldDecorator} = this.props.form;
return(
@ -123,10 +176,13 @@ class Eduinforms extends Component{
<span className="font-18 fl color-dark-21">公告栏</span>
{
this.props.isAdmin()===true?
<li className="btn colorblue font-16 fr" style={{cursor: "default"}}
onClick={() => this.bianji(true)}>
编辑
</li>
(this.state.yslbool===false?
<li className="btn colorblue font-16 fr bluebkbk" style={{cursor: "default"}}
onClick={() => this.bianji(true)}>
发布公告
</li>
:"")
:""
}
@ -138,36 +194,73 @@ class Eduinforms extends Component{
<div id={"cdiv1"}>
{
whethertoedit === false?
<div>
{
description === null || description=== undefined ||description === "" ?
<div className="alltask ">
<div className="edu-tab-con-box clearfix edu-txt-center"><img className="edu-nodata-img mb20"
src={getImageUrl("images/educoder/nodata.png")} />
<p className="edu-nodata-p mb20">暂时还没有相关数据哦！</p></div>
</div>
:
<div className="edu-back-white ">
<div id="MakedownHTML" className={"markdown-body fonttext yslmtopcg yslminHeigth"} style={{minHeight:"400px"}} dangerouslySetInnerHTML={{__html: markdownToHTML(description).replace(/▁/g, "▁▁▁")}}>
whethertoedit === false?""
:
<div className="edu-back-white bor-bottom-greyE">
</div>
</div>
}
</div>
:
<div>
<Form layout='vertical' onSubmit={this.handleSubmit} >
<div className="edu-back-white ">
<div className={"yslmt16px"}>
<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 "
>
{getFieldDecorator('eduintits', {
rules: [{
required: true, message: '请在此输入标题,最多60个字符',
}, {
max: 60, message: '最大限制为60个字符',
}],
})(
<div className="ysleduinwh">
<div className="yslduinlefts">
<span className="yslduincolorred">*</span>
</div>
<div className="yslduinleft">
<Input placeholder="请在此输入标题，最多60个字符" maxLength="60"
style={{ textAlign: "left",width:"100%",}}
onInput={this.changeTopicName}
autoComplete="off"
suffix={String(addonAfter)+"/60"}
value={eduintit}
className="searchViewAfter"></Input>
</div>
</div>
)}
</Form.Item>
<div className="edu-back-white ">
<div className={"yslmt16px"}>
<style>
{
`
.ant-form-item-children {
position: unset;
}
.chooseDes .ant-form-item{
margin-bottom:0px !important;
}
.rememberTip{
position:absolute;
right:0px;
@ -206,41 +299,66 @@ class Eduinforms extends Component{
margin-bottom: 24px !important;
}
`
}
</style>
<Form.Item
style={{"borderBottom":'none'}}
className="chooseDes "
>
{getFieldDecorator('description', {
rules: [{
required: true, message: '请在此输入内容,最多5000个字符',
}, {
max: 5000, message: '最大限制为5000个字符',
}],
})(
<TPMMDEditor ref={this.messageRef}
placeholder={'请在此输入内容,最多5000个字符'}
initValue={description}
mdID={'courseMessageMD'}
className="courseMessageMD "
height={518}
></TPMMDEditor>
)}
</Form.Item>
</div>
</div>
}
</style>
<Form.Item
style={{"borderBottom":'none'}}
className="chooseDes "
>
{getFieldDecorator('description', {
rules: [{
required: true, message: '请在此输入内容,最多5000个字符',
}, {
max: 5000, message: '最大限制为5000个字符',
}],
})(
<TPMMDEditor ref={this.messageRef}
placeholder={'请在此输入内容,最多5000个字符'}
initValue={description}
mdID={'courseMessageMD'}
className="courseMessageMD "
height={518}
></TPMMDEditor>
)}
</Form.Item>
</div>
</div>
<Form.Item>
<div className="clearfix mt28 fr" style={{display:"block;"}}>
<a className="defalutCancelbtn fl mr20" onClick={()=>this.bianji(false)}>取消</a>
<Button htmlType="submit" className="ant-btn defalutSubmitbtn fl ant-btn-primary">
<span>提 交</span></Button>
</div>
<div className="clearfix mt28 fr pb50 mr25" style={{display:"block;"}}>
<a className="defalutCancelbtn fl mr20 " onClick={()=>this.bianji(false)}>取消</a>
<Button htmlType="submit" className="ant-btn defalutSubmitbtn fl ant-btn-primary">
<span>提 交</span></Button>
</div>
</Form.Item>
</Form>
</div>
}
<div>
{
informs === null || informs=== undefined ||informs.length === 0 ?
<div className="alltask ">
<div className="edu-tab-con-box clearfix edu-txt-center"><img className="edu-nodata-img mb20"
src={getImageUrl("images/educoder/nodata.png")} />
<p className="edu-nodata-p mb20">暂时还没有相关数据哦！</p></div>
</div>
:
<div className="edu-back-white ">
{ informs&&informs.map((item, index) => {
return (
<Bullsubdirectory {...this.state} {...this.props} key={index} yslbool={yslbool} id={item.id} myname={item.name} mydescription={item.description}
getyslbooltrue={()=>this.getyslbooltrue()}
getyslboolfalse={()=>this.getyslboolfalse()}
getinputdata={()=>this.getinputdata()} ></Bullsubdirectory>
)
})
}
</div>
}
</div>
</div>
@ -257,3 +375,7 @@ class Eduinforms extends Component{
}
const Eduinformss = Form.create({ name: 'eduinforms' })(Eduinforms);
export default Eduinformss;
{/*<div key={index} className="bor-bottom-greyE" >*/}
{/* {item.name===""?"":item.name===undefined?"":item.name===null?"":<div className="ysltitbt"><span >{item.name}</span></div>}*/}
{/* <div id="MakedownHTML" key={index} className={"markdown-body fonttext yslmtopcg yslminHeigth markdownysltext"} dangerouslySetInnerHTML={{__html: markdownToHTML(item.description).replace(/▁/g, "▁▁▁")}}/>*/}
{/*</div>*/}

63
public/react/src/modules/courses/gradinforms/myysleduinforms.css
Unescape View File

@ -1,5 +1,5 @@
.yslmt16px{
padding-top: 25px !important;
padding-top: 12px !important;
padding-left: 25px !important;
padding-right: 25px !important;
padding-bottom: 1px !important;
@ -11,3 +11,64 @@
}
.bluebkbk{
border: 1px solid #4CADFF;
width: 79px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ysleduinwh{
padding-right: 25px;
margin-top: 26px;
display: flex;
justify-content:flex-start;
}
.yslduincolorred{
color: red;
line-height: 40px;
height: 40px;
text-align: center;
}
.yslduinleft{
width: 100% ;
}
.yslduinlefts{
width: 25px;
line-height: 40px;
height: 40px;
text-align: center;
}
.mtyslduin25{
margin-top: 25px;
}
.newbianji1{
font-size: 16px !important;
margin-right: 10px;
color: #4CACFF;
margin-bottom: 3px;
display: inline-block;
}
.ysltitbt{
float: left;
padding-top: 31px;
padding-left: 25px;
font-size: 16px;
color: #333333;
text-align: left;
}
.markdownysltext{
font-size: 14px;
color: #999999;
}
.fudonyingxiangysl{
width: 100%;
height: 66px;
}
.yslbianji{
padding-top: 31px;
}

Write Preview
Loading…
Cancel
Save