diff --git a/public/react/src/components/monaco-editor/index.jsx b/public/react/src/components/monaco-editor/index.jsx index e2cb11db0..f04622bfa 100644 --- a/public/react/src/components/monaco-editor/index.jsx +++ b/public/react/src/components/monaco-editor/index.jsx @@ -64,7 +64,7 @@ function getLanguageByMirrorName(mirror_name) { export default ({ width = '100%', - height = '100%', + height = '445px', value, language = 'javascript', options = {}, @@ -78,20 +78,9 @@ export default ({ const [init, setInit] = useState(false) function onLayout() { - if (window.ResizeObserver) { - const ro = new window.ResizeObserver(entries => { - for (let entry of entries) { - if (entry.target.offsetHeight > 0) { - editor.current.instance.layout() - } - } - }) - ro.observe(editorEl.current.parentElement) - } else { - setTimeout(() => { - editor.current.instance.layout() - }, 100); - } + setTimeout(() => { + editor.current.instance.layout() + }, 100) } useEffect(() => { diff --git a/public/react/src/modules/page/MainContent.js b/public/react/src/modules/page/MainContent.js index 045c5740a..06d37136b 100644 --- a/public/react/src/modules/page/MainContent.js +++ b/public/react/src/modules/page/MainContent.js @@ -155,7 +155,7 @@ class MainContent extends Component {
正在加载中,请稍后...
-
+
diff --git a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js index bbb3c47a4..d96e63841 100644 --- a/public/react/src/modules/page/main/CodeRepositoryViewContainer.js +++ b/public/react/src/modules/page/main/CodeRepositoryViewContainer.js @@ -17,27 +17,27 @@ function addPrePath(treeData, parentNodePath) { }) } function getNewTreeData(treeData, curKey, child, level) { - const loop = (data) => { - data.forEach((item) => { - // 这里不能用indexOf 同一级可能出现test目录和test.py文件 - if (item.key == curKey) { - if (child && child.length) { // 可能没有子节点 - child = addPrePath(child, curKey); - item.children = child; - } - item.isLeaf = false; - } else { - if (item.children) { - loop(item.children); - } - } - }); - }; - loop(treeData); + const loop = (data) => { + data.forEach((item) => { + // 这里不能用indexOf 同一级可能出现test目录和test.py文件 + if (item.key == curKey) { + if (child && child.length) { // 可能没有子节点 + child = addPrePath(child, curKey); + item.children = child; + } + item.isLeaf = false; + } else { + if (item.children) { + loop(item.children); + } + } + }); + }; + loop(treeData); } function fileData2TreeData(repoFilesData) { - if(repoFilesData!=null){ + if (repoFilesData != null) { const fileTreeData = []; repoFilesData.forEach((item) => { if (item.kind === 'file') { @@ -79,17 +79,17 @@ class CodeRepositoryViewContainer extends Component { } } showSettingDrawer = (open) => { - this.setState({settingDrawerOpen: open}) + this.setState({ settingDrawerOpen: open }) } tabIndexChange = (index) => { - this.setState({tabIndex: index}); + this.setState({ tabIndex: index }); } onRepositoryViewExpand() { window.repository_extend_and_zoom(); this.setState({ evaluateViewExpanded: !this.state.evaluateViewExpanded }, () => { - setTimeout(()=>{ + setTimeout(() => { window.__tpiOnResize() }, 300) }) @@ -104,8 +104,8 @@ class CodeRepositoryViewContainer extends Component { } this.setState({ - drawerOpen: open, - }) + drawerOpen: open, + }) } loadRepoFiles = () => { if (!this.state.fileTreeData) { @@ -114,28 +114,28 @@ class CodeRepositoryViewContainer extends Component { } componentWillReceiveProps(newProps, oldProps) { - + } componentDidMount() { - + } componentDidUpdate(prevProps, prevState, snapshot) { const { game, challenge } = this.props - if (this.props.game && (!prevProps.game || prevProps.game.identifier !== this.props.game.identifier) ) { + if (this.props.game && (!prevProps.game || prevProps.game.identifier !== this.props.game.identifier)) { this.setState({ - fileTreeSelectedKeys: [ challenge.multiPath ? challenge.path[0] : challenge.path ] + fileTreeSelectedKeys: [challenge.multiPath ? challenge.path[0] : challenge.path] }) // 初始化 } else if (this.state.fileTreeSelectedKeys.length === 0 && challenge && challenge.path) { this.setState({ - fileTreeSelectedKeys: [ challenge.multiPath ? challenge.path[0] : challenge.path ] + fileTreeSelectedKeys: [challenge.multiPath ? challenge.path[0] : challenge.path] }) } else if (challenge && prevProps && prevProps.challenge - && challenge.pathIndex != prevProps.challenge.pathIndex - && challenge.pathIndex !== -1) { + && challenge.pathIndex != prevProps.challenge.pathIndex + && challenge.pathIndex !== -1) { this.setState({ - fileTreeSelectedKeys: [ challenge.multiPath ? challenge.path[challenge.pathIndex] : challenge.path ] + fileTreeSelectedKeys: [challenge.multiPath ? challenge.path[challenge.pathIndex] : challenge.path] }) } } @@ -146,20 +146,20 @@ class CodeRepositoryViewContainer extends Component { }) } onLoadData = (treeNode) => { - if (treeNode.props.children && treeNode.props.children.length) { - return new Promise((resolve) => { - resolve(); - }); - } - return new Promise((resolve, reject) => { - this.fetchRepoFiles(treeNode, resolve, reject) - }); - } + if (treeNode.props.children && treeNode.props.children.length) { + return new Promise((resolve) => { + resolve(); + }); + } + return new Promise((resolve, reject) => { + this.fetchRepoFiles(treeNode, resolve, reject) + }); + } map2OldData = (treeData) => { if (!treeData || treeData.length == 0) { return [] } - + if (!treeData || treeData.length === 0) return treeData; treeData = treeData.map(item => { return { @@ -170,7 +170,7 @@ class CodeRepositoryViewContainer extends Component { }) return treeData; } - + fetchRepoFiles(treeNode, resolve, reject) { // http://localhost:3000/api/v1/games/829al3mst4fy/entries?path=src/step1&rev=master if (!this.props.challenge || !this.props.game) { @@ -179,14 +179,14 @@ class CodeRepositoryViewContainer extends Component { // var ar = this.props.challenge.path.split('/'); // ar.length = ar.length - 2; // var _path = ar.join('/'); - var _path = treeNode ? treeNode.props.eventKey : '' ; + var _path = treeNode ? treeNode.props.eventKey : ''; if (_path.charAt(0) === '/') { _path = _path.substring(1) } // var url = `/api/v1/games/${this.props.game.identifier}/entries?path=${_path}&rev=master&gpid=${this.props.myshixun.gpid}` let url = `/myshixuns/${this.props.myshixun.identifier}/repository.json` - + if (!this.state.fileTreeData || this.state.fileTreeData.length === 0) { this.setState({ loadingFirstRepoFiles: true, @@ -194,44 +194,44 @@ class CodeRepositoryViewContainer extends Component { } var that = this; axios.post(url, { - path: _path - // withCredentials: true, - }) - .then((response) => { + path: _path + // withCredentials: true, + }) + .then((response) => { // if (!response) { // resolve && resolve(); // return; // } - const repoFilesData = this.map2OldData(response.data.trees) - if (!this.state.fileTreeData || this.state.fileTreeData.length === 0) { // 还没树节点,没加载过 - - const fileTreeData = fileData2TreeData(repoFilesData) - this.setState({ - fileTreeData, - loadingFirstRepoFiles: false, - }); - } else { - var _treeNode = treeNode; - var _eventKey = _treeNode.props.eventKey; - - const fileTreeData = that.state.fileTreeData; - // 新的数组放置到treenode下 - - const tempFileTreeData = fileData2TreeData(repoFilesData) - - getNewTreeData(fileTreeData, _eventKey, tempFileTreeData, 2); - this.setState({ - fileTreeData, - }) - } - - resolve && resolve(); - - }) - .catch(function (error) { - console.log(error); - reject && reject(); - }); + const repoFilesData = this.map2OldData(response.data.trees) + if (!this.state.fileTreeData || this.state.fileTreeData.length === 0) { // 还没树节点,没加载过 + + const fileTreeData = fileData2TreeData(repoFilesData) + this.setState({ + fileTreeData, + loadingFirstRepoFiles: false, + }); + } else { + var _treeNode = treeNode; + var _eventKey = _treeNode.props.eventKey; + + const fileTreeData = that.state.fileTreeData; + // 新的数组放置到treenode下 + + const tempFileTreeData = fileData2TreeData(repoFilesData) + + getNewTreeData(fileTreeData, _eventKey, tempFileTreeData, 2); + this.setState({ + fileTreeData, + }) + } + + resolve && resolve(); + + }) + .catch(function (error) { + console.log(error); + reject && reject(); + }); } onTreeSelect = (selectedKeys, info) => { const isLeaf = info.node.isLeaf(); @@ -240,7 +240,7 @@ class CodeRepositoryViewContainer extends Component { fileTreeSelectedKeys: selectedKeys }) const { fetchRepositoryCode, onPathChange, showSnackbar, challenge } = this.props; - + const nodePath = info.node.props.eventKey; let isCurrentFile = false; // 设置pathIndex为-1,那么代码文件下拉可以切回可编辑的文件 @@ -249,7 +249,7 @@ class CodeRepositoryViewContainer extends Component { if (challenge.pathIndex === 0) { showSnackbar(`当前编辑文件已经是${nodePath}`) } else { - fetchRepositoryCode(null, nodePath, 1); + fetchRepositoryCode(null, nodePath, 1); onPathChange(0) } return; @@ -257,7 +257,7 @@ class CodeRepositoryViewContainer extends Component { onPathChange(-1) } } else { - + let cur_index = -1; if (challenge.path && challenge.path.forEach) { challenge.path.forEach((item, index) => { @@ -267,7 +267,7 @@ class CodeRepositoryViewContainer extends Component { } }) } - + if (isCurrentFile) { if (challenge.pathIndex == cur_index) { showSnackbar(`当前编辑文件已经是${nodePath}`) @@ -281,75 +281,49 @@ class CodeRepositoryViewContainer extends Component { 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') { + || filetype == 'jar' + || filetype == 'doc' || filetype == 'pdf' || filetype == 'xsl' || filetype == 'ppt') { showSnackbar(`不支持加载${filetype}类型的文件。`) return; } - fetchRepositoryCode(null, nodePath, 1); + fetchRepositoryCode(null, nodePath, 1); } else { console.error('no eventKey:', info.node) } } } -// /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, - // })) - // }) - - // : - - // } - // - - {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, - })) - }) - - : - - + {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, + })) + }) + + : + + } - - ); - } + >} + + ); + } } export default CodeRepositoryViewContainer;