通用评论

1
  1. {"version":3,"sources":["../../../src/components/ContentItem/index.js"],"names":["CommentItem","props","state","isShowInput","handleToggleInput","bind","renderTextWithReply","setState","text","content","newText","reply","user_id","user_name","commentId","replyId","type","showReply","onShowReply","app","isComment","user_avatar","marginLeft","created","format","__html","reply_count","userSelect","cursor","sCommentFavor","id","favored","favor_count","Component","propTypes","PropTypes","object","isRequired","oneOf","func","defaultProps"],"mappings":"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","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Avatar, Icon } from \"antd\";\nimport dayjs from \"dayjs\";\nimport Comment from \"../../Comment\";\nimport CommentInput from \"../CommentInput\";\nimport { renderContent } from \"../../helper\";\nimport \"./index.css\";\n\nclass CommentItem extends Component {\n constructor(props) {\n super(props);\n this.state = {\n isShowInput: false\n };\n this.handleToggleInput = this.handleToggleInput.bind(this);\n this.renderTextWithReply = this.renderTextWithReply.bind(this);\n }\n\n handleToggleInput() {\n this.setState({ isShowInput: !this.state.isShowInput });\n }\n\n renderTextWithReply(text, content) {\n let newText = text;\n const { reply } = content;\n if (reply) {\n newText = `${newText} //@<a href=\"/${reply.user_id}\">${\n reply.user_name\n }</a> ${reply.content}`;\n if (reply.reply) {\n return this.renderTextWithReply(newText, reply);\n }\n }\n return newText;\n }\n\n render() {\n const {\n commentId,\n replyId,\n content,\n type,\n showReply,\n onShowReply,\n app\n } = this.props;\n const { isShowInput } = this.state;\n const isComment = type === \"comment\";\n return (\n <div className=\"box\">\n <div className=\"left\">\n <Avatar src={content.user_avatar} size=\"large\" />\n </div>\n <div className=\"right\">\n <div className=\"name\">\n <a href={`/${content.user_id}`}>\n {content.user_name || \"暂无昵称\"}\n </a>\n\n <span style={{ marginLeft: 10 }}>\n {dayjs(content.created * 1000).format(\"YYYY-MM-DD HH:mm:ss\")}\n </span>\n </div>\n <div\n className=\"content\"\n dangerouslySetInnerHTML={{\n __html: renderContent(\n this.renderTextWithReply(content.content, content)\n )\n }}\n />\n <div className=\"bottom\">\n {isComment && content.reply_count ? (\n <div>\n <a\n className=\"itemLeft\"\n onClick={onShowReply}\n style={{ userSelect: \"none\" }}\n >\n {content.reply_count} 条回复\n {showReply ? <Icon type=\"up\" /> : <Icon type=\"down\" />}\n </a>\n </div>\n ) : null}\n\n <a onClick={this.handleToggleInput} className=\"itemRight\">\n &nbsp; 回复\n </a>\n <div\n className=\"itemRight\"\n style={{ cursor: \"pointer\" }}\n onClick={() => app.sCommentFavor(content.id, content.favored)}\n >\n <Icon\n type=\"like-o\"\n className={content.favored ? \"favored\" : \"\"}\n />\n &nbsp;{content.favor_count}\n </div>\n </div>\n\n {isShowInput ? (\n <CommentInput\n type={type}\n replyId={replyId}\n commentId={commentId}\n handleToggleInput={this.handleToggleInput}\n />\n ) : null}\n </div>\n </div>\n );\n }\n}\n\nCommentItem.propTypes = {\n content: PropTypes.object.isRequired,\n // comment 评论\n // reply 回复\n type: PropTypes.oneOf([\"comment\", \"reply\"]),\n onShowReply: PropTypes.func\n};\n\nCommentItem.defaultProps = {\n type: \"comment\",\n onShowReply: () => {}\n};\n\nexport default Comment(CommentItem);\n"]}