diff --git a/app/views/student_works/shixun_work_report.json.jbuilder b/app/views/student_works/shixun_work_report.json.jbuilder index 0b5e4da45..29a5c1874 100644 --- a/app/views/student_works/shixun_work_report.json.jbuilder +++ b/app/views/student_works/shixun_work_report.json.jbuilder @@ -54,7 +54,7 @@ if @shixun json.passed_time @work.myshixun&.passed_time # 评阅信息 - json.work_comment @user_course_identity < Course::STUDENT ? @comment&.comment : nil + json.work_comment @user_course_identity < Course::STUDENT || !@comment&.is_hidden ? @comment&.comment : nil json.work_comment_hidden @comment&.is_hidden # 图形统计 diff --git a/public/react/config/webpack.config.dev.js b/public/react/config/webpack.config.dev.js index de3bffa48..15bba890a 100644 --- a/public/react/config/webpack.config.dev.js +++ b/public/react/config/webpack.config.dev.js @@ -32,7 +32,7 @@ module.exports = { // See the discussion in https://github.com/facebookincubator/create-react-app/issues/343.s // devtool: "cheap-module-eval-source-map", // 开启调试 - devtool: "source-map", // 开启调试 + //devtool: "source-map", // 开启调试 // These are the "entry points" to our application. // This means they will be the "root" imports that are included in JS bundle. // The first two entry points enable "hot" CSS and auto-refreshes for JS. diff --git a/public/react/src/modules/courses/coursesPublic/AppraiseModal.js b/public/react/src/modules/courses/coursesPublic/AppraiseModal.js index 14f29acbe..fc9427d27 100644 --- a/public/react/src/modules/courses/coursesPublic/AppraiseModal.js +++ b/public/react/src/modules/courses/coursesPublic/AppraiseModal.js @@ -76,7 +76,7 @@ class AppraiseModal extends Component{ { // console.log("viewtraining") @@ -2104,7 +2106,8 @@ class Listofworksstudentone extends Component { this.setState({ userids: e.myid, }) - this.viewtrainingt(e.myid); + // this.viewtrainingt(e.myid); + window.open(`/courses/${this.state.props.match.params.coursesId}/shixun_homeworks/${e.myid}/shixun_work_report`, '_blank'); } // 关闭调分 cancelModulationModels = () => { diff --git a/public/react/src/modules/courses/shixunHomework/ShixunWorkReport.js b/public/react/src/modules/courses/shixunHomework/ShixunWorkReport.js index 05586a9ba..0a0688d33 100644 --- a/public/react/src/modules/courses/shixunHomework/ShixunWorkReport.js +++ b/public/react/src/modules/courses/shixunHomework/ShixunWorkReport.js @@ -3,7 +3,8 @@ import {WordsBtn,markdownToHTML,ActionBtn,queryString,downloadFile} from 'educod import { Form, Select, Input, Button,Checkbox,Upload,Icon,message,Modal, Table, Divider,InputNumber, Tag,DatePicker,Radio,Tooltip,Spin} from "antd"; import {Link,Switch,Route,Redirect} from 'react-router-dom'; import axios from 'axios'; - +import moment from 'moment'; +import Modals from "../../modals/Modals"; import ConclusionEvaluation from './shixunreport/ConclusionEvaluation'; import OfficialAcademicTranscript from './shixunreport/OfficialAcademicTranscript'; import Coursesshixundetails from './shixunreport/Coursesshixundetails'; @@ -21,6 +22,7 @@ import '../css/Courses.css'; import './style.css'; import 'moment/locale/zh-cn'; + class ShixunWorkReport extends Component { constructor(props) { @@ -154,19 +156,21 @@ class ShixunWorkReport extends Component { } showAppraiseModal=(sum)=>{ - if(sum===undefined){ - this.setState({ - showAppraiseModaltype:true - }) - }else{ - this.setState({ - showAppraiseModaltype:true, - work_comment:undefined, - work_type:0, - }) - - } - + // if(sum===undefined){ + // this.setState({ + // showAppraiseModaltype:true, + // }) + // }else{ + // this.setState({ + // showAppraiseModaltype:true, + // work_comment:undefined, + // work_type:0, + // }) + // + // } + this.setState({ + showAppraiseModaltype:true, + }) } hideAppraiseModal=()=>{ @@ -188,18 +192,39 @@ class ShixunWorkReport extends Component { }) } isdeleteModal=()=>{ - let url =`/student_works/${this.props.match.params.homeworkid}/destroy_work_comment.json` + this.setState({ + modalsType: true, + modalsTopval:"是否确认删除？", + modalSave: ()=>this.isdeleteModals(), + modalCancel:()=>this.hideisdeleteModal(), + }) + } + + hideisdeleteModal=()=>{ + this.setState({ + modalsType: false, + modalsTopval:"是否确认删除？", + modalSave: ()=>this.isdeleteModals(), + modalCancel:()=>this.hideisdeleteModal(), + }) + } + + isdeleteModals=()=>{ + let url =`/student_works/${this.props.match.params.homeworkid}/destroy_work_comment.json` axios.delete(url).then((response) => { - // const { status } = response.data; - if(response.data.status===0){ - this.props.showNotification(response.data.message) - this.setState({ - showAppraiseModalsshow:false, - work_comment_hidden:false - }) - }else{ - this.props.showNotification(response.data.message) - } + // const { status } = response.data; + if(response.data.status===0){ + this.props.showNotification(response.data.message) + this.setState({ + showAppraiseModalsshow:false, + work_comment_hidden:false, + work_comment:undefined, + work_type:0, + }) + this.hideisdeleteModal() + }else{ + this.props.showNotification(response.data.message) + } }) .catch(function (error) { console.log(error); @@ -213,12 +238,19 @@ class ShixunWorkReport extends Component { let homeworkid=this.props.match.params.homeworkid; const antIcon = ; - let showAppraiseModals=this.props&&this.props.isAdminOrTeacher()===true?work_comment_hidden===true?true:false:work_comment===null?false:true; - + // let showAppraiseModals=this.props&&this.props.isAdminOrTeacher()===true?work_comment===null||work_comment===undefined?false:true:work_comment===null||work_comment===undefined?false:true; + let showAppraiseModals=work_comment===null||work_comment===undefined?false:true; + console.log(showAppraiseModals) return ( data===undefined?"": - + {showAppraiseModaltype===true?this.confirmysl(`/student_works/${homeworkid}/export_shixun_work_report.pdf`)} > 导出实训报告数据 : ""} - {this.props.isAdmin() ?work_comment_hidden===true? "":this.showAppraiseModal(1)}*/} + {/*>评阅 : ""}*/} + {this.props.isAdmin() ?this.showAppraiseModal(1)} - >评阅 : ""} + >评阅:""} + {/*{work_comment===null||work_comment===undefined?"评阅":"编辑评阅"}*/}
@@ -333,23 +374,28 @@ class ShixunWorkReport extends Component {
-

陈晓

+

{data&&data.username}

- 通过： {data&&data.complete_count}/{data&&data.challenges_count} - 课堂最高完成效率： {data&&data.max_efficiency===null?'--':data&&data.max_efficiency} - 通关时间： {data&&data.passed_time===null?'--':data&&data.passed_time} -

- -

- 经验值： {data&&data.myself_experience}/{data&&data.total_experience} - 完成效率： {data&&data.efficiency===null?'--':data&&data.efficiency} - 实战耗时： {data&&data.time_consuming===null?'--':data&&data.time_consuming} + +

通过关卡： {data&&data.complete_count}/{data&&data.challenges_count}
+
经验值： {data&&data.myself_experience}/{data&&data.total_experience}
+ + + +
课堂最高完成效率： {data&&data.max_efficiency===null?'--':data&&data.max_efficiency}
+
完成效率： {data&&data.efficiency===null?'--':data&&data.efficiency}
+ + + +
通关时间： {data&&data.passed_time===null?'--':moment(data&&data.passed_time).format('YYYY-MM-DD HH:mm')}
+
实战耗时： {data&&data.time_consuming===null?'--':data&&data.time_consuming}
+

@@ -429,7 +475,7 @@ class ShixunWorkReport extends Component {
- 老师评阅{showAppraiseModals===true?"":"（仅对课堂老师可见）"} + 老师评阅{work_comment_hidden===true||this.state.work_type===1?"（仅对课堂老师可见）":""} {this.props&&this.props.isAdminOrTeacher()===true?this.isdeleteModal()} diff --git a/public/react/src/modules/modals/WordNumberTextarea.css b/public/react/src/modules/modals/WordNumberTextarea.css index 9bd8c820c..b1a7ef6a4 100644 --- a/public/react/src/modules/modals/WordNumberTextarea.css +++ b/public/react/src/modules/modals/WordNumberTextarea.css @@ -36,7 +36,7 @@ .WordNumberTextarea-count { display: inline-block; float: right; - font-size: 0.28rem; + font-size: 16px; color: #adadad; padding-right: 0.25rem; } diff --git a/public/react/src/modules/page/Index.js b/public/react/src/modules/page/Index.js index b2daa27e4..ab0f30e70 100644 --- a/public/react/src/modules/page/Index.js +++ b/public/react/src/modules/page/Index.js @@ -219,6 +219,7 @@ class Index extends Component { praisePlus={context.praisePlus} + git_url={context.git_url} mirror_name={context.mirror_name} challenge={context.challenge} myshixun={context.myshixun} diff --git a/public/react/src/modules/page/MainContent.js b/public/react/src/modules/page/MainContent.js index 601c002a9..d8623d84b 100644 --- a/public/react/src/modules/page/MainContent.js +++ b/public/react/src/modules/page/MainContent.js @@ -13,7 +13,7 @@ import ChooseEvaluateView from './main/ChooseEvaluateView' import { CircularProgress } from 'material-ui/Progress'; import Button from 'material-ui/Button'; -import VNCDisplay from './VNCDisplay' +import VNCContainer from './VNCContainer' import './tpiPage.css'; import './tpiPageForMobile.css'; @@ -94,9 +94,13 @@ class MainContent extends Component {
*/} - { showIframeContent && vnc_url ? + { showIframeContent && vnc_url ? + + + : diff --git a/public/react/src/modules/page/VNC.css b/public/react/src/modules/page/VNC.css new file mode 100644 index 000000000..cf47d7207 --- /dev/null +++ b/public/react/src/modules/page/VNC.css @@ -0,0 +1,17 @@ +.float_button { + background-image: url(./images/float_switch.jpg); + height: 112px; + width: 38px; + position: absolute; + left: -38px; + top: 32%; + cursor: pointer; +} +.float_button .text { + position: relative; + writing-mode: vertical-rl; + top: 36px; + color: #fff; + left: 13px; + user-select: none; +} \ No newline at end of file diff --git a/public/react/src/modules/page/VNCContainer.js b/public/react/src/modules/page/VNCContainer.js new file mode 100644 index 000000000..1812181aa --- /dev/null +++ b/public/react/src/modules/page/VNCContainer.js @@ -0,0 +1,187 @@ +import React, { Component } from 'react'; +import axios from 'axios' +import { Spin } from 'antd' +import ClipboardJS from 'clipboard' + +import VNCDisplay from './VNCDisplay' +import FloatButton from './component/FloatButton' +import SecondDrawer from './component/SecondDrawer' +import RepoTree from './component/repo/RepoTree' +import TPIMonaco from './component/monaco/TPIMonaco' +import notEditablePathImg from '../../images/tpi/notEditablePath.png' + +import './VNC.css' +const $ = window.$; +const firstDrawerWidth = 260; +class VNCContainer extends Component { + constructor(props) { + super(props) + + this.state = { + fileTreeSelectedKeys: [], + repositoryCode: '' + } + } + componentDidMount() { + if (!this.clipboard) { + const clipboard = new ClipboardJS('.copybtn'); + clipboard.on('success', (e) => { + this.props.showSnackbar('复制成功') + }); + this.clipboard = clipboard + } + + } + getSecondDrawerWidth = () => { + return $('#game_right_contents').width() - firstDrawerWidth + } + renderSecondDrawerChildren = () => { + const { readingCodeLoading, repositoryCode } = this.state; + const height = $(window).height() - 130 + + const isEditablePath = false; + return ( + +
+
+ + +
+ ); + } + fetchReadRepositoryCode = (path) => { + const status = 1 + const fetchRepoCodeUrl = `/tasks/${this.props.game.identifier}/rep_content.json?path=${path}&status=${status}` + this.setState({ readingCodeLoading: true }); + axios.get(fetchRepoCodeUrl, { + }).then((fetchReadRepositoryCodeResponse) => { + + + if (fetchReadRepositoryCodeResponse.data.content || fetchReadRepositoryCodeResponse.data.content == "") { + this.setState({ + repositoryCode: fetchReadRepositoryCodeResponse.data.content, + readingCodeLoading: false + }) + } else { + this.setState({ readingCodeLoading: false }); + } + // this.setState({ isEditablePath, currentPath: path }); + + }).catch(error =>{ + console.log(error) + this.setState({ readingCodeLoading: false }); + this.props.showSnackbar(`服务端异常，请联系管理员！`); + }) + } + onTreeSelect = (selectedKeys, info) => { + const isLeaf = info.node.props.isLeaf; + if (isLeaf) { // 叶子节点 + selectedKeys.length && this.setState({ + fileTreeSelectedKeys: selectedKeys + }) + this.refs["secondDrawer"].showSecondDrawer() + + console.log('leaf clicked') + const nodePath = info.node.props.eventKey; + if (nodePath) { + const filetype = nodePath.split('.').pop().toLowerCase(); + if (filetype == 'jpg' || filetype == 'png' || filetype == 'gif' || filetype == 'jpeg' + || filetype == 'jar' + || filetype == 'doc' || filetype == 'pdf' || filetype == 'xsl' || filetype == 'ppt') { + this.props.showSnackbar(`不支持加载${filetype}类型的文件。`) + return; + } + this.fetchReadRepositoryCode(nodePath); + } else { + console.error('no eventKey:', info.node) + } + } + } + /* + selectedKeys={fileTreeSelectedKeys} + onSelect={onTreeSelect} + */ + render() { + const { challenge, vnc_url, git_url } = this.props + + const secondDrawerChildren = this.renderSecondDrawerChildren(); + return ( + + + +
+
网址克隆
+
+ + +
+
+ + + + + + + + ); + } +} + +export default VNCContainer; diff --git a/public/react/src/modules/page/component/FloatButton.js b/public/react/src/modules/page/component/FloatButton.js new file mode 100644 index 000000000..1b9e191f2 --- /dev/null +++ b/public/react/src/modules/page/component/FloatButton.js @@ -0,0 +1,24 @@ +import React, { Component } from 'react'; + +const $ = window.$; +class FloatButton extends Component { + componentDidMount() { + + + } + + render() { + const { challenge, vnc_url, children } = this.props + + return ( +
+ + {children || '版本库'} +
+ ); + } +} + +export default FloatButton; diff --git a/public/react/src/modules/page/component/SecondDrawer.js b/public/react/src/modules/page/component/SecondDrawer.js new file mode 100644 index 000000000..f0551bf5e --- /dev/null +++ b/public/react/src/modules/page/component/SecondDrawer.js @@ -0,0 +1,101 @@ +import React from "react"; +import ReactDOM from "react-dom"; +import { Drawer } from "antd"; +import FloatButton from './FloatButton' +import PropTypes from 'prop-types'; + +class SecondDrawer extends React.Component { + state = { visible: false, childrenDrawer: false }; + + showDrawer = () => { + this.setState({ + visible: true + }); + }; + + onClose = () => { + this.setState({ + visible: false + }); + }; + + showSecondDrawer = () => { + this.setState({ + childrenDrawer: true + }); + }; + + onChildrenDrawerClose = () => { + this.setState({ + childrenDrawer: false + }); + }; + + swtichFirstDrawer = () => { + this.setState({ + visible: !this.state.visible, + childrenDrawer: false + }); + }; + componentDidMount() { + this.setState({ visible: true }, () => { + this.setState({ visible: false }); + }); + } + render() { + const { floatText, maskClosable, children, secondDrawerChildren, firstDrawerWidth, getSecondDrawerWidth + ,firstDrawerClassName, secondDrawerClassName + } = this.props + const secondDrawerWidth = getSecondDrawerWidth(); + // 180 不知道为什么会偏移 180px + return ( + + {/* */} + {floatText} + { children } + + + { secondDrawerChildren } + {/* */} + + + ); + } +} + +SecondDrawer.propTypes = { + floatText: PropTypes.string, + maskClosable: PropTypes.bool, + secondDrawerChildren: PropTypes.element, +}; +// firstDrawerWidth={firstDrawerWidth} +// getSecondDrawerWidth={this.getSecondDrawerWidth} +export default SecondDrawer \ No newline at end of file diff --git a/public/react/src/modules/page/component/monaco/TPIMonaco.js b/public/react/src/modules/page/component/monaco/TPIMonaco.js index 83d55915e..54763174e 100644 --- a/public/react/src/modules/page/component/monaco/TPIMonaco.js +++ b/public/react/src/modules/page/component/monaco/TPIMonaco.js @@ -271,6 +271,7 @@ class TPIMonaco extends Component { const lang = getLanguageByMirrorName(this.props.mirror_name); const editor = window.monaco.editor.create(document.getElementById('extend-challenge-file-edit'), { value: value, + readOnly: !this.props.isEditablePath, // 属性说明 // http://testeduplus2.educoder.net/react/build/static/node_modules/_monaco-editor@0.15.6@monaco-editor/esm/vs/editor/common/config/commonEditorConfig.js // https://github.com/Microsoft/monaco-editor/issues/29 @@ -303,7 +304,7 @@ class TPIMonaco extends Component { notCallCodeMirrorOnChangeFlag = false return; } - this.props.onRepositoryCodeUpdate(editor.getValue()) + this.props.onRepositoryCodeUpdate && this.props.onRepositoryCodeUpdate(editor.getValue()) }) this.props.codemirrorDidMount && this.props.codemirrorDidMount() diff --git a/public/react/src/modules/page/component/repo/RepoTree.js b/public/react/src/modules/page/component/repo/RepoTree.js new file mode 100644 index 000000000..fbf1286c3 --- /dev/null +++ b/public/react/src/modules/page/component/repo/RepoTree.js @@ -0,0 +1,54 @@ +import React, { useState, useEffect, useContext, useRef, memo } from 'react'; + +// import { Tree } from 'antd'; +// const { TreeNode } = Tree; +import Tree, { TreeNode } from 'rc-tree'; +import 'rc-tree/assets/index.css'; + +const $ = window.$; +export default function RepoTree(props) { + const { fileTreeData, onLoadData, onTreeSelect, fileTreeSelectedKeys, loadRepoFiles } = props; + const [expandedKeys, setExpandedKeys] = useState([]) + useEffect(() => { + loadRepoFiles() + }, []) + + if (!fileTreeData || fileTreeData.length === 0) { + return "" + } + + const onExpand = (expandedKeys) => { + // console.log('onExpand', arguments); + // if not set autoExpandParent to false, if children expanded, parent can not collapse. + // or, you can remove all expanded children keys. + setExpandedKeys(expandedKeys) + } + + const loop = (data) => { + return data.map((item) => { + if (item.children) { + return {loop(item.children)}; + } + return ( + + ); + }); + }; + const treeNodes = loop(fileTreeData); + + + // selectable={false} + return ( + + {treeNodes} + + ) +} diff --git a/public/react/src/modules/page/images/float_switch.jpg b/public/react/src/modules/page/images/float_switch.jpg new file mode 100644 index 000000000..12fc6f878 Binary files /dev/null and b/public/react/src/modules/page/images/float_switch.jpg differ diff --git a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js index 8efe7b0e1..0a5be59e0 100644 --- a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js +++ b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js @@ -101,6 +101,11 @@ class CodeRepositoryViewContainer extends Component { drawerOpen: open, }) } + loadRepoFiles = () => { + if (!this.state.fileTreeData) { + this.fetchRepoFiles(); + } + } componentWillReceiveProps(newProps, oldProps) { @@ -269,18 +274,34 @@ class CodeRepositoryViewContainer extends Component { } // /shixuns/mnf6b7z3/shixun_discuss?challenge_id=88 render() { - + return ( - + {this.props.isOnlyContainer == true ? + React.Children.map(this.props.children, child => { + if(!child) { + return '' + } + return React.cloneElement(child, Object.assign({...this.state}, { + loadRepoFiles: this.loadRepoFiles, + onTreeSelect: this.onTreeSelect, + onLoadData: this.onLoadData, + })) + }) - > + : + + } + ); } }