Merge branch 'dev_aliyun' of http://bdgit.educoder.net/Hjqreturn/educoder into dev_aliyun
cxt
5 years ago
commit
a705fcf93a
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 308 KiB After Width: | Height: | Size: 362 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,205 +1,254 @@
|
|||||||
import React, { Component } from 'react';
|
import React, {Component} from 'react';
|
||||||
|
|
||||||
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
|
import {BrowserRouter as Router, Route, Link} from "react-router-dom";
|
||||||
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
import { getImageUrl,} from "educoder";
|
import {getImageUrl,} from "educoder";
|
||||||
|
|
||||||
import './TPMright.css';
|
import './TPMright.css';
|
||||||
|
|
||||||
import {Icon,Tooltip} from 'antd';
|
import {Progress, Tooltip} from 'antd';
|
||||||
|
|
||||||
// import "antd/dist/antd.css";
|
// import "antd/dist/antd.css";
|
||||||
|
|
||||||
class TPMRightSection extends Component {
|
class TPMRightSection extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
this.state = {
|
this.state = {
|
||||||
|
|
||||||
TPMRightSection:false,
|
TPMRightSection: false,
|
||||||
clickNewsubscripttype:false
|
clickNewsubscripttype: false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// componentDidMount() {
|
// componentDidMount() {
|
||||||
// let id=this.props.match.params.shixunId;
|
// let id=this.props.match.params.shixunId;
|
||||||
//
|
//
|
||||||
// let shixunsDetailsURL=`/shixuns/`+id+`/show_right.json`;
|
// let shixunsDetailsURL=`/shixuns/`+id+`/show_right.json`;
|
||||||
//
|
//
|
||||||
// axios.get(shixunsDetailsURL).then((response)=> {
|
// axios.get(shixunsDetailsURL).then((response)=> {
|
||||||
// if(response.status===200){
|
// if(response.status===200){
|
||||||
// this.setState({
|
// this.setState({
|
||||||
// TPMRightSectionData: response.data
|
// TPMRightSectionData: response.data
|
||||||
// });
|
// });
|
||||||
// }
|
// }
|
||||||
// }).catch((error)=>{
|
// }).catch((error)=>{
|
||||||
// console.log(error)
|
// console.log(error)
|
||||||
// });
|
// });
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// shouldComponentUpdate(nextProps, nextState) {
|
// shouldComponentUpdate(nextProps, nextState) {
|
||||||
// return nextProps.TPMRightSectionData !== this.state.TPMRightSectionData
|
// return nextProps.TPMRightSectionData !== this.state.TPMRightSectionData
|
||||||
// }
|
// }
|
||||||
clickNewsubscript=(val)=>{
|
clickNewsubscript = (val) => {
|
||||||
if(val===0){
|
if (val === 0) {
|
||||||
this.setState({
|
this.setState({
|
||||||
TPMRightSection:true,
|
TPMRightSection: true,
|
||||||
clickNewsubscripttype:true
|
clickNewsubscripttype: true
|
||||||
})
|
})
|
||||||
}else{
|
} else {
|
||||||
this.setState({
|
this.setState({
|
||||||
TPMRightSection:false,
|
TPMRightSection: false,
|
||||||
clickNewsubscripttype:false
|
clickNewsubscripttype: false
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
render() {
|
|
||||||
let {TPMRightSection,clickNewsubscripttype}=this.state;
|
render() {
|
||||||
let {TPMRightSectionData}=this.props
|
let {TPMRightSection, clickNewsubscripttype} = this.state;
|
||||||
|
let {TPMRightSectionData} = this.props
|
||||||
return (
|
let Progresssum;
|
||||||
<div>
|
if(TPMRightSectionData&&TPMRightSectionData.complete_count!=null){
|
||||||
{
|
Progresssum=(parseInt(TPMRightSectionData&&TPMRightSectionData.complete_count) / parseInt(TPMRightSectionData&&TPMRightSectionData.challenge_count))*100;
|
||||||
TPMRightSectionData===undefined?"":
|
}
|
||||||
<div>
|
return (
|
||||||
<div className="edu-back-white padding40-20 mb10">
|
<div>
|
||||||
<p className="font-16 mb20">创建者</p>
|
{
|
||||||
<div className="df">
|
TPMRightSectionData === undefined ? "" :
|
||||||
<a href={TPMRightSectionData===undefined?"":TPMRightSectionData.creator===undefined?"":`/users/${TPMRightSectionData.creator.login}/courses`}>
|
<div>
|
||||||
<img alt="头像" className="radius mr10" height="80" src={getImageUrl(TPMRightSectionData===undefined?"":TPMRightSectionData.creator===undefined?"":'images/'+TPMRightSectionData.creator.image_url+"?1532489442")} width="80" />
|
<div className="edu-back-white pd302020zuoze mb10">
|
||||||
</a>
|
<p className="font-16 mb20"><i className={"iconfont icon-chuangjianzhe1 audit_situationactive font-14"}></i> 创建者</p>
|
||||||
<div className="flex1">
|
<div className="df">
|
||||||
|
<a
|
||||||
<p className="mb20">{TPMRightSectionData===undefined?"":TPMRightSectionData.creator===undefined?"":TPMRightSectionData.creator.name}</p>
|
href={TPMRightSectionData === undefined ? "" : TPMRightSectionData.creator === undefined ? "" : `/users/${TPMRightSectionData.creator.login}/courses`}>
|
||||||
<div className="clearfix">
|
<img alt="头像" className="radius mr10" height="36"
|
||||||
<span>发布 {TPMRightSectionData.user_shixuns_count}</span>
|
src={getImageUrl(TPMRightSectionData === undefined ? "" : TPMRightSectionData.creator === undefined ? "" : 'images/' + TPMRightSectionData.creator.image_url + "?1532489442")}
|
||||||
{/*<span className="ml20">粉丝 <span id="user_h_fan_count">{TPMRightSectionData.fans_count}</span></span>*/}
|
width="36"/>
|
||||||
{/* <a href="/watchers/unwatch?className=fr+user_watch_btn+edu-default-btn+edu-focus-btn&object_id=3039&object_type=user&shixun_id=61&target_id=3039" className="fr edu-default-btn user_watch_btn edu-focus-btn" data-method="post" data-remote="true" id="cancel_watch" rel="nofollow">取消关注</a> */}
|
</a>
|
||||||
</div>
|
<div className="flex1">
|
||||||
|
|
||||||
</div>
|
<div className="creatorname sortinxdirection space-between">
|
||||||
</div>
|
<div className={"creatornamelist"}>
|
||||||
</div>
|
{TPMRightSectionData === undefined ? "" : TPMRightSectionData.creator === undefined ? "" : TPMRightSectionData.creator.name}
|
||||||
{
|
</div>
|
||||||
TPMRightSectionData === undefined ? "" :TPMRightSectionData.tags===undefined?"": TPMRightSectionData.tags.length === 0 ? "" :
|
<div className={"creatornamelist width80center"}>
|
||||||
<div className="edu-back-white padding40-20 mb10 relative">
|
{TPMRightSectionData.user_shixuns_count}
|
||||||
<p className="font-16 mb20">技能标签 <span className="color-grey-c">{TPMRightSectionData.tags.length}</span></p>
|
</div>
|
||||||
<div className={TPMRightSection===false?"newedbox newedboxheight":"newedbox newminheight"}>
|
</div>
|
||||||
<div className="clearfix" id="boxheight">
|
<div className="clearfix">
|
||||||
{ TPMRightSectionData.tags.map((item,key)=>{
|
<span className={"fr color888hezuo"}>发布实训项目</span>
|
||||||
return(
|
{/*<span className="ml20">粉丝 <span id="user_h_fan_count">{TPMRightSectionData.fans_count}</span></span>*/}
|
||||||
<span className={item.status===false?"newedu-filter-btn fl":"edu-filter-btn29BD8B fl"}
|
{/* <a href="/watchers/unwatch?className=fr+user_watch_btn+edu-default-btn+edu-focus-btn&object_id=3039&object_type=user&shixun_id=61&target_id=3039" className="fr edu-default-btn user_watch_btn edu-focus-btn" data-method="post" data-remote="true" id="cancel_watch" rel="nofollow">取消关注</a> */}
|
||||||
style={{display:item.tag_name===" "||item.tag_name===""?"none":""}}
|
</div>
|
||||||
key={key}>{item.tag_name}</span>
|
|
||||||
)})
|
</div>
|
||||||
}
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
{TPMRightSectionData&&TPMRightSectionData.complete_count!=null?<div className="edu-back-white padd252020px relative borderbottomf4">
|
||||||
|
<div className="font-16 mb5">
|
||||||
<div className={TPMRightSectionData.tags.length>15&&clickNewsubscripttype===false?"newsubscript mb9 color-grey-9":"newsubscript mb9 color-grey-9 none"}
|
<span><i className={"iconfont icon-jilu1 audit_situationactive font-14"}></i> 学习统计</span>
|
||||||
|
<span className={"sortinxdirection space-between fr"}>
|
||||||
data-tip-down="显示全部"
|
<span className="color888hezuo font-12">已完成 {TPMRightSectionData&&TPMRightSectionData.complete_count} 个 / 共 {TPMRightSectionData&&TPMRightSectionData.challenge_count} 关</span>
|
||||||
onClick={()=>this.clickNewsubscript(0)}><span className="mr8">...</span><Icon type="caret-down" />
|
</span>
|
||||||
</div>
|
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className={clickNewsubscripttype===false?"newsubscript mb9 color-grey-9 none":"newsubscript mb9 color-grey-9"}
|
<Progress percent={Progresssum} showInfo={false} status="active" strokeColor={{
|
||||||
|
'0%': '#29BD8B',
|
||||||
data-tip-down="显示全部"
|
'100%': '#29BD8B',
|
||||||
onClick={()=>this.clickNewsubscript(1)}><Icon type="caret-up" />
|
}} />
|
||||||
</div>
|
</div>:""}
|
||||||
|
{
|
||||||
</div>
|
TPMRightSectionData === undefined ? "" : TPMRightSectionData.tags === undefined ? "" : TPMRightSectionData.tags.length === 0 ? "" :
|
||||||
|
<div className="edu-back-white padd252020px mb10 relative">
|
||||||
|
<p className="font-16 mb20">
|
||||||
}
|
<span><i className={"iconfont icon-biaoqian2 audit_situationactive font-14"}></i> 技能标签</span>
|
||||||
|
<span className={"sortinxdirection space-between fr"}>
|
||||||
|
<span className="color888hezuo font-12">已获得 {TPMRightSectionData&&TPMRightSectionData.user_tag_count} 个 / 共 {TPMRightSectionData&&TPMRightSectionData.tag_count} 个</span>
|
||||||
<div className="padding20 edu-back-white mb10 mt10" style={{
|
</span>
|
||||||
display: TPMRightSectionData === undefined?"none":TPMRightSectionData.paths===undefined?"":TPMRightSectionData.paths.length === 0 ? "none" : "block"
|
|
||||||
}}>
|
</p>
|
||||||
<p className="mb20 font-16 clearfix">所属课程</p>
|
<div className={TPMRightSection === false ? "newedbox newedboxheight" : "newedbox newminheight"}>
|
||||||
<div className="recommend-list" >
|
<div className="clearfix" id="boxheight">
|
||||||
{
|
{TPMRightSectionData.tags.map((item, key) => {
|
||||||
TPMRightSectionData===undefined?"":TPMRightSectionData.paths===undefined?"":TPMRightSectionData.paths.map((i,k)=>{
|
return (
|
||||||
|
<span className={item.status === false ? "newedu-filter-btn fl" : "edu-filter-btn29BD8B fl"}
|
||||||
return(
|
style={{display: item.tag_name === " " || item.tag_name === "" ? "none" : ""}}
|
||||||
|
key={key}>{item.tag_name}</span>
|
||||||
<div className="recomments clearfix df" key={k}>
|
)
|
||||||
|
})
|
||||||
<a href={"/paths/"+i.id} height="96" width="128" target="_blank">
|
}
|
||||||
<img alt="实训" height="96" src={"/"+i.image_url} width="128" />
|
</div>
|
||||||
</a>
|
</div>
|
||||||
|
|
||||||
<div className="ml10 flex1">
|
|
||||||
<a href={"/paths/"+i.id} target="_blank" data-tip-down={i.name} className="color-grey-6 task-hide mb12 recomment-name">{i.name}</a>
|
<div
|
||||||
<p className="clearfix mt8 font-12 color-grey-B4">
|
className={TPMRightSectionData.tags.length > 15 && clickNewsubscripttype === false ? "textcenter color-grey-9 mt20 rightjinengs" : "none"}
|
||||||
|
onClick={() => this.clickNewsubscript(0)}>
|
||||||
<Tooltip placement="bottom" title={"章节"}>
|
<span className="mr8">
|
||||||
<span className="mr10 fl squareIconSpan"><i className="iconfont icon-shixun fl mr3"></i>{i.stages_count}</span>
|
<div>
|
||||||
</Tooltip>
|
<p className={"font-12"}>展开全部</p>
|
||||||
|
<p className={"font-12"}><i className={"iconfont icon-jiantou9 font-12"}></i></p>
|
||||||
{/*<Tooltip placement="bottom" title={"经验值"}>*/}
|
</div>
|
||||||
{/*<span className="mr10 fl squareIconSpan"><i className="iconfont icon-jingyan fl mr3"></i>{i.score_count}</span>*/}
|
</span>
|
||||||
{/*</Tooltip>*/}
|
</div>
|
||||||
|
|
||||||
<Tooltip placement="bottom" title={"学习人数"}>
|
|
||||||
<span className="mr10 fl squareIconSpan"><i className="iconfont icon-chengyuan fl mr3"></i>{i.members_count}</span>
|
<div className={clickNewsubscripttype === false ? "none" : "textcenter mt20 color-grey-9 rightjinengs"}
|
||||||
</Tooltip>
|
onClick={() => this.clickNewsubscript(1)}>
|
||||||
|
<span className="mr8">
|
||||||
</p>
|
<div>
|
||||||
</div>
|
<p className={"font-12"}><i className={"iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu- font-12"}></i></p>
|
||||||
|
<p className={"font-12"}>收起全部</p>
|
||||||
</div>
|
</div>
|
||||||
|
</span>
|
||||||
)
|
</div>
|
||||||
})
|
|
||||||
}
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
}
|
||||||
{TPMRightSectionData === undefined?"":TPMRightSectionData.paths===undefined?"":TPMRightSectionData.paths.length === 0 ? "" :
|
|
||||||
this.props.user&&this.props.user.main_site===true?<div className="padding20 edu-back-white"
|
|
||||||
style={{
|
<div className="padding20 edu-back-white mb10 mt10" style={{
|
||||||
display:
|
display: TPMRightSectionData === undefined ? "none" : TPMRightSectionData.paths === undefined ? "" : TPMRightSectionData.paths.length === 0 ? "none" : "block"
|
||||||
TPMRightSectionData === undefined?"none":TPMRightSectionData.recommands===undefined?"none":TPMRightSectionData.recommands.length === 0 ? "none" : "block"
|
}}>
|
||||||
}}
|
<p className="mb20 font-16 clearfix"><i className={"iconfont icon-shu1 audit_situationactive font-14"}></i> 所属课程</p>
|
||||||
>
|
<div className="recommend-list">
|
||||||
<p className="mb20 font-16 clearfix">推荐实训</p>
|
{
|
||||||
<div className="recommend-list">
|
TPMRightSectionData === undefined ? "" : TPMRightSectionData.paths === undefined ? "" : TPMRightSectionData.paths.map((i, k) => {
|
||||||
{
|
|
||||||
TPMRightSectionData===undefined?"":TPMRightSectionData.recommands===undefined?"":TPMRightSectionData.recommands.map((item,key)=>{
|
return (
|
||||||
return(
|
|
||||||
<div className="recomments clearfix df" key={key}>
|
<div className="recomments clearfix df" key={k}>
|
||||||
<a href={"/shixuns/"+item.identifier+"/challenges"} target="_blank">
|
|
||||||
<img alt="69?1526971094" height="96" src={"/"+item.pic} width="128"/>
|
<a href={"/paths/" + i.id} height="96" width="128" target="_blank">
|
||||||
</a>
|
<img alt="实训" height="96" src={"/" + i.image_url} width="128"/>
|
||||||
<div className="ml10 flex1">
|
</a>
|
||||||
<Tooltip placement="bottom" title={item.name}>
|
|
||||||
<a href={"/shixuns/"+item.identifier+"/challenges"} target="_blank" className="color-grey-6 task-hide mb12 recomment-name">{item.name}</a>
|
<div className="ml10 flex1">
|
||||||
</Tooltip>
|
<a href={"/paths/" + i.id} target="_blank" data-tip-down={i.name}
|
||||||
<p className="clearfix mt8 font-12 color-grey-B4">
|
className="color-grey-6 task-hide mb12 recomment-name">{i.name}</a>
|
||||||
{item.stu_num} 人学习
|
<p className="clearfix mt8 font-12 color-grey-B4">
|
||||||
</p>
|
|
||||||
<p className="edu-txt-right color-orange pr10">{item.level}</p>
|
<Tooltip placement="bottom" title={"章节"}>
|
||||||
</div>
|
<span className="mr10 fl squareIconSpan"><i
|
||||||
</div>
|
className="iconfont icon-shixun fl mr3"></i>{i.stages_count}</span>
|
||||||
)
|
</Tooltip>
|
||||||
})
|
|
||||||
}
|
{/*<Tooltip placement="bottom" title={"经验值"}>*/}
|
||||||
</div>
|
{/*<span className="mr10 fl squareIconSpan"><i className="iconfont icon-jingyan fl mr3"></i>{i.score_count}</span>*/}
|
||||||
</div>:""
|
{/*</Tooltip>*/}
|
||||||
}
|
|
||||||
</div>
|
<Tooltip placement="bottom" title={"学习人数"}>
|
||||||
}
|
<span className="mr10 fl squareIconSpan"><i
|
||||||
</div>
|
className="iconfont icon-chengyuan fl mr3"></i>{i.members_count}</span>
|
||||||
)
|
</Tooltip>
|
||||||
|
|
||||||
|
</p>
|
||||||
}
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{TPMRightSectionData === undefined ? "" : TPMRightSectionData.paths === undefined ? "" : TPMRightSectionData.paths.length === 0 ? "" :
|
||||||
|
this.props.user && this.props.user.main_site === true ? <div className="padding20 edu-back-white"
|
||||||
|
style={{
|
||||||
|
display:
|
||||||
|
TPMRightSectionData === undefined ? "none" : TPMRightSectionData.recommands === undefined ? "none" : TPMRightSectionData.recommands.length === 0 ? "none" : "block"
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<p className="mb20 font-16 clearfix"><i className={"iconfont icon-tuijian audit_situationactive font-14"}></i> 推荐实训</p>
|
||||||
|
<div className="recommend-list">
|
||||||
|
{
|
||||||
|
TPMRightSectionData === undefined ? "" : TPMRightSectionData.recommands === undefined ? "" : TPMRightSectionData.recommands.map((item, key) => {
|
||||||
|
return (
|
||||||
|
<div className="recomments clearfix df" key={key}>
|
||||||
|
<a href={"/shixuns/" + item.identifier + "/challenges"} target="_blank">
|
||||||
|
<img alt="69?1526971094" height="96" src={"/" + item.pic} width="128"/>
|
||||||
|
</a>
|
||||||
|
<div className="ml10 flex1">
|
||||||
|
<Tooltip placement="bottom" title={item.name}>
|
||||||
|
<a href={"/shixuns/" + item.identifier + "/challenges"} target="_blank"
|
||||||
|
className="color-grey-6 task-hide mb12 recomment-name">{item.name}</a>
|
||||||
|
</Tooltip>
|
||||||
|
<p className="clearfix mt8 font-12 color-grey-B4">
|
||||||
|
{item.stu_num} 人学习
|
||||||
|
</p>
|
||||||
|
<p className="edu-txt-right color-orange pr10">{item.level}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div> : ""
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default TPMRightSection;
|
export default TPMRightSection;
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 308 KiB After Width: | Height: | Size: 362 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading…
Reference in new issue