import React from 'react';
import { Button, Modal, Row, Icon } from 'antd';
import styles from './index.less';

const MessageContent = ({
  mode,
  domain,
  readOnly,
  record,
  onOk,
  onCancel,
  dispatch,
  loading,
  ...modalProps
}) => {
  const handleCancel = () => {
    onCancel();
  };
  const modalOpts = {
    ...modalProps,
    onCancel: handleCancel,
    footer: [
      <Button key="back" onClick={handleCancel} type="primary">
        关闭
      </Button>
    ]
  };

  return (
    <Modal {...modalOpts}>
      <Row type="flex" justify="start" className={styles.header}>
        <div className={styles.msgSubject}>
          <div dangerouslySetInnerHTML={{ __html: record.msgSubject }} />
        </div>
      </Row>
      <Row type="flex" justify="start">
        <div className={styles.msgSendTime}>
          <Icon type="clock-circle-o" className={styles.msgClock} />
          <span className={styles.msgTimeContent}>{record.msgSendTime}</span>
        </div>
      </Row>
      <Row type="flex" justify="start">
        <div className={styles.msgContent}>
          <div dangerouslySetInnerHTML={{ __html: record.msgContent }} />
        </div>
      </Row>
    </Modal>
  );
};

export default MessageContent;
