diff --git a/public/react/src/common/components/comment/CommentForm.js b/public/react/src/common/components/comment/CommentForm.js
index cc4e4efd9..da4814a9e 100644
--- a/public/react/src/common/components/comment/CommentForm.js
+++ b/public/react/src/common/components/comment/CommentForm.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-12-17 17:32:55
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 11:11:57
+ * @LastEditTime : 2019-12-26 18:43:21
*/
import './index.scss';
import React, { useState } from 'react';
@@ -69,7 +69,7 @@ function CommentForm (props) {
props.form.setFieldsValue({'comment': ''});
setCtx('');
// const _html = formatDelta(content.ops);
- console.log('保存的内容=====》》》》', content);
+ // console.log('保存的内容=====》》》》', content);
onSubmit && onSubmit(JSON.stringify(content));
}
});
diff --git a/public/react/src/common/components/comment/CommentItem.js b/public/react/src/common/components/comment/CommentItem.js
index 6332dbd9a..5cd39b8e0 100644
--- a/public/react/src/common/components/comment/CommentItem.js
+++ b/public/react/src/common/components/comment/CommentItem.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-12-17 17:35:17
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 11:30:32
+ * @LastEditTime : 2019-12-26 20:00:56
*/
import './index.scss';
import 'quill/dist/quill.core.css'; // 核心样式
@@ -36,6 +36,8 @@ function CommentItem ({
const [showItemCount, setShowItemCount] = useState(5);
// 箭头方向
const [arrow, setArrow] = useState(false);
+ // 上传图片的ulr
+ const [url, setUrl] = useState('');
const {
author = {}, // 作者
@@ -85,6 +87,10 @@ function CommentItem ({
);
};
+ const handleShowUploadImage = (url) => {
+ console.log('==============>>>>>>>>>>>>',url);
+ setUrl(url);
+ }
// 评论内容
const commentCtx = (ctx) => {
let _ctx = null;
@@ -97,6 +103,7 @@ function CommentItem ({
<QuillForEditor
readOnly={true}
value={_ctx}
+ showUploadImage={handleShowUploadImage}
/>
)};
@@ -181,6 +188,10 @@ function CommentItem ({
}
}
+ const handleClose = () => {
+ setUrl('');
+ }
+
return (
<li className="comment_item_area">
{commentAvatar(author)}
@@ -225,11 +236,17 @@ function CommentItem ({
<div
style={{ display: showQuill ? 'block' : 'none'}}
className="comment_item_quill">
- <CommentForm
+ <CommentForm
onCancel={handleClickCancel}
onSubmit={handleClickSubmit(id)}
/>
</div>
+
+ {/* 显示上传的图片信息 */}
+ <div className="show_upload_image" style={{ display: url ? 'block' : 'none'}}>
+ <Icon type="close" className="image_close" onClick={handleClose}/>
+ <img className="image_info" src={url} alt=""/>
+ </div>
</div>
</li>
);
diff --git a/public/react/src/common/components/comment/index.scss b/public/react/src/common/components/comment/index.scss
index d881e5bee..db327c82f 100644
--- a/public/react/src/common/components/comment/index.scss
+++ b/public/react/src/common/components/comment/index.scss
@@ -87,6 +87,39 @@ $ml: 20px;
// .comment_item_quill{
// // margin-top: 10px;
// }
+ .show_upload_image{
+ position: fixed;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 1000;
+ &::before{
+ position: absolute;
+ height: 100%;
+ width:100%;
+ content: '';
+ background: #000;
+ opacity: .5;
+ }
+
+ .image_info{
+ position: absolute;
+ width: 80%;
+ height: 80%;
+ left: 10%;
+ top: 10%;
+ background: green;
+ }
+
+ .image_close{
+ position: absolute;
+ right: 20px;
+ top: 20px;
+ color: #fff;
+ cursor: pointer;
+ }
+ }
}
.comment_icon_count{
cursor: pointer;
diff --git a/public/react/src/common/quillForEditor/ImageBlot.js b/public/react/src/common/quillForEditor/ImageBlot.js
index 1b474d5dc..0316b1325 100644
--- a/public/react/src/common/quillForEditor/ImageBlot.js
+++ b/public/react/src/common/quillForEditor/ImageBlot.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-12-16 15:50:45
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-24 09:44:03
+ * @LastEditTime : 2019-12-27 08:57:37
*/
import Quill from "quill";
@@ -15,25 +15,38 @@ export default class ImageBlot extends BlockEmbed {
static create(value) {
const node = super.create();
-
node.setAttribute('alt', value.alt);
node.setAttribute('src', value.url);
-
+ console.log('~~~~~~~~~~~', node, value);
+ node.addEventListener('click', function () {
+ value.onclick(value.url);
+ }, false);
if (value.width) {
node.setAttribute('width', value.width);
}
if (value.height) {
node.setAttribute('height', value.height);
}
+
+ if (value.id) {
+ node.setAttribute('id', value.id);
+ }
// 宽度和高度都不存在时，
if (!value.width && !value.height) {
- node.setAttribute('display', 'block');
+ // node.setAttribute('display', 'block');
node.setAttribute('width', '100%');
}
+
+ node.setAttribute('style', { cursor: 'pointer' });
+
+ // if (node.onclick) {
+ // console.log('image 有图片点击事件======》》》》》》');
+ // // node.setAttribute('onclick', node.onCLick);
+ // }
// 给图片添加点击事件
- node.onclick = () => {
- value.onClick && value.onClick(value.url);
- }
+ // node.onclick = () => {
+ // value.onClick && value.onClick(value.url);
+ // }
return node;
}
@@ -45,7 +58,9 @@ export default class ImageBlot extends BlockEmbed {
onclick: node.onclick,
width: node.width,
height: node.height,
- display: node.getAttribute('display')
+ display: node.getAttribute('display'),
+ id: node.id,
+ style: node.style
};
}
}
diff --git a/public/react/src/common/quillForEditor/index.js b/public/react/src/common/quillForEditor/index.js
index 8239a0c93..330ecfed9 100644
--- a/public/react/src/common/quillForEditor/index.js
+++ b/public/react/src/common/quillForEditor/index.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-12-18 08:49:30
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 10:22:26
+ * @LastEditTime : 2019-12-26 19:36:00
*/
import './index.scss';
import 'quill/dist/quill.core.css'; // 核心样式
@@ -116,9 +116,22 @@ function QuillForEditor ({
// 设置值
useEffect(() => {
if (!quill) return
+
+ // debugger;
const previous = quill.getContents()
- const current = value
+
+ if (value && value.hasOwnProperty('ops')) {
+ console.log(value.ops);
+ const ops = value.ops || [];
+ ops.forEach((item, i) => {
+ if (item.insert['image']) {
+ item.insert['image'] = Object.assign({}, item.insert['image'], {style: { cursor: 'pointer' }, onclick: (url) => showUploadImage(url)});
+ }
+ });
+ }
+ const current = value
+ console.log('+++++', current);
if (!deepEqual(previous, current)) {
setSelection(quill.getSelection())
if (typeof value === 'string') {
diff --git a/public/react/src/modules/developer/components/controlSetting/index.js b/public/react/src/modules/developer/components/controlSetting/index.js
index 0fcfc278f..5c970f00e 100644
--- a/public/react/src/modules/developer/components/controlSetting/index.js
+++ b/public/react/src/modules/developer/components/controlSetting/index.js
@@ -4,11 +4,11 @@
* @Github:
* @Date: 2019-11-27 16:02:36
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 15:17:28
+ * @LastEditTime : 2019-12-27 09:32:34
*/
import './index.scss';
import React, { useState, useRef, useEffect } from 'react';
-import { Tabs, Button, Icon } from 'antd';
+import { Tabs, Button, Icon, notification } from 'antd';
import { connect } from 'react-redux';
import InitTabCtx from '../initTabCtx';
import ExecResult from '../execResult';
@@ -18,6 +18,7 @@ const { TabPane } = Tabs;
const ControlSetting = (props) => {
const {
+ hack,
inputValue,
loading,
submitLoading,
@@ -57,6 +58,13 @@ const ControlSetting = (props) => {
// 调试代码
const handleTestCode = (e) => {
+ if (!hack.code) {
+ notification.warning({
+ message: '提示',
+ description: '代码块内容不能为空'
+ });
+ return;
+ }
// console.log(formRef.current.handleTestCodeFormSubmit);
// 调出控制台界面
setShowTextResult(true);
@@ -137,8 +145,9 @@ const ControlSetting = (props) => {
const mapStateToProps = (state) => {
const {commonReducer, ojForUserReducer} = state;
const {loading, excuteState, submitLoading, showOrHideControl } = commonReducer;
- const { commitTestRecordDetail } = ojForUserReducer;
+ const { commitTestRecordDetail, hack } = ojForUserReducer;
return {
+ hack,
loading,
submitLoading,
excuteState,
diff --git a/public/react/src/modules/developer/components/initTabCtx/index.js b/public/react/src/modules/developer/components/initTabCtx/index.js
index 3e707daa1..831416fab 100644
--- a/public/react/src/modules/developer/components/initTabCtx/index.js
+++ b/public/react/src/modules/developer/components/initTabCtx/index.js
@@ -3,8 +3,8 @@
* @Author: tangjiang
* @Github:
* @Date: 2019-11-27 19:46:14
- * @LastEditors: tangjiang
- * @LastEditTime: 2019-12-19 10:47:05
+ * @LastEditors : tangjiang
+ * @LastEditTime : 2019-12-26 20:07:35
*/
import './index.scss';
import React, { useState, useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
@@ -26,7 +26,7 @@ function InitTabCtx (props, ref) {
const { inputValue, onDebuggerCode } = props;
- console.log('default value', inputValue);
+ // console.log('default value', inputValue);
useImperativeHandle(ref, () => ({
handleTestCodeFormSubmit: (cb) => {
// console.log('父组件调用我啦~~~~~~~~~');
@@ -34,9 +34,9 @@ function InitTabCtx (props, ref) {
}
}));
- useEffect(() => {
- console.log('初始值: ========', props);
- }, [props]);
+ // useEffect(() => {
+ // console.log('初始值: ========', props);
+ // }, [props]);
// 渲染文本提示信息
const renderText = () => (<span className={'ctx_default'}>请在这里添加测试用例，点击“调试代码”时将从这里读取输入来测试你的代码...</span>);
diff --git a/public/react/src/modules/developer/components/myMonacoEditor/index.js b/public/react/src/modules/developer/components/myMonacoEditor/index.js
index facff0b75..ed7186102 100644
--- a/public/react/src/modules/developer/components/myMonacoEditor/index.js
+++ b/public/react/src/modules/developer/components/myMonacoEditor/index.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-11-27 15:02:52
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 15:19:34
+ * @LastEditTime : 2019-12-27 09:22:08
*/
import './index.scss';
import React, { useState, useRef, useEffect } from 'react';
@@ -53,9 +53,7 @@ function MyMonacoEditor (props, ref) {
const editorRef = useRef(null);
useEffect(() => {
- if (props.code) {
- setEditCode(props.code);
- }
+ setEditCode(props.code || '');
}, [props]);
useEffect(() => {
@@ -125,9 +123,9 @@ function MyMonacoEditor (props, ref) {
}
}
- const renderRestore = identifier ? (
- <MyIcon type="iconzaicizairu" />
- ) : '';
+ // const renderRestore = identifier ? (
+ // <MyIcon type="iconzaicizairu" />
+ // ) : '';
// lex_has_save ${hadCodeUpdate} ? : ''
const _classnames = hadCodeUpdate ? `flex_strict flex_has_save` : 'flex_strict';
diff --git a/public/react/src/modules/developer/newOrEditTask/rightpane/initTabCtx/index.js b/public/react/src/modules/developer/newOrEditTask/rightpane/initTabCtx/index.js
index 6933151a2..defb5e3c7 100644
--- a/public/react/src/modules/developer/newOrEditTask/rightpane/initTabCtx/index.js
+++ b/public/react/src/modules/developer/newOrEditTask/rightpane/initTabCtx/index.js
@@ -75,11 +75,11 @@ class InitTabCtx extends PureComponent {
handleTestCodeFormSubmit = (cb) => {
const {form, debuggerCode} = this.props;
- console.log(debuggerCode);
+ // console.log(debuggerCode);
form.validateFields((err, values) => {
if (!err) { // 表单验证通过时，调用测试接口
cb && cb(); // 调用回调函数，切换 tab
- console.log('表单值:', values);
+ // console.log('表单值:', values);
debuggerCode(values);
}
});
diff --git a/public/react/src/modules/developer/recordDetail/index.scss b/public/react/src/modules/developer/recordDetail/index.scss
index e52090060..994ebea58 100644
--- a/public/react/src/modules/developer/recordDetail/index.scss
+++ b/public/react/src/modules/developer/recordDetail/index.scss
@@ -1,6 +1,7 @@
@import '../split_pane_resizer.scss';
.record_detail_area{
+ background: #fff;
.record_detail_ctx{
padding: 0 20px;
.detail_ctx_header{
@@ -39,6 +40,9 @@
}
.result_error_area{
margin-top: 15px;
+ background: rgba(250,250,250,1);
+ color: #E51C24;
+ border-radius: 3px;
}
}
}
diff --git a/public/react/src/modules/developer/studentStudy/rightpane/index.js b/public/react/src/modules/developer/studentStudy/rightpane/index.js
index cf264c67b..259f2f63a 100644
--- a/public/react/src/modules/developer/studentStudy/rightpane/index.js
+++ b/public/react/src/modules/developer/studentStudy/rightpane/index.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-11-27 14:59:51
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 17:56:51
+ * @LastEditTime : 2019-12-27 09:23:15
*/
import React, { useState, useEffect } from 'react';
import {connect} from 'react-redux';
@@ -39,10 +39,12 @@ const RightPane = (props) => {
changeLoadingState
} = props;
- const [editorCode, setEditorCode] = useState('');
+ const [editorCode, setEditorCode] = useState(editor_code || hack.code);
const [noteClazz, setNoteClazz] = useState('editor_nodte_area');
const [noteCount] = useState(5000);
- let initFlag = true;
+ // const [code, setCode] = useState(editor_code || hack.code);
+ // let initFlag = true;
+
useEffect(() => {
if (editor_code) {
setEditorCode(editor_code);
@@ -61,24 +63,18 @@ const RightPane = (props) => {
let timer = null; // 定时器
// 代码块内容变化时
- const handleCodeChange = (code) => {
- // 保存用户提交的代码块
- setEditorCode(code);
- // 第一次回填代码内容时不更新;
- if (initFlag) {
- initFlag = false;
- return;
- }
+ const handleCodeChange = (value) => {
+ saveUserInputCode(value);
+ setEditorCode(value);
if (!timer) {
- timer = setInterval(() => {
+ timer = setInterval(function () {
clearInterval(timer);
timer = null;
- saveUserCodeForInterval && saveUserCodeForInterval(identifier, code);
+ saveUserCodeForInterval(identifier);
}, 3000);
}
- // 保存用户代码块
- saveUserInputCode(code);
}
+
// 代码调试
const handleDebuggerCode = (value) => {
// 调用保存代码块接口，成功后，调用调试接口
diff --git a/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js b/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
index cdd60f72c..b24d4dc2c 100644
--- a/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
+++ b/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
@@ -360,11 +360,11 @@ class Challengesjupyter extends Component {
let id=this.props.match.params.shixunId;
let that=this;
Modal.confirm({
- title: '重置实训',
+ title: '重置环境',
content: (
<p style={{ lineHeight: '24px' }}>
你在本文件中修改的内容将丢失,<br />
- 是否确定重新加载初始代码？
+ 是否确定重置环境？
</p>
),
okText: '确定',
diff --git a/public/react/src/redux/actions/ojForUser.js b/public/react/src/redux/actions/ojForUser.js
index ee78d336e..5cd0cea3a 100644
--- a/public/react/src/redux/actions/ojForUser.js
+++ b/public/react/src/redux/actions/ojForUser.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-11-27 13:42:11
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 18:32:08
+ * @LastEditTime : 2019-12-27 09:28:38
*/
import types from "./actionTypes";
import { Base64 } from 'js-base64';
@@ -108,25 +108,31 @@ export const getUserProgramDetail = (identifier, type) => {
}
export const saveUserCodeForInterval = (identifier, code) => {
- return (dispatch) => {
+ return (dispatch, getState) => {
+ const { userCode } = getState().ojForUserReducer;
dispatch({
type: types.AUTO_UPDATE_CODE,
payload: true
});
+ console.log('+++', userCode);
fetchUpdateCode(identifier, {
- code: Base64.encode(code)
+ code: userCode
}).then(res => {
if (res.data.status === 401) {
return;
};
-
+ dispatch({
+ type: types.RESTORE_INITIAL_CODE,
+ payload: userCode
+ });
+
setTimeout(() => {
dispatch({
type: types.AUTO_UPDATE_CODE,
payload: false
})
}, 1000);
- console.log('代码保存成功', res);
+ // console.log('代码保存成功', res);
}).catch(() => {
dispatch({
type: types.AUTO_UPDATE_CODE,
diff --git a/public/react/src/redux/reducers/ojForUserReducer.js b/public/react/src/redux/reducers/ojForUserReducer.js
index eeaa3c6ca..f78385049 100644
--- a/public/react/src/redux/reducers/ojForUserReducer.js
+++ b/public/react/src/redux/reducers/ojForUserReducer.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2019-11-27 13:41:48
* @LastEditors : tangjiang
- * @LastEditTime : 2019-12-26 18:34:56
+ * @LastEditTime : 2019-12-27 09:18:02
*/
import types from "../actions/actionTypes";
import { Base64 } from 'js-base64';
@@ -94,11 +94,10 @@ const ojForUserReducer = (state = initialState, action) => {
}
case types.SAVE_USER_CODE:
let curCode = Base64.encode(action.payload);
-
return {
...state,
userCode: curCode,
- isUpdateCode: true
+ isUpdateCode: true,
}
case types.IS_UPDATE_CODE:
return {
@@ -133,11 +132,13 @@ const ojForUserReducer = (state = initialState, action) => {
let restoreCode = action.payload
if (restoreCode) {
curHack['code'] = Base64.decode(restoreCode);
+ } else {
+ curHack['code'] = '';
}
- console.log('当前的代码内容:', curHack);
+ console.log(curHack);
return {
...state,
- hack: Object.assign({}, curHack)
+ hack: Object.assign({}, state.hack, curHack)
}
case types.SAVE_HACK_IDENTIFIER:
return {