diff --git a/public/react/src/App.js b/public/react/src/App.js index 1c15b3dab..46a92166d 100644 --- a/public/react/src/App.js +++ b/public/react/src/App.js @@ -311,6 +311,11 @@ const StudentStudy = Loadable({ loader: () => import('./modules/developer/studentStudy'), loading: Loading }); +// 提交记录详情 +const RecordDetail = Loadable({ + loader: () => import('./modules/developer/recordDetail'), + loading: Loading +}); // //个人竞赛报名 // const PersonalCompetit = Loadable({ // loader: () => import('./modules/competition/personal/PersonalCompetit.js'), @@ -666,17 +671,33 @@ class App extends Component { (props)=>() }/> - + { + // debugger; + // console.log(this.props, props, this.state); + // return () + // } + // } + /> () + (props) => () } /> + () + } + /> () } /> - + () + }/> ( - ), @@ -179,6 +179,7 @@ class DeveloperHome extends React.PureComponent { componentDidMount() { // 是否是我的，如果是我的 显示编辑按钮 const { isMySource } = this.props; + if (isMySource) { this.handleFilterSearch({come_from: 'mine'}); let _columns = this.columns.concat([this.options]); @@ -197,6 +198,31 @@ class DeveloperHome extends React.PureComponent { }); } + // 是否登录 + isLogin = (url) => { + if(this.props.checkIfLogin()===false){ + this.props.showLoginDialog() + return false; + } + return true; + } + + // 新建 + handleClickNew = () => { + if (this.isLogin()) { + // this.props.history.push('/problems/new'); + window.location.href = '/problems/new' + } + // window.location.href = '/problems/new'; + } + + // 编辑 + handleClickEditor = (identifier) => { + if (this.isLogin()) { + this.props.history.push(`/problems/${identifier}/edit`) + } + } + // table条件变化时 handleTableChange = (pagination, filters, sorter) => { const {field, order} = sorter; const {current, pageSize} = pagination; @@ -208,7 +234,7 @@ class DeveloperHome extends React.PureComponent { }); this.props.changePaginationInfo(pagination); }; - + // 获取接口数据 fetchData = () => { this.props.fetchOJList(this.state.searchParams); }; @@ -245,7 +271,9 @@ class DeveloperHome extends React.PureComponent { this.setState({ searchParams: searchParams }, () => { - this.fetchData(); + if (this.isLogin()) { + this.fetchData(); + } }); } @@ -343,10 +371,16 @@ class DeveloperHome extends React.PureComponent { // 点击name handleNameClick = (record) => { - console.log('name has click', record); + // console.log('name has click', record); // 先调用start接口获取返回的 identifier, 再跳转到开启编辑 - this.props.startProgramQuestion(record.identifier, this.props); + if (this.isLogin()) { + this.props.startProgramQuestion(record.identifier, this.props); + } } + // if(this.props.checkIfLogin()===false){ + // this.props.showLoginDialog() + // return + // } render () { // const { testReducer, handleClick } = this.props; @@ -388,8 +422,8 @@ class DeveloperHome extends React.PureComponent { - diff --git a/public/react/src/modules/developer/components/monacoSetting/index.js b/public/react/src/modules/developer/components/monacoSetting/index.js index 0d71f55be..ea8448fa0 100644 --- a/public/react/src/modules/developer/components/monacoSetting/index.js +++ b/public/react/src/modules/developer/components/monacoSetting/index.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-11-25 17:50:33 * @LastEditors: tangjiang - * @LastEditTime: 2019-11-27 14:40:36 + * @LastEditTime: 2019-12-04 11:26:02 */ import React from 'react'; import { Select } from 'antd'; @@ -18,9 +18,10 @@ const SettingDrawer = (props) => { */ const {title, type = 'label', content = [] } = props; - const handleFontSize = (value) => { + const handleFontSize = (e) => { const {onChangeFontSize} = props; - // console.log('fong size change: ', value); + const value = e.target.value; + console.log('fong size change: ', value); onChangeFontSize && onChangeFontSize(value); } @@ -39,16 +40,16 @@ const SettingDrawer = (props) => { } else if (Array.isArray(value)) { if (type === 'select') { const child = ctx.value.map((opt, i) => ( - + )); renderResult = (
{ctx.text} - {child} - +
); } diff --git a/public/react/src/modules/developer/components/myMonacoEditor/index.js b/public/react/src/modules/developer/components/myMonacoEditor/index.js index 989fc07ba..ae10e37d0 100644 --- a/public/react/src/modules/developer/components/myMonacoEditor/index.js +++ b/public/react/src/modules/developer/components/myMonacoEditor/index.js @@ -4,11 +4,11 @@ * @Github: * @Date: 2019-11-27 15:02:52 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-03 09:29:54 + * @LastEditTime: 2019-12-04 11:36:16 */ import './index.scss'; import React, { useState, useRef, useEffect } from 'react'; -import { Icon, Drawer } from 'antd'; +import { Icon, Drawer, Modal } from 'antd'; import { connect } from 'react-redux'; import MonacoEditor from '@monaco-editor/react'; import SettingDrawer from '../../components/monacoSetting'; @@ -22,9 +22,11 @@ function MyMonacoEditor (props, ref) { const { language, code, + identifier, showOrHideControl, // saveUserInputCode, - onCodeChange + onCodeChange, + onRestoreInitialCode } = props; const [showDrawer, setShowDrawer] = useState(false); // 控制配置滑框 const [editCode, setEditCode] = useState(''); @@ -77,11 +79,25 @@ function MyMonacoEditor (props, ref) { fontSize: `${fontSize}px` } + // 恢复初始代码 + const handleRestoreCode = () => { + console.log('点击了恢复初始代码'); + Modal.confirm({ + content: '确定要恢复代码吗?', + okText: '确定', + cancelText: '取消', + onOk () { + onRestoreInitialCode && onRestoreInitialCode(); + } + }) + } + return (
- 已保存 + {identifier ? '已保存' : ''} + {identifier ? '恢复初始代码' : ''}
{ +const App = (props) => { return ( - + ); } diff --git a/public/react/src/modules/developer/newOrEditTask/index.js b/public/react/src/modules/developer/newOrEditTask/index.js index 6e1ec7a4a..b06279bc7 100644 --- a/public/react/src/modules/developer/newOrEditTask/index.js +++ b/public/react/src/modules/developer/newOrEditTask/index.js @@ -6,10 +6,10 @@ * @Last Modified time: 2019-11-19 23:23:41 */ import './index.scss'; -import React, { useState, useEffect, useRef } from 'react'; +import React, { useEffect } from 'react'; import { connect } from 'react-redux'; import SplitPane from 'react-split-pane';// import { Form } from 'antd'; -import { Button, Icon, notification } from 'antd'; +import { Button, Icon } from 'antd'; import { Link } from 'react-router-dom'; import LeftPane from './leftpane'; import RightPane from './rightpane'; @@ -20,18 +20,19 @@ const NewOrEditTask = (props) => { const { publishLoading, handlePublish, - testCases = [], + // testCases = [], // ojTestCaseValidate = [], - changeSubmitLoadingStatus, + // changeSubmitLoadingStatus, changePublishLoadingStatus, - updateTestAndValidate, + // updateTestAndValidate, identifier, } = props; - const leftRef = useRef(null); - const rightRef = useRef(null); + // console.log('props =====>>>>', props); + // const leftRef = useRef(null); + // const rightRef = useRef(null); - const [formDate, setFormData] = useState({}); + // const [formDate, setFormData] = useState({}); // const isNullOrUndefiendOrZero = (value) => { // if ([undefined, null, ''].includes(value)) { diff --git a/public/react/src/modules/developer/recordDetail/index.js b/public/react/src/modules/developer/recordDetail/index.js new file mode 100644 index 000000000..05be1a6e7 --- /dev/null +++ b/public/react/src/modules/developer/recordDetail/index.js @@ -0,0 +1,112 @@ +/* + * @Description: 提交记录详情 + * @Author: tangjiang + * @Github: + * @Date: 2019-12-04 08:36:21 + * @LastEditors: tangjiang + * @LastEditTime: 2019-12-04 10:36:06 + */ +import './index.scss'; +import React, { useState, useEffect } from 'react'; +import { Button } from 'antd'; +import moment from 'moment'; +import ErrorResult from '../components/errorResult'; +import { Link } from 'react-router-dom'; +import MonacoEditor from '@monaco-editor/react'; +import { connect } from 'react-redux'; +import { getImageUrl } from 'educoder'; +import actions from '../../../redux/actions'; +import CONST from '../../../constants'; + +const {reviewResult} = CONST; + +function RecordDetail (props) { + const { + match: { params }, + mygetHelmetapi = {}, + recordDetail, + getUserCommitRecordDetail + } = props; + + const identifier = params.id; + const [detail, setDetail] = useState({}); + + useEffect(() => { + // 根据id获取记录详情 + getUserCommitRecordDetail(identifier, 'detail'); + }, []); + + useEffect(() => { + setDetail(recordDetail); + }, [recordDetail]); + return ( +
+
+
+ 用户头像 + + {(mygetHelmetapi &&mygetHelmetapi.name) || ''} + +
+
+ {detail.name || 'test'} +
+
+ +
+
+
+
+

提交记录

+
+
+ + 状态: {reviewResult[detail.status]} + + + 提交时间: + {/* moment(detail.) */} + + + + 语言: C + +
+
+ +
+
+

提交内容

+ +
+
+ +
+
+
+ ) +} + +const mapStateToProps = (state) => { + const {recordDetail} = state.ojForUserReducer; + return { + recordDetail + } +} +const mapDispatchToProps = (dispatch) => ({ + // 根据id号获取记录详情 + getUserCommitRecordDetail: (id, type) => dispatch(actions.getUserCommitRecordDetail(id, type)) +}); + +export default connect( + mapStateToProps, + mapDispatchToProps +)(RecordDetail); \ No newline at end of file diff --git a/public/react/src/modules/developer/recordDetail/index.scss b/public/react/src/modules/developer/recordDetail/index.scss new file mode 100644 index 000000000..0360acb31 --- /dev/null +++ b/public/react/src/modules/developer/recordDetail/index.scss @@ -0,0 +1,39 @@ +@import '../split_pane_resizer.scss'; + +.record_detail_area{ + .record_detail_ctx{ + padding: 0 30px; + .detail_ctx_header{ + position: relative; + height: 56px; + } + .header_h2{ + line-height: 56px; + } + .header_btn{ + position: absolute; + right: 0; + top: 14px; + } + .detail_ctx_status{ + line-height: 18px; + .status_label{ + color: rgba(153,153,153,1); + margin-right: 40px; + } + .status_label_error{ + color: #E51C24; + } + .status_label_success{ + color: #28BD8B; + } + .status_label_sub{ + color: #333333; + } + } + + .result_code_area{ + height: 500px; + } + } +} diff --git a/public/react/src/modules/developer/split_pane_resizer.scss b/public/react/src/modules/developer/split_pane_resizer.scss index 7700cf7db..f8b5b28eb 100644 --- a/public/react/src/modules/developer/split_pane_resizer.scss +++ b/public/react/src/modules/developer/split_pane_resizer.scss @@ -1,9 +1,11 @@ .new_add_task_wrap, -.student_study_warp{ +.student_study_warp, +.record_detail_area{ height: 100vh; .task_header, - .student_study_header{ + .student_study_header, + .record_detail_header{ height: 65px; background:rgba(34,34,34,1); padding:0 30px; @@ -50,7 +52,8 @@ } } - .student_study_header{ + .student_study_header, + .record_detail_header{ position: relative; .avator_nicker, .study_quit, diff --git a/public/react/src/modules/developer/studentStudy/index.js b/public/react/src/modules/developer/studentStudy/index.js index 3af736006..5c9a89247 100644 --- a/public/react/src/modules/developer/studentStudy/index.js +++ b/public/react/src/modules/developer/studentStudy/index.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-11-23 10:53:19 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-03 14:49:32 + * @LastEditTime: 2019-12-04 14:02:05 */ import './index.scss'; import React, { useEffect } from 'react'; @@ -30,6 +30,7 @@ const StudentStudy = (props) => { saveUserProgramIdentifier, } = props; + console.log(props); let { id } = params; // console.log(id); @@ -57,7 +58,7 @@ const StudentStudy = (props) => {
- +
diff --git a/public/react/src/modules/developer/studentStudy/leftpane/commitRecord/index.js b/public/react/src/modules/developer/studentStudy/leftpane/commitRecord/index.js index 6a8057105..d7a76c19c 100644 --- a/public/react/src/modules/developer/studentStudy/leftpane/commitRecord/index.js +++ b/public/react/src/modules/developer/studentStudy/leftpane/commitRecord/index.js @@ -4,12 +4,13 @@ * @Github: * @Date: 2019-11-27 09:49:33 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-03 20:47:59 + * @LastEditTime: 2019-12-04 10:37:33 */ import './index.scss'; import React, { useState, useEffect } from 'react'; import { Table, Icon, message } from 'antd'; import { connect } from 'react-redux'; +import { Link } from 'react-router-dom'; import actions from '../../../../../redux/actions'; import CONST from '../../../../../constants'; import moment from 'moment'; @@ -109,7 +110,9 @@ const CommitRecord = (props) => {

- 显示详情 + + 显示详情 +

diff --git a/public/react/src/modules/developer/studentStudy/rightpane/index.js b/public/react/src/modules/developer/studentStudy/rightpane/index.js index 216deffdb..f146e6e6b 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-03 09:31:59 + * @LastEditTime: 2019-12-04 10:57:49 */ import React from 'react'; import {connect} from 'react-redux'; @@ -20,7 +20,8 @@ const RightPane = (props) => { submitUserCode, input, updateCode, - saveUserInputCode + saveUserInputCode, + restoreInitialCode } = props; const handleSubmitForm = () => { @@ -33,7 +34,7 @@ const RightPane = (props) => { // 代码块内容变化时 const handleCodeChange = (code) => { // 保存用户提交的代码块 - console.log(code); + // console.log(code); // 保存用户代码块 saveUserInputCode(code); } @@ -42,13 +43,19 @@ const RightPane = (props) => { // 调用保存代码块接口，成功后，调用调试接口 updateCode(identifier, value, 'debug'); } + // 恢复初始代码 + const handleRestoreInitialCode = () => { + restoreInitialCode(identifier); + } return (
- ({ updateCode: (identifier, inputValue, type) => dispatch(actions.updateCode(identifier, inputValue, type)), // 保存用户代码块 saveUserInputCode: (code) => dispatch(actions.saveUserInputCode(code)), + // 恢复初始代码 + restoreInitialCode: (identifier) => dispatch(actions.restoreInitialCode(identifier)), }); export default connect( diff --git a/public/react/src/modules/tpm/TPMIndex.js b/public/react/src/modules/tpm/TPMIndex.js index 9b3308e04..7fd389197 100644 --- a/public/react/src/modules/tpm/TPMIndex.js +++ b/public/react/src/modules/tpm/TPMIndex.js @@ -148,7 +148,7 @@ class TPMIndex extends Component { componentDidMount = () => { let id = this.props.match.params.shixunId; - + console.log('props', this.props); // let collaborators = `/shixuns/` + id + `/propaedeutics.json`; // // axios.get(collaborators).then((response) => { diff --git a/public/react/src/redux/actions/actionTypes.js b/public/react/src/redux/actions/actionTypes.js index c6c50bce6..f6bc7f3b9 100644 --- a/public/react/src/redux/actions/actionTypes.js +++ b/public/react/src/redux/actions/actionTypes.js @@ -45,6 +45,8 @@ const types = { CHANGE_PAGINATION_INFO: 'CHANGE_PAGINATION_INFO', // 改变分页数据 UPDATE_TEST_AND_VALIDATE: 'UPDATE_TEST_AND_VALIDATE', // 更新测试用例及验证值 UPDATE_OPEN_TESTCASE_INDEX: 'UPDATE_OPEN_TESTCASE_INDEX', // 更新测试用例索引 + GET_COMMIT_RECORD_DETAIL_BY_ID: 'GET_COMMIT_RECORD_DETAIL_BY_ID', // 根据id号获取提交记录详情 + RESTORE_INITIAL_CODE: 'RESTORE_INITIAL_CODE' // 恢复初始代码 } export default types; diff --git a/public/react/src/redux/actions/index.js b/public/react/src/redux/actions/index.js index 212ff81e8..2e113032d 100644 --- a/public/react/src/redux/actions/index.js +++ b/public/react/src/redux/actions/index.js @@ -40,6 +40,7 @@ import { submitUserCode, getUserProgramDetail, saveUserProgramIdentifier, + restoreInitialCode, // isUpdateCodeCtx } from './ojForUser'; @@ -87,6 +88,7 @@ export default { getUserProgramDetail, updateTestAndValidate, updateOpenTestCaseIndex, - saveUserProgramIdentifier + saveUserProgramIdentifier, + restoreInitialCode, // isUpdateCodeCtx } \ No newline at end of file diff --git a/public/react/src/redux/actions/ojForUser.js b/public/react/src/redux/actions/ojForUser.js index e1c318a62..1ca7f3b32 100644 --- a/public/react/src/redux/actions/ojForUser.js +++ b/public/react/src/redux/actions/ojForUser.js @@ -4,18 +4,20 @@ * @Github: * @Date: 2019-11-27 13:42:11 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-03 20:44:47 + * @LastEditTime: 2019-12-04 10:54:50 */ import types from "./actionTypes"; import { Base64 } from 'js-base64'; import { fetchStartProgram, fetchUserProgramDetail, - fetchDebuggerCode, fetchCodeSubmit, + fetchDebuggerCode, + fetchCodeSubmit, fetchUserCommitRecord, fetchUserCommitRecordDetail, fetchUpdateCode, - fetchUserCodeSubmit + fetchUserCodeSubmit, + fetchRestoreInitialCode } from "../../services/ojService"; // 进入编程页面时，首先调用开启编程题接口 @@ -46,16 +48,23 @@ export const saveUserProgramIdentifier = (identifier) => { } // 获取用户编程题详情 -export const getUserProgramDetail = (identifier) => { +export const getUserProgramDetail = (identifier, type) => { // 调用用户编程详情接口 return (dispatch) => { fetchUserProgramDetail(identifier).then(res => { const { status, data = {} } = res; if (status === 200) { - dispatch({ - type: types.USER_PROGRAM_DETAIL, - payload: data - }); + if (!type) { + dispatch({ + type: types.USER_PROGRAM_DETAIL, + payload: data + }); + } else { + dispatch({ + type: types.GET_COMMIT_RECORD_DETAIL_BY_ID, + payload: data + }) + } } }); } @@ -227,9 +236,9 @@ export const getUserCommitRecord = (identifier) => { } } // 获取提交记录详情 -export const getUserCommitRecordDetail = () => { +export const getUserCommitRecordDetail = (identifier) => { return (dispatch) => { - fetchUserCommitRecordDetail().then(res => { + fetchUserCommitRecordDetail(identifier).then(res => { console.log('提交记录详情======》》》》', res); }); } @@ -302,3 +311,11 @@ export const submitUserCode = (identifier, inputValue, type) => { } } +export const restoreInitialCode = (identifier) => { + return (dispatch) => { + fetchRestoreInitialCode(identifier).then(res => { + console.log('恢复初始代码====》》》》', res); + }); + } +} + diff --git a/public/react/src/redux/reducers/ojForUserReducer.js b/public/react/src/redux/reducers/ojForUserReducer.js index 3aea19e61..8f6fe4b0c 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-03 20:00:26 + * @LastEditTime: 2019-12-04 09:02:30 */ import types from "../actions/actionTypes"; import { Base64 } from 'js-base64'; @@ -13,12 +13,13 @@ const initialState = { user_program_identifier: '', // 开启OJ题的唯一标题 hack: {}, // 编程题主要内容 test_case: {}, // 测试用例 - commitRecordDetail: {}, // 提交记录详情 + commitRecordDetail: {}, // 提交成功后记录提交的详情 commitRecord: [], // 提交记录 userCode: '', // 保存当前用户输入的代码 isUpdateCode: false, // 是否更新了代码内容 userCodeTab: 'task', // 学员测评tab位置: task | record | comment userTestInput: '', // 用户自定义输入值 + recordDetail: {}, // 根据id号获取的记录详情 }; const ojForUserReducer = (state = initialState, action) => { @@ -78,6 +79,11 @@ const ojForUserReducer = (state = initialState, action) => { ...state, userCodeTab: action.payload } + case types.GET_COMMIT_RECORD_DETAIL_BY_ID: + return { + ...state, + recordDetail: action.payload + } default: return state; } diff --git a/public/react/src/services/ojService.js b/public/react/src/services/ojService.js index f8d888890..1f3ba0ad6 100644 --- a/public/react/src/services/ojService.js +++ b/public/react/src/services/ojService.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-11-20 10:55:38 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-03 14:10:13 + * @LastEditTime: 2019-12-04 10:53:41 */ import axios from 'axios'; @@ -71,9 +71,11 @@ export async function fetchUserCommitRecord (identifier) { } // 获取提交记录详情 -export async function fetchUserCommitRecordDetail () { +export async function fetchUserCommitRecordDetail (identifier) { const url = `/myproblems/record_detail.json`; - return axios.get(url); + debugger; + const params = {id: identifier}; + return axios.get(url, {params}); } // 恢复初始代码 @@ -99,3 +101,9 @@ export async function fetchUserCodeSubmit (identifier) { const url = `/myproblems/${identifier}/code_submit.json`; return axios.get(url); } + +// 恢复初始代码 +export async function fetchRestoreInitialCode (identifier) { + const url = `/myproblems/${identifier}/restore_initial_code.json`; + return axios.post(url); +}