import React, { Component } from 'react';

import { BrowserRouter as Router, Route, Link } from "react-router-dom";

class TPMNav extends Component {

  	render() {
      const { user, match, shixun } = this.props;
  		let isAdminOrCreator = false;
      	if (user) {
	        isAdminOrCreator = user.admin || user.manager
      	}
  		const shixunId = match.params.shixunId;
  		// const challengesPath = `/shixuns/${shixunId}/challenges`;
		// console.log(this.props.propaedeutics)
		const challengesPath = `/shixuns/${shixunId}/challenges`;
		// console.log(match.path)
	    return (
	      	<div className="bor-bottom-greyE clearfix pl20 pr20 pt40 pb20 edu-back-white challengeNav">
		        <Link
							to={challengesPath}
		        	className={match.path === "/shixuns/:shixunId"|| match.path ==="/shixuns/:shixunId/challenges"?  " active fl mr40": 'fl mr40'}>任务</Link>

				{
					this.props.propaedeutics===undefined?"":this.props.propaedeutics===false?"":<Link to={`/shixuns/${shixunId}/propaedeutics`}
								 className={`${match.url.indexOf('propaedeutics') != -1 ? 'active' : ''} fl mr40 `}
								 id={"knowledge"}
						>背景知识</Link>
				}

		        <Link to={`/shixuns/${shixunId}/repository`}
                      style={{display:  this.props.identity >4||this.props.identity===undefined ? "none" : 'block'}}
                      className={`${match.url.indexOf('repository') != -1 ? 'active' : ''} fl mr40`}>版本库</Link>

		        <Link to={`/shixuns/${shixunId}/collaborators`}
		        	className={`${match.url.indexOf('collaborators') != -1 ? 'active' : ''} fl mr40`}>合作者</Link>

		        <Link to={`/shixuns/${shixunId}/shixun_discuss`}
		        	className={`${match.url.indexOf('shixun_discuss') != -1 ? 'active' : ''} fl mr40`}>评论</Link>

		        <Link to={`/shixuns/${shixunId}/ranking_list`}
		        	className={`${match.url.indexOf('ranking_list') != -1 ? 'active' : ''} fl`}>排行榜</Link>
				{/* target="_blank"*/}
                <a
                    href={`/shixuns/${shixunId}/settings`} className="fr"
                    style={{display: this.props.identity >4||this.props.identity===undefined ? "none" : 'block'}}
                >配置</a>
	      	</div>
	    );
  	}
}

export default TPMNav;