import React, { Component } from 'react';
import {getImageUrl} from 'educoder';
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import { Tooltip } from 'antd';
import axios from 'axios';


class ShixunPathCard extends Component{
  constructor(props) {
    super(props)
  }
  render(){
    let {pathList}=this.props;
    return(
      <div className="educontent" id="subjects_list_content">
        {
          pathList && pathList.length > 0 ? 
          (
            <div className="square-list clearfix">
              {
                pathList && pathList.map((item,key)=>{

                  return(
                    <div className="square-Item" id={"item_"+key}>
                      {
                        item.tag_name === null ? "" :
                          <div className="tag-green">
                            <span className="tag-name">{item.tag_name}</span>
                            <img src={getImageUrl('images/educoder/tag2.png')}/>
                          </div>
                      }
                      

                      <div className={item.allow_visit=== false ? "closeSquare" : "none"}>
                        <img src={getImageUrl("images/educoder/icon/lockclose.svg")}
                            className="mt80 mb25"/>
                        <p className="font-14 color-white">非试用内容，需要授权</p>
                      </div>
                      <Link to={"/paths/"+item.id} className="square-img" >
												{/*target="_blank"*/}
                        <img alt="13?1543211263" src={item.image_url} style={{"display":"block"}}/>
                      </Link>
                      <div className="square-main">
                        <p className="task-hide">
                          <Link to={"/paths/"+item.id}  className="justify color-grey-name" >{item.name}</Link>
													{/*target="_blank"*/}
                        </p>
                        <p className="clearfix mt8 font-12 color-grey-B4">

                          <Tooltip placement="bottom" title={"章节"}>
                              <span className="mr10 fl squareIconSpan"><i className="iconfont icon-shixun fl mr3"></i>{item.stages_count}</span>
                          </Tooltip>

                          {/*<Tooltip placement="bottom" title={"经验值"}>*/}
                              {/*<span className="mr10 fl squareIconSpan"><i className="iconfont icon-jingyan fl mr3"></i>{item.shixuns_count}</span>*/}
                          {/*</Tooltip>*/}

                          <Tooltip placement="bottom" title={"学习人数"}>
                              <span className="mr10 fl squareIconSpan"><i className="iconfont icon-chengyuan fl mr3"></i>{item.members_count}</span>
                          </Tooltip>
                        </p>
                      </div>
                    </div>
                  )
                })
              }
            </div>
          ):(
            <div className="edu-tab-con-box clearfix edu-txt-center">
              <img className="edu-nodata-img mb20" src={getImageUrl("images/educoder/nodata.png")}/>
              <p className="edu-nodata-p mb20">暂无数据哦~</p>
            </div>
          )
        }
        
      </div>
    )
  }
}
export default ShixunPathCard;