import React from 'react';
import { Badge } from 'antd-mobile';
import './index.less';
import Page from '@src/containers/Page';
import Assets from '@src/components/Assets';
import { formatDate } from '@src/services/Tools';
import { My } from '../../../stores/my';

export default class extends Page {
  initData() {
    My.message(this.state.search)
      .then(result => {
        this.setTableData(result.list, result.total);
      });
  }

  readAll() {
    My.readAllMessage()
      .then(() => {
        this.refresh();
      });
  }

  renderView() {
    const { list = [] } = this.state;
    return (
      <div>
        <div className="all" onClick={() => {
          this.readAll();
        }}>
          <Assets name="clean" />
          全部已读
        </div>
        <div className="list">
          {list.map(row => {
            return <div className="item">
              <div className="detail">
                <div className="title">
                  {row.title}
                  <Badge dot />
                </div>
                <div className="desc">{row.description}</div>
                {row.link && <a href={row.link}>查看详情</a>}
              </div>
              <div className="date-time">
                <div className="date">{formatDate(row.createTime, 'YYYY-MM-DD')}</div>
                <div className="time">{formatDate(row.createTime, 'HH:mm:ss')}</div>
              </div>
            </div>;
          })}
        </div>
      </div>
    );
  }
}