88 lines
4.0 KiB
JavaScript
88 lines
4.0 KiB
JavaScript
import React, { Component } from 'react';
|
||
import Tooltip from 'material-ui/Tooltip';
|
||
import './Comment.css'
|
||
|
||
const $ = window.$;
|
||
function pasteListener(event) {
|
||
if (event.clipboardData.types[0] === 'Files') {
|
||
event.preventDefault();
|
||
}
|
||
}
|
||
|
||
class CommentInput extends Component {
|
||
|
||
componentWillReceiveProps(newProps, newContext) {
|
||
// TODO 暂没有切实训的场景
|
||
if (newProps.challenge && newProps.challenge.shixun_id
|
||
&& (!this.props.challenge.shixun_id || newProps.challenge.shixun_id != this.props.challenge.shixun_id)) {
|
||
setTimeout(() => {
|
||
window.sd_create_editor_from_shixun_data(newProps.challenge.shixun_id, null, "100%", "Shixun");
|
||
if ($.browser.mozilla) {
|
||
setTimeout(() => {
|
||
const _body = $('.ke-edit-iframe')[0].contentWindow.document.body;
|
||
_body.removeEventListener('paste', pasteListener)
|
||
_body.addEventListener('paste', pasteListener)
|
||
}, 4200)
|
||
}
|
||
}, 100)
|
||
|
||
}
|
||
|
||
}
|
||
|
||
render() {
|
||
const { createNewComment, editedComment, commentOnChange, challenge, praisePlus, gotNewReply, showNewReply } = this.props;
|
||
|
||
return (
|
||
<li className="comment-input fl" id="shixun_comment_block">
|
||
{!challenge.shixun_id ? '' :
|
||
<div nhname={`new_message_${challenge.shixun_id}`} className="fr" style={{ width: '99%' }}>
|
||
<form acceptCharset="UTF-8" action="/discusses?challenge_id=118&dis_id=61&dis_type=Shixun" className="df" data-remote="true" id="new_comment_form" method="post">
|
||
<div className="fl" style={{ flex: 1, marginTop: '7px' }} id="editor_panel">
|
||
<div nhname={`toolbar_container_${challenge.shixun_id}`}></div>
|
||
{/*有问题或有建议，请直接给我留言吧！*/}
|
||
<textarea id={`comment_news_${challenge.shixun_id}`}
|
||
nhname={`new_message_textarea_${challenge.shixun_id}`} name="content"
|
||
value={editedComment} onChange={commentOnChange} className="none">
|
||
</textarea>
|
||
</div>
|
||
<div className="tips"
|
||
style={{ 'float': 'left', 'marginTop': '6px', 'fontSize': '12px', 'color': '#ff6800' }}>
|
||
请勿粘贴答案，否则将造成账号禁用等后果！
|
||
</div>
|
||
<div className="fr buttons" style={{ minWidth: '25px', height: '32px' }}>
|
||
<a id={`new_message_submit_btn_${challenge.shixun_id}`}
|
||
style={{ display: 'none' }} onClick={createNewComment} className="commentsbtn task-btn task-btn-blue fr">
|
||
发送
|
||
</a>
|
||
<p className="fr ml10" style={{ minWidth: '25px' }} >
|
||
<Tooltip title={challenge.user_praise ? "取消点赞" : "点赞"}>
|
||
<span id="game_praise_tread" className="color-grey mr20" onClick={praisePlus}>
|
||
<i className={`mr3 ${challenge.user_praise ? "iconfont icon-dianzan color-orange03" : "iconfont icon-dianzan-xian"} `} alt="赞" ></i>
|
||
{challenge.praise_count ?
|
||
<span className="font-16" id="game_praise_count">{challenge.praise_count}</span> : ''}
|
||
</span>
|
||
</Tooltip>
|
||
</p>
|
||
<p className="fr ml10" style={{ minWidth: '25px' }} >
|
||
{gotNewReply ?
|
||
<React.Fragment>
|
||
<i className={`replyIcon newReplyIcon iconfont icon-tpixiaoxitixing`} onClick={showNewReply}></i>
|
||
<span className="dot blink"></span>
|
||
</React.Fragment>
|
||
:
|
||
<Tooltip title={"暂无新消息"}>
|
||
<i className={`replyIcon iconfont icon-tpixiaoxitixing`}></i>
|
||
</Tooltip>
|
||
}
|
||
</p>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
}
|
||
</li>
|
||
)
|
||
}
|
||
}
|
||
|
||
export default CommentInput; |