|
|
|
@ -1,202 +1,202 @@
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
|
|
|
|
|
|
|
|
import {Input, Select, Radio, Checkbox, Popconfirm, message, Modal} from 'antd';
|
|
|
|
import {Input, Select, Radio, Checkbox, Popconfirm, message, Modal} from 'antd';
|
|
|
|
|
|
|
|
|
|
|
|
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
|
|
|
|
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
|
|
|
|
|
|
|
|
|
|
|
|
// import "antd/dist/antd.css";
|
|
|
|
// import "antd/dist/antd.css";
|
|
|
|
|
|
|
|
|
|
|
|
import axios from 'axios';
|
|
|
|
import axios from 'axios';
|
|
|
|
|
|
|
|
|
|
|
|
import {getUrl} from 'educoder';
|
|
|
|
import {getUrl} from 'educoder';
|
|
|
|
|
|
|
|
|
|
|
|
let origin = getUrl();
|
|
|
|
let origin = getUrl();
|
|
|
|
|
|
|
|
|
|
|
|
let path = getUrl("/editormd/lib/")
|
|
|
|
let path = getUrl("/editormd/lib/")
|
|
|
|
|
|
|
|
|
|
|
|
const $ = window.$;
|
|
|
|
const $ = window.$;
|
|
|
|
|
|
|
|
|
|
|
|
let timeout;
|
|
|
|
let timeout;
|
|
|
|
|
|
|
|
|
|
|
|
let currentValue;
|
|
|
|
let currentValue;
|
|
|
|
|
|
|
|
|
|
|
|
const Option = Select.Option;
|
|
|
|
const Option = Select.Option;
|
|
|
|
|
|
|
|
|
|
|
|
const RadioGroup = Radio.Group;
|
|
|
|
const RadioGroup = Radio.Group;
|
|
|
|
|
|
|
|
|
|
|
|
function create_editorMD(id, width, high, placeholder, imageUrl, callback) {
|
|
|
|
function create_editorMD(id, width, high, placeholder, imageUrl, callback) {
|
|
|
|
var editorName = window.editormd(id, {
|
|
|
|
var editorName = window.editormd(id, {
|
|
|
|
width: width,
|
|
|
|
width: width,
|
|
|
|
height: high,
|
|
|
|
height: high,
|
|
|
|
path: path, // "/editormd/lib/"
|
|
|
|
path: path, // "/editormd/lib/"
|
|
|
|
|
|
|
|
|
|
|
|
syncScrolling: "single",
|
|
|
|
syncScrolling: "single",
|
|
|
|
tex: true,
|
|
|
|
tex: true,
|
|
|
|
tocm: true,
|
|
|
|
tocm: true,
|
|
|
|
emoji: true,
|
|
|
|
emoji: true,
|
|
|
|
taskList: true,
|
|
|
|
taskList: true,
|
|
|
|
codeFold: true,
|
|
|
|
codeFold: true,
|
|
|
|
searchReplace: true,
|
|
|
|
searchReplace: true,
|
|
|
|
htmlDecode: "style,script,iframe",
|
|
|
|
htmlDecode: "style,script,iframe",
|
|
|
|
sequenceDiagram: true,
|
|
|
|
sequenceDiagram: true,
|
|
|
|
autoFocus: false,
|
|
|
|
autoFocus: false,
|
|
|
|
toolbarIcons: function () {
|
|
|
|
toolbarIcons: function () {
|
|
|
|
// Or return editormd.toolbarModes[name]; // full, simple, mini
|
|
|
|
// Or return editormd.toolbarModes[name]; // full, simple, mini
|
|
|
|
// Using "||" set icons align right.
|
|
|
|
// Using "||" set icons align right.
|
|
|
|
return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "testIcon", "testIcon1", '|', "image", "table", '|', "watch", "clear"]
|
|
|
|
return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "testIcon", "testIcon1", '|', "image", "table", '|', "watch", "clear"]
|
|
|
|
},
|
|
|
|
},
|
|
|
|
toolbarCustomIcons: {
|
|
|
|
toolbarCustomIcons: {
|
|
|
|
testIcon: "<a type=\"inline\" class=\"latex\" ><div class='zbg'></div></a>",
|
|
|
|
testIcon: "<a type=\"inline\" class=\"latex\" ><div class='zbg'></div></a>",
|
|
|
|
testIcon1: "<a type=\"latex\" class=\"latex\" ><div class='zbg_latex'></div></a>"
|
|
|
|
testIcon1: "<a type=\"latex\" class=\"latex\" ><div class='zbg_latex'></div></a>"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
//这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。
|
|
|
|
//这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。
|
|
|
|
saveHTMLToTextarea: true,
|
|
|
|
saveHTMLToTextarea: true,
|
|
|
|
// 用于增加自定义工具栏的功能，可以直接插入HTML标签，不使用默认的元素创建图标
|
|
|
|
// 用于增加自定义工具栏的功能，可以直接插入HTML标签，不使用默认的元素创建图标
|
|
|
|
dialogMaskOpacity: 0.6,
|
|
|
|
dialogMaskOpacity: 0.6,
|
|
|
|
placeholder: placeholder,
|
|
|
|
placeholder: placeholder,
|
|
|
|
imageUpload: true,
|
|
|
|
imageUpload: true,
|
|
|
|
imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"],
|
|
|
|
imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"],
|
|
|
|
imageUploadURL: imageUrl,//url
|
|
|
|
imageUploadURL: imageUrl,//url
|
|
|
|
onload: function () {
|
|
|
|
onload: function () {
|
|
|
|
// this.previewing();
|
|
|
|
// this.previewing();
|
|
|
|
$("#" + id + " [type=\"latex\"]").bind("click", function () {
|
|
|
|
$("#" + id + " [type=\"latex\"]").bind("click", function () {
|
|
|
|
editorName.cm.replaceSelection("```latex");
|
|
|
|
editorName.cm.replaceSelection("```latex");
|
|
|
|
editorName.cm.replaceSelection("\n");
|
|
|
|
editorName.cm.replaceSelection("\n");
|
|
|
|
editorName.cm.replaceSelection("\n");
|
|
|
|
editorName.cm.replaceSelection("\n");
|
|
|
|
editorName.cm.replaceSelection("```");
|
|
|
|
editorName.cm.replaceSelection("```");
|
|
|
|
var __Cursor = editorName.cm.getDoc().getCursor();
|
|
|
|
var __Cursor = editorName.cm.getDoc().getCursor();
|
|
|
|
editorName.cm.setCursor(__Cursor.line - 1, 0);
|
|
|
|
editorName.cm.setCursor(__Cursor.line - 1, 0);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$("#" + id + " [type=\"inline\"]").bind("click", function () {
|
|
|
|
$("#" + id + " [type=\"inline\"]").bind("click", function () {
|
|
|
|
editorName.cm.replaceSelection("$$$$");
|
|
|
|
editorName.cm.replaceSelection("$$$$");
|
|
|
|
var __Cursor = editorName.cm.getDoc().getCursor();
|
|
|
|
var __Cursor = editorName.cm.getDoc().getCursor();
|
|
|
|
editorName.cm.setCursor(__Cursor.line, __Cursor.ch - 2);
|
|
|
|
editorName.cm.setCursor(__Cursor.line, __Cursor.ch - 2);
|
|
|
|
editorName.cm.focus();
|
|
|
|
editorName.cm.focus();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
$("[type=\"inline\"]").attr("title", "行内公式");
|
|
|
|
$("[type=\"inline\"]").attr("title", "行内公式");
|
|
|
|
$("[type=\"latex\"]").attr("title", "多行公式");
|
|
|
|
$("[type=\"latex\"]").attr("title", "多行公式");
|
|
|
|
|
|
|
|
|
|
|
|
window.md_elocalStorage(editorName, `UpdatepropaedeMDs_${id}`, "UpdatepropaedeMDs");
|
|
|
|
window.md_elocalStorage(editorName, `UpdatepropaedeMDs_${id}`, "UpdatepropaedeMDs");
|
|
|
|
|
|
|
|
|
|
|
|
callback && callback()
|
|
|
|
callback && callback()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
return editorName;
|
|
|
|
return editorName;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default class TPMUpdatepropaede extends Component {
|
|
|
|
export default class TPMUpdatepropaede extends Component {
|
|
|
|
constructor(props) {
|
|
|
|
constructor(props) {
|
|
|
|
super(props)
|
|
|
|
super(props)
|
|
|
|
this.state = {
|
|
|
|
this.state = {
|
|
|
|
shixunId:undefined
|
|
|
|
shixunId:undefined
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
updatepropaedeMD(initValue, id) {
|
|
|
|
updatepropaedeMD(initValue, id) {
|
|
|
|
|
|
|
|
|
|
|
|
this.contentChanged = false;
|
|
|
|
this.contentChanged = false;
|
|
|
|
const placeholder = "";
|
|
|
|
const placeholder = "";
|
|
|
|
// amp;
|
|
|
|
// amp;
|
|
|
|
// 编辑时要传memoId
|
|
|
|
// 编辑时要传memoId
|
|
|
|
const imageUrl = `/api/attachments.json`;
|
|
|
|
const imageUrl = `/api/attachments.json`;
|
|
|
|
// 创建editorMd
|
|
|
|
// 创建editorMd
|
|
|
|
|
|
|
|
|
|
|
|
const Updatepropaede_editormd = create_editorMD(id, '100%', 400, placeholder, imageUrl, () => {
|
|
|
|
const Updatepropaede_editormd = create_editorMD(id, '100%', 400, placeholder, imageUrl, () => {
|
|
|
|
setTimeout(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
Updatepropaede_editormd.resize()
|
|
|
|
Updatepropaede_editormd.resize()
|
|
|
|
Updatepropaede_editormd.cm && Updatepropaede_editormd.cm.refresh()
|
|
|
|
Updatepropaede_editormd.cm && Updatepropaede_editormd.cm.refresh()
|
|
|
|
}, 500)
|
|
|
|
}, 500)
|
|
|
|
|
|
|
|
|
|
|
|
if (initValue != undefined) {
|
|
|
|
if (initValue != undefined) {
|
|
|
|
Updatepropaede_editormd.setValue(initValue)
|
|
|
|
Updatepropaede_editormd.setValue(initValue)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
Updatepropaede_editormd.cm.on("change", (_cm, changeObj) => {
|
|
|
|
Updatepropaede_editormd.cm.on("change", (_cm, changeObj) => {
|
|
|
|
console.log('....contentChanged')
|
|
|
|
console.log('....contentChanged')
|
|
|
|
this.contentChanged = true;
|
|
|
|
this.contentChanged = true;
|
|
|
|
})
|
|
|
|
})
|
|
|
|
});
|
|
|
|
});
|
|
|
|
this.Updatepropaede_editormd = Updatepropaede_editormd;
|
|
|
|
this.Updatepropaede_editormd = Updatepropaede_editormd;
|
|
|
|
window.Updatepropaede_editormd = Updatepropaede_editormd;
|
|
|
|
window.Updatepropaede_editormd = Updatepropaede_editormd;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
componentDidMount() {
|
|
|
|
componentDidMount() {
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
let url="/shixuns/"+id+"/propaedeutics.json";
|
|
|
|
let url="/shixuns/"+id+"/propaedeutics.json";
|
|
|
|
axios.get(url).then((response) => {
|
|
|
|
axios.get(url).then((response) => {
|
|
|
|
console.log(response)
|
|
|
|
console.log(response)
|
|
|
|
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
|
|
|
|
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
|
|
|
|
|
|
|
|
|
|
|
|
}else{
|
|
|
|
}else{
|
|
|
|
this.setState({
|
|
|
|
this.setState({
|
|
|
|
shixunId:id
|
|
|
|
shixunId:id
|
|
|
|
})
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
if(response.data.content[0]!=null){
|
|
|
|
if(response.data.content[0]!=null){
|
|
|
|
this.updatepropaedeMD(response.data.content[0], "UpdatepropaedeMD");
|
|
|
|
this.updatepropaedeMD(response.data.content, "UpdatepropaedeMD");
|
|
|
|
}else{
|
|
|
|
}else{
|
|
|
|
this.updatepropaedeMD("", "UpdatepropaedeMD");
|
|
|
|
this.updatepropaedeMD("", "UpdatepropaedeMD");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}).catch((error) => {
|
|
|
|
}).catch((error) => {
|
|
|
|
console.log(error)
|
|
|
|
console.log(error)
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
updatepropaedeuticsvalue=()=>{
|
|
|
|
updatepropaedeuticsvalue=()=>{
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
let url="/shixuns/"+id+"/update_propaedeutics.json";
|
|
|
|
let url="/shixuns/"+id+"/update_propaedeutics.json";
|
|
|
|
const update_propaedeuticsvalue = this.Updatepropaede_editormd.getValue();
|
|
|
|
const update_propaedeuticsvalue = this.Updatepropaede_editormd.getValue();
|
|
|
|
axios.post(url,{
|
|
|
|
axios.post(url,{
|
|
|
|
content:update_propaedeuticsvalue
|
|
|
|
content:update_propaedeuticsvalue
|
|
|
|
}
|
|
|
|
}
|
|
|
|
).then((response) => {
|
|
|
|
).then((response) => {
|
|
|
|
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
|
|
|
|
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
|
|
|
|
|
|
|
|
|
|
|
|
}else{
|
|
|
|
}else{
|
|
|
|
this.props.showSnackbar(response.data.message);
|
|
|
|
this.props.showSnackbar(response.data.message);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}).catch((error) => {
|
|
|
|
}).catch((error) => {
|
|
|
|
console.log(error)
|
|
|
|
console.log(error)
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
render() {
|
|
|
|
render() {
|
|
|
|
|
|
|
|
|
|
|
|
let {shixunId} = this.state;
|
|
|
|
let {shixunId} = this.state;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<React.Fragment>
|
|
|
|
<React.Fragment>
|
|
|
|
<div className="educontent">
|
|
|
|
<div className="educontent">
|
|
|
|
|
|
|
|
|
|
|
|
<div className="edu-back-white mt30">
|
|
|
|
<div className="edu-back-white mt30">
|
|
|
|
<div className="font-16 pt30 pl20 pr20 pb40 bor-bottom-greyE clearfix">
|
|
|
|
<div className="font-16 pt30 pl20 pr20 pb40 bor-bottom-greyE clearfix">
|
|
|
|
<span className="fl">背景知识</span>
|
|
|
|
<span className="fl">背景知识</span>
|
|
|
|
<a href={"/shixuns/"+shixunId+"/propaedeutics"}className="color-grey-9 fr">返回</a>
|
|
|
|
<a href={"/shixuns/"+shixunId+"/propaedeutics"}className="color-grey-9 fr">返回</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="padding40-20">
|
|
|
|
<div className="padding40-20">
|
|
|
|
<div className="padding10-20 edu-back-greyf5 radius4" id="UpdatepropaedeMD">
|
|
|
|
<div className="padding10-20 edu-back-greyf5 radius4" id="UpdatepropaedeMD">
|
|
|
|
<textarea style={{display: 'none'}} id="Updatepropaedes" name="content"> </textarea>
|
|
|
|
<textarea style={{display: 'none'}} id="Updatepropaedes" name="content"> </textarea>
|
|
|
|
<div className="CodeMirror cm-s-defualt">
|
|
|
|
<div className="CodeMirror cm-s-defualt">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="clearfix mb30 mt30">
|
|
|
|
<div className="clearfix mb30 mt30">
|
|
|
|
<a className="defalutSubmitbtn fl mr20"
|
|
|
|
<a className="defalutSubmitbtn fl mr20"
|
|
|
|
onClick={this.updatepropaedeuticsvalue}>保存</a>
|
|
|
|
onClick={this.updatepropaedeuticsvalue}>保存</a>
|
|
|
|
<a href={"/shixuns/"+shixunId+"/propaedeutics"} className="defalutCancelbtn fl"
|
|
|
|
<a href={"/shixuns/"+shixunId+"/propaedeutics"} className="defalutCancelbtn fl"
|
|
|
|
>取消</a>
|
|
|
|
>取消</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</React.Fragment>
|
|
|
|
</React.Fragment>
|
|
|
|
)
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
