hjm 6 years ago
parent 1416970fad
commit b78ee4d27e

File diff suppressed because one or more lines are too long

@ -231,8 +231,6 @@ class Infos extends Component{
next_gold
}=this.state;
let {pathname}=this.props.location;
moduleName=pathname.split("/")[3];
return(
<div className="newMain">
{this.state.updata===undefined?"":<UpgradeModals

@ -8,6 +8,8 @@ import "./usersInfo.css"
import "../../courses/css/members.css"
import "../../courses/css/Courses.css"
import banner from '../../../images/account/infobanner.png'
class InfosBanner extends Component{
constructor(props){
super(props);
@ -26,165 +28,89 @@ class InfosBanner extends Component{
next_gold
}=this.props;
let {username}= this.props.match.params;
let {pathname}=this.props.location;
moduleName=pathname.split("/")[3];
return(
<div className="user-main-half">
<div className="user-headImg"></div>
<div className="user-headCon">
<div className="pr" style={{"min-height": "465px"}}>
<div className="educontent pt80 clearfix edu-txt-center">
<div className="inline">
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的经验值</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_experience`}
>{data && data.experience}</a>
</div>
<em className="v-h-line fl"></em>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的金币</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_grade`}
id="user_code">{data && data.grade}</a>
</div>
<div className="headphoto mt14">
<img alt="头像" id="user_avatar_show" nhname="avatar_image" src={data && `${getImageUrl('images/'+data.avatar_url)}`}/>
</div>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的粉丝</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_fanslist`}
id="user_h_fan_count">{data && data.fan_count}</a>
</div>
<em className="v-h-line fl"></em>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的关注</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_watchlist`}
>{data && data.follow_count}</a>
</div>
<span className="clearfix"></span>
<span className="myName">{data && data.name}</span>
</div>
</div>
<div className="educontent mt10 clearfix edu-txt-center">
<div className="inline">
{
data && is_current == false && data.identity =="学生" ? "" : <span className="mypost fl mr10">{data && data.identity}</span>
}
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/authentication` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.authentication ?"已实名认证":"未实名认证"}>
<i className={ data && data.authentication ? "iconfont icon-shenfenrenzheng font-13 color-blue":"iconfont icon-shenfenrenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/professional_certification` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.professional_certification ?"已职业认证":"未职业认证"}>
<i className={ data && data.professional_certification ? "iconfont icon-zhiyerenzheng font-13 color-blue":"iconfont icon-zhiyerenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/change_or_bind?type=phone` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.phone_binded ?"已手机认证":"未手机认证"}>
<i className={ data && data.phone_binded ? "iconfont icon-shoujirenzheng font-13 color-blue":"iconfont icon-shoujirenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/my/account` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.email_binded ?"已邮箱认证":"未邮箱认证"}>
<i className={ data && data.email_binded ? "iconfont icon-youxiangrenzheng font-13 color-blue":"iconfont icon-youxiangrenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
{/* <!--学院管理员身份--> */}
{
data && data.college_identifier &&
<a
// href={`${this.props.Headertop && this.props.Headertop.old_url}/colleges/${data.college_identifier}/statistics`} target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title="学院管理员">
<i className="iconfont icon-chengyuanguanli font-12 color-blue" data-tip-down="学院管理员"></i>
</Tooltip>
</a>
}
</div>
</div>
<div className="mt15 educontent clearfix edu-txt-center">
<p className="mb20" style={{"height": "28px"}}>
<div className="pr mb60">
<img src={banner} style={{width:"100%"}}/>
<div className="bannerPanel">
<div className="educontent">
<div className="clearfix color-white mb20">
<p className="myPhoto mr30 fl"><img alt="头像" width='106px' height='106px' src={data && `${getImageUrl('images/'+data.avatar_url)}`}/></p>
<div className="fl">
<p className="clearfix mt20">
<span className="username task-hide" style={{"maxWidth":'370px'}}>{data && data.name}</span>
{
is_edit && is_current ?
<input type="text" id="mysign" class="mysign-input" placeholder="请输入您的个性签名" style={{height:"20px"}} value={sign} onInput={this.inputSign} onBlur={this.savemysign}/>
:
is_current ?
<a className="mysign-span" onClick={this.editmysign} style={{"display": "block"}}>{sign || "这家伙很懒,什么都没留下~"}</a>
:
<span className="mysign-span" style={{"display": "block","cursor":"default"}}>{sign || "这家伙很懒,什么都没留下~"}</span>
data && is_current == false && data.identity =="学生" ? "" : <span className="userpost">{data && data.identity}</span>
}
</p>
<p className="mt20">
<Tooltip placement='bottom' title={ data && data.professional_certification ?"已职业认证":"未职业认证"}>
<i className={ data && data.professional_certification ? "iconfont icon-shenfenzhenghaomaguizheng font-15 user-colorgrey-green mr30 ml2":"iconfont icon-shenfenzhenghaomaguizheng font-15 user-colorgrey-B8 mr30 ml2"}></i>
</Tooltip>
<Tooltip placement='bottom' title={ data && data.authentication ?"已实名认证":"未实名认证"}>
<i className={ data && data.authentication ? "iconfont icon-renzhengshangjia font-15 user-colorgrey-green":"iconfont icon-renzhengshangjia font-15 user-colorgrey-B8"}></i>
</Tooltip>
</p>
</div>
<div className="fr">
<div class="fl headtab mt20">
<span>{is_current ? "我":"TA"}的经验值</span>
<a style={{"cursor":"default"}}>{data && data.experience}</a>
</div>
<div class="fl headtab mt20 pr leftTransform pl20">
<span>{is_current ? "我":"TA"}的金币</span>
<a style={{"cursor":"default"}}>{data && data.grade}</a>
</div>
{
is_current ?
<div className="inline">
<span className="fl mt35 ml80">
{
data && data.attendance_signed ?
<React.Fragment>
<span className="user_default_btn user_grey_btn mb5">已签到</span>
<p id="attendance_notice" className="none font-12 color-grey-6" style={{"display":"block"}}>明日签到&nbsp;<font className="color-orange">+{next_gold}</font>&nbsp;</p>
</React.Fragment>
<span className="user_default_btn user_grey_btn font-18">已签到</span>
:
<a herf="javascript:void(0);" onClick={this.props.signFor} id="attendance" className="user_default_btn user_orange_btn fl mb15">签到</a>
// <a herf="javascript:void(0);" onClick={this.trialapplications} id="authentication_apply" className="user_default_btn user_private_btn fl ml15">试用申请</a>
<a herf="javascript:void(0);" onClick={this.props.signFor} className="user_default_btn user_yellow_btn fl font-18">签到</a>
}
</div>
</span>
:
<div className="inline">
<a href="javascript:void(0);" onClick={this.props.followPerson} className="user_default_btn user_watch_btn user_private_btn fl mr20">{followed ? "取消关注":"关注"}</a>
<a href={`${this.props.Headertop && this.props.Headertop.old_url}/messages/${login}/message_detail?target_ids=${id}`} className="user_default_btn user_private_btn fl">私信</a>
</div>
<span className="fl mt35 ml80">
<a href={`${this.props.Headertop && this.props.Headertop.old_url}/messages/${login}/message_detail?target_ids=${id}`} className="user_default_btn user_yellow_btn fl font-18">私信</a>
</span>
}
</div>
<div className="edu-txt-center navInfo">
<div className="inline">
<li className={`${moduleName == 'courses' ||moduleName == undefined ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'courses'})}
to={`/users/${username}/courses`}>课堂</Link>
</li>
<li className={`${moduleName == 'shixuns' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'shixuns'})}
to={`/users/${username}/shixuns`}>实训</Link>
</li>
<li className={`${moduleName == 'paths' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'paths'})}
to={`/users/${username}/paths`}>实践课程</Link>
</li>
<li className={`${moduleName == 'projects' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'projects'})}
to={`/users/${username}/projects`}>项目</Link>
</li>
<li className={`${moduleName == 'package' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'package'})}
to={`/users/${username}/package`}>众包</Link>
</li>
</div>
<div className="userNav">
<li className={`${moduleName == 'courses' ||moduleName == undefined ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'courses'})}
to={`/users/${username}/courses`}>翻转课堂</Link>
</li>
<li className={`${moduleName == 'shixuns' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'shixuns'})}
to={`/users/${username}/shixuns`}>开发社区</Link>
</li>
<li className={`${moduleName == 'paths' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'paths'})}
to={`/users/${username}/paths`}>实践课程</Link>
</li>
<li className={`${moduleName == 'projects' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'projects'})}
to={`/users/${username}/projects`}>项目</Link>
</li>
{/*{ data && data.identity!="学生" && <li> <a href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}?type=m_bank`}>题库</a></li>}*/}
</div>
</div>
<li className={`${moduleName == 'package' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'package'})}
to={`/users/${username}/package`}>众包</Link>
</li>
</div>
</div>
</div>
</div>
)
}
}

@ -0,0 +1,190 @@
import React, { Component } from 'react';
import {Link} from 'react-router-dom';
import {Tooltip,Menu} from 'antd';
import {getImageUrl} from 'educoder';
import "./usersInfo.css"
import "../../courses/css/members.css"
import "../../courses/css/Courses.css"
class banner_out extends Component{
constructor(props){
super(props);
}
render(){
let {
data ,
is_current,
is_edit,
sign,
type,
followed,
id,
login,
moduleName,
next_gold
}=this.props;
let {username}= this.props.match.params;
return(
<div className="user-main-half">
<div className="user-headImg"></div>
<div className="user-headCon">
<div className="pr" style={{"min-height": "465px"}}>
<div className="educontent pt80 clearfix edu-txt-center">
<div className="inline">
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的经验值</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_experience`}
>{data && data.experience}</a>
</div>
<em className="v-h-line fl"></em>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的金币</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_grade`}
id="user_code">{data && data.grade}</a>
</div>
<div className="headphoto mt14">
<img alt="头像" id="user_avatar_show" nhname="avatar_image" src={data && `${getImageUrl('images/'+data.avatar_url)}`}/>
</div>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的粉丝</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_fanslist`}
id="user_h_fan_count">{data && data.fan_count}</a>
</div>
<em className="v-h-line fl"></em>
<div className="fl headtab">
<span>{is_current ? "我":"TA"}的关注</span>
<a style={{ cursor: 'default' }}
// href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}/user_watchlist`}
>{data && data.follow_count}</a>
</div>
<span className="clearfix"></span>
<span className="myName">{data && data.name}</span>
</div>
</div>
<div className="educontent mt10 clearfix edu-txt-center">
<div className="inline">
{
data && is_current == false && data.identity =="学生" ? "" : <span className="mypost fl mr10">{data && data.identity}</span>
}
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/authentication` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.authentication ?"已实名认证":"未实名认证"}>
<i className={ data && data.authentication ? "iconfont icon-shenfenrenzheng font-13 color-blue":"iconfont icon-shenfenrenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/professional_certification` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.professional_certification ?"已职业认证":"未职业认证"}>
<i className={ data && data.professional_certification ? "iconfont icon-zhiyerenzheng font-13 color-blue":"iconfont icon-zhiyerenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/account/change_or_bind?type=phone` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.phone_binded ?"已手机认证":"未手机认证"}>
<i className={ data && data.phone_binded ? "iconfont icon-shoujirenzheng font-13 color-blue":"iconfont icon-shoujirenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
<a
// href={is_current ? `${this.props.Headertop && this.props.Headertop.old_url}/my/account` :"javascript:void(0)"}
// target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title={ data && data.email_binded ?"已邮箱认证":"未邮箱认证"}>
<i className={ data && data.email_binded ? "iconfont icon-youxiangrenzheng font-13 color-blue":"iconfont icon-youxiangrenzheng font-13 color-grey-9"}></i>
</Tooltip>
</a>
{/* <!--学院管理员身份--> */}
{
data && data.college_identifier &&
<a
// href={`${this.props.Headertop && this.props.Headertop.old_url}/colleges/${data.college_identifier}/statistics`} target="_blank"
className={is_current ? "ringauto fl" :"ringauto fl cdefault"}>
<Tooltip placement='bottom' title="学院管理员">
<i className="iconfont icon-chengyuanguanli font-12 color-blue" data-tip-down="学院管理员"></i>
</Tooltip>
</a>
}
</div>
</div>
<div className="mt15 educontent clearfix edu-txt-center">
<p className="mb20" style={{"height": "28px"}}>
{
is_edit && is_current ?
<input type="text" id="mysign" class="mysign-input" placeholder="请输入您的个性签名" style={{height:"20px"}} value={sign} onInput={this.inputSign} onBlur={this.savemysign}/>
:
is_current ?
<a className="mysign-span" onClick={this.editmysign} style={{"display": "block"}}>{sign || "这家伙很懒,什么都没留下~"}</a>
:
<span className="mysign-span" style={{"display": "block","cursor":"default"}}>{sign || "这家伙很懒,什么都没留下~"}</span>
}
</p>
{
is_current ?
<div className="inline">
{
data && data.attendance_signed ?
<React.Fragment>
<span className="user_default_btn user_grey_btn mb5">已签到</span>
<p id="attendance_notice" className="none font-12 color-grey-6" style={{"display":"block"}}>明日签到&nbsp;<font className="color-orange">+{next_gold}</font>&nbsp;</p>
</React.Fragment>
:
<a herf="javascript:void(0);" onClick={this.props.signFor} id="attendance" className="user_default_btn user_orange_btn fl mb15">签到</a>
// <a herf="javascript:void(0);" onClick={this.trialapplications} id="authentication_apply" className="user_default_btn user_private_btn fl ml15">试用申请</a>
}
</div>
:
<div className="inline">
<a href="javascript:void(0);" onClick={this.props.followPerson} className="user_default_btn user_watch_btn user_private_btn fl mr20">{followed ? "取消关注":"关注"}</a>
<a href={`${this.props.Headertop && this.props.Headertop.old_url}/messages/${login}/message_detail?target_ids=${id}`} className="user_default_btn user_private_btn fl">私信</a>
</div>
}
</div>
<div className="edu-txt-center navInfo">
<div className="inline">
<li className={`${moduleName == 'courses' ||moduleName == undefined ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'courses'})}
to={`/users/${username}/courses`}>课堂</Link>
</li>
<li className={`${moduleName == 'shixuns' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'shixuns'})}
to={`/users/${username}/shixuns`}>实训</Link>
</li>
<li className={`${moduleName == 'paths' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'paths'})}
to={`/users/${username}/paths`}>实践课程</Link>
</li>
<li className={`${moduleName == 'projects' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'projects'})}
to={`/users/${username}/projects`}>项目</Link>
</li>
<li className={`${moduleName == 'package' ? 'active' : '' }`}>
<Link
onClick={() => this.setState({moduleName: 'package'})}
to={`/users/${username}/package`}>众包</Link>
</li>
{/*{ data && data.identity!="学生" && <li> <a href={`${this.props.Headertop && this.props.Headertop.old_url}/users/${username}?type=m_bank`}>题库</a></li>}*/}
</div>
</div>
</div>
</div>
</div>
)
}
}
export default banner_out;

