|
|
|
@ -4,12 +4,12 @@
|
|
|
|
* @Github:
|
|
|
|
* @Github:
|
|
|
|
* @Date: 2019-11-20 10:35:40
|
|
|
|
* @Date: 2019-11-20 10:35:40
|
|
|
|
* @LastEditors : tangjiang
|
|
|
|
* @LastEditors : tangjiang
|
|
|
|
* @LastEditTime : 2019-12-27 14:30:55
|
|
|
|
* @LastEditTime : 2020-01-03 09:20:12
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
import './index.scss';
|
|
|
|
import './index.scss';
|
|
|
|
// import 'katex/dist/katex.css';
|
|
|
|
// import 'katex/dist/katex.css';
|
|
|
|
import React from 'react';
|
|
|
|
import React from 'react';
|
|
|
|
import { Form, Input, Select, InputNumber, Button } from 'antd';
|
|
|
|
import { Form, Input, Select, InputNumber, Button, Cascader, notification } from 'antd';
|
|
|
|
import { connect } from 'react-redux';
|
|
|
|
import { connect } from 'react-redux';
|
|
|
|
import AddTestDemo from './AddTestDemo';
|
|
|
|
import AddTestDemo from './AddTestDemo';
|
|
|
|
// import QuillEditor from '../../../quillEditor';
|
|
|
|
// import QuillEditor from '../../../quillEditor';
|
|
|
|
@ -18,6 +18,7 @@ import CONST from '../../../../../constants';
|
|
|
|
import { toStore } from 'educoder'; // 保存和读取store值
|
|
|
|
import { toStore } from 'educoder'; // 保存和读取store值
|
|
|
|
// import Wrapper from '../../../../../common/reactQuill';
|
|
|
|
// import Wrapper from '../../../../../common/reactQuill';
|
|
|
|
import QuillForEditor from '../../../../../common/quillForEditor';
|
|
|
|
import QuillForEditor from '../../../../../common/quillForEditor';
|
|
|
|
|
|
|
|
import KnowLedge from '../../../components/knowledge';
|
|
|
|
const scrollIntoView = require('scroll-into-view');
|
|
|
|
const scrollIntoView = require('scroll-into-view');
|
|
|
|
const {jcLabel} = CONST;
|
|
|
|
const {jcLabel} = CONST;
|
|
|
|
const FormItem = Form.Item;
|
|
|
|
const FormItem = Form.Item;
|
|
|
|
@ -59,7 +60,9 @@ class EditTab extends React.Component {
|
|
|
|
scrollHeight: 0, // 滚动元素的高度
|
|
|
|
scrollHeight: 0, // 滚动元素的高度
|
|
|
|
top: 500,
|
|
|
|
top: 500,
|
|
|
|
bottom: 20,
|
|
|
|
bottom: 20,
|
|
|
|
offsetTop: 0
|
|
|
|
offsetTop: 0,
|
|
|
|
|
|
|
|
// knowledges: [],
|
|
|
|
|
|
|
|
// coursers: [] // 选中的课程
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
@ -77,9 +80,17 @@ class EditTab extends React.Component {
|
|
|
|
}, () => {
|
|
|
|
}, () => {
|
|
|
|
this.state.scrollEl.addEventListener('scroll', this.handleScroll, false);
|
|
|
|
this.state.scrollEl.addEventListener('scroll', this.handleScroll, false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
// 获取题库
|
|
|
|
|
|
|
|
// this.props.getQuestion({
|
|
|
|
|
|
|
|
// source: 'question'
|
|
|
|
|
|
|
|
// });
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
componentWillUnmount () {
|
|
|
|
// componentDidUpdate (nextProp) {
|
|
|
|
|
|
|
|
// console.log(nextProp);
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
componentWillUnmount (nextPro) {
|
|
|
|
this.state.scrollEl.removeEventListener('scroll', this.handleScroll, false);
|
|
|
|
this.state.scrollEl.removeEventListener('scroll', this.handleScroll, false);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
@ -125,9 +136,26 @@ class EditTab extends React.Component {
|
|
|
|
handleTimeLimitChange = (value) => {
|
|
|
|
handleTimeLimitChange = (value) => {
|
|
|
|
this.props.validateOjTimeLimit(value);
|
|
|
|
this.props.validateOjTimeLimit(value);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 改变分类
|
|
|
|
// 改变方向
|
|
|
|
handleChangeCategory = (value) => {
|
|
|
|
handleChangeSubDisciplineId = (value) => {
|
|
|
|
this.props.validateOjCategory(value);
|
|
|
|
// 课程下拉值变化时， 同步更新知识点
|
|
|
|
|
|
|
|
const { courseQuestions, saveKnowledge } = this.props;
|
|
|
|
|
|
|
|
saveKnowledge([]);
|
|
|
|
|
|
|
|
// 获取当前分类下的知识点
|
|
|
|
|
|
|
|
courseQuestions.forEach(item => {
|
|
|
|
|
|
|
|
if (value[0] && item.id === value[0]) {
|
|
|
|
|
|
|
|
item.sub_disciplines && item.sub_disciplines.forEach(c => {
|
|
|
|
|
|
|
|
if (value[1] && c.id === value[1]) {
|
|
|
|
|
|
|
|
saveKnowledge(c.tag_disciplines)
|
|
|
|
|
|
|
|
console.log(c.tag_disciplines);
|
|
|
|
|
|
|
|
} else if (!value[1]) {
|
|
|
|
|
|
|
|
saveKnowledge([]);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
// this.props.validateOjCategory(value[1] || '');
|
|
|
|
|
|
|
|
this.props.validateOjSubDisciplineId(value[1] || '');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 改变公开程序
|
|
|
|
// 改变公开程序
|
|
|
|
handleChangeOpenOrNot = (value) => {
|
|
|
|
handleChangeOpenOrNot = (value) => {
|
|
|
|
@ -146,13 +174,18 @@ class EditTab extends React.Component {
|
|
|
|
addTestCase, // 添加测试用例
|
|
|
|
addTestCase, // 添加测试用例
|
|
|
|
deleteTestCase, // 删除测试用例
|
|
|
|
deleteTestCase, // 删除测试用例
|
|
|
|
testCasesValidate,
|
|
|
|
testCasesValidate,
|
|
|
|
openTestCodeIndex = []
|
|
|
|
openTestCodeIndex = [],
|
|
|
|
|
|
|
|
courseQuestions,
|
|
|
|
|
|
|
|
tag_discipline_id,
|
|
|
|
|
|
|
|
knowledges
|
|
|
|
} = this.props;
|
|
|
|
} = this.props;
|
|
|
|
|
|
|
|
console.log('knowledge======>>>>>>', knowledges);
|
|
|
|
|
|
|
|
// const {knowledges} = this.state;
|
|
|
|
// 表单label
|
|
|
|
// 表单label
|
|
|
|
const myLabel = (name, subTitle) => {
|
|
|
|
const myLabel = (name, subTitle, nostar) => {
|
|
|
|
if (subTitle) {
|
|
|
|
if (subTitle) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<span className={'label_text'}>
|
|
|
|
<span className={`label_text ${nostar}`}>
|
|
|
|
{name}
|
|
|
|
{name}
|
|
|
|
<span className={'label_sub_text'}>
|
|
|
|
<span className={'label_sub_text'}>
|
|
|
|
({subTitle})
|
|
|
|
({subTitle})
|
|
|
|
@ -161,7 +194,7 @@ class EditTab extends React.Component {
|
|
|
|
)
|
|
|
|
)
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<span className={'label_text'}>{name}</span>
|
|
|
|
<span className={`label_text ${nostar}`}>{name}</span>
|
|
|
|
)
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
@ -197,7 +230,14 @@ class EditTab extends React.Component {
|
|
|
|
};
|
|
|
|
};
|
|
|
|
// 添加测试用例
|
|
|
|
// 添加测试用例
|
|
|
|
const handleAddTest = () => {
|
|
|
|
const handleAddTest = () => {
|
|
|
|
const {position} = this.props;
|
|
|
|
const {position, testCases = []} = this.props;
|
|
|
|
|
|
|
|
if (testCases.length >= 50) {
|
|
|
|
|
|
|
|
notification.warning({
|
|
|
|
|
|
|
|
message: '提示',
|
|
|
|
|
|
|
|
description: '测试用例不能超过50个'
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
return;
|
|
|
|
|
|
|
|
}
|
|
|
|
const obj = { // 测试用例参数
|
|
|
|
const obj = { // 测试用例参数
|
|
|
|
input: '',
|
|
|
|
input: '',
|
|
|
|
output: '',
|
|
|
|
output: '',
|
|
|
|
@ -235,15 +275,74 @@ class EditTab extends React.Component {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 编辑器配置信息
|
|
|
|
// 编辑器配置信息
|
|
|
|
const quillConfig = [
|
|
|
|
const quillConfig = [
|
|
|
|
[{ header: [1, 2, 3, 4, 5, 6, false] }],
|
|
|
|
{ header: 1}, {header: 2},
|
|
|
|
['bold', 'italic', 'underline', 'strike'], // 切换按钮
|
|
|
|
// {size: ['12px', '14px', '16px', '18px', '20px', false]},
|
|
|
|
['blockquote', 'code-block'], // 代码块
|
|
|
|
'bold', 'italic', 'underline', 'strike', // 切换按钮
|
|
|
|
[{align: []}, { 'list': 'ordered' }, { 'list': 'bullet' }], // 列表
|
|
|
|
'blockquote', 'code-block', // 代码块
|
|
|
|
[{ 'script': 'sub'}, { 'script': 'super' }],
|
|
|
|
{align: []}, { 'list': 'ordered' }, { 'list': 'bullet' }, // 列表
|
|
|
|
[{ 'color': [] }, { 'background': [] }], // 字体颜色与背景色
|
|
|
|
{ 'script': 'sub'}, { 'script': 'super' },
|
|
|
|
['image', 'formula'], // 数学公式、图片、视频
|
|
|
|
{ 'color': [] }, { 'background': [] }, // 字体颜色与背景色
|
|
|
|
['clean'], // 清除格式
|
|
|
|
// {font: []},
|
|
|
|
|
|
|
|
'image', 'formula', // 数学公式、图片、视频
|
|
|
|
|
|
|
|
'clean', // 清除格式
|
|
|
|
];
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const renderCourseQuestion = (arrs) => {
|
|
|
|
|
|
|
|
const tempArr = [];
|
|
|
|
|
|
|
|
const sub_id = this.props.ojForm.sub_discipline_id;
|
|
|
|
|
|
|
|
function loop (arrs, tempArr) {
|
|
|
|
|
|
|
|
arrs.forEach(item => {
|
|
|
|
|
|
|
|
const obj = {};
|
|
|
|
|
|
|
|
obj.value = item.id;
|
|
|
|
|
|
|
|
obj.label = item.name;
|
|
|
|
|
|
|
|
// 当item下还有子元素时，递归调用
|
|
|
|
|
|
|
|
if (item.sub_disciplines) {
|
|
|
|
|
|
|
|
arrs = item.sub_disciplines;
|
|
|
|
|
|
|
|
obj.children = [];
|
|
|
|
|
|
|
|
loop(arrs, obj.children);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
tempArr.push(obj);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
loop(arrs, tempArr);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 获取选中的下拉值
|
|
|
|
|
|
|
|
let choid_ids = [];
|
|
|
|
|
|
|
|
// let tempKnowledges = [];
|
|
|
|
|
|
|
|
tempArr.forEach(t => {
|
|
|
|
|
|
|
|
// debugger;
|
|
|
|
|
|
|
|
if (sub_id && t.children) {
|
|
|
|
|
|
|
|
t.children.forEach(c => {
|
|
|
|
|
|
|
|
if (c.value === sub_id) {
|
|
|
|
|
|
|
|
choid_ids = [t.value, c.value];
|
|
|
|
|
|
|
|
// tempKnowledges = c.children || [];
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log(choid_ids);
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
|
|
<Cascader
|
|
|
|
|
|
|
|
options={tempArr}
|
|
|
|
|
|
|
|
expandTrigger="hover"
|
|
|
|
|
|
|
|
value={choid_ids}
|
|
|
|
|
|
|
|
// onChange={this.handleChangeCategory}
|
|
|
|
|
|
|
|
onChange={this.handleChangeSubDisciplineId}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 知识点
|
|
|
|
|
|
|
|
const handleKnowledgeChange = (values= []) => {
|
|
|
|
|
|
|
|
const _result = [];
|
|
|
|
|
|
|
|
values.forEach(v => {
|
|
|
|
|
|
|
|
_result.push(v.id);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
console.log('下拉选择的值:===>>>', _result);
|
|
|
|
|
|
|
|
// 保存选择的知识点
|
|
|
|
|
|
|
|
this.props.saveTagDisciplineId(_result);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<div className={'editor_area'} id="textCase">
|
|
|
|
<div className={'editor_area'} id="textCase">
|
|
|
|
@ -262,16 +361,34 @@ class EditTab extends React.Component {
|
|
|
|
|
|
|
|
|
|
|
|
<FormItem
|
|
|
|
<FormItem
|
|
|
|
className={`input_area flex_50 flex_50_right`}
|
|
|
|
className={`input_area flex_50 flex_50_right`}
|
|
|
|
label={<span>{myLabel(jcLabel['category'], '合理的分类有利于快速检索')}</span>}
|
|
|
|
label={<span>{myLabel(jcLabel['sub_discipline_id'], '合理的课程分类有利于快速检索')}</span>}
|
|
|
|
validateStatus={ojFormValidate.category.validateStatus}
|
|
|
|
validateStatus={ojFormValidate.sub_discipline_id.validateStatus}
|
|
|
|
help={ojFormValidate.category.errMsg}
|
|
|
|
help={ojFormValidate.sub_discipline_id.errMsg}
|
|
|
|
colon={ false }
|
|
|
|
colon={ false }
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<Select onChange={this.handleChangeCategory} value={`${ojForm.category}`}>
|
|
|
|
{/* <Select onChange={this.handleChangeCategory} value={`${ojForm.category}`}>
|
|
|
|
{getOptions('category')}
|
|
|
|
{getOptions('category')}
|
|
|
|
</Select>
|
|
|
|
</Select> */}
|
|
|
|
|
|
|
|
{/* <Cascader
|
|
|
|
|
|
|
|
options={courseQuestions}
|
|
|
|
|
|
|
|
expandTrigger="hover"
|
|
|
|
|
|
|
|
onChange={this.handleChangeCategory}
|
|
|
|
|
|
|
|
/> */}
|
|
|
|
|
|
|
|
{ renderCourseQuestion(courseQuestions)}
|
|
|
|
</FormItem>
|
|
|
|
</FormItem>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<FormItem
|
|
|
|
|
|
|
|
colon={ false }
|
|
|
|
|
|
|
|
className='input_area flex_100'
|
|
|
|
|
|
|
|
label={<span>{myLabel(jcLabel['knowledge'], '', 'nostar')}</span>}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<KnowLedge
|
|
|
|
|
|
|
|
options={knowledges}
|
|
|
|
|
|
|
|
values={tag_discipline_id}
|
|
|
|
|
|
|
|
onChange={handleKnowledgeChange}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</FormItem>
|
|
|
|
|
|
|
|
|
|
|
|
<FormItem
|
|
|
|
<FormItem
|
|
|
|
className={`input_area flex_50 flex_50_left`}
|
|
|
|
className={`input_area flex_50 flex_50_left`}
|
|
|
|
label={<span>{myLabel(jcLabel['timeLimit'], '程序允许时间限制时长，单位：秒')}</span>}
|
|
|
|
label={<span>{myLabel(jcLabel['timeLimit'], '程序允许时间限制时长，单位：秒')}</span>}
|
|
|
|
@ -317,16 +434,13 @@ class EditTab extends React.Component {
|
|
|
|
help={ojFormValidate.description.errMsg}
|
|
|
|
help={ojFormValidate.description.errMsg}
|
|
|
|
colon={ false }
|
|
|
|
colon={ false }
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<div style={{ marginTop: '15px'}}>
|
|
|
|
<QuillForEditor
|
|
|
|
<QuillForEditor
|
|
|
|
|
|
|
|
style={{ height: '200px' }}
|
|
|
|
style={{ height: '200px' }}
|
|
|
|
placeholder="请输入描述信息"
|
|
|
|
placeholder="请输入描述信息"
|
|
|
|
onContentChange={handleContentChange}
|
|
|
|
onContentChange={handleContentChange}
|
|
|
|
options={quillConfig}
|
|
|
|
options={quillConfig}
|
|
|
|
value={ojForm.description}
|
|
|
|
value={ojForm.description}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</FormItem>
|
|
|
|
</FormItem>
|
|
|
|
|
|
|
|
|
|
|
|
{/* <FormItem
|
|
|
|
{/* <FormItem
|
|
|
|
@ -366,14 +480,21 @@ const mapStateToProps = (state) => {
|
|
|
|
testCases,
|
|
|
|
testCases,
|
|
|
|
openTestCodeIndex,
|
|
|
|
openTestCodeIndex,
|
|
|
|
testCasesValidate,
|
|
|
|
testCasesValidate,
|
|
|
|
ojFormValidate} = ojFormReducer;
|
|
|
|
ojFormValidate,
|
|
|
|
|
|
|
|
courseQuestions,
|
|
|
|
|
|
|
|
tag_discipline_id,
|
|
|
|
|
|
|
|
knowledges
|
|
|
|
|
|
|
|
} = ojFormReducer;
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
ojForm,
|
|
|
|
ojForm,
|
|
|
|
testCases,
|
|
|
|
testCases,
|
|
|
|
testCasesValidate,
|
|
|
|
testCasesValidate,
|
|
|
|
ojFormValidate,
|
|
|
|
ojFormValidate,
|
|
|
|
position,
|
|
|
|
position,
|
|
|
|
openTestCodeIndex
|
|
|
|
openTestCodeIndex,
|
|
|
|
|
|
|
|
courseQuestions,
|
|
|
|
|
|
|
|
tag_discipline_id,
|
|
|
|
|
|
|
|
knowledges
|
|
|
|
};
|
|
|
|
};
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
@ -386,10 +507,15 @@ const mapDispatchToProps = (dispatch) => ({
|
|
|
|
validateOjTimeLimit: (value) => dispatch(actions.validateOjTimeLimit(value)),
|
|
|
|
validateOjTimeLimit: (value) => dispatch(actions.validateOjTimeLimit(value)),
|
|
|
|
validateOjCategory: (value) => dispatch(actions.validateOjCategory(value)),
|
|
|
|
validateOjCategory: (value) => dispatch(actions.validateOjCategory(value)),
|
|
|
|
validateOpenOrNot: (value) => dispatch(actions.validateOpenOrNot(value)),
|
|
|
|
validateOpenOrNot: (value) => dispatch(actions.validateOpenOrNot(value)),
|
|
|
|
|
|
|
|
validateOjSubDisciplineId: (value) => dispatch(actions.validateOjSubDisciplineId(value)),
|
|
|
|
|
|
|
|
saveTagDisciplineId: (value) => dispatch(actions.saveTagDisciplineId(value)),
|
|
|
|
// 新增测试用例
|
|
|
|
// 新增测试用例
|
|
|
|
addTestCase: (value) => dispatch(actions.addTestCase(value)),
|
|
|
|
addTestCase: (value) => dispatch(actions.addTestCase(value)),
|
|
|
|
// 删除测试用例
|
|
|
|
// 删除测试用例
|
|
|
|
deleteTestCase: (value) => dispatch(actions.deleteTestCase(value)),
|
|
|
|
deleteTestCase: (value) => dispatch(actions.deleteTestCase(value)),
|
|
|
|
|
|
|
|
saveKnowledge: (value) => dispatch(actions.saveKnowledge(value))
|
|
|
|
|
|
|
|
// 获取题库
|
|
|
|
|
|
|
|
// getQuestion: (params) => dispatch(actions.getQuestion(params))
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
export default connect(
|
|
|
|
export default connect(
|
|
|
|
|
