{"version":3,"sources":["../../../src/components/CommentBox/index.js"],"names":["CommentBox","props","state","showReply","page","handleToggleReply","bind","handleGetMoreReply","renderReplies","setState","commentId","app","sGetReply","replies","replyCount","isNoMoreReply","length","len","marginLeft","map","item","index","id","float","content","reply_count","Component","propTypes","PropTypes","string","isRequired","defaultProps"],"mappings":"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","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { Icon } from \"antd\";\r\nimport Comment from \"../../Comment\";\r\nimport ContentItem from \"./../ContentItem\";\r\nimport \"./index.css\";\r\n\r\nclass CommentBox extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {\r\n      showReply: true,\r\n      page: 1\r\n    };\r\n\r\n    this.handleToggleReply = this.handleToggleReply.bind(this);\r\n    this.handleGetMoreReply = this.handleGetMoreReply.bind(this);\r\n    this.renderReplies = this.renderReplies.bind(this);\r\n  }\r\n\r\n  /**\r\n   * 切换是否显示回复列表\r\n   */\r\n  handleToggleReply() {\r\n    this.setState({ showReply: !this.state.showReply });\r\n  }\r\n\r\n  /**\r\n   * 获取更多评论\r\n   * @param {string} commentId comment id\r\n   */\r\n  handleGetMoreReply(commentId) {\r\n    // 从第一页开始获取评论\r\n    const { page } = this.state;\r\n    this.props.app.sGetReply({ commentId, page });\r\n    this.setState({ page: page + 1 });\r\n  }\r\n\r\n  /**\r\n   * 渲染回复 DOM\r\n   * @param {array} replies 回复列表\r\n   * @param {number} replies 回复的数量\r\n   * @param {boolean} isNoMoreReply 是否没有更多回复\r\n   */\r\n  renderReplies(replies, replyCount, isNoMoreReply) {\r\n    const { commentId } = this.props;\r\n    const { showReply } = this.state;\r\n    if (showReply && replies && replies.length) {\r\n      const len = replies.length;\r\n      return (\r\n        <div style={{ marginLeft: 50 }}>\r\n          {replies.map((item, index) => {\r\n            if (index === len - 1) {\r\n              return [\r\n                <ContentItem\r\n                  commentId={commentId}\r\n                  replyId={item.id}\r\n                  key={item.id}\r\n                  content={item}\r\n                  action=\"replyToReply\" // 回复的回复\r\n                />,\r\n                <div className=\"comment-more-box\" key=\"show_more_button\">\r\n                  {!isNoMoreReply &&\r\n                    replyCount !== len && (\r\n                      <span\r\n                        className=\"comment-show-more\"\r\n                        onClick={() => this.handleGetMoreReply(commentId)}\r\n                      >\r\n                        查看更多回复\r\n                      </span>\r\n                    )}\r\n\r\n                  <a\r\n                    style={{ float: \"right\" }}\r\n                    onClick={this.handleToggleReply}\r\n                  >\r\n                    <Icon type=\"up\" /> 收起回复\r\n                  </a>\r\n                </div>\r\n              ];\r\n            }\r\n            return (\r\n              <ContentItem\r\n                commentId={commentId}\r\n                replyId={item.id}\r\n                key={item.id}\r\n                content={item}\r\n                action=\"replyToReply\" // 评论的回复\r\n              />\r\n            );\r\n          })}\r\n        </div>\r\n      );\r\n    }\r\n    return null;\r\n  }\r\n\r\n  render() {\r\n    const { content } = this.props;\r\n    const { showReply } = this.state;\r\n    return (\r\n      <div>\r\n        <ContentItem\r\n          content={content}\r\n          onShowReply={this.handleToggleReply}\r\n          showReply={showReply}\r\n          commentId={content.id}\r\n          action=\"reply\" // 评论的回复\r\n        />\r\n        {this.renderReplies(\r\n          content.replies,\r\n          content.reply_count,\r\n          content.isNoMoreReply\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nCommentBox.propTypes = {\r\n  commentId: PropTypes.string.isRequired\r\n};\r\n\r\nCommentBox.defaultProps = {};\r\n\r\nexport default Comment(CommentBox);\r\n"]}