diff --git a/public/react/src/images/wx-head.png b/public/react/src/images/wx-head.png
new file mode 100644
index 000000000..6e5edb72c
Binary files /dev/null and b/public/react/src/images/wx-head.png differ
diff --git a/public/react/src/modules/wxcode/index.js b/public/react/src/modules/wxcode/index.js
index 2fb871288..fa6457b5b 100644
--- a/public/react/src/modules/wxcode/index.js
+++ b/public/react/src/modules/wxcode/index.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2020-01-15 09:56:34
* @LastEditors : tangjiang
- * @LastEditTime : 2020-01-17 15:34:40
+ * @LastEditTime : 2020-01-17 21:03:15
*/
import './index.scss';
import React, {useState, useEffect, useRef} from 'react';
@@ -22,6 +22,10 @@ const App = (props) => {
wxCode,
path,
showLoading,
+ showDialog,
+ gold,
+ experience,
+ next_game,
// userCode,
testCase = [],
getWXCode,
@@ -34,7 +38,8 @@ const App = (props) => {
updateWXCodeForInterval,
evaluateWxCode,
showWXCodeTextCase,
- changeWXCodeEvaluateLoading
+ changeWXCodeEvaluateLoading,
+ changeWXCodeEvaluateDialog
} = props;
const {identifier} = props.match.params;
@@ -63,18 +68,22 @@ const App = (props) => {
// const [isVisible, setIsVisible] = useState(false);
const editorRef = useRef(null);
let timer = null;
+
+ const loadResult = (identifier) => {
+ // 加载代码块内容
+ getWXCode(identifier);
+ // 加载测试集
+ const params = {
+ path,
+ status: 0,
+ retry: 1
+ };
+ getWXCodeTestCase(identifier, params);
+ }
useEffect(() => {
setTimeout(() => {
setCookier();
- // 加载代码块内容
- getWXCode(identifier, );
- // 加载测试集
- const params = {
- path,
- status: 0,
- retry: 1
- };
- getWXCodeTestCase(identifier, params);
+ loadResult(identifier);
}, 0);
}, []);
// 关闭
@@ -109,7 +118,7 @@ const App = (props) => {
timer = null;
// 调用更新代码
updateWXCodeForInterval(identifier, path);
- }, 10000);
+ }, 5000);
}
}
@@ -130,12 +139,30 @@ const App = (props) => {
changeWXCodeEvaluateLoading(true);
evaluateWxCode(identifier, path);
}
+
+ // 关闭弹框
+ const handleCloseDialog = () => {
+ changeWXCodeEvaluateDialog(false);
+ }
+
+ // 查看测试集
+ const handleClickShowResult = () => {
+ showWXCodeTextCase(true);
+ changeWXCodeEvaluateDialog(false);
+ }
+
+ // 下一关
+ const handleClickNext = () => {
+ changeWXCodeEvaluateDialog(false);
+ loadResult(next_game);
+ }
const tcclasses = isShow ? `wx-code-test-case active` : 'wx-code-test-case';
const loading = showLoading ? 'code-evaluate-loading active' : 'code-evaluate-loading';
- const _val = sets_error_count === 0;
+ const dialog = showDialog ? 'pass-dialog active' : 'pass-dialog';
+ const _val = +sets_error_count === 0;
let resultTxt = (_val) ? '全部通过' : `${sets_error_count}组测试结果不匹配`;
- const iclasses = _val ? 'iconfont icon-tishi1 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 ulClasses = last_compile_output ? 'case-list hasResult' : 'case-list';
return (
@@ -150,7 +177,7 @@ const App = (props) => {
options={{
selectOnLineNumbers: true,
automaticLayout: true,
- fontSize: `32px`
+ fontSize: `36px`
}}
theme='dark'
editorDidMount={handleEditorChange}
@@ -199,7 +226,7 @@ const App = (props) => {
测试集{i + 1}
{
- is_public
+ is_public && last_compile_output
? (result
?
: )
@@ -249,6 +276,34 @@ const App = (props) => {
测评中...
+ {/* 通过弹框 */}
+
+
+
+
+
{next_game ? '评测通过' : '恭喜通关'}
+
+ 金币 {gold > 0 ? `+${gold}` : 0},
+ 经验值 {experience > 0 ? `+${experience}` : 0}
+
+ {
+ next_game
+ ? (
+
+
+
+
+ )
+ : (
+
+
+
+ )
+ }
+
+
+
+
);
}
@@ -259,8 +314,12 @@ const mapStateToProps = (state) => {
isShow,
wxCode,
userCode,
+ gold,
+ experience,
+ next_game,
testCase,
showLoading,
+ showDialog,
last_compile_output,
test_sets_count,
sets_error_count
@@ -271,8 +330,12 @@ const mapStateToProps = (state) => {
isShow,
wxCode,
userCode,
+ gold,
+ experience,
+ next_game,
testCase,
showLoading,
+ showDialog,
last_compile_output,
test_sets_count,
sets_error_count
@@ -287,7 +350,8 @@ const mapDispatchToProps = (dispatch) => ({
updateWXCodeForInterval: (identifier, path) => dispatch(actions.updateWXCodeForInterval(identifier, path)),
evaluateWxCode: (identifier, path) => dispatch(actions.evaluateWxCode(identifier, path)),
showWXCodeTextCase: (flag) => dispatch(actions.showWXCodeTextCase(flag)),
- changeWXCodeEvaluateLoading: (flag) => dispatch(actions.changeWXCodeEvaluateLoading(flag))
+ changeWXCodeEvaluateLoading: (flag) => dispatch(actions.changeWXCodeEvaluateLoading(flag)),
+ changeWXCodeEvaluateDialog: (flag) => dispatch(actions.changeWXCodeEvaluateDialog(flag))
});
export default connect(
diff --git a/public/react/src/modules/wxcode/index.scss b/public/react/src/modules/wxcode/index.scss
index f831da519..d31b3c55d 100644
--- a/public/react/src/modules/wxcode/index.scss
+++ b/public/react/src/modules/wxcode/index.scss
@@ -28,12 +28,16 @@
align-items: center;
.icon{
// font-size: 24px !important;
+ // transform: scale(2.4);
+ // line-height: 2;
+ font-size: 32px !important;
transform: scale(2);
- line-height: 2;
- }
- .icon-reset{
- transform: scale(2.4);
+ position: relative;
+ top: 10px;
}
+ // .icon-reset{
+ // transform: scale(2.4);
+ // }
// .icon:first-child{
// transform: scale((3));
// }
@@ -42,7 +46,7 @@
margin-left: 50px;
}
.icon-txt{
- font-size: 24px;
+ font-size: 32px;
}
}
}
@@ -53,7 +57,7 @@
border-radius: 9999px;
padding: 0 40px;
line-height: 72px;
- font-size: 32px;
+ font-size: 36px;
color: #fff;
background:#2EA4FF;
}
@@ -99,10 +103,12 @@
border-bottom: 2px solid #213857;
.header-title{
color:#637DA6;
- font-size: 24px;
+ // font-size: 24px;
+ font-size: 36px;
}
.header-close{
- font-size: 28px;
+ // font-size: 28px;
+ font-size: 36px;
color: #2EA4FF;
}
}
@@ -126,7 +132,8 @@
margin-right: 10px;
}
.result-txt{
- font-size: 34px;
+ // font-size: 34px;
+ font-size: 36px;
}
.result-txt-desc{
max-width: 500px;
@@ -162,7 +169,7 @@
margin-top: 0;
}
}
-
+
.case-item-header{
display: flex;
justify-content: space-between;
@@ -185,14 +192,14 @@
}
.item-header-desc{
- font-size: 32px;
+ font-size: 36px;
color: #405D8C;
line-height: 1.5;
// background: gold;
.icon{
position: relative;
top: -4px;
- font-size: 32px !important;
+ font-size: 36px !important;
margin-right: 10px;
}
&.active{
@@ -234,7 +241,8 @@
// }
}
}
- .code-evaluate-loading{
+ .code-evaluate-loading,
+ .pass-dialog{
display: none;
position: fixed;
left: 0;
@@ -250,7 +258,12 @@
content: '';
background: rgba(0,0,0,.5);
}
-
+ &.active{
+ display: flex;
+ }
+ }
+ .code-evaluate-loading{
+ // display: none;
.loading-flex{
display: flex;
position: absolute;
@@ -264,12 +277,84 @@
font-size: 100px !important;
}
.loading-txt{
- font-size: 32px;
+ font-size: 36px;
}
}
-
- &.active{
+ }
+ .pass-dialog{
+ flex-direction: column;
+ .pass-box{
+ position: relative;
+ z-index: 10;
+ background: #fff;
+ border-radius: 15px;
+ width: 490px;
+ height: 490px;
+ overflow: hidden;
+ }
+ .pass-img{
+ height: 200px;
+ background: url(../../images/wx-head.png) center center no-repeat;
+ // background: url(../../../public/images/wx-head.png) center center no-repeat;
+ }
+ .pass-ctx{
display: flex;
+ flex-direction: column;
+ // justify-content: center;
+ justify-content: space-between;
+ align-items: center;
+ height: 290px;
+ padding: 40px 0;
+ .pass-title,
+ .pass-value,
+ .pass-btn .btn,
+ .pass-btn-all .btn{
+ font-size: 36px;
+ line-height: 1.5;
+ }
+ .pass-value{
+ color: #888888;
+ .value_color{
+ color: rgb(234, 185, 35);
+ }
+ }
+ .pass-btn,
+ .pass-btn-all{
+ display: flex;
+ justify-content: space-between;
+ // background: gold;
+ padding: 0 40px;
+ width: 100%;
+ margin-top: 10px;
+ }
+ .pass-btn-all{
+ justify-content: center;
+ }
+ .btn{
+ outline: none;
+ border-radius: 999px;
+ padding: 0 30px;
+ height: 70px;
+ &.btn-first{
+ border: 1px solid #2EA4FF;
+ color: #2EA4FF;
+ }
+ &.btn-second{
+ background-color: #2EA4FF;
+ color: #fff;
+ }
+ }
+
+ .pass-title{
+ color: #2EA4FF;
+ }
}
}
+ .icon_close{
+ display: block;
+ position: relative;
+ z-index: 10;
+ color: #555;
+ font-size: 100px!important;
+ }
}
\ No newline at end of file
diff --git a/public/react/src/redux/actions/actionTypes.js b/public/react/src/redux/actions/actionTypes.js
index f749cd7d8..22dfa5b77 100644
--- a/public/react/src/redux/actions/actionTypes.js
+++ b/public/react/src/redux/actions/actionTypes.js
@@ -99,7 +99,9 @@ const types = {
UPDATE_WXCODE_BY_IDENTIFIER: 'UPDATE_WXCODE_BY_IDENTIFIER',
UPDATE_WXCODE_FOR_EDITOR: 'UPDATE_WXCODE_FOR_EDITOR',
IS_SHOW_WXCODE_TEST_CASES: 'IS_SHOW_WXCODE_TEST_CASES',
- SHOW_WX_CODE_LOADING: 'SHOW_WX_CODE_LOADING'
+ SHOW_WX_CODE_LOADING: 'SHOW_WX_CODE_LOADING',
+ SHOW_WX_CODE_DIALOG: 'SHOW_WX_CODE_DIALOG',
+ SET_GOLD_AND_EXPERIENCE: 'SET_GOLD_AND_EXPERIENCE'
}
export default types;
diff --git a/public/react/src/redux/actions/index.js b/public/react/src/redux/actions/index.js
index 3b8bb2e12..663e94028 100644
--- a/public/react/src/redux/actions/index.js
+++ b/public/react/src/redux/actions/index.js
@@ -118,7 +118,8 @@ import {
updateWXCodeForInterval,
evaluateWxCode,
showWXCodeTextCase,
- changeWXCodeEvaluateLoading
+ changeWXCodeEvaluateLoading,
+ changeWXCodeEvaluateDialog
} from './wxCode';
export default {
toggleTodo,
@@ -211,5 +212,6 @@ export default {
updateWXCodeForInterval,
evaluateWxCode,
showWXCodeTextCase,
- changeWXCodeEvaluateLoading
+ changeWXCodeEvaluateLoading,
+ changeWXCodeEvaluateDialog
}
\ No newline at end of file
diff --git a/public/react/src/redux/actions/wxCode.js b/public/react/src/redux/actions/wxCode.js
index 32927658d..e62e6facc 100644
--- a/public/react/src/redux/actions/wxCode.js
+++ b/public/react/src/redux/actions/wxCode.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2020-01-15 15:41:10
* @LastEditors : tangjiang
- * @LastEditTime : 2020-01-16 15:25:25
+ * @LastEditTime : 2020-01-17 21:06:46
*/
import types from './actionTypes.js';
import {
@@ -38,6 +38,7 @@ export const getWXCodeTestCase = (identifier, params) => {
try{
const {data = {}} = res;
console.log(data.test_sets);
+ const _path = data.challenge.path;
dispatch({
type: types.GET_WXCODE_TEST_CASE,
payload: {
@@ -45,7 +46,7 @@ export const getWXCodeTestCase = (identifier, params) => {
game_id: data.game && data.game.id,
myIdentifier: data.myshixun.identifier,
exec_time: data.challenge.exec_time,
- path: data.challenge.path,
+ path: _path.split(';')[0] || _path.split(';')[0],
last_compile_output: data.last_compile_output,
test_sets_count: data.test_sets_count,
sets_error_count: data.sets_error_count
@@ -103,6 +104,7 @@ export const evaluateWxCode = (identifier, path) => {
return (dispatch, getState) => {
const {
userCode,
+ wxCode,
game_id,
myIdentifier,
exec_time,
@@ -115,61 +117,90 @@ export const evaluateWxCode = (identifier, path) => {
// build
// const {} = res;
console.log(res);
+ const _resubmit = res.data.resubmit;
const params = {
- content_modified: 1,
- sec_key: res.data.sec_key
+ first: 1,
+ content_modified: userCode !== wxCode ? 1 : 0,
+ sec_key: res.data.sec_key,
+ resubmit: _resubmit
}
- console.log(params);
- fetchWxCodeGameBuild(identifier, params).then(res => {
- if (res.data.status === 1) {
- // 定时调用 game_status fetchWxCodeGameStatus
- let count = 1;
- const intervalTime = 500;
- function wxCodeGameStatus (intervalTime, finalTime, count, timer) {
- const excuteTime = (count++) * intervalTime; // 当前执行时间
- console.log(finalTime, count, excuteTime);
- fetchWxCodeGameStatus(identifier).then(r => {
- const { status, test_sets = [] } = r.data;
- if (+status > -1 || ((excuteTime / 1000) > (finalTime + 1))) {
- clearInterval(timer);
- timer = null;
+
+ setTimeout(() => {
+ // console.log(params);
+ fetchWxCodeGameBuild(identifier, params).then(res => {
+ const {status} = res.data;
+ if (status === 1) {
+ // 定时调用 game_status fetchWxCodeGameStatus
+ let count = 1;
+ const intervalTime = 500;
+ function wxCodeGameStatus (intervalTime, finalTime, count, timer) {
+ const excuteTime = (count++) * intervalTime; // 当前执行时间
+ console.log(finalTime, count, excuteTime);
+ fetchWxCodeGameStatus(identifier, {resubmit: _resubmit}).then(r => {
+ const { status, test_sets = [], gold, experience, next_game, sets_error_count } = r.data;
+ if (+status > -1 || ((excuteTime / 1000) > (finalTime + 1))) {
+ clearInterval(timer);
+ timer = null;
+ dispatch({
+ type: types.SHOW_WX_CODE_LOADING,
+ payload: false
+ });
+ setTimeout(() => {
+ // 显示测试集弹框
+ // dispatch({
+ // type: types.IS_SHOW_WXCODE_TEST_CASES,
+ // payload: true
+ // });
+ // 评测是否通过, 通过 弹通过,否则 弹测试集
+ if (status === 2 && sets_error_count === 0) {
+ dispatch({
+ type: types.SET_GOLD_AND_EXPERIENCE,
+ payload: {
+ gold,
+ experience,
+ next_game
+ }
+ });
+ dispatch({
+ type: types.SHOW_WX_CODE_DIALOG,
+ payload: true
+ });
+
+ } else {
+ dispatch({
+ type: types.IS_SHOW_WXCODE_TEST_CASES,
+ payload: true
+ });
+ }
+ dispatch({
+ type: types.GET_WXCODE_TEST_CASE,
+ payload: {
+ test_sets,
+ game_id,
+ myIdentifier,
+ exec_time,
+ path,
+ last_compile_output,
+ test_sets_count,
+ sets_error_count
+ }
+ });
+ }, 50);
+ }
+ }).catch(err => {
dispatch({
type: types.SHOW_WX_CODE_LOADING,
payload: false
});
- setTimeout(() => {
- // 显示测试集弹框
- dispatch({
- type: types.IS_SHOW_WXCODE_TEST_CASES,
- payload: true
- });
- dispatch({
- type: types.GET_WXCODE_TEST_CASE,
- payload: {
- test_sets,
- game_id,
- myIdentifier,
- exec_time,
- path,
- last_compile_output,
- test_sets_count,
- sets_error_count
- }
- });
- }, 50);
- }
- }).catch(err => {
- dispatch({
- type: types.SHOW_WX_CODE_LOADING,
- payload: false
});
- });
+ }
+ let timer = setInterval(() => {
+ wxCodeGameStatus(intervalTime, exec_time, count++, timer);
+ }, intervalTime);
}
- let timer = setInterval(() => {
- wxCodeGameStatus(intervalTime, exec_time, count++, timer);
- }, intervalTime);
- }
- })
+ })
+ }, 50);
+
}).catch(err => {
dispatch({
type: types.SHOW_WX_CODE_LOADING,
@@ -193,4 +224,12 @@ export const changeWXCodeEvaluateLoading = (flag) => {
type: types.SHOW_WX_CODE_LOADING,
payload: flag
}
-}
\ No newline at end of file
+}
+
+// 关闭对话框
+export const changeWXCodeEvaluateDialog = (flag) => {
+ return {
+ type: types.SHOW_WX_CODE_DIALOG,
+ payload: flag
+ }
+}
diff --git a/public/react/src/redux/reducers/wxcodeReducer.js b/public/react/src/redux/reducers/wxcodeReducer.js
index 26ac4204f..24aa4a58b 100644
--- a/public/react/src/redux/reducers/wxcodeReducer.js
+++ b/public/react/src/redux/reducers/wxcodeReducer.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2020-01-15 15:37:44
* @LastEditors : tangjiang
- * @LastEditTime : 2020-01-16 15:22:37
+ * @LastEditTime : 2020-01-17 19:50:00
*/
import types from "../actions/actionTypes";
const initialState = {
@@ -19,7 +19,11 @@ const initialState = {
sets_error_count: 0,
path: '',
isShow: false,
- showLoading: false
+ showLoading: false,
+ showDialog: false,
+ gold: 0,
+ experience: 0,
+ next_game: ''
};
const wxcodeReducer = (state = initialState, action) => {
@@ -58,6 +62,18 @@ const wxcodeReducer = (state = initialState, action) => {
...state,
showLoading: payload
}
+ case types.SHOW_WX_CODE_DIALOG:
+ return {
+ ...state,
+ showDialog: payload
+ }
+ case types.SET_GOLD_AND_EXPERIENCE:
+ return {
+ ...state,
+ gold: payload.gold,
+ experience: payload.experience,
+ next_game: payload.next_game
+ }
default:
return {
...state
diff --git a/public/react/src/services/wxcodeService.js b/public/react/src/services/wxcodeService.js
index 073f248fa..4490321a8 100644
--- a/public/react/src/services/wxcodeService.js
+++ b/public/react/src/services/wxcodeService.js
@@ -4,7 +4,7 @@
* @Github:
* @Date: 2020-01-15 15:44:36
* @LastEditors : tangjiang
- * @LastEditTime : 2020-01-17 16:40:03
+ * @LastEditTime : 2020-01-17 20:39:13
*/
import axios from 'axios';
import cookie from 'react-cookies'
@@ -69,9 +69,9 @@ export async function fetchWxCodeGameBuild (identifier, params) {
return axios.get(url, {params});
}
-export async function fetchWxCodeGameStatus (identifier) {
+export async function fetchWxCodeGameStatus (identifier, params) {
setCookier();
const url = `/tasks/${identifier}/game_status.json`;
- const params = Object.assign({}, {withCredentials: true});
+ params = Object.assign({}, params, {withCredentials: true});
return axios.get(url, {params});
}