forked from Gitlink/forgeplus-react
233 lines
7.9 KiB
JavaScript
233 lines
7.9 KiB
JavaScript
|
import React, { Component } from 'react';
|
|||
|
|
import axios from 'axios';
|
|||
|
|
import { trace_collapse, info } from 'educoder';
|
|||
|
|
import RepositoryCodeEditor from './shixunchild/Repository/RepositoryCodeEditor';
|
|||
|
|
import {debuggerCode} from "../../redux/actions/ojForUser";
|
|||
|
|
|
|||
|
|
class TPMRepositoryComponentdetails extends Component {
|
|||
|
|
constructor(props) {
|
|||
|
|
super(props)
|
|||
|
|
this.nameTypeMap = {}
|
|||
|
|
let pathArray = []
|
|||
|
|
var splitArray = window.location.pathname.split('shixun_show/');
|
|||
|
|
if (splitArray[1]) {
|
|||
|
|
pathArray = decodeURIComponent(splitArray[1]).split('/')
|
|||
|
|
|
|||
|
|
if (pathArray[pathArray.length - 1] == '') {
|
|||
|
|
// 有可能是这么访问的： http://localhost:3007/shixuns/3ozvy5f8/repository/fsu7tkaw/master/shixun_show/src/
|
|||
|
|
pathArray.length = pathArray.length - 1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
this.state = {
|
|||
|
|
repositoryLoading: true,
|
|||
|
|
pathArray: pathArray,
|
|||
|
|
isContentWidth100: this._isFileInPathArray(pathArray)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
componentDidUpdate(prevProps, prevState) {
|
|||
|
|
if (this.props.secret_repository_tab != prevProps.secret_repository_tab) {
|
|||
|
|
this.fetchRepo()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
componentDidMount = () => {
|
|||
|
|
this.fetchRepo()
|
|||
|
|
}
|
|||
|
|
setContentWidth100 = (flag) => {
|
|||
|
|
const newFileContent = flag === false ? '' : this.state.fileContent
|
|||
|
|
this.setState({
|
|||
|
|
// isCodeFile
|
|||
|
|
isContentWidth100: flag,
|
|||
|
|
fileContent: newFileContent
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
saveCode = (content) => {
|
|||
|
|
const path = this.state.pathArray.join('/')
|
|||
|
|
let id = this.props.match.params.shixunId;
|
|||
|
|
let url = `/shixuns/${id}/update_file.json`;
|
|||
|
|
axios.post(url, {
|
|||
|
|
path: path,
|
|||
|
|
content
|
|||
|
|
}).then((response) => {
|
|||
|
|
if(response.status === 200){
|
|||
|
|
this.setState({
|
|||
|
|
fileContent: response.data.content,
|
|||
|
|
repositoryLoading: false
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
trace_collapse('tpm save code res: ', response)
|
|||
|
|
this.props.showNotification('文件保存成功')
|
|||
|
|
|
|||
|
|
}).catch((error)=>{
|
|||
|
|
console.log(error)
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
fetchCode = (newPathArray) => {
|
|||
|
|
const path = newPathArray.join('/')
|
|||
|
|
|
|||
|
|
// https://testeduplus2.educoder.net/shixuns/3ozvy5f8/file_content.json
|
|||
|
|
this.setContentWidth100(true)
|
|||
|
|
this.setState({ repositoryLoading: true, pathArray: newPathArray })
|
|||
|
|
let id = this.props.match.params.shixunId;
|
|||
|
|
let url = `/shixuns/${id}/file_content.json`;
|
|||
|
|
axios.post(url, {
|
|||
|
|
path: path,
|
|||
|
|
secret_repository: this.props.secret_repository_tab===false?undefined:this.props.secret_repository_tab
|
|||
|
|
}).then((response) => {
|
|||
|
|
trace_collapse('repository res: ', response)
|
|||
|
|
|
|||
|
|
if (response.data.status == -1) {
|
|||
|
|
// this.props.showNotification('无法找到对应的资源，请变更地址或联系管理员！')
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (response.data.status == -2) {
|
|||
|
|
this.props.showNotification(response.data.message)
|
|||
|
|
// this.props.showNotification('无法找到对应的资源，请变更地址或联系管理员！')
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if(response.status === 200){
|
|||
|
|
this.setState({
|
|||
|
|
fileContent: response.data.content,
|
|||
|
|
repositoryLoading: false
|
|||
|
|
});
|
|||
|
|
// this.props.history
|
|||
|
|
// .replace(`${this.props.match.url}/master/shixun_show/${newPathArray.join('/')}`)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}).catch((error)=>{
|
|||
|
|
// this.props.showNotification('无法找到对应的资源，请变更地址或联系管理员！')
|
|||
|
|
console.log(error)
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
_isFileName = (name) => {
|
|||
|
|
return name.indexOf('.') !== -1
|
|||
|
|
}
|
|||
|
|
_isFileInPathArray = (array) => {
|
|||
|
|
if (!array || array.length === 0) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
return this.nameTypeMap[array[array.length - 1]] !== 'tree' && this._isFileName( array[array.length - 1] )
|
|||
|
|
}
|
|||
|
|
// listItem 如果是num，则是通过面包屑点击过来的，取pathArray的子集
|
|||
|
|
fetchRepo = (listItem) => {
|
|||
|
|
|
|||
|
|
if(listItem === "main"||listItem){
|
|||
|
|
this.props.history.replace(`/shixuns/${this.props.match.params.shixunId}/repository`)
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const { pathArray } = this.state;
|
|||
|
|
let newPathArray = pathArray.slice(0)
|
|||
|
|
|
|||
|
|
if (listItem === 0 || listItem) {
|
|||
|
|
this.setContentWidth100(false)
|
|||
|
|
this.nameTypeMap[listItem.name] = listItem.type
|
|||
|
|
if (typeof listItem == 'number') { // 参数是数字的话，做截取
|
|||
|
|
// if (this._isFileName(newPathArray[listItem])) { // 面包屑中的文件不让点击了
|
|||
|
|
// listItem--;
|
|||
|
|
// }
|
|||
|
|
newPathArray = newPathArray.slice(0, listItem)
|
|||
|
|
} else if (listItem.type === 'tree') {
|
|||
|
|
newPathArray.push(listItem.name)
|
|||
|
|
} else if (listItem.type === 'blob') {
|
|||
|
|
newPathArray.push(listItem.name)
|
|||
|
|
this.setState({ pathArray: newPathArray })
|
|||
|
|
//this.fetchCode(newPathArray)
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// https://testeduplus2.educoder.net/shixuns/3ozvy5f8/repository.json
|
|||
|
|
this.setState({ repositoryLoading: true, pathArray: newPathArray })
|
|||
|
|
let urlNewPathArray = newPathArray;
|
|||
|
|
let fileInPathArray = false;
|
|||
|
|
if (newPathArray.length) {
|
|||
|
|
fileInPathArray = this.nameTypeMap[newPathArray[newPathArray.length - 1]] ? this.nameTypeMap[newPathArray[newPathArray.length - 1]] !== 'tree'
|
|||
|
|
: (listItem ? listItem.type !== 'tree' : this._isFileName( newPathArray[newPathArray.length - 1] ))
|
|||
|
|
if ( fileInPathArray ) {
|
|||
|
|
urlNewPathArray = newPathArray.slice(0, newPathArray.length - 1)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
const path = urlNewPathArray.join('/')
|
|||
|
|
|
|||
|
|
let id = this.props.match.params.shixunId;
|
|||
|
|
let url = `/shixuns/${id}/${this.props.secret_repository_tab ? 'secret_repository' : 'repository'}.json`;
|
|||
|
|
// this.props.setLoadingContent(true)
|
|||
|
|
axios.post(url, {
|
|||
|
|
path: path ? path : ''
|
|||
|
|
}).then((response) => {
|
|||
|
|
// this.props.setLoadingContent(false)
|
|||
|
|
|
|||
|
|
const trees = response.data.trees
|
|||
|
|
const treeIsFileMap = {}
|
|||
|
|
if (!trees || !Array.isArray(trees)) {
|
|||
|
|
// this.props.showNotification('无法找到对应的资源，请变更地址或联系管理员！')
|
|||
|
|
// return;
|
|||
|
|
} else {
|
|||
|
|
trees.forEach(item => {
|
|||
|
|
treeIsFileMap[item.name] = item.type == 'blob'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
if(response.status === 200){
|
|||
|
|
this.setState({
|
|||
|
|
treeIsFileMap,
|
|||
|
|
...response.data,
|
|||
|
|
repositoryLoading: false
|
|||
|
|
});
|
|||
|
|
// this.props.history
|
|||
|
|
// .replace(`${this.props.match.url}` +
|
|||
|
|
// (newPathArray.length ? `/master/shixun_show/${newPathArray.join('/')}` : ''))
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始化时，repo接口完毕后需要看是否需要fetchCode
|
|||
|
|
if (fileInPathArray&&listItem!=2) {
|
|||
|
|
this.fetchCode(newPathArray)
|
|||
|
|
}
|
|||
|
|
// info(response)
|
|||
|
|
trace_collapse('repository res: ', response)
|
|||
|
|
|
|||
|
|
}).catch((error)=>{
|
|||
|
|
console.log(error)
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
render() {
|
|||
|
|
const { isContentWidth100 } = this.state;
|
|||
|
|
let matchpath =this.props.match.path;
|
|||
|
|
let flag =false;
|
|||
|
|
if(matchpath==="/shixuns/:shixunId/repository"){
|
|||
|
|
flag =true;
|
|||
|
|
}else if(matchpath==="/shixuns/:shixunId/secret_repository"){
|
|||
|
|
flag =true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 需要重构
|
|||
|
|
return (
|
|||
|
|
<React.Fragment>
|
|||
|
|
{ flag ? ""
|
|||
|
|
:
|
|||
|
|
<div>
|
|||
|
|
{/* 可能会影响到其他页面的样式，需要测试、协商 */}
|
|||
|
|
<div>
|
|||
|
|
<RepositoryCodeEditor
|
|||
|
|
{...this.state}
|
|||
|
|
{...this.props}
|
|||
|
|
fetchRepo={this.fetchRepo}
|
|||
|
|
saveCode={this.saveCode}
|
|||
|
|
nameTypeMap={this.nameTypeMap}
|
|||
|
|
|
|||
|
|
></RepositoryCodeEditor>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</React.Fragment>
|
|||
|
|
|
|||
|
|
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default TPMRepositoryComponentdetails ;
|