harry 5 years ago
parent 2e691ff55d
commit dc1ca77e6e

@ -16,8 +16,6 @@ import SettingDrawer from '../../components/monacoSetting';
import CONST from '../../../../constants'; import CONST from '../../../../constants';
import MyIcon from '../../../../common/components/MyIcon'; import MyIcon from '../../../../common/components/MyIcon';
// import actions from '../../../../redux/actions';
const { fontSetting, opacitySetting } = CONST; const { fontSetting, opacitySetting } = CONST;
const maps = { const maps = {
'c': 'main.c', 'c': 'main.c',
@ -79,19 +77,20 @@ function MyMonacoEditor (props, ref) {
} }
// 文本框内容变化时,记录文本框内容 // 文本框内容变化时,记录文本框内容
const handleEditorChange = (origin, monaco) => { const handleEditorChange = (_, monaco) => {
editorRef.current = monaco; // 获取当前monaco实例 editorRef.current = monaco; // 获取当前monaco实例
// setEditCode(origin); // 保存编辑器初始值 }
useEffect(() => {
if (editorRef.current) {
editorRef.current.onDidChangeModelContent(e => { // 监听编辑器内容的变化 editorRef.current.onDidChangeModelContent(e => { // 监听编辑器内容的变化
// TODO 需要优化 节流
const val = editorRef.current.getValue(); const val = editorRef.current.getValue();
// setEditCode(val);
// console.log('编辑器代码====>>>>', val);
onCodeChange(val); onCodeChange(val);
// 值一变化保存当前代码值
// saveUserInputCode(val);
}); });
} }
}, [
editorRef.current
])
// 配置编辑器属性 // 配置编辑器属性
const editorOptions = { const editorOptions = {
@ -109,14 +108,6 @@ function MyMonacoEditor (props, ref) {
onRestoreInitialCode && onRestoreInitialCode(); onRestoreInitialCode && onRestoreInitialCode();
} }
}) })
// Modal.confirm({
// content: '确定要恢复代码吗?',
// okText: '确定',
// cancelText: '取消',
// onOk () {
// onRestoreInitialCode && onRestoreInitialCode();
// }
// })
} }
const handleUpdateNotice = () => { const handleUpdateNotice = () => {
@ -125,11 +116,6 @@ function MyMonacoEditor (props, ref) {
} }
} }
// const renderRestore = identifier ? (
// <MyIcon type="iconzaicizairu" />
// ) : '';
// lex_has_save ${hadCodeUpdate} ? : ''
const _classnames = hadCodeUpdate ? `flex_strict flex_has_save` : 'flex_strict'; const _classnames = hadCodeUpdate ? `flex_strict flex_has_save` : 'flex_strict';
return ( return (
<React.Fragment> <React.Fragment>
@ -138,12 +124,6 @@ function MyMonacoEditor (props, ref) {
{/* 未保存时 ? '学员初始代码文件' : main.x */} {/* 未保存时 ? '学员初始代码文件' : main.x */}
<span className='flex_strict' style={{ color: '#ddd' }}>{identifier ? language ? maps[language.toLowerCase()] : '' : '学员初始代码文件'}</span> <span className='flex_strict' style={{ color: '#ddd' }}>{identifier ? language ? maps[language.toLowerCase()] : '' : '学员初始代码文件'}</span>
<span className={_classnames}>{hadCodeUpdate ? '已保存' : ''}</span> <span className={_classnames}>{hadCodeUpdate ? '已保存' : ''}</span>
{/* <Tooltip
style={{ background: 'gold' }}
className="tooltip_style"
title="通知"
placement="bottom"
> */}
<Tooltip <Tooltip
placement="bottom" placement="bottom"
title="通知" title="通知"
@ -212,12 +192,6 @@ const mapStateToProps = (state) => {
} }
}; };
// const mapDispatchToProps = (dispatch) => ({
// // saveUserInputCode: (code) => dispatch(actions.saveUserInputCode(code)),
// });
// MyMonacoEditor = React.forwardRef(MyMonacoEditor);
export default connect( export default connect(
mapStateToProps, mapStateToProps,
// mapDispatchToProps
)(CNotificationHOC()(MyMonacoEditor)); )(CNotificationHOC()(MyMonacoEditor));

