parent
0c18f5c859
commit
91359292a6
@ -1,115 +1,126 @@
|
||||
import React,{ Component } from "react";
|
||||
import {Tooltip} from 'antd'
|
||||
import moment from 'moment'
|
||||
import { getUrl, WordsBtn } from 'educoder'
|
||||
class BoardsListItem extends Component{
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state = {
|
||||
|
||||
}
|
||||
}
|
||||
onTitleClick = (discussMessage) => {
|
||||
const isAdminOrStudent = this.props.isAdminOrStudent();
|
||||
if (!isAdminOrStudent && discussMessage.is_public == false) {
|
||||
// 没有权限访问
|
||||
return;
|
||||
}
|
||||
const cid = this.props.match.params.coursesId
|
||||
const board_id = this.props.match.params.boardId
|
||||
this.props.toDetailPage(cid, board_id, discussMessage.id)
|
||||
}
|
||||
render(){
|
||||
let { addGroup } = this.state;
|
||||
const isAdmin = this.props.isAdmin()
|
||||
const isAdminOrStudent = this.props.isAdminOrStudent()
|
||||
const { checkBox, discussMessage, onSticky, onItemClick, current_user } = this.props;
|
||||
if (!discussMessage || !discussMessage.author) {
|
||||
return '';
|
||||
}
|
||||
let canNotLink = !isAdminOrStudent && discussMessage.is_public == false
|
||||
|
||||
return(
|
||||
<div className="panel-inner-fourm boardsList">
|
||||
<style>{`
|
||||
.boardsList .panel-list-img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
`}</style>
|
||||
{ checkBox }
|
||||
<a href={`/users/${discussMessage.author.login}`} alt="用户" style={{"width":"50px","height":"50px","display":"block", margin: "0 10px"}}>
|
||||
{/* /images/avatars/User/1?1529221779 */}
|
||||
<img
|
||||
alt="1?1529221779" className="panel-list-img mr15" height="50"
|
||||
src={`${getUrl()}/images/${discussMessage.author.image_url}`} width="50"
|
||||
></img>
|
||||
</a>
|
||||
<div className="clearfix ds pr pt5 contentSection" onClick={() => onItemClick(discussMessage)}>
|
||||
<h6>
|
||||
<a href="javascript:void(0)" className="panel-list-title hide fl mt5 color-dark font-bd"
|
||||
style={{ fontWeight: 'bold', cursor: (canNotLink ? 'default' : 'poninter'), maxWidth: '700px' }}
|
||||
onClick={canNotLink ? () => {} : () => this.onTitleClick(discussMessage)}
|
||||
title={`${discussMessage.subject.length > 40 ? discussMessage.subject : ''}`}
|
||||
>{discussMessage.subject}</a>
|
||||
{ !!discussMessage.sticky && <span className="btn-cir btn-cir-red fl mt5 ml5">置顶</span> }
|
||||
{
|
||||
|
||||
discussMessage.is_public == false ? (<Tooltip title={`${isAdminOrStudent ? '私有属性' : '私有属性，非课堂成员不能访问'}`}>
|
||||
<i className="iconfont icon-guansuo color-grey-c ml10 font-16 fl mt4"></i>
|
||||
</Tooltip>) : ""
|
||||
}
|
||||
</h6>
|
||||
|
||||
<div className="cl"></div>
|
||||
<p className="color-grey panel-lightgrey mt18 fl">
|
||||
<span className="mr50">
|
||||
<a href={`/users/${discussMessage.author.login}`} className="panel-name-small hide fl mr15 mr30 color-grey3 font-14">{discussMessage.author.name}</a>
|
||||
|
||||
{ discussMessage.total_replies_count != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.total_replies_count} 回复</span> }
|
||||
{ discussMessage.praises_count != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.praises_count} 点赞</span> }
|
||||
{ discussMessage.visits != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.visits} 浏览</span> }
|
||||
|
||||
<span className="mr15 color-light-grey-C font-14">{moment(discussMessage.created_on).fromNow()} </span>
|
||||
</span>
|
||||
</p>
|
||||
<div className="fr mt15">
|
||||
{(isAdmin || discussMessage.author.login == current_user.login) &&
|
||||
<WordsBtn style="blue" className="fl font-16 ml28"
|
||||
onClick={(e) => { this.props.toEditPage(this.props.match.params.coursesId, this.props.match.params.boardId, discussMessage.id )} }>编辑</WordsBtn> }
|
||||
|
||||
{ isAdmin && <WordsBtn style="blue" className="fl font-16 ml28"
|
||||
onClick={(e) => { debugger; onSticky(discussMessage); e.cancelBubble = true; e.stopPropagation();}}>
|
||||
{ discussMessage.sticky ? '取消置顶' : '置顶' }</WordsBtn> }
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{/* { (isAdmin || discussMessage.author.login == current_user.login) &&
|
||||
<div className="homepagePostSetting" style={{"right":"4px","top":"5px","display":"block"}}>
|
||||
<ul>
|
||||
<li className="edu-position edu-position-hidebox">
|
||||
<i className="fa fa-bars color-grey-b"></i>
|
||||
<ul className="edu-position-hide undis">
|
||||
{(isAdmin || discussMessage.author.login == current_user.login) && <li><a href="javascript:void(0)" onClick={(e) => {
|
||||
this.props.toEditPage(this.props.match.params.coursesId, this.props.match.params.boardId, discussMessage.id )} } >编辑</a></li>
|
||||
}
|
||||
{isAdmin && <li><a href="javascript:void(0)" onClick={(e) => { debugger; onSticky(discussMessage); e.cancelBubble = true; e.stopPropagation();} }>
|
||||
{ discussMessage.sticky ? '取消置顶' : '置顶' }
|
||||
</a></li>
|
||||
}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
} */}
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
import React,{ Component } from "react";
|
||||
import {Tooltip} from 'antd'
|
||||
import moment from 'moment'
|
||||
import { getUrl, WordsBtn } from 'educoder'
|
||||
class BoardsListItem extends Component{
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state = {
|
||||
|
||||
}
|
||||
}
|
||||
onTitleClick = (discussMessage) => {
|
||||
if(this.props.checkIfLogin()===false){
|
||||
this.props.showLoginDialog()
|
||||
return
|
||||
}
|
||||
|
||||
if(this.props.checkIfProfileCompleted()===false){
|
||||
this.props.showProfileCompleteDialog()
|
||||
return
|
||||
}
|
||||
|
||||
const isAdminOrStudent = this.props.isAdminOrStudent();
|
||||
if (!isAdminOrStudent && discussMessage.is_public == false) {
|
||||
// 没有权限访问
|
||||
return;
|
||||
}
|
||||
const cid = this.props.match.params.coursesId
|
||||
const board_id = this.props.match.params.boardId
|
||||
this.props.toDetailPage(cid, board_id, discussMessage.id)
|
||||
}
|
||||
render(){
|
||||
let { addGroup } = this.state;
|
||||
const isAdmin = this.props.isAdmin()
|
||||
const isAdminOrStudent = this.props.isAdminOrStudent()
|
||||
const { checkBox, discussMessage, onSticky, onItemClick, current_user } = this.props;
|
||||
if (!discussMessage || !discussMessage.author) {
|
||||
return '';
|
||||
}
|
||||
let canNotLink = !isAdminOrStudent && discussMessage.is_public == false
|
||||
|
||||
return(
|
||||
<div className="panel-inner-fourm boardsList">
|
||||
<style>{`
|
||||
.boardsList .panel-list-img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
`}</style>
|
||||
{ checkBox }
|
||||
<a href={`/users/${discussMessage.author.login}`} alt="用户" style={{"width":"50px","height":"50px","display":"block", margin: "0 10px"}}>
|
||||
{/* /images/avatars/User/1?1529221779 */}
|
||||
<img
|
||||
alt="1?1529221779" className="panel-list-img mr15" height="50"
|
||||
src={`${getUrl()}/images/${discussMessage.author.image_url}`} width="50"
|
||||
></img>
|
||||
</a>
|
||||
<div className="clearfix ds pr pt5 contentSection" onClick={() => onItemClick(discussMessage)}>
|
||||
<h6>
|
||||
<Tooltip title={canNotLink?"私有属性，非课堂成员不能访问":`${discussMessage.subject.length > 40 ? discussMessage.subject : ''}`} placement="bottom">
|
||||
<a className="panel-list-title hide fl mt5 color-dark font-bd pointer"
|
||||
style={{ fontWeight: 'bold', cursor: (canNotLink ? 'poninter' : 'poninter'), maxWidth: '700px' }}
|
||||
onClick={canNotLink ? () => {} : () => this.onTitleClick(discussMessage)}
|
||||
>{discussMessage.subject}</a>
|
||||
</Tooltip>
|
||||
{ !!discussMessage.sticky && <span className="btn-cir btn-cir-red fl mt5 ml5">置顶</span> }
|
||||
{
|
||||
|
||||
discussMessage.is_public == false ? (<Tooltip title={`${isAdminOrStudent ? '私有属性' : '私有属性，非课堂成员不能访问'}`} placement="bottom">
|
||||
<i className="iconfont icon-guansuo color-grey-c ml10 font-16 fl mt4"></i>
|
||||
</Tooltip>) : ""
|
||||
}
|
||||
</h6>
|
||||
|
||||
<div className="cl"></div>
|
||||
<p className="color-grey panel-lightgrey mt18 fl">
|
||||
<span className="mr50">
|
||||
<a href={`/users/${discussMessage.author.login}`} className="panel-name-small hide fl mr15 mr30 color-grey3 font-14">{discussMessage.author.name}</a>
|
||||
|
||||
{ discussMessage.total_replies_count != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.total_replies_count} 回复</span> }
|
||||
{ discussMessage.praises_count != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.praises_count} 点赞</span> }
|
||||
{ discussMessage.visits != 0 && <span className="mr15 color-grey9 font-14">{discussMessage.visits} 浏览</span> }
|
||||
|
||||
<span className="mr15 color-light-grey-C font-14">{moment(discussMessage.created_on).fromNow()} </span>
|
||||
</span>
|
||||
</p>
|
||||
<div className="fr mt15">
|
||||
{(isAdmin || discussMessage.author.login == current_user.login) &&
|
||||
<WordsBtn style="blue" className="fl font-16 ml28"
|
||||
onClick={(e) => { this.props.toEditPage(this.props.match.params.coursesId, this.props.match.params.boardId, discussMessage.id )} }>编辑</WordsBtn> }
|
||||
|
||||
{ isAdmin && <WordsBtn style="blue" className="fl font-16 ml28"
|
||||
onClick={(e) => { debugger; onSticky(discussMessage); e.cancelBubble = true; e.stopPropagation();}}>
|
||||
{ discussMessage.sticky ? '取消置顶' : '置顶' }</WordsBtn> }
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{/* { (isAdmin || discussMessage.author.login == current_user.login) &&
|
||||
<div className="homepagePostSetting" style={{"right":"4px","top":"5px","display":"block"}}>
|
||||
<ul>
|
||||
<li className="edu-position edu-position-hidebox">
|
||||
<i className="fa fa-bars color-grey-b"></i>
|
||||
<ul className="edu-position-hide undis">
|
||||
{(isAdmin || discussMessage.author.login == current_user.login) && <li><a href="javascript:void(0)" onClick={(e) => {
|
||||
this.props.toEditPage(this.props.match.params.coursesId, this.props.match.params.boardId, discussMessage.id )} } >编辑</a></li>
|
||||
}
|
||||
{isAdmin && <li><a href="javascript:void(0)" onClick={(e) => { debugger; onSticky(discussMessage); e.cancelBubble = true; e.stopPropagation();} }>
|
||||
{ discussMessage.sticky ? '取消置顶' : '置顶' }
|
||||
</a></li>
|
||||
}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
} */}
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
export default BoardsListItem;
|
||||
Loading…
Reference in new issue