123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 |
- import React, { Component } from "react";
- import { Row, Col } from "antd";
- import intl from "react-intl-universal";
- import "./AvatarHoverCard.less";
-
- class AvatarHoverCard extends Component {
- constructor(props) {
- super(props);
- this.state = {
- showModal: false
- };
- }
-
- componentDidMount() {
- const isLogin =
- this.props.currentUser.user_id > 0 || this.props.currentUser.id > 0;
- this.props.getUserInfo({
- id: this.props.user_id,
- noCheckFollowed: !isLogin
- });
- }
-
- render() {
- const { image, user_id, currentUser, userAvaHoverData } = this.props;
- const followed =
- userAvaHoverData[user_id] && userAvaHoverData[user_id].isFollowed;
-
- return (
- <div className="AvatarHoverCard" onClick={e => e.stopPropagation()}>
- {/* <Link to={`/bilingual/user/${user_id}`}> */}
- <div onClick={() => this.props.userAvaClick(user_id)}>
- <Row type="flex" className="rowUser">
- <div
- className="avatar"
- style={{
- backgroundImage: `url(${image})`
- }}
- />
- <div className="nickname">
- {userAvaHoverData[user_id] && userAvaHoverData[user_id].nickname}
- </div>
- </Row>
- </div>
- {/* </Link> */}
- <div className="divider" />
- <Row type="flex" className="rowNum">
- <Col className="colFans">
- <div className="count">
- {userAvaHoverData[user_id] && userAvaHoverData[user_id].fans}
- </div>
- <div className="text">
- {intl.get("bilingually.fan", {
- ext:
- userAvaHoverData[user_id] &&
- userAvaHoverData[user_id].fans > 1
- ? "s"
- : ""
- })}
- </div>
- </Col>
- <Col className="hdivider" />
- <Col className="colFollow">
- <div className="count">
- {userAvaHoverData[user_id] && userAvaHoverData[user_id].followers}
- </div>
- <div className="text">
- {intl.get("bilingually.follow", {
- ext:
- userAvaHoverData[user_id] &&
- userAvaHoverData[user_id].followers > 1
- ? "s"
- : ""
- })}
- </div>
- </Col>
- </Row>
- {currentUser.user_id > 0 && currentUser.user_id !== user_id && (
- <Row type="flex" className="rowBtn">
- {followed ? (
- <div
- className="unFollowBtn"
- onClick={e => {
- e.stopPropagation();
- this.props
- .unFocus({
- id: user_id
- })
- .then(() => {
- this.props.getUserInfo({
- id: user_id
- });
- });
- }}
- >
- {intl.get("bilingually.cancel_follow")}
- </div>
- ) : (
- <div
- className="followBtn"
- onClick={e => {
- e.stopPropagation();
- this.props.focus({ id: user_id }).then(() => {
- this.props.getUserInfo({
- id: user_id
- });
- });
- }}
- >
- {intl.get("bilingually.follow", { ext: "" })}
- </div>
- )}
-
- {/* 发私信按钮,暂时隐藏 */}
- <div
- className={`privateMessageBtn ${
- this.props.locale === "en-US" ? "enUs" : ""
- }`}
- onClick={() => this.props.sendMessage({ id: user_id })}
- >
- {intl.get("bilingually.im.send_msg")}
- </div>
- </Row>
- )}
- </div>
- );
- }
- }
-
- export default AvatarHoverCard;
|