@ -8,23 +8,19 @@
import './index.scss'; import './index.scss';
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import SplitPane from 'react-split-pane';// import { Form } from 'antd'; import SplitPane from 'react-split-pane';
import { Button } from 'antd'; import { Button } from 'antd';
import LeftPane from './leftpane'; import LeftPane from './leftpane';
import RightPane from './rightpane'; import RightPane from './rightpane';
import { withRouter } from 'react-router'; import { withRouter } from 'react-router';
import { toStore, CNotificationHOC } from 'educoder'; import { toStore, CNotificationHOC } from 'educoder';
import UserInfo from '../components/userInfo'; import UserInfo from '../components/userInfo';
// import RightPane from './rightpane/index';
import actions from '../../../redux/actions'; import actions from '../../../redux/actions';
// import {ModalConfirm} from '../../../common/components/ModalConfirm';
const NewOrEditTask = (props) => { const NewOrEditTask = (props) => {
const { const {
publishLoading, publishLoading,
handlePublish, handlePublish,
// testCases = [],
// ojTestCaseValidate = [],
identifier, identifier,
isPublish, isPublish,
userInfo, userInfo,
@ -38,15 +34,10 @@ const NewOrEditTask = (props) => {
getQuestion, getQuestion,
saveSearchParams, saveSearchParams,
setOjInitialValue, setOjInitialValue,
courseQuestions
// updateTestAndValidate,
} = props; } = props;
// 表单提交
const handleSubmitForm = () => { const handleSubmitForm = () => {
// 改变loading状态
changeSubmitLoadingStatus(true); changeSubmitLoadingStatus(true);
// 调用输入表单验证功能
if (props.identifier) { if (props.identifier) {
props.handleUpdateOjForm(props); props.handleUpdateOjForm(props);
} else { } else {
@ -54,12 +45,10 @@ const NewOrEditTask = (props) => {
} }
}; };
const id = props.match.params.id;
useEffect(() => { useEffect(() => {
// 获取用户信息 // 获取用户信息
getUserInfoForNew(); getUserInfoForNew();
// console.log('获取路由参数: ====', props.match.params);
const id = props.match.params.id;
// 保存OJForm的id号指明是编辑还是新增
props.saveOJFormId(id); props.saveOJFormId(id);
// 获取地址栏查询参数 // 获取地址栏查询参数
const $searchs = window.location.search && window.location.search.substring(1); const $searchs = window.location.search && window.location.search.substring(1);
@ -87,14 +76,9 @@ const NewOrEditTask = (props) => {
source: 'question' source: 'question'
}); });
if (id) { // id号即 identifier if (id) { // id号即 identifier
// TODO id 存在时, 编辑, 获取 store 中的记录数
props.getOJFormById(id); props.getOJFormById(id);
} else {
// 清空store中的测试用例集合
// props.clearOJFormStore();
} }
return () => {} }, [id])
}, []);
// 模拟挑战 // 模拟挑战
const imitationChallenge = () => { const imitationChallenge = () => {
@ -107,11 +91,9 @@ const NewOrEditTask = (props) => {
// 开始挑战 // 开始挑战
const startChallenge = () => { const startChallenge = () => {
// 调用 start 接口, 成功后跳转到开启实战 // 调用 start 接口, 成功后跳转到开启实战
// TODO
identifier && validateOjForm(props, 'challenge', () => { identifier && validateOjForm(props, 'challenge', () => {
startProgramQuestion(identifier, props); startProgramQuestion(identifier, props);
}); });
// identifier && startProgramQuestion(identifier, props);
} }
// 取消 // 取消
@ -120,16 +102,11 @@ const NewOrEditTask = (props) => {
props.clearOJFormStore(); props.clearOJFormStore();
// 清空描述信息 // 清空描述信息
toStore('oj_description', ''); toStore('oj_description', '');
// props.history.push('/problems');
props.history.push(`/problemset?${props.searchParams}`); props.history.push(`/problemset?${props.searchParams}`);
} }
// 发布 // 发布
const handleClickPublish = () => { const handleClickPublish = () => {
// ModalConfirm('提示', (<p>发布后即可应用到自己管理的课堂<br /> 是否确认发布?</p>), () => {
// changePublishLoadingStatus(true);
// handlePublish(props, 'publish');
// });
props.confirm({ props.confirm({
title: '提示', title: '提示',
content: (<p>发布后即可应用到自己管理的课堂<br /> 是否确认发布?</p>), content: (<p>发布后即可应用到自己管理的课堂<br /> 是否确认发布?</p>),
@ -141,10 +118,6 @@ const NewOrEditTask = (props) => {
} }
// 撤销发布 // 撤销发布
const handleClickCancelPublish = () => { const handleClickCancelPublish = () => {
// ModalConfirm('提示', (<p>是否确认撤销发布?</p>), () => {
// changePublishLoadingStatus(true);
// handleCancelPublish(props, identifier);
// });
props.confirm({ props.confirm({
title: '提示', title: '提示',
content: ((<p>是否确认撤销发布?</p>)), content: ((<p>是否确认撤销发布?</p>)),
@ -248,7 +221,6 @@ const NewOrEditTask = (props) => {
</SplitPane> </SplitPane>
</SplitPane> </SplitPane>
</div> </div>
{/* 控制台 */}
<div className='new_add_task_ctl'> <div className='new_add_task_ctl'>
{ {
/* 录入时: 取消 保存 */ /* 录入时: 取消 保存 */

@ -6,15 +6,12 @@
* @LastEditors : tangjiang * @LastEditors : tangjiang
* @LastEditTime : 2020-01-02 14:23:43 * @LastEditTime : 2020-01-02 14:23:43
*/ */
import React, { useState, useEffect } from 'react'; import React, { useState } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import MyMonacoEditor from '../../components/myMonacoEditor'; import MyMonacoEditor from '../../components/myMonacoEditor';
import ControlSetting from '../../components/controlSetting'; import ControlSetting from '../../components/controlSetting';
import actions from '../../../../redux/actions'; import actions from '../../../../redux/actions';
// import QuillForEditor from '../../../../common/quillForEditor';
// import TextArea from 'antd/lib/input/TextArea';
import { Input, Form, Button } from 'antd'; import { Input, Form, Button } from 'antd';
// import FormItem from 'antd/lib/form/FormItem';
const { TextArea } = Input; const { TextArea } = Input;
const FormItem = Form.Item; const FormItem = Form.Item;
const RightPane = (props) => { const RightPane = (props) => {
@ -33,54 +30,34 @@ const RightPane = (props) => {
updateNotice, updateNotice,
saveUserInputCode, saveUserInputCode,
restoreInitialCode, restoreInitialCode,
// saveOpacityType,
saveUserCodeForInterval, saveUserCodeForInterval,
addNotes, addNotes,
changeLoadingState changeLoadingState
} = props; } = props;
// const [editorCode, setEditorCode] = useState(editor_code || hack.code);
const [noteClazz, setNoteClazz] = useState('editor_nodte_area'); const [noteClazz, setNoteClazz] = useState('editor_nodte_area');
const [noteCount] = useState(5000); const [noteCount] = useState(5000);
// const [code, setCode] = useState(editor_code || hack.code);
// let initFlag = true;
// useEffect(() => {
// if (editor_code) {
// setEditorCode(editor_code);
// } else {
// setEditorCode(hack.code);
// }
// }, [hack, editor_code]);
const handleSubmitForm = () => { const handleSubmitForm = () => {
// 提交时, 先调用提交接口,提交成功后,循环调用测评接口
// saveOpacityType('submit');
submitUserCode(identifier, submitInput, 'submit'); submitUserCode(identifier, submitInput, 'submit');
// // 提交时,先调用评测接口, 评测通过后才调用保存接口
// updateCode(identifier, submitInput, 'submit');
} }
let timer = null; // 定时器 let timer = null; // 定时器
// 代码块内容变化时 // 代码块内容变化时
const handleCodeChange = (value) => { const handleCodeChange = (value) => {
// console.log('编辑器代码 ======》》》》》》》》》++++++++++', value);
saveUserInputCode(value); saveUserInputCode(value);
// setEditorCode(value);
if (!timer) { if (!timer) {
timer = setInterval(function () { timer = setInterval(function () {
clearInterval(timer); clearInterval(timer);
timer = null; timer = null;
saveUserCodeForInterval(identifier); saveUserCodeForInterval(identifier);
}, 3000); }, 10000);
} }
} }
// 代码调试 // 代码调试
const handleDebuggerCode = (value) => { const handleDebuggerCode = (value) => {
// 调用保存代码块接口,成功后,调用调试接口
// saveOpacityType('debug');
updateCode(identifier, value, 'debug'); updateCode(identifier, value, 'debug');
} }
// 恢复初始代码 // 恢复初始代码
@ -113,7 +90,6 @@ const RightPane = (props) => {
} }
}); });
} }
const { getFieldDecorator } = props.form; const { getFieldDecorator } = props.form;
return ( return (
<div className={'right_pane_code_wrap'}> <div className={'right_pane_code_wrap'}>

@ -25,7 +25,6 @@ import { notification } from "antd";
// 进入编程页面时,首先调用开启编程题接口 // 进入编程页面时,首先调用开启编程题接口
export const startProgramQuestion = (id, props) => { export const startProgramQuestion = (id, props) => {
return (dispatch, getState) => { return (dispatch, getState) => {
const {searchParams} = getState().ojFormReducer;
fetchStartProgram(id).then(res => { fetchStartProgram(id).then(res => {
const { status, data } = res; const { status, data } = res;
if (status === 200) { if (status === 200) {
@ -41,13 +40,6 @@ export const startProgramQuestion = (id, props) => {
}); });
// 跳转至开启编程 // 跳转至开启编程
if (identifier) { if (identifier) {
// let data = Object.assign({}, props);
// const path = {
// pathname: `/myproblems/${identifier}`,
// state: data
// }
// console.log(path);
// props.history.push(`/myproblems/${identifier}`);
props.history.push({ props.history.push({
pathname: `/myproblems/${identifier}`, pathname: `/myproblems/${identifier}`,
}); });
@ -115,24 +107,18 @@ export const saveUserCodeForInterval = (identifier, code) => {
type: types.AUTO_UPDATE_CODE, type: types.AUTO_UPDATE_CODE,
payload: true payload: true
}); });
// console.log('+++', userCode);
fetchUpdateCode(identifier, { fetchUpdateCode(identifier, {
code: Base64.encode(userCode) code: Base64.encode(userCode)
}).then(res => { }).then(res => {
if (res.data.status === 401) { if (res.data.status === 401) {
return; return;
}; };
// dispatch({
// type: types.RESTORE_INITIAL_CODE,
// payload: userCode
// });
setTimeout(() => { setTimeout(() => {
dispatch({ dispatch({
type: types.AUTO_UPDATE_CODE, type: types.AUTO_UPDATE_CODE,
payload: false payload: false
}) })
}, 1000); }, 1000);
// console.log('代码保存成功', res);
}).catch(() => { }).catch(() => {
dispatch({ dispatch({
type: types.AUTO_UPDATE_CODE, type: types.AUTO_UPDATE_CODE,
@ -337,11 +323,13 @@ export const debuggerCode = (identifier,value, type) => {
// 获取提交记录 // 获取提交记录
export const getUserCommitRecord = (identifier) => { export const getUserCommitRecord = (identifier) => {
return (dispatch, getState) => { return (dispatch, getState) => {
try {
const { pages: { limit, page } } = getState().ojForUserReducer; const { pages: { limit, page } } = getState().ojForUserReducer;
fetchUserCommitRecord(identifier, { fetchUserCommitRecord(identifier, {
limit, limit,
page page
}).then(res => { }).then(res => {
if (res) {
const { status, data } = res; const { status, data } = res;
if (status === 200) { if (status === 200) {
dispatch({ dispatch({
@ -349,7 +337,12 @@ export const getUserCommitRecord = (identifier) => {
payload: data payload: data
}) })
} }
}); }
})
} catch (error) {
console.log(error, '-------')
}
;
} }
} }
// 获取提交记录详情 // 获取提交记录详情
@ -405,7 +398,6 @@ export const submitUserCode = (identifier, inputValue, type) => {
function userCodeSubmit() { function userCodeSubmit() {
fetchUserCodeSubmit(identifier).then(res => { fetchUserCodeSubmit(identifier).then(res => {
// console.log('用户提交代码成功======》》》》》', res);
if (res.status === 200) { if (res.status === 200) {
if (res.data.status === 401) { if (res.data.status === 401) {
dispatch({ dispatch({
@ -415,7 +407,6 @@ export const submitUserCode = (identifier, inputValue, type) => {
return; return;
}; };
// 测评 // 测评
console.log('hack=====', hack);
codeEvaluate(dispatch, identifier, type, hack.time_limit, hack.status, hack.score, hack.passed); codeEvaluate(dispatch, identifier, type, hack.time_limit, hack.status, hack.score, hack.passed);
} }
}).catch(() => { }).catch(() => {
@ -427,10 +418,9 @@ export const submitUserCode = (identifier, inputValue, type) => {
} }
if (isUpdateCode) { if (isUpdateCode) {
fetchUpdateCode(identifier, { fetchUpdateCode(identifier, {
code: userCode code: Base64.encode(userCode)
}).then(res => { }).then(res => {
// 是否更新了代码, 目的是当代码没有更新时不调用更新代码接口,目录没有实现 // 是否更新了代码, 目的是当代码没有更新时不调用更新代码接口,目录没有实现
// TODO 需要优化
if (res.data.status === 401) { if (res.data.status === 401) {
dispatch({ dispatch({
type: types.SUBMIT_LOADING_STATUS, type: types.SUBMIT_LOADING_STATUS,
@ -460,7 +450,6 @@ export const restoreInitialCode = (identifier, msg) => {
return (dispatch) => { return (dispatch) => {
fetchRestoreInitialCode(identifier).then(res => { fetchRestoreInitialCode(identifier).then(res => {
if (res.data.status === 401) return; if (res.data.status === 401) return;
// console.log('恢复初始代码====》》》》', res);
const { status, data } = res; const { status, data } = res;
if (status === 200) { if (status === 200) {
dispatch({ dispatch({
@ -515,7 +504,6 @@ export const changeRecordPagination = (page) => {
export const addNotes = (identifier, params, cb) => { export const addNotes = (identifier, params, cb) => {
return (dispatch) => { return (dispatch) => {
fetchAddNotes(identifier, params).then(res => { fetchAddNotes(identifier, params).then(res => {
// console.log('添加笔记成功===>>', res);
dispatch({ dispatch({
type: types.LOADING_STATUS, type: types.LOADING_STATUS,
payload: false payload: false

Loading…
Cancel
Save