@ -119,4 +119,105 @@
.project-package-item.with-operator:hover .item-operator a {
display: block;
font-size: 20px;
}
/* 个人主页头部改版 */
.bannerPanel{
position: absolute;
width:100%;
top:0px;
left:0px;
height:100%;
padding-top:25px;
box-sizing: border-box;
}
.username{
font-size:26px;
margin-right:15px;
height: 30px;
line-height: 30px;
float: left;
color:#fff;
}
.myPhoto img{
border-radius: 50%;
}
.myPhoto{
border-radius: 50%;
border:2px solid #fff;
width:110px;
height:110px;
}
.userpost{
padding:0px 10px;
height: 20px;
line-height:18px;
border:1px solid #fff;
border-radius: 2px;
color:#fff!important;
display: inline;
margin-top: 7px;
float:left;
}
.user-colorgrey-B8{color:#B8B8B8}
.user-colorgrey-green{color:#7ED321}
.user_yellow_btn {
color: #fff!important;
background-color: #FF8E02;
}
.headtab span {
color: #e8e8e8;
font-size: 14px;
}
.headtab span, .headtab a {
display: block;
width: 100%;
text-align: center;
}
.headtab {
width: 160px;
height: 70px;
text-align: center;
}
.leftTransform:before{
position: absolute;
content:'';
left:0px;
top:6px;
width:1px;
height:84%;
background: #fff;
transform: rotate(18deg);
}
.userNav{
height: 54px;
line-height: 54px;
background: #fff;
box-shadow:3px 5px 11px 1px rgba(230,230,230,0.5);
border-radius:7px;
padding:0px 10px;
margin-top:8px;
}
.userNav li{
display: inline-block;
padding:0px 30px;
box-sizing: border-box
}
.userNav li a{
color:#333333;
font-size: 16px;
display: block
}
.userNav li.active a{
position: relative;
color:#4CACFF;
}
.userNav li.active a:after{
position: absolute;
bottom: 0px;
height: 4px;
width:100%;
content: '';
left:0px;
background: #4CACFF;
}
Loading…
Cancel
Save