import React, { Component } from 'react';
import './index.less';
import Assets from '@src/components/Assets';
import More from '../More';
import { formatDate } from '../../../../src/services/Tools';
import GIcon from '../Icon';

export default class Note extends Component {
  render() {
    const { data = { file: true }, teacher, theme = 'default', reply, actionList, onAction } = this.props;
    const { info } = this.props.user;
    return (
      <div className={`note-detail ${theme}`}>
        <Assets className="note-avatar" name="sun_blue" src={data.userId ? info.avatar : teacher.avatar} />
        {onAction && actionList && <More menu={actionList} onClick={onAction} />}
        {onAction && reply && <GIcon className="reply" onClick={() => onAction('reply')} />}
        <div className="t-2 t-s-12 m-b-1">
          {data.userId ? info.nickname : teacher.realname} <span className="t-3">{formatDate(data.createTime, 'YYYY-MM-DD HH:mm')}</span>
        </div>
        <div className="t-1 t-s-12 m-b-1">
          {data.reply && <div className="reply">{data.reply}</div>}
          {data.content}
        </div>
        <a hidden={!data.file} className="link t-s-12">
          {data.name}
        </a>
      </div>
    );
  }
}