forgeplus-react/src/forge/Activity/ActivityItem.js

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import './activity.css';
import { getImageUrl } from 'educoder';
import { truncateCommitId } from "../common/util";


class ActivityItem extends Component {
  render() {
    const { projectsId ,owner } = this.props.match.params;
    const { item } = this.props;
    return (
      <div className="activity_item">
        <div className="flex1">
          {/* 如果是版本发布 */}
          {item.trend_type === "VersionRelease" ?
          <p className="itemLine">
            <Link to={`/${owner}/${projectsId}/releases`} className="font-16">{item.name}</Link>
            <span className="activity_type">{item.trend_type}</span>
          </p >
          :
          // 如果是任务
          item.trend_type === "Issue" ?
            <p className="itemLine">
              <Link to={`/${owner}/${projectsId}/issues/${item.trend_id}`} className="font-16">{item.name}</Link>
              <span className="activity_type">{item.trend_type}</span>
            </p >
            :
          // 如果是commit--CommitLog
          item.trend_type === "CommitLog" ?
          <p className="itemLine">
            <Link to={`/${owner}/${projectsId}/commits/${item.commit_log && truncateCommitId(item.commit_log.commit_id)}`} className="font-16">{item.name}</Link>
            <span className="activity_type">{item.trend_type}</span>
          </p >
          :
            // 如果是合并请求
            <p className="itemLine">
              <Link to={`/${item.project && item.project.owner&& item.project.owner.login}/${item.project && item.project.identifier}/pulls/${item.trend_id}`} className="font-16">{item.name}</Link>
              <span className="activity_type">{item.trend_type}</span>
            </p >
          }
          <p className="itemLine mt10">
            {
              item && item.user_login ? 
              <Link to={`/${item.user_login}`} className="show-user-link">
                <img alt="" src={getImageUrl(`/${item.user_avatar}`)} className="createImage" />
                <span className="mr20">{item.user_name}</span>
              </Link>
              :
              <span className="show-user-link">
                <img alt="" src={getImageUrl(`/${item.user_avatar}`)} className="createImage" />
                <span className="mr20 color-grey-6">{item.user_name}</span>
              </span>
            }
            {item.created_at && <span className="color-grey-9">创建于<span className="ml2 color-grey-6">{item.created_at}</span></span>}
          </p >
        </div>
      </div>
    )
  }
}
export default ActivityItem;