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

题库新编辑器

Browse Source
dev_new_shixunsrepository
杨树林 5 years ago
parent c0bfc28f02
commit d56e75324b
8 changed files with 562 additions and 304 deletions
Show Stats Download Patch File Download Diff File

1
public/react/src/common/quillForEditor/README.md
Unescape View File

@ -61,6 +61,7 @@
### 使用
````
编辑模式是放不大图片的
import QuillForEditor from 'xxx';
// 指定需要显示的工具栏信息, 不指定加载全部

23
public/react/src/modules/question/Question.js
Unescape View File

@ -66,9 +66,28 @@ class Question extends Component {
oj_status:null,
isVisible: false,
selectionbools:false,
chakanjiexiboolindex:"无",
}
}
chakanjiexibool=(index)=>{
debugger
if(this.state.chakanjiexiboolindex===index){
this.setState({
chakanjiexiboolindex:"无",
})
return
}
this.setState({
chakanjiexiboolindex:index,
})
}
setmychakanjiexibool=(str)=>{
this.setState({
chakanjiexiboolindex:str,
})
}
setdiscipline_id=(discipline_id)=>{
this.setState({
discipline_id:discipline_id,
@ -338,6 +357,8 @@ class Question extends Component {
oj_status:this.state.oj_status
};
this.getdata(data);
this.setmychakanjiexibool("无")
}
showDrawer = () => {
if(this.state.visible===true){
@ -882,6 +903,8 @@ class Question extends Component {
/>
{/*头部*/}
<Contentpart {...this.state} {...this.props}
chakanjiexiboolindex={this.state.chakanjiexiboolindex}
chakanjiexibool={(e)=>this.chakanjiexibool(e)}
getitem_basketss={(id)=>this.getitem_basketss(id)}
selectallquestionsonthispage={()=>this.selectallquestionsonthispage()}
getitem_baskets={(e)=>this.getitem_baskets(e)}

158
public/react/src/modules/question/component/ChoquesEditor.js
Unescape View File

@ -10,6 +10,7 @@ import axios from 'axios'
import update from 'immutability-helper'
import './../questioncss/questioncom.css';
import {getUrl, ActionBtn, DMDEditor, ConditionToolTip} from 'educoder';
import QuillForEditor from '../../../common/quillForEditor';
const { TextArea } = Input;
const confirm = Modal.confirm;
const $ = window.$
@ -70,10 +71,13 @@ class ChoquesEditor extends Component{
this.state = {
question_choices: _question_choices || ['', '', '', ''],
standard_answers: _standard_answers || [false, false, false, false],
question_title: this.props.question_title || '',
question_title: this.props.question_title!==undefined?JSON.parse(this.props.question_title):"",
question_type: this.props.question_type || 0,
question_score: this.props.question_score || this.props.init_question_score,
question_titles:this.props.question_titles||'',
question_titles: this.props.question_titles!==undefined?JSON.parse(this.props.question_titles):"",
question_titlesysl:this.props.question_titlesysl||'',
question_titleysl:this.props.question_title || '',
item_banksedit:[],
}
}
addOption = () => {
@ -122,12 +126,11 @@ class ChoquesEditor extends Component{
}
onSave = () => {
var editordata=[];
const {question_title, question_score, question_type,question_titles, question_choices, standard_answers } = this.state;
const {question_title, question_score,question_titleysl,question_titlesysl, question_type,question_titles, question_choices, standard_answers } = this.state;
const { question_id_to_insert_after, question_id } = this.props
// TODO check
const answerArray = standard_answers.map((item, index) => { return item == true ? index+1 : -1 }).filter(item => item != -1);
if(!question_title) {
this.refs['titleEditor'].showError()
if(!question_titleysl) {
this.props.showNotification('请您输入题干');
return editordata;
}
@ -143,14 +146,12 @@ class ChoquesEditor extends Component{
for(let i = 0; i < question_choices.length; i++) {
if (!question_choices[i]) {
this.refs[`optionEditor${i}`].showError()
this.props.showNotification(`请先输入 ${tagArray[i]} 选项的内容`);
return editordata;
}
}
if(!question_titles) {
this.refs['titleEditor2'].showError()
if(!question_titlesysl) {
this.props.showNotification('请您输入题目解析');
return editordata;
}
@ -162,7 +163,7 @@ class ChoquesEditor extends Component{
"question_choices":["a答案","b答案","c答案","d答案"],
"standard_answers":[1]
}*/
editordata=[question_title,answerArray,question_choices,question_titles];
editordata=[question_titleysl,answerArray,question_choices,question_titlesysl];
// question_title,
// question_type: answerArray.length > 1 ? 1 : 0,
// question_score,
@ -186,8 +187,10 @@ class ChoquesEditor extends Component{
try {
this.setState({
item_banksedit:this.props.item_banksedit,
question_title:this.props.item_banksedit.name,
question_titles:this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titleysl:this.props.item_banksedit.name|| '',
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
question_titlesysl:this.props.item_banksedit.analysis||'',
mychoicess:this.props.item_banksedit.choices,
})
@ -205,8 +208,10 @@ class ChoquesEditor extends Component{
if(prevProps.item_banksedit !== this.props.item_banksedit) {
this.setState({
item_banksedit: this.props.item_banksedit,
question_title: this.props.item_banksedit.name,
question_titles: this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titleysl:this.props.item_banksedit.name|| '',
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
question_titlesysl:this.props.item_banksedit.analysis||'',
mychoicess: this.props.item_banksedit.choices,
})
@ -217,15 +222,28 @@ class ChoquesEditor extends Component{
standard_answers[index] = !standard_answers[index]
this.setState({ standard_answers })
}
onOptionContentChange = (value, index) => {
onOptionContentChange = (value,quill,index) => {
if (index >= this.state.question_choices.length) {
// TODO 新建，然后删除CD选项，再输入题干，会调用到这里，且index是3
return;
}
var texts;
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
texts="";
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
texts=value;
}
let question_choices = this.state.question_choices.slice(0);
question_choices[index] = value;
this.setState({ question_choices })
question_choices[index] = texts;
console.log(question_choices);
this.setState({ question_choices });
}
on_question_score_change = (e) => {
this.setState({ question_score: e })
}
@ -241,6 +259,41 @@ class ChoquesEditor extends Component{
toShowMode = () => {
}
onContentChange=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titleysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titleysl:value
})
}
}
onContentChanges=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titlesysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titlesysl:value
})
}
}
render() {
let { question_title, question_score, question_type, question_choices, standard_answers,question_titles} = this.state;
let { question_id, index, exerciseIsPublish,
@ -271,7 +324,7 @@ class ChoquesEditor extends Component{
flex:1
}
.optionRow {
margin:0px!important;
/* margin:0px!important; */
/* margin-bottom: 20px!important; */
}
.signleEditor .content_editorMd_show{
@ -291,11 +344,14 @@ class ChoquesEditor extends Component{
<span className="xingtigan fl">题干：</span>
</p>
<TPMMDEditor mdID={qNumber} placeholder="请您输入题干" height={155} className=" mt10"
initValue={question_title} onChange={(val) => this.setState({ question_title: val})}
ref="titleEditor"
<QuillForEditor
style={{ height: '155px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={question_title}
onContentChange={this.onContentChange}
></TPMMDEditor>
/>
<div className="mb10 sortinxdirection">
{/* {!question_id ? '新建' : '编辑'} */}
@ -305,7 +361,7 @@ class ChoquesEditor extends Component{
{question_choices.map( (item, index) => {
const bg = standard_answers[index] ? 'check-option-bg' : ''
return <div className="df optionRow " >
return <div className={index>0?"df optionRow mt15": "df optionRow"} >
{/* 点击设置答案 */}
{/* TODO 加了tooltip后，会丢失掉span的class */}
{/* <Tooltip title={standard_answers[index] ? '点击取消标准答案设置' : '点击设置为标准答案'}> */}
@ -317,13 +373,26 @@ class ChoquesEditor extends Component{
</span>
{/* </Tooltip> */}
<div style={{ flex: '0 0 1038px'}}>
<DMDEditor
ref={`optionEditor${index}`}
toMDMode={this.toMDMode} toShowMode={this.toShowMode}
height={166} className={'optionMdEditor'} noStorage={true}
mdID={qNumber + index} placeholder="" onChange={(value) => this.onOptionContentChange(value, index)}
initValue={item}
></DMDEditor>
{
item===undefined||item===null||item===""?
<QuillForEditor
style={{ height: '166px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={item}
onContentChange={(value,quill) => this.onOptionContentChange(value,quill,index)}
/>
:
<QuillForEditor
style={{ height: '166px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={JSON.parse(item)}
onContentChange={(value,quill) => this.onOptionContentChange(value,quill,index)}
/>
}
</div>
{exerciseIsPublish || index<=2?
<i className=" font-18 ml15 mr20"></i>
@ -346,32 +415,19 @@ class ChoquesEditor extends Component{
<p className="mb10 clearfix">
<p className="mb10 mt10 clearfix">
{/* {!question_id ? '新建' : '编辑'} */}
<span className="xingcolor font-16 fl mr4">*</span>
<span className="xingtigan fl">题目解析：</span>
</p>
<style>{`
.optionMdEditor {
flex:1
}
.optionRow {
margin:0px!important;
/* margin-bottom: 20px!important; */
}
.signleEditor .content_editorMd_show{
display: flex;
margin-top:0px!important;
border-radius:2px;
max-width: 1056px;
word-break:break-all;
}
`}</style>
<TPMMDEditor mdID={qNumber+question_choices.length} placeholder="请您输入题目解析" height={155} className=" mt10"
initValue={question_titles} onChange={(val) => this.setState({ question_titles: val})}
ref="titleEditor2"
></TPMMDEditor>
<div className="mt10"></div>
<QuillForEditor
style={{height: '166px' }}
placeholder="请您输入题目解析"
options={['code-block', 'image', 'formula']}
value={question_titles}
onContentChange={this.onContentChanges}
/>
</div>

13
public/react/src/modules/question/component/Contentpart.js
Unescape View File

@ -25,7 +25,6 @@ class Contentpart extends Component {
this.state = {
page:1,
chakanjiexibool:false,
chakanjiexiboolindex:"无",
}
}
//初始化
@ -35,16 +34,7 @@ class Contentpart extends Component {
}
chakanjiexibool=(index)=>{
debugger
if(this.state.chakanjiexiboolindex===index){
this.setState({
chakanjiexiboolindex:"无",
})
return
}
this.setState({
chakanjiexiboolindex:index,
})
this.props.chakanjiexibool(index);
}
render() {
@ -230,6 +220,7 @@ class Contentpart extends Component {
: this.props.Contentdata.items.map((object, index) => {
return (
<Listjihe {...this.state} {...this.props}
chakanjiexiboolindex={this.props.chakanjiexiboolindex}
chakanjiexibool={(keindex)=>this.chakanjiexibool(keindex)}
listjihe={index+1}
keindex={index}

181
public/react/src/modules/question/component/JudquestionEditor.js
Unescape View File

@ -10,6 +10,8 @@ import axios from 'axios'
import update from 'immutability-helper'
import './../questioncss/questioncom.css';
import {getUrl, ActionBtn, DMDEditor, ConditionToolTip} from 'educoder';
import QuillForEditor from '../../../common/quillForEditor';
const { TextArea } = Input;
const confirm = Modal.confirm;
const $ = window.$
@ -46,10 +48,12 @@ class JudquestionEditor extends Component{
this.state = {
question_choices: _question_choices || ['', '', '', ''],
standard_answers: _standard_answers || [false, false, false, false],
question_title: this.props.question_title || '',
question_title: this.props.question_title!==undefined?JSON.parse(this.props.question_title):"",
question_type: this.props.question_type || 0,
question_score: this.props.question_score || this.props.init_question_score,
question_titles:this.props.question_titles||'',
question_titles: this.props.question_titles!==undefined?JSON.parse(this.props.question_titles):"",
question_titlesysl:this.props.question_titlesysl||'',
question_titleysl:this.props.question_title || '',
zqda:null,
item_banksedit:[],
mychoicess:[],
@ -99,12 +103,11 @@ class JudquestionEditor extends Component{
}
onSave = () => {
var editordata=[];
const {question_title, question_score, question_type,question_titles, zqda,question_choices, standard_answers } = this.state;
const {question_title, question_score,question_titleysl,question_titlesysl, question_type,question_titles, zqda,question_choices, standard_answers } = this.state;
const { question_id_to_insert_after, question_id } = this.props
// TODO check
const answerArray = standard_answers.map((item, index) => { return item == true ? index+1 : -1 }).filter(item => item != -1);
if(!question_title) {
this.refs['titleEditor'].showError()
if(!question_titleysl) {
this.props.showNotification('请您输入题干');
return editordata;
}
@ -117,8 +120,7 @@ class JudquestionEditor extends Component{
if(!question_titles) {
this.refs['titleEditor2'].showError()
if(!question_titlesysl) {
this.props.showNotification('请您输入题目解析');
return editordata;
}
@ -132,7 +134,7 @@ class JudquestionEditor extends Component{
}*/
editordata=[question_title,zqda,question_titles];
editordata=[question_titleysl,zqda,question_titlesysl];
// question_title,
// question_type: answerArray.length > 1 ? 1 : 0,
// question_score,
@ -156,31 +158,31 @@ class JudquestionEditor extends Component{
try {
this.setState({
item_banksedit:this.props.item_banksedit,
question_title:this.props.item_banksedit.name,
question_titles:this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
mychoicess:this.props.item_banksedit.choices,
})
if(this.props.item_banksedit){
if(this.props.item_banksedit.choices){
for(var ik=0;ik<this.props.item_banksedit.choices.length;ik++ ){
if( this.props.item_banksedit.choices[ik].choice_text==="正确"){
if( this.props.item_banksedit.choices[ik].is_answer===true){
this.setState({
zqda:"0"
})
}
}else{
if( this.props.item_banksedit.choices[ik].is_answer===true){
this.setState({
zqda:"1"
})
}
}
}
}
}
// if(this.props.item_banksedit){
// if(this.props.item_banksedit.choices){
// for(var ik=0;ik<this.props.item_banksedit.choices.length;ik++ ){
// if( this.props.item_banksedit.choices[ik].choice_text==="正确"){
// if( this.props.item_banksedit.choices[ik].is_answer===true){
// this.setState({
// zqda:"0"
// })
// }
//
// }else{
// if( this.props.item_banksedit.choices[ik].is_answer===true){
// this.setState({
// zqda:"1"
// })
// }
// }
// }
// }
// }
}catch (e) {
}
@ -194,31 +196,31 @@ class JudquestionEditor extends Component{
if(prevProps.item_banksedit !== this.props.item_banksedit){
this.setState({
item_banksedit:this.props.item_banksedit,
question_title:this.props.item_banksedit.name,
question_titles:this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
mychoicess:this.props.item_banksedit.choices,
})
if(this.props.item_banksedit){
if(this.props.item_banksedit.choices){
for(var ik=0;ik<this.props.item_banksedit.choices.length;ik++ ){
if( this.props.item_banksedit.choices[ik].choice_text==="正确"){
if( this.props.item_banksedit.choices[ik].is_answer===true){
this.setState({
zqda:"0"
})
}
}else{
if( this.props.item_banksedit.choices[ik].is_answer===true){
this.setState({
zqda:"1"
})
}
}
}
}
}
// if(this.props.item_banksedit){
// if(this.props.item_banksedit.choices){
// for(var ik=0;ik<this.props.item_banksedit.choices.length;ik++ ){
// if( this.props.item_banksedit.choices[ik].choice_text==="正确"){
// if( this.props.item_banksedit.choices[ik].is_answer===true){
// this.setState({
// zqda:"0"
// })
// }
//
// }else{
// if( this.props.item_banksedit.choices[ik].is_answer===true){
// this.setState({
// zqda:"1"
// })
// }
// }
// }
// }
// }
}
}
@ -275,6 +277,39 @@ class JudquestionEditor extends Component{
})
}
onContentChange=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titleysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titleysl:value
})
}
}
onContentChanges=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titlesysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titlesysl:value
})
}
}
render() {
let { question_title, question_score, question_type, question_choices, standard_answers,question_titles} = this.state;
let { question_id, index, exerciseIsPublish,
@ -325,11 +360,14 @@ class JudquestionEditor extends Component{
<span className="xingtigan fl">题干：</span>
</p>
<TPMMDEditor mdID={qNumber} placeholder="请您输入题干" height={155} className=" mt10"
initValue={question_title} onChange={(val) => this.setState({ question_title: val})}
ref="titleEditor"
<QuillForEditor
style={{ height: '155px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={question_title}
onContentChange={this.onContentChange}
></TPMMDEditor>
/>
<div className="mb10 sortinxdirection">
{/* {!question_id ? '新建' : '编辑'} */}
@ -363,36 +401,23 @@ class JudquestionEditor extends Component{
<div>
<div className="mt10">
<p className="mb10 clearfix">
{/* {!question_id ? '新建' : '编辑'} */}
<span className="xingcolor font-16 fl mr4">*</span>
<span className="xingtigan fl">题目解析：</span>
</p>
<style>{`
.optionMdEditor {
flex:1
}
.optionRow {
margin:0px!important;
/* margin-bottom: 20px!important; */
}
.signleEditor .content_editorMd_show{
display: flex;
margin-top:0px!important;
border-radius:2px;
max-width: 1056px;
word-break:break-all;
}
`}</style>
<TPMMDEditor mdID={qNumber+question_choices.length} placeholder="请您输入题目解析" height={155} className=" mt10"
initValue={question_titles} onChange={(val) => this.setState({ question_titles: val})}
ref="titleEditor2"
></TPMMDEditor>
<QuillForEditor
style={{height: '166px' }}
placeholder="请您输入题目解析"
options={['code-block', 'image', 'formula']}
value={question_titles}
onContentChange={this.onContentChanges}
/>
</div>
</div>
</div>
)

287
public/react/src/modules/question/component/Listjihe.js
Unescape View File

@ -1,6 +1,6 @@
import React, {Component} from "react";
import {Link, NavLink} from 'react-router-dom';
import {WordsBtn, ActionBtn,SnackbarHOC,getImageUrl,markdownToHTML} from 'educoder';
import {WordsBtn, ActionBtn, SnackbarHOC, getImageUrl, markdownToHTML} from 'educoder';
import axios from 'axios';
import {
notification,
@ -10,6 +10,8 @@ import {
Radio
} from "antd";
import './../questioncss/questioncom.css';
import QuillForEditor from "../../../common/quillForEditor";
const tagArray = [
'A．', 'B．', 'C．', 'D．', 'E．', 'F．', 'G．', 'H．', 'I．',
'J．', 'K．', 'L．', 'M．', 'N．', 'O．', 'P．', 'Q．', 'R．',
@ -20,74 +22,73 @@ const tagArrays = [
'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R',
'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'
]
class Listjihe extends Component {
constructor(props) {
super(props);
this.state = {
page:1,
name:"单选题",
nd:"简单",
page: 1,
name: "单选题",
nd: "简单",
}
}
//初始化
componentDidMount(){
componentDidMount() {
}
//选用
Selectingpracticaltraining=(id)=>{
let data={}
if(this.props.exam_id===undefined){
data={
item_ids:[id]
Selectingpracticaltraining = (id) => {
let data = {}
if (this.props.exam_id === undefined) {
data = {
item_ids: [id]
}
}else{
data={
item_ids:[id],
exam_id:this.props.exam_id===undefined?"":parseInt(this.props.exam_id),
} else {
data = {
item_ids: [id],
exam_id: this.props.exam_id === undefined ? "" : parseInt(this.props.exam_id),
}
}
}
this.props.getitem_baskets(data);
}
//撤销
Selectingpracticaltrainings=(id)=>{
Selectingpracticaltrainings = (id) => {
this.props.getitem_basketss(id);
}
render() {
let {page,name,nd}=this.state;
let {defaultActiveKey,items,listjihe,chakanjiexiboolindex,keindex}=this.props;
let {page, name, nd} = this.state;
let {defaultActiveKey, items, listjihe, chakanjiexiboolindex, keindex} = this.props;
// 编程答案
var rightkey=null
var rightkey = null
if(items){
if(items.item_type){
if(items.item_type==="PROGRAM"){
if (items) {
if (items.item_type) {
if (items.item_type === "PROGRAM") {
}else{
if(items.item_type==="JUDGMENT") {
} else {
if (items.item_type === "JUDGMENT") {
if(items.choices){
if(items.choices.length>0){
var arr= items.choices;
for(let data of arr) {
if(data.is_answer===true){
rightkey=data.choice_text;
if (items.choices) {
if (items.choices.length > 0) {
var arr = items.choices;
for (let data of arr) {
if (data.is_answer === true) {
rightkey = data.choice_text;
break;
}
}
}
}
}else {
} else {
if (items.choices) {
if (items.choices.length > 0) {
var arr = items.choices;
@ -106,11 +107,41 @@ class Listjihe extends Component {
}
}
var itemssname="";
try {
itemssname= JSON.parse(items.name);
}catch (e) {
}
if(itemssname===undefined){
itemssname=items.name
}
return (
<div key={keindex} className={chakanjiexiboolindex===keindex?"w100s borderwds283 pd20 mb20 listjihecolors":"w100s borderwds pd20 mb20 listjihecolors"}>
<div key={keindex}
className={chakanjiexiboolindex === keindex ? "w100s borderwds283 pd20 mb20 listjihecolors" : "w100s borderwds pd20 mb20 listjihecolors"}>
{/*顶部*/}
<style>
{
` .markdown-body .ql-editor{
padding-left: 0px;
}
.markdown-body .ql-editor p{
line-height: 0px;
}
.programquill .ql-editor{
padding-left: 0px;
}
.programquill .ql-editor p{
line-height: 0px;
}
`
}
</style>
<div className="w100s sortinxdirection">
<div className="listjihetixingstitsy">
{
@ -120,17 +151,36 @@ class Listjihe extends Component {
<div className="listjihetixingstitsy">
.
</div>
<div className="ml10 w100s listjihetixingstit markdown-body" style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(items&&items.name).replace(/▁/g, "▁▁▁")}}>
</div>
{
items.item_type==="PROGRAM"?
<div className="ml10 w100s listjihetixingstit markdown-body" style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(items&&items.name).replace(/▁/g, "▁▁▁")}}></div>
:
<div className="ml10 w100s listjihetixingstit markdown-body" style={{wordBreak: "break-word"}}>
{ items===undefined||items===null||items===""?"":
items.name === undefined || items.name === null || items.name === "" ?
""
:
items.name.length>0?
<QuillForEditor
readOnly={true}
value={itemssname}
/>
:""
}
</div>
}
</div>
{/*内容*/}
<div className="w100s sortinxdirection ">
{items.item_type==="JUDGMENT"?
<p className="w100s listjihetixingstits sortinxdirection ">
{items.item_type === "JUDGMENT" ?
<p className="w100s listjihetixingstitsp sortinxdirection ">
{
items === undefined ||items === null? "" : items.choices.map((object, index) => {
items === undefined || items === null ? "" : items.choices.map((object, index) => {
return (
<p className={index===1? "sortinxdirection ml10":"sortinxdirection " } >
<p className={index === 1 ? "sortinxdirection ml10" : "sortinxdirection "}>
<Radio disabled={false}>
{object.choice_text}
</Radio>
@ -138,21 +188,52 @@ class Listjihe extends Component {
)
})
}
</p>:
items.item_type==="PROGRAM"?
</p> :
items.item_type === "PROGRAM" ?
<p className="w100s listjihetixingstitssy sortinxdirection ">
<p className={"sortinxdirection mt15"} >
<p style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(items.program_attr.description).replace(/▁/g, "▁▁▁")}}></p>
<p className={"sortinxdirection mt15"}>
{
items&&items.program_attr&&items.program_attr.description?
<p className="programquill" style={{wordBreak: "break-word"}}
>
<QuillForEditor
readOnly={true}
value={JSON.parse(items.program_attr.description)}
/>
</p>
:""
}
</p>
</p>
:
<p className="w100s listjihetixingstits verticallayout ">
<p className="w100s listjihetixingstitsp verticallayout ">
{
items === undefined ||items === null? "" : items.choices.map((object, index) => {
items === undefined || items === null ? "" : items.choices.map((object, index) => {
return (
<p className={index===0?"sortinxdirection":"sortinxdirection mt15"} >
{tagArray[index]}
<p style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(object.choice_text).replace(/▁/g, "▁▁▁")}}></p>
<p className={index === 0 ? "sortinxdirection " : "sortinxdirection mt15 "}>
<p className="lh26">{tagArray[index]}</p>
<p className="programquill" style={{wordBreak: "break-word"}}>
{object ?
object.choice_text === undefined || object.choice_text=== null || object.choice_text === "" ?
""
:
object.choice_text.length>0?
<QuillForEditor
readOnly={true}
value={JSON.parse(object.choice_text)}
/>
:""
:
""
}
</p>
</p>
)
})
@ -163,91 +244,95 @@ class Listjihe extends Component {
<div className="w100s sortinxdirection mt10">
<p className="listjihetixing">难度：<span >{items.difficulty===1?"简单":items.difficulty===2?"适中":items.difficulty===3?"困难":""}</span></p>
<p className="ml30 listjihetixing">题型：<span >{items.item_type==="SINGLE"?"单选题":items.item_type==="MULTIPLE"?"多选题":items.item_type==="JUDGMENT"?"判断题":items.item_type==="PROGRAM"?"编程题":""}</span></p>
<p
className="listjihetixing">难度：<span>{items.difficulty === 1 ? "简单" : items.difficulty === 2 ? "适中" : items.difficulty === 3 ? "困难" : ""}</span>
</p>
<p
className="ml30 listjihetixing">题型：<span>{items.item_type === "SINGLE" ? "单选题" : items.item_type === "MULTIPLE" ? "多选题" : items.item_type === "JUDGMENT" ? "判断题" : items.item_type === "PROGRAM" ? "编程题" : ""}</span>
</p>
</div>
{/*更新时间*/}
<div className="w100s sortinxdirection">
<div className="w50s listjihetixingstit sortinxdirection">
<p className="updatetimes lh30">更新时间：{items.update_time}</p>
{
this.props.defaultActiveKey==="0"||this.props.defaultActiveKey===0?
this.props.defaultActiveKey === "0" || this.props.defaultActiveKey === 0 ?
""
:
<p className="updatetimes lh30 ml45">创建者：{items.author.name}</p>
}
{
items.item_type==="PROGRAM"?
items.item_type === "PROGRAM" ?
<p className="updatetimes lh30 ml45">编程语言：{items.program_attr.language}</p>
:""
: ""
}
{
items.item_type==="PROGRAM"?
items.program_attr.status===0?
items.item_type === "PROGRAM" ?
items.program_attr.status === 0 ?
<p className="updatetimes lh30 ml45 nofabu mt5">未发布</p>
:""
:""
: ""
: ""
}
</div>
<div className="w50s xaxisreverseorder">
{
items.choosed===true?
<p className="selectionss xiaoshou" onClick={()=>this.Selectingpracticaltrainings(items.id)}>
items.choosed === true ?
<p className="selectionss xiaoshou" onClick={() => this.Selectingpracticaltrainings(items.id)}>
<i className="iconfont icon-jianhao font-12 lg ml7 lh30 icontianjiadaohangcolor mr5"></i>
<span className="mr15 lh30">撤销</span></p>
:
items.item_type==="PROGRAM"?
items.program_attr.status===0?
<p className="selectionys jinzhixiaoshou" >
items.item_type === "PROGRAM" ?
items.program_attr.status === 0 ?
<p className="selectionys jinzhixiaoshou">
<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr5"></i>
<span className="mr15 lh30">选用</span>
</p>
:
<p className="selection xiaoshou" onClick={()=>this.Selectingpracticaltraining(items.id)}>
<p className="selection xiaoshou" onClick={() => this.Selectingpracticaltraining(items.id)}>
<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr5"></i>
<span className="mr15 lh30">选用</span>
</p>
:
<p className="selection xiaoshou" onClick={()=>this.Selectingpracticaltraining(items.id)}>
<p className="selection xiaoshou" onClick={() => this.Selectingpracticaltraining(items.id)}>
<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr5"></i>
<span className="mr15 lh30">选用</span>
</p>
}
{
defaultActiveKey===0||defaultActiveKey==="0"?
defaultActiveKey === 0 || defaultActiveKey === "0" ?
<div className="xaxisreverseorder">
<p className="viewparsings xiaoshou mr25" onClick={()=>this.props.showmodelysl(items.id)}>
<p className="viewparsings xiaoshou mr25" onClick={() => this.props.showmodelysl(items.id)}>
<i className="iconfont icon-shanchu1 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
<span>删除</span>
</p>
{
items.item_type==="PROGRAM"?
items.item_type === "PROGRAM" ?
<a href={`/problems/${items.program_attr.identifier}/edit`}>
<p className="viewparsings xiaoshou mr25" >
<p className="viewparsings xiaoshou mr25">
<i className="iconfont icon-bianji2 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
<span>编辑</span>
</p>
</a>
:
<a href={`/question/edit/${items.id}`}>
<p className="viewparsings xiaoshou mr25" >
<p className="viewparsings xiaoshou mr25">
<i className="iconfont icon-bianji2 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
<span>编辑</span>
</p>
</a>
}
{
items.public===false?
items.item_type==="PROGRAM"?
items.program_attr.status===0?
items.public === false ?
items.item_type === "PROGRAM" ?
items.program_attr.status === 0 ?
""
:
<p className="viewparsings xiaoshou mr25" onClick={()=>this.props.showmodels(items.id)}>
<p className="viewparsings xiaoshou mr25" onClick={() => this.props.showmodels(items.id)}>
<i className="iconfont icon-gongkai font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
<span>公开</span>
</p>
:
<p className="viewparsings xiaoshou mr25" onClick={()=>this.props.showmodels(items.id)}>
<p className="viewparsings xiaoshou mr25" onClick={() => this.props.showmodels(items.id)}>
<i className="iconfont icon-gongkai font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
<span>公开</span>
</p>
@ -256,54 +341,65 @@ class Listjihe extends Component {
}
</div>
:""
: ""
}
{
items.item_type==="PROGRAM"?
items.item_type === "PROGRAM" ?
""
:
<p className="viewparsings xiaoshou mr25" onClick={()=>this.props.chakanjiexibool(keindex)}>
<p className="viewparsings xiaoshou mr25" onClick={() => this.props.chakanjiexibool(keindex)}>
<i className="iconfont icon-jiexi font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
查看解析</p>
}
</div>
</div>
{
chakanjiexiboolindex===keindex?<div>
chakanjiexiboolindex === keindex ? <div>
<div className="w100s questiontypeheng mt23">
</div>
<div className=" sortinxdirection mt15 yldxtit" >
<div className=" sortinxdirection mt15 yldxtit">
{
items.item_type==="SINGLE" || items.item_type==="MULTIPLE"?
items.item_type === "SINGLE" || items.item_type === "MULTIPLE" ?
<p className=" testfondex yldxtit"
style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("答案："+tagArrays[rightkey]).replace(/▁/g, "▁▁▁")}}
style={{wordBreak: "break-word"}}
dangerouslySetInnerHTML={{__html: markdownToHTML("答案：" + tagArrays[rightkey]).replace(/▁/g, "▁▁▁")}}
>
</p>
:
<p className=" testfondex yldxtit"
style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("答案："+rightkey).replace(/▁/g, "▁▁▁")}}
style={{wordBreak: "break-word"}}
dangerouslySetInnerHTML={{__html: markdownToHTML("答案：" + rightkey).replace(/▁/g, "▁▁▁")}}
>
</p>
}
</div>
{
items&&items.analysis?
""
:""
}
<div className=" sortinxdirection mt15 yldxtit" >
<p className=" testfondex yldxtit"
style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("解析："+items.analysis).replace(/▁/g, "▁▁▁")}}
<div className=" sortinxdirection mt15 yldxtit">
<p className=" testfondex yldxtit programquill"
style={{wordBreak: "break-word"}}
>
{items ?
items.analysis=== undefined || items.analysis=== null || items.analysis === "" ?
""
:
items.analysis.length>0?
<QuillForEditor
readOnly={true}
value={JSON.parse(items.analysis)}
/>
:
""
:
""
}
</p>
</div>
</div>:""
</div> : ""
}
@ -313,4 +409,5 @@ class Listjihe extends Component {
}
}
export default Listjihe;

194
public/react/src/modules/question/component/SingleEditor.js
Unescape View File

@ -75,10 +75,12 @@ class SingleEditor extends Component{
this.state = {
question_choices: _question_choices || ['', '', '', ''],
standard_answers: _standard_answers || [false, false, false, false],
question_title: this.props.question_title || '',
question_title: this.props.question_title!==undefined?JSON.parse(this.props.question_title):"",
question_type: this.props.question_type || 0,
question_score: this.props.question_score || this.props.init_question_score,
question_titles:this.props.question_titles||'',
question_titles: this.props.question_titles!==undefined?JSON.parse(this.props.question_titles):"",
question_titlesysl:this.props.question_titlesysl||'',
question_titleysl:this.props.question_title || '',
item_banksedit:[],
}
}
@ -121,12 +123,21 @@ class SingleEditor extends Component{
}
onSave = () => {
var editordata=[];
const {question_title, question_score, question_type,question_titles, question_choices, standard_answers } = this.state;
const {question_title, question_titleysl,question_score, question_type,question_titles,question_titlesysl, question_choices, standard_answers } = this.state;
const { question_id_to_insert_after, question_id } = this.props
// TODO check
const answerArray = standard_answers.map((item, index) => { return item == true ? index+1 : -1 }).filter(item => item != -1);
if(!question_title) {
this.refs['titleEditor'].showError()
// const _text = quill.getText();
// const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
// if (!reg.test(_text)) {
// // 处理编辑器内容为空
// } else {
// // 提交到后台的内容需要处理一下;
// value = JSON.stringify(value)
// }
if(!question_titleysl) {
// this.refs['titleEditor'].showError()
this.props.showNotification('请您输入题干');
return editordata;
}
@ -139,14 +150,13 @@ class SingleEditor extends Component{
for(let i = 0; i < question_choices.length; i++) {
if (!question_choices[i]) {
this.refs[`optionEditor${i}`].showError()
// this.refs[`optionEditor${i}`].showError()
this.props.showNotification(`请先输入 ${tagArray[i]} 选项的内容`);
return editordata;
}
}
if(!question_titles) {
this.refs['titleEditor2'].showError()
if(!question_titlesysl) {
this.props.showNotification('请您输入题目解析');
return editordata;
}
@ -158,7 +168,7 @@ class SingleEditor extends Component{
"question_choices":["a答案","b答案","c答案","d答案"],
"standard_answers":[1]
}*/
editordata=[question_title,answerArray,question_choices,question_titles];
editordata=[question_titleysl,answerArray,question_choices,question_titlesysl];
// question_title,
// question_type: answerArray.length > 1 ? 1 : 0,
// question_score,
@ -184,8 +194,10 @@ class SingleEditor extends Component{
try {
this.setState({
item_banksedit:this.props.item_banksedit,
question_title:this.props.item_banksedit.name,
question_titles:this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titleysl:this.props.item_banksedit.name|| '',
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
question_titlesysl:this.props.item_banksedit.analysis||'',
mychoicess:this.props.item_banksedit.choices,
})
@ -204,8 +216,10 @@ class SingleEditor extends Component{
if(prevProps.item_banksedit !== this.props.item_banksedit) {
this.setState({
item_banksedit: this.props.item_banksedit,
question_title: this.props.item_banksedit.name,
question_titles: this.props.item_banksedit.analysis,
question_title: this.props.item_banksedit.name!==undefined?JSON.parse(this.props.item_banksedit.name):"",
question_titleysl:this.props.item_banksedit.name|| '',
question_titles: this.props.item_banksedit.analysis!==undefined?JSON.parse(this.props.item_banksedit.analysis):"",
question_titlesysl:this.props.item_banksedit.analysis||'',
mychoicess: this.props.item_banksedit.choices,
})
@ -229,14 +243,26 @@ class SingleEditor extends Component{
// standard_answers[index] = !standard_answers[index];
this.setState({ standard_answers })
}
onOptionContentChange = (value, index) => {
onOptionContentChange = (value,quill,index) => {
if (index >= this.state.question_choices.length) {
// TODO 新建，然后删除CD选项，再输入题干，会调用到这里，且index是3
return;
}
var texts;
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
texts="";
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
texts=value;
}
let question_choices = this.state.question_choices.slice(0);
question_choices[index] = value;
this.setState({ question_choices })
question_choices[index] = texts;
console.log(question_choices);
this.setState({ question_choices });
}
on_question_score_change = (e) => {
this.setState({ question_score: e })
@ -254,11 +280,46 @@ class SingleEditor extends Component{
}
onContentChange=(e)=>{
console.log(e);
onContentChange=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titleysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titleysl:value
})
}
}
onContentChanges=(value,quill)=>{
const _text = quill.getText();
const reg = /^[\s\S]*.*[^\s][\s\S]*$/;
if (!reg.test(_text)) {
// 处理编辑器内容为空
this.setState({
question_titlesysl:""
})
} else {
// 提交到后台的内容需要处理一下;
value = JSON.stringify(value)
this.setState({
question_titlesysl:value
})
}
}
handleShowImage = (url) => {
console.log("点击了图片放大");
console.log(url);
alert(url);
}
render() {
let { question_title, question_score, question_type, question_choices, standard_answers,question_titles} = this.state;
let { question_title, question_score, question_type, question_choices, standard_answers,question_titles,question_titlesysl} = this.state;
let { question_id, index, exerciseIsPublish,
// question_title,
// question_type,
@ -279,7 +340,6 @@ class SingleEditor extends Component{
// ////console.log("xuanzheshijuan");
// ////console.log(answerTagArray);
// ////console.log(!exerciseIsPublish);
return(
<div className="padding20-30 signleEditor danxuano" id={qNumber}>
<style>{`
@ -287,7 +347,7 @@ class SingleEditor extends Component{
flex:1
}
.optionRow {
margin:0px!important;
/* margin:0px!important; */
/* margin-bottom: 20px!important; */
}
.signleEditor .content_editorMd_show{
@ -307,21 +367,16 @@ class SingleEditor extends Component{
<span className="xingtigan fl">题干：</span>
</p>
<TPMMDEditor mdID={qNumber} placeholder="请您输入题干" height={155} className=" mt10"
initValue={question_title} onChange={(val) => this.setState({ question_title: val})}
ref="titleEditor"
<QuillForEditor
style={{ height: '155px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={question_title}
onContentChange={this.onContentChange}
></TPMMDEditor>
/>
{/*<QuillForEditor*/}
{/* style={{ height: '155px'}}*/}
{/* placeholder="请您输入题干"*/}
{/* value={question_title}*/}
{/* options={['code-block', 'image', 'formula']}*/}
{/* onContentChange={this.onContentChange}*/}
{/*/>*/}
<div className="mb10 sortinxdirection">
<div className="mb10 mt10 sortinxdirection">
{/* {!question_id ? '新建' : '编辑'} */}
<span className="xingcolor font-16 fl mr4">*</span>
<span className="xingtigans fl"><span className="xingtigan">答案选项：</span>点击答案可设置正确答案</span>
@ -329,11 +384,11 @@ class SingleEditor extends Component{
{question_choices.map( (item, index) => {
const bg = standard_answers[index] ? 'check-option-bg' : ''
return <div className="df optionRow " >
return <div className={index>0?"df optionRow mt15": "df optionRow"} key={index} >
{/* 点击设置答案 */}
{/* TODO 加了tooltip后，会丢失掉span的class */}
{/* <Tooltip title={standard_answers[index] ? '点击取消标准答案设置' : '点击设置为标准答案'}> */}
<span class={`option-item fr mr10 color-grey select-choice ${bg} `}
<span className={`option-item fr mr10 color-grey select-choice ${bg} `}
name="option_span" onClick={() => this.onOptionClick(index)} style={{flex: '0 0 38px'}}>
<ConditionToolTip title={standard_answers[index] ? '' : '点击设置为标准答案'} placement="left" condition={true}>
<div style={{width: '100%', height: '100%'}}>{tagArray[index]}</div>
@ -341,13 +396,30 @@ class SingleEditor extends Component{
</span>
{/* </Tooltip> */}
<div style={{ flex: '0 0 1038px'}}>
<DMDEditor
ref={`optionEditor${index}`}
toMDMode={this.toMDMode} toShowMode={this.toShowMode}
height={166} className={'optionMdEditor'} noStorage={true}
mdID={qNumber + index} placeholder="" onChange={(value) => this.onOptionContentChange(value, index)}
initValue={item}
></DMDEditor>
{
item===undefined||item===null||item===""?
<QuillForEditor
style={{ height: '166px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={item}
onContentChange={(value,quill) => this.onOptionContentChange(value,quill,index)}
/>
:
<QuillForEditor
style={{ height: '166px'}}
placeholder="请您输入题干"
options={['code-block', 'image', 'formula']}
value={JSON.parse(item)}
onContentChange={(value,quill) => this.onOptionContentChange(value,quill,index)}
/>
}
</div>
{exerciseIsPublish || index<=1?
<i className=" font-18 ml15 mr20"></i>
@ -366,36 +438,20 @@ class SingleEditor extends Component{
<div>
<p className="mb10 clearfix">
<div className="mt10">
<p className="mb10 clearfix">
{/* {!question_id ? '新建' : '编辑'} */}
<span className="xingcolor font-16 fl mr4">*</span>
<span className="xingtigan fl">题目解析：</span>
</p>
<style>{`
.optionMdEditor {
flex:1
}
.optionRow {
margin:0px!important;
/* margin-bottom: 20px!important; */
}
.signleEditor .content_editorMd_show{
display: flex;
margin-top:0px!important;
border-radius:2px;
max-width: 1056px;
word-break:break-all;
}
`}</style>
<TPMMDEditor mdID={qNumber+question_choices.length} placeholder="请您输入题目解析" height={155} className=" mt10"
initValue={question_titles} onChange={(val) => this.setState({ question_titles: val})}
ref="titleEditor2"
></TPMMDEditor>
<div className="mt10"></div>
<QuillForEditor
style={{height: '166px' }}
placeholder="请您输入题目解析"
options={['code-block', 'image', 'formula']}
value={question_titles}
onContentChange={this.onContentChanges}
/>
</div>

9
public/react/src/modules/question/questioncss/questioncom.css
Unescape View File

@ -332,6 +332,12 @@
line-height:19px;
margin-top: 19px;
}
.listjihetixingstitsp{
color: #333333;
font-size: 14px;
line-height:19px;
margin-top: 10px;
}
.listjihetixingstitssy{
color: #333333;
font-size: 14px;
@ -939,3 +945,6 @@
.searchwidth{
width: 347px !important;
}
.lh26{
line-height: 26px !important;
}

Write Preview
Loading…
Cancel
Save