|
|
|
@ -4,7 +4,7 @@
|
|
|
|
* @Github:
|
|
|
|
* @Github:
|
|
|
|
* @Date: 2020-01-15 09:56:34
|
|
|
|
* @Date: 2020-01-15 09:56:34
|
|
|
|
* @LastEditors : tangjiang
|
|
|
|
* @LastEditors : tangjiang
|
|
|
|
* @LastEditTime : 2020-01-17 21:10:23
|
|
|
|
* @LastEditTime : 2020-01-18 15:07:09
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
import './index.scss';
|
|
|
|
import './index.scss';
|
|
|
|
import React, {useState, useEffect, useRef} from 'react';
|
|
|
|
import React, {useState, useEffect, useRef} from 'react';
|
|
|
|
@ -44,28 +44,36 @@ const App = (props) => {
|
|
|
|
|
|
|
|
|
|
|
|
const {identifier} = props.match.params;
|
|
|
|
const {identifier} = props.match.params;
|
|
|
|
// 获取路径参数
|
|
|
|
// 获取路径参数
|
|
|
|
|
|
|
|
|
|
|
|
const setCookier = () => {
|
|
|
|
const setCookier = () => {
|
|
|
|
// const _params = window.location.search;
|
|
|
|
const _params = window.location.search;
|
|
|
|
// if (_params) {
|
|
|
|
if (_params) {
|
|
|
|
// let _search = _params.split('?')[1];
|
|
|
|
let _search = _params.split('?')[1];
|
|
|
|
// _search.split('&').forEach(item => {
|
|
|
|
_search.split('&').forEach(item => {
|
|
|
|
// // console.log(item);
|
|
|
|
// console.log(item);
|
|
|
|
// const _arr = item.split('=');
|
|
|
|
const _arr = item.split('=');
|
|
|
|
// cookie.remove(_arr[0], {
|
|
|
|
cookie.remove(_arr[0], {
|
|
|
|
// path: '/',
|
|
|
|
path: '/',
|
|
|
|
// domain: '.educoder.net'
|
|
|
|
domain: '.educoder.net'
|
|
|
|
// });
|
|
|
|
});
|
|
|
|
// cookie.save(_arr[0], _arr[1], {
|
|
|
|
cookie.save(_arr[0], _arr[1], {
|
|
|
|
// path: '/',
|
|
|
|
path: '/',
|
|
|
|
// domain: '.educoder.net'
|
|
|
|
domain: '.educoder.net'
|
|
|
|
// });
|
|
|
|
});
|
|
|
|
// });
|
|
|
|
});
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
setCookier();
|
|
|
|
setCookier();
|
|
|
|
const [isActive, setIsActive] = useState(-1);
|
|
|
|
const [isActive, setIsActive] = useState(-1);
|
|
|
|
|
|
|
|
const [tip, setTip] = useState('');
|
|
|
|
|
|
|
|
const [codes, setCodes] = useState(wxCode);
|
|
|
|
|
|
|
|
// const [showInfo, setShowInfo] = useState(false);
|
|
|
|
// const [isVisible, setIsVisible] = useState(false);
|
|
|
|
// const [isVisible, setIsVisible] = useState(false);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
|
|
|
if (codes !== props.wxCode) {
|
|
|
|
|
|
|
|
setCodes(props.wxCode);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}, [props]);
|
|
|
|
const editorRef = useRef(null);
|
|
|
|
const editorRef = useRef(null);
|
|
|
|
let timer = null;
|
|
|
|
let timer = null;
|
|
|
|
|
|
|
|
|
|
|
|
@ -129,8 +137,12 @@ const App = (props) => {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 初始化
|
|
|
|
// 初始化
|
|
|
|
const handleResetCode = () => {
|
|
|
|
const handleResetCode = () => {
|
|
|
|
|
|
|
|
clearInterval(timer);
|
|
|
|
|
|
|
|
timer = null;
|
|
|
|
const result = window.confirm('你在本文件中修改的内容将丢失, 是否确定重新加载初始代码？');
|
|
|
|
const result = window.confirm('你在本文件中修改的内容将丢失, 是否确定重新加载初始代码？');
|
|
|
|
if (result) {
|
|
|
|
if (result) {
|
|
|
|
|
|
|
|
setTip('初始化中...');
|
|
|
|
|
|
|
|
changeWXCodeEvaluateLoading(true);
|
|
|
|
identifier && restoreWXCode(identifier, { path });
|
|
|
|
identifier && restoreWXCode(identifier, { path });
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -138,6 +150,7 @@ const App = (props) => {
|
|
|
|
const handleEvalateCode = () => {
|
|
|
|
const handleEvalateCode = () => {
|
|
|
|
changeWXCodeEvaluateLoading(true);
|
|
|
|
changeWXCodeEvaluateLoading(true);
|
|
|
|
evaluateWxCode(identifier, path);
|
|
|
|
evaluateWxCode(identifier, path);
|
|
|
|
|
|
|
|
setTip('评测中...');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 关闭弹框
|
|
|
|
// 关闭弹框
|
|
|
|
@ -164,7 +177,9 @@ const App = (props) => {
|
|
|
|
let resultTxt = (_val) ? '全部通过' : `${sets_error_count}组测试结果不匹配`;
|
|
|
|
let resultTxt = (_val) ? '全部通过' : `${sets_error_count}组测试结果不匹配`;
|
|
|
|
const iclasses = _val ? 'iconfont icon-wancheng icon success' : 'iconfont icon-tishi1 icon fail';
|
|
|
|
const iclasses = _val ? 'iconfont icon-wancheng icon success' : 'iconfont icon-tishi1 icon fail';
|
|
|
|
const tclasses = _val ? 'result-txt success' : 'result-txt fail';
|
|
|
|
const tclasses = _val ? 'result-txt success' : 'result-txt fail';
|
|
|
|
const ulClasses = last_compile_output ? 'case-list hasResult' : 'case-list';
|
|
|
|
const ulClasses = !!last_compile_output ? 'case-list hasResult' : 'case-list';
|
|
|
|
|
|
|
|
const resultFlag = !!last_compile_output ? 'wxcode-test-result active' : 'wxcode-test-result';
|
|
|
|
|
|
|
|
// console.log('==========>>>>>>>> 评测结果样式', last_compile_output, resultFlag);
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<div className="wx-code-area">
|
|
|
|
<div className="wx-code-area">
|
|
|
|
<div className="wx-code-flex">
|
|
|
|
<div className="wx-code-flex">
|
|
|
|
@ -173,11 +188,11 @@ const App = (props) => {
|
|
|
|
height="100%"
|
|
|
|
height="100%"
|
|
|
|
width="100%"
|
|
|
|
width="100%"
|
|
|
|
language="python"
|
|
|
|
language="python"
|
|
|
|
value={wxCode}
|
|
|
|
value={codes}
|
|
|
|
options={{
|
|
|
|
options={{
|
|
|
|
selectOnLineNumbers: true,
|
|
|
|
selectOnLineNumbers: true,
|
|
|
|
automaticLayout: true,
|
|
|
|
automaticLayout: true,
|
|
|
|
fontSize: `36px`
|
|
|
|
fontSize: `42px`
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
theme='dark'
|
|
|
|
theme='dark'
|
|
|
|
editorDidMount={handleEditorChange}
|
|
|
|
editorDidMount={handleEditorChange}
|
|
|
|
@ -186,11 +201,11 @@ const App = (props) => {
|
|
|
|
<div className="wx-code-test">
|
|
|
|
<div className="wx-code-test">
|
|
|
|
<div className="flex-btn">
|
|
|
|
<div className="flex-btn">
|
|
|
|
<span className="icon-btn" onClick={handleResetCode}>
|
|
|
|
<span className="icon-btn" onClick={handleResetCode}>
|
|
|
|
<i className="iconfont icon-reset icon"></i>
|
|
|
|
<i className="iconfont icon-chushihua icon"></i>
|
|
|
|
<span className="icon-txt">初始化</span>
|
|
|
|
<span className="icon-txt">初始化</span>
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
<span className="icon-btn" onClick={handleClickTestCase}>
|
|
|
|
<span className="icon-btn" onClick={handleClickTestCase}>
|
|
|
|
<i className="iconfont icon-base icon"></i>
|
|
|
|
<i className="iconfont icon-ceshiji icon"></i>
|
|
|
|
<span className="icon-txt">测试集</span>
|
|
|
|
<span className="icon-txt">测试集</span>
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@ -205,7 +220,7 @@ const App = (props) => {
|
|
|
|
<span className="header-title">共{testCase.length}个测试用例</span>
|
|
|
|
<span className="header-title">共{testCase.length}个测试用例</span>
|
|
|
|
<span className="header-close" onClick={handleCloseTestCase}>关闭</span>
|
|
|
|
<span className="header-close" onClick={handleCloseTestCase}>关闭</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div className="wxcode-test-result" style={{ display: last_compile_output ? 'block' : 'none'}}>
|
|
|
|
<div className={resultFlag}>
|
|
|
|
<i className={iclasses}></i>
|
|
|
|
<i className={iclasses}></i>
|
|
|
|
<span className={tclasses}>{test_sets_count - sets_error_count}/{test_sets_count}</span>
|
|
|
|
<span className={tclasses}>{test_sets_count - sets_error_count}/{test_sets_count}</span>
|
|
|
|
<span className={`${tclasses} result-txt-desc`}>{resultTxt}</span>
|
|
|
|
<span className={`${tclasses} result-txt-desc`}>{resultTxt}</span>
|
|
|
|
@ -213,7 +228,7 @@ const App = (props) => {
|
|
|
|
<ul className={ulClasses}>
|
|
|
|
<ul className={ulClasses}>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
testCase.map((item, i) => {
|
|
|
|
testCase.map((item, i) => {
|
|
|
|
const {input, output, actual_output, is_public, result} = item;
|
|
|
|
const {input, output, actual_output, is_public, result, compile_success} = item;
|
|
|
|
const _classes = isActive === i ? 'case-item-desc active' : 'case-item-desc';
|
|
|
|
const _classes = isActive === i ? 'case-item-desc active' : 'case-item-desc';
|
|
|
|
const iconclasses = isActive === i ? 'iconfont icon-sanjiaoxing-down icon active' : 'iconfont icon-triangle icon';
|
|
|
|
const iconclasses = isActive === i ? 'iconfont icon-sanjiaoxing-down icon active' : 'iconfont icon-triangle icon';
|
|
|
|
const headerClasses = is_public ? 'item-header-desc active' : 'item-header-desc';
|
|
|
|
const headerClasses = is_public ? 'item-header-desc active' : 'item-header-desc';
|
|
|
|
@ -226,17 +241,23 @@ const App = (props) => {
|
|
|
|
测试集{i + 1}
|
|
|
|
测试集{i + 1}
|
|
|
|
</h2>
|
|
|
|
</h2>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
is_public && last_compile_output
|
|
|
|
is_public
|
|
|
|
? (result
|
|
|
|
? compile_success > 0
|
|
|
|
? <span className="iconfont icon-wancheng case_item_success"></span>
|
|
|
|
? result ? <span className="iconfont icon-wancheng case_item_success"></span>
|
|
|
|
: <span className="iconfont icon-jinggao1 case_item_fail"></span>)
|
|
|
|
|
|
|
|
: (<span className="case-item-tips">
|
|
|
|
|
|
|
|
隐藏测试集，暂不支持解锁和查看
|
|
|
|
|
|
|
|
{/* {result
|
|
|
|
|
|
|
|
? <span className="iconfont icon-wancheng case_item_success"></span>
|
|
|
|
|
|
|
|
: <span className="iconfont icon-jinggao1 case_item_fail"></span>
|
|
|
|
: <span className="iconfont icon-jinggao1 case_item_fail"></span>
|
|
|
|
} */}
|
|
|
|
: ''
|
|
|
|
</span>)
|
|
|
|
:
|
|
|
|
|
|
|
|
<span className="case-item-tips">隐藏测试集，暂不支持解锁和查看 </span>
|
|
|
|
|
|
|
|
// is_public
|
|
|
|
|
|
|
|
// ? result ? <span className="iconfont icon-wancheng case_item_success"></span>
|
|
|
|
|
|
|
|
// : <span className="iconfont icon-jinggao1 case_item_fail"></span>)
|
|
|
|
|
|
|
|
// : (
|
|
|
|
|
|
|
|
// 隐藏测试集，暂不支持解锁和查看
|
|
|
|
|
|
|
|
// {/* {result
|
|
|
|
|
|
|
|
// ? <span className="iconfont icon-wancheng case_item_success"></span>
|
|
|
|
|
|
|
|
// : <span className="iconfont icon-jinggao1 case_item_fail"></span>
|
|
|
|
|
|
|
|
// } */}
|
|
|
|
|
|
|
|
// </span>)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
@ -273,7 +294,7 @@ const App = (props) => {
|
|
|
|
<div className={loading}>
|
|
|
|
<div className={loading}>
|
|
|
|
<span className="loading-flex">
|
|
|
|
<span className="loading-flex">
|
|
|
|
<Icon className="loading-icon" type="loading" />
|
|
|
|
<Icon className="loading-icon" type="loading" />
|
|
|
|
<span className="loading-txt">测评中...</span>
|
|
|
|
<span className="loading-txt">{tip}</span>
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{/* 通过弹框 */}
|
|
|
|
{/* 通过弹框 */}
|
|
|
|
@ -324,7 +345,7 @@ const mapStateToProps = (state) => {
|
|
|
|
test_sets_count,
|
|
|
|
test_sets_count,
|
|
|
|
sets_error_count
|
|
|
|
sets_error_count
|
|
|
|
} = state.wxcodeReducer;
|
|
|
|
} = state.wxcodeReducer;
|
|
|
|
console.log(state);
|
|
|
|
// console.log(state);
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
path,
|
|
|
|
path,
|
|
|
|
isShow,
|
|
|
|
isShow,
|
|
|
|
|
