Merge branch 'develop' of http://bdgit.educoder.net/Hjqreturn/educoder into develop
cxt
5 years ago
commit
8f8ca3475b
@ -0,0 +1,5 @@
|
|||||||
|
class AddVipToShixun < ActiveRecord::Migration[5.2]
|
||||||
|
def change
|
||||||
|
add_column :shixuns, :vip, :boolean, default: 0
|
||||||
|
end
|
||||||
|
end
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
class ModifyTypeForTestSets < ActiveRecord::Migration[5.2]
|
||||||
|
def change
|
||||||
|
change_column :test_sets, :input, :longtext
|
||||||
|
change_column :test_sets, :output, :longtext
|
||||||
|
|
||||||
|
end
|
||||||
|
end
|
||||||
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 74 KiB |
@ -0,0 +1,15 @@
|
|||||||
|
/*
|
||||||
|
* @Description: 引入阿里图标库
|
||||||
|
* @Author: tangjiang
|
||||||
|
* @Github:
|
||||||
|
* @Date: 2019-12-10 09:03:48
|
||||||
|
* @LastEditors: tangjiang
|
||||||
|
* @LastEditTime: 2019-12-10 09:05:41
|
||||||
|
*/
|
||||||
|
import { Icon } from 'antd';
|
||||||
|
|
||||||
|
const MyIcon = Icon.createFromIconfontCN({
|
||||||
|
scriptUrl: '//at.alicdn.com/t/font_1535266_ss6796i6f6j.js'
|
||||||
|
});
|
||||||
|
|
||||||
|
export default MyIcon;
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
/*
|
||||||
|
* @Description: 用户头像及昵称
|
||||||
|
* @Author: tangjiang
|
||||||
|
* @Github:
|
||||||
|
* @Date: 2019-12-09 17:11:28
|
||||||
|
* @LastEditors: tangjiang
|
||||||
|
* @LastEditTime: 2019-12-09 17:36:55
|
||||||
|
*/
|
||||||
|
import './index.scss';
|
||||||
|
import React from 'react';
|
||||||
|
import { getImageUrl } from 'educoder'
|
||||||
|
|
||||||
|
function UserInfo (props) {
|
||||||
|
const {image_url, name} = props.userInfo;
|
||||||
|
return (
|
||||||
|
<div className={'avator_nicker'}>
|
||||||
|
<img alt="用户头像" className={'student_img'} src={getImageUrl(`images/${image_url}` || 'images/educoder/headNavLogo.png?1526520218')} />
|
||||||
|
<span className={'student_nicker'}>
|
||||||
|
{name || ''}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default UserInfo
|
||||||
|
export {
|
||||||
|
UserInfo
|
||||||
|
};
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
|
||||||
|
.avator_nicker{
|
||||||
|
position: absolute;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 65px;
|
||||||
|
// height: 65px;
|
||||||
|
.student_img,
|
||||||
|
.student_nicker{
|
||||||
|
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.student_nicker{
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.student_img{
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -1,2 +1,18 @@
|
|||||||
@import '../split_pane_resizer.scss';
|
@import '../split_pane_resizer.scss';
|
||||||
|
|
||||||
|
.new_add_task_wrap {
|
||||||
|
.split-pane-area{
|
||||||
|
height: calc(100vh - 121px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.new_add_task_ctl{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
height: 56px;
|
||||||
|
background: #333333;
|
||||||
|
> button{
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,215 +0,0 @@
|
|||||||
/*
|
|
||||||
* @Description: 右侧代码块
|
|
||||||
* @Author: tangjiang
|
|
||||||
* @Date: 2019-11-18 08:42:04
|
|
||||||
* @Last Modified by: tangjiang
|
|
||||||
* @Last Modified time: 2019-11-20 00:00:34
|
|
||||||
*/
|
|
||||||
|
|
||||||
import './index.scss';
|
|
||||||
|
|
||||||
import React, { Fragment, useState, useRef, useEffect } from 'react';
|
|
||||||
import { Icon, Drawer, Tabs, Button, notification } from 'antd';
|
|
||||||
import _ from 'lodash';
|
|
||||||
import MonacoEditor from '@monaco-editor/react';
|
|
||||||
import { connect } from 'react-redux';
|
|
||||||
import InitTabCtx from './initTabCtx';
|
|
||||||
import SettingDrawer from '../../components/monacoSetting';
|
|
||||||
import CONST from '../../../../constants';
|
|
||||||
import actions from '../../../../redux/actions';
|
|
||||||
|
|
||||||
const { fontSetting, opacitySetting } = CONST;
|
|
||||||
|
|
||||||
const { TabPane } = Tabs;
|
|
||||||
|
|
||||||
const RightPaneCode = (props) => {
|
|
||||||
|
|
||||||
const [showDrawer, setShowDrawer] = useState(false); // 控制配置滑框
|
|
||||||
const [defaultActiveKey, setDefaultActiveKey] = useState('1'); // 当前选中的tab
|
|
||||||
const [showTextResult, setShowTextResult] = useState(false); // 是否点击控制台按钮
|
|
||||||
const [editCode, setEditCode] = useState(()=> {
|
|
||||||
return '#include <stdio.h>';
|
|
||||||
}); // monaco编辑器内容
|
|
||||||
const [language, setLanguage] = useState('C')
|
|
||||||
const [fontSize,setFontSize] = useState(12);
|
|
||||||
const editorRef = useRef(null); // 编辑器ref
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (props.language) {
|
|
||||||
// console.log('当前输入的代码:', editCode);
|
|
||||||
// console.log('当前输入的语言:', props.language);
|
|
||||||
setLanguage(props.language)
|
|
||||||
}
|
|
||||||
}, [props.language]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
}, [props.testCases]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
}, [editCode]);
|
|
||||||
|
|
||||||
// 监听store中编辑器内容变化
|
|
||||||
useEffect(() => {
|
|
||||||
setEditCode(props.code);
|
|
||||||
}, [props.code]);
|
|
||||||
|
|
||||||
// 打开设置
|
|
||||||
const handleShowDrawer = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setShowDrawer(true);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 关闭设置
|
|
||||||
const handleDrawerClose = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setShowDrawer(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 切换tab
|
|
||||||
const handleTabChange = (key) => {
|
|
||||||
setDefaultActiveKey(key);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 显示/隐藏tab
|
|
||||||
const handleShowControl = () => {
|
|
||||||
setShowTextResult(!showTextResult);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 侧边栏改变字体大小
|
|
||||||
const handleFontSizeChange = (value) => {
|
|
||||||
setFontSize(value);
|
|
||||||
}
|
|
||||||
// 文本框内容变化时，记录文本框内容
|
|
||||||
const handleEditorChange = (origin, monaco) => {
|
|
||||||
editorRef.current = monaco; // 获取当前monaco实例
|
|
||||||
setEditCode(origin); // 保存编辑器初始值
|
|
||||||
editorRef.current.onDidChangeModelContent(e => { // 监听编辑器内容的变化
|
|
||||||
// TODO 需要优化 节流
|
|
||||||
const val = editorRef.current.getValue();
|
|
||||||
setEditCode(val);
|
|
||||||
// 保存当前代码
|
|
||||||
props.saveOjFormCode(val);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 提交按钮点击
|
|
||||||
const handleSubmit = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
if (!editCode) {
|
|
||||||
notification['error']({
|
|
||||||
message: '必填',
|
|
||||||
description: '代码块内容必须输入!'
|
|
||||||
});
|
|
||||||
editorRef.current.focus();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
props.changePublishLoadingStatus(true);
|
|
||||||
const { onSubmitForm } = props;
|
|
||||||
onSubmitForm(editCode);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 调试测试代码
|
|
||||||
// const handleTestCode = () => {
|
|
||||||
// // 打开控制台信息
|
|
||||||
// setShowTextResult(true);
|
|
||||||
// this.formRef.handleTestCodeFormSubmit(() => {
|
|
||||||
// // 当验证通过后 切换tab 到代码执行结果
|
|
||||||
// setDefaultActiveKey('2');
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// 控制台点击时 添加active属性
|
|
||||||
const classNames = `control_tab ${showTextResult ? 'move_up move_up_final' : 'move_down_final'}`;
|
|
||||||
|
|
||||||
// 配置编辑器属性
|
|
||||||
const editorOptions = {
|
|
||||||
selectOnLineNumbers: true,
|
|
||||||
automaticLayout: true,
|
|
||||||
fontSize: `${fontSize}px`
|
|
||||||
}
|
|
||||||
|
|
||||||
// 返回渲染值
|
|
||||||
return (
|
|
||||||
<Fragment>
|
|
||||||
<div className={'right_pane_code_wrap'}>
|
|
||||||
<div className={'code-title'}>
|
|
||||||
<span></span>
|
|
||||||
<Icon className={'code-icon'} type="setting" onClick={handleShowDrawer}/>
|
|
||||||
</div>
|
|
||||||
{/** 代码编辑器 */}
|
|
||||||
<MonacoEditor
|
|
||||||
height={showTextResult ? 'calc(100% - 382px)' : 'calc(100% - 112px)'}
|
|
||||||
width="100%"
|
|
||||||
language={language.toLowerCase()}
|
|
||||||
value={editCode}
|
|
||||||
options={editorOptions}
|
|
||||||
theme="dark"
|
|
||||||
editorDidMount={handleEditorChange}
|
|
||||||
/>
|
|
||||||
{/* 控制台信息 */}
|
|
||||||
<div className="pane_control_area">
|
|
||||||
<Tabs
|
|
||||||
className={classNames}
|
|
||||||
activeKey={defaultActiveKey}
|
|
||||||
tabBarStyle={{ backgroundColor: '#000', color: '#fff' }}
|
|
||||||
onChange={handleTabChange}
|
|
||||||
>
|
|
||||||
<TabPane tab={'自定义测试用例'} key={'1'} style={{ height: '280px', overflowY: 'auto' }}>
|
|
||||||
<InitTabCtx wrappedComponentRef={(form) => this.formRef = form }/>
|
|
||||||
</TabPane>
|
|
||||||
<TabPane tab={'代码执行结果'} key={'2'} style={{ height: '280px', overflowY: 'auto' }}>
|
|
||||||
<h2>代码执行结果</h2>
|
|
||||||
</TabPane>
|
|
||||||
</Tabs>
|
|
||||||
<div className="pane_control_opts">
|
|
||||||
<Button type="link" style={{ color: '#fff' }} onClick={handleShowControl}>控制台 <Icon type={ showTextResult ? "down" : "up" } /></Button>
|
|
||||||
<p>
|
|
||||||
{/* <Button ghost
|
|
||||||
style={{ marginRight: '10px', color: '#28BD8B', borderColor: '#28BD8B' }}
|
|
||||||
onClick={handleTestCode}
|
|
||||||
disabled={!props.identifier || props.testCases.length === 0}
|
|
||||||
>调试代码</Button> */}
|
|
||||||
<Button
|
|
||||||
loading={props.submitLoading}
|
|
||||||
type="primary"
|
|
||||||
onClick={handleSubmit}
|
|
||||||
>{props.identifier ? '更新' : '提交'}</Button>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Drawer
|
|
||||||
className={'setting_drawer'}
|
|
||||||
placement="right"
|
|
||||||
closable={false}
|
|
||||||
onClose={handleDrawerClose}
|
|
||||||
visible={showDrawer}
|
|
||||||
>
|
|
||||||
<SettingDrawer {...fontSetting} onChangeFontSize={handleFontSizeChange}/>
|
|
||||||
<SettingDrawer {...opacitySetting}/>
|
|
||||||
</Drawer>
|
|
||||||
</Fragment>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapStateToProps = (state) => {
|
|
||||||
const { ojForm, testCases, identifier, code } = state.ojFormReducer;
|
|
||||||
const { submitLoading } = state.commonReducer;
|
|
||||||
return {
|
|
||||||
language: ojForm.language,
|
|
||||||
testCases,
|
|
||||||
identifier,
|
|
||||||
code,
|
|
||||||
submitLoading
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const mapDispatchToProps = (dispatch) => ({
|
|
||||||
saveOjFormCode: (code) => dispatch(actions.saveOjFormCode(code)),
|
|
||||||
changePublishLoadingStatus: (flag) => dispatch(actions.changeSubmitLoadingStatus(flag))
|
|
||||||
});
|
|
||||||
//
|
|
||||||
export default connect(
|
|
||||||
mapStateToProps,
|
|
||||||
mapDispatchToProps
|
|
||||||
)(RightPaneCode);
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
.quill_editor_area{
|
|
||||||
height: 300px;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
Loading…
Reference in new issue