You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
3.6 KiB
103 lines
3.6 KiB
import React , { Component } from 'react';
|
|
import { Link , Route , Switch } from 'react-router-dom';
|
|
|
|
import '../css/index.css'
|
|
import './list.css';
|
|
|
|
import Loadable from 'react-loadable';
|
|
import Loading from '../../Loading';
|
|
|
|
import axios from 'axios';
|
|
const FileNew = Loadable({
|
|
loader: () => import('../Newfile/Index'),
|
|
loading: Loading,
|
|
})
|
|
const OrderIndex = Loadable({
|
|
loader: () => import('../Order/order'),
|
|
loading: Loading,
|
|
})
|
|
const CoderRootIndex = Loadable({
|
|
loader: () => import('./CoderRootIndex'),
|
|
loading: Loading,
|
|
})
|
|
class Detail extends Component{
|
|
constructor(props){
|
|
super(props);
|
|
this.state={
|
|
projectDetail:undefined
|
|
}
|
|
}
|
|
|
|
componentDidMount=()=>{
|
|
this.getDetail();
|
|
}
|
|
|
|
getDetail=()=>{
|
|
const { login } = this.props.current_user;
|
|
const { projectsId } = this.props.match.params;
|
|
const url = `/${login}/${projectsId}.json`;
|
|
axios.get(url).then((result)=>{
|
|
if(result){
|
|
this.setState({
|
|
projectDetail:result.data
|
|
})
|
|
}
|
|
}).catch((error)=>{})
|
|
}
|
|
|
|
render(){
|
|
const { projectsId } = this.props.match.params;
|
|
|
|
const { projectDetail } = this.state;
|
|
const url = this.props.history.location.pathname;
|
|
return(
|
|
<div>
|
|
<div className="detailHeader-wrapper">
|
|
<div className="normal f-wrap-between mb20">
|
|
<p className="font-18 color-blue df flex-1" style={{alignItems:"center"}}>{projectDetail && projectDetail.author && projectDetail.author.name} / <span className="hide-1 flex-1">{ projectDetail && projectDetail.identifier }</span></p>
|
|
|
|
<span className="p-r-tags large">
|
|
<span><label>关注</label><span>{projectDetail && projectDetail.watchers_count}</span></span>
|
|
<span><label>点赞</label><span>{projectDetail && projectDetail.praises_count}</span></span>
|
|
<span><label>Fork</label><span>{projectDetail && projectDetail.forked_count}</span></span>
|
|
</span>
|
|
</div>
|
|
<div className="normal f-wrap-between">
|
|
<ul className="headerMenu-wrapper">
|
|
<li className={url.indexOf("coder")>0? "active" : ""}><Link to={`/projects/${projectsId}/coder`}>代码</Link></li>
|
|
<li className={url.indexOf("orders")>0 ? "active" : ""}><Link to={`/projects/${projectsId}/orders`}>工单</Link></li>
|
|
<li className={url.indexOf("merge")>0 ? "active" : ""}><Link to={`/projects/${projectsId}/merge`}>合并请求</Link></li>
|
|
<li className={url.indexOf("edition")>0 ? "active" : ""}><Link to={`/projects/${projectsId}/edition`}>版本发布</Link></li>
|
|
<li className={url.indexOf("trends")>0 ? "active" : ""}><Link to={`/projects/${projectsId}/trends`}>动态</Link></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<Switch {...this.props}>
|
|
<Route path="/projects/:projectsId/coder/:branch/newfile/:path"
|
|
render={
|
|
(props) => (<FileNew {...this.props} {...props} {...this.state}/>)
|
|
}
|
|
></Route>
|
|
<Route path="/projects/:projectsId/coder/:branch/newfile"
|
|
render={
|
|
(props) => (<FileNew {...this.props} {...props} {...this.state}/>)
|
|
}
|
|
></Route>
|
|
<Route path="/projects/:projectsId/orders"
|
|
render={
|
|
(props) => (<OrderIndex {...this.props} {...props} {...this.state}/>)
|
|
}
|
|
></Route>
|
|
<Route path="/projects/:projectsId/coder"
|
|
render={
|
|
(props) => (<CoderRootIndex {...this.props} {...props} {...this.state}/>)
|
|
}
|
|
></Route>
|
|
</Switch>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default Detail; |