forked from huge/frontEnd/hugeOA

Mr Ke
2020-06-24 cb0a06de99bd629c2021e3d9b32fe8eae8c54879
src/components/common/NotifyList/index.jsx
@@ -6,7 +6,7 @@
/** 通知列表 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Alert } from 'antd';
import { Alert, Tooltip } from 'antd';
import fetch from '../../../api/request';
import './index.scss';
@@ -17,7 +17,7 @@
    this.config = {
    };
    this.state = {
      content: ''
      notice: null
    };
  }
@@ -25,30 +25,63 @@
    fetch({
      url: `api/document/getNewNotice`
    }).then(res => {
      console.log('res', res);
      this.setState({
        content: res.documentContent || ''
      })
      if (res) {
        this.setState({
          notice: res
          // documentTitle: res.documentTitle || ''
        })
      }
    })
  }
  componentDidMount() { }
  emoveTAG = (str) => {
    return str.replace(/<[^>]+>/g, "");
  }
  onClick = () => {
    this.props.history.push({ pathname: "/index/workbench/announcement" });
  }
  onMouseOut = () => {
    this.refs.marquee.start();
  }
  onMouseOver = () => {
    this.refs.marquee.stop();
  }
  linkDetail = (id) => {
    this.props.history.push({ pathname: `/document/detail/${id}` });
  }
  renderDom = () => {
    let { content } = this.state;
    let { notice } = this.state;
    return <div className="notify-list-main-dom">
      <span className="notify-list-main-dom-msg">最新通知:{content}</span>
      <span className="notify-list-main-dom-fuc">[查看全部]</span>
      <div className="notify-list-main-dom-msg">最新通知:
        <div className="notify-list-main-dom-msg-title" onClick={() => { notice.id && this.linkDetail(notice.id) }}>
          <marquee onMouseOut={this.onMouseOut} onMouseOver={this.onMouseOver} ref='marquee' style={{ cursor: 'pointer' }}>{notice.documentTitle || ''}</marquee>
        </div>
        {
          notice.documentContent ? <Tooltip placement='topLeft' title={this.emoveTAG(notice.documentContent)}>
            <div className="notify-list-main-dom-msg-content" onClick={() => { notice.id && this.linkDetail(notice.id) }}>{this.emoveTAG(notice.documentContent)}</div>
          </Tooltip> : null
        }
      </div>
      <div className="notify-list-main-dom-fuc" onClick={this.onClick}>[查看全部]</div>
    </div>
  }
  render() {
    let { content } = this.state;
    let { notice } = this.state;
    return (
      <div className="notify-list-main">
        {
          content &&
          notice &&
          <Alert
            // message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
            message={this.renderDom()}