修复bug

Mr Ke

2020-04-26 1386b9fff21abc8f611c2a6c199581ea67efe315

修复bug

 package.json

@@ -15,7 +15,8 @@
    "react-dom": "^16.12.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.4.0",
    "sass-loader": "^8.0.2"
    "sass-loader": "^8.0.2",
    "wangeditor": "^3.1.1"
  },
  "homepage": ".",
  "scripts": {

 public/Group 182.png

Binary files differ

 public/logo192.png

Binary files differ

 public/logo512.png

Binary files differ

 public/manifest.json

@@ -1,13 +1,7 @@
{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.favicon.png",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    }
  ],
  "icons": [],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",

 public/办公@1x.png

Binary files differ

 public/办公@svg.svg

File was deleted

 public/文档管理@1x.png

Binary files differ

 public/文档管理@svg.svg

File was deleted

 public/系统管理@1x.png

Binary files differ

 public/系统管理@svg.svg

File was deleted

 public/绩效管理@1x.png

Binary files differ

 public/绩效管理@svg.svg

File was deleted

 public/背景@svg.svg

File was deleted

 public/首页@1x.png

Binary files differ

 public/首页@svg.svg

File was deleted

 src/components/common/HotListTableView/index.jsx

@@ -76,7 +76,8 @@
        }
      },
      {
        title: '爬虫时间',
        // title: '爬虫时间',
        title: '发布时间',
        key: 'create_time',
        dataIndex: 'create_time',


 src/components/common/HotListTableView/index.scss

@@ -21,5 +21,8 @@
    & .ant-tabs-bar {
      margin-bottom: 0 !important;
    }
    & a:visited {
      color: #559de6;
    }
  }
}

 src/components/page/AnnouncementPage/index.jsx

@@ -33,19 +33,26 @@

  componentDidMount() { }

  cancle = (id) => {
  link = (id) => {
    console.log(id)
    //   // this.props.history.push("/document/create?id=" + id);
    this.props.history.push({ pathname: "/document/create/" + id });
    this.props.history.push({ pathname: "/document/detail/" + id });
  }

  emoveTAG = (str) => {
    return str.replace(/<[^>]+>/g, "");
  }

  renderColumns = () => {
    return [
      { title: '标题', dataIndex: 'documentTitle' },
      { title: '通知内容', dataIndex: 'documentContent' },
      {
        title: '通知内容', dataIndex: 'documentContent', ellipsis: true, width: '40%', render: (cur, item) => {
          return this.emoveTAG(cur)
        }
      },
      { title: '接受情况', dataIndex: 'groupType', render: (cur, item) => <span>{item.readNumber || 0}/{item.noticeNumber || 0}</span> },
      { title: '通知时间', dataIndex: 'createTime', render: (cur, item) => cur !== "" && cur != null ? moment(cur).format("YYYY-MM-DD HH:mm") : "" },
      { title: '操作', render: (text, record) => <a onClick={() => this.cancle(record.id)}>查看</a> }
      { title: '操作', render: (text, record) => <a onClick={() => this.link(record.id)}>查看</a> }
    ];
  }


 src/components/page/DocumentDetailPage/index.jsx

New file
@@ -0,0 +1,248 @@
/* eslint-disable */
/**liuwh
 * 4/6/2020, 3:53:15 PM
 * doc comment for the file goes here
 */

/** Happy Coding */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Card, Row, Col, Select, Button, Input, Upload, Icon, Spin, message } from 'antd';
import E from 'wangeditor';
import './index.scss';
const Option = Select.Option;
const { TextArea } = Input;

import fetch from '../../../api/request';
import { BASE_URL } from '../../../api/httpurl'

const param = [{ value: 'DT00002', name: '通知公告' }, { value: 'DT00001', name: '规章制度' }]
export default class DocumentDetailPage extends Component {
  constructor(props) {
    super(props);
    this.config = {
    };
    this.state = {
      loading: false,//页面加载loading
      iconLoading: false,//提交按钮loading
      saveData: {},//表单提交数据
      fileList: [],//附件列表
      disabled: false,
      editorContent: null//富文本编辑内容
    };
  }

  componentWillMount() { }

  componentDidMount() {
    this.loadData()
  }

  loadData = () => {
    let _this = this;
    const { id } = _this.props.match.params;
    _this.setState({
      loading: true,
      disabled: true
    })
    fetch({
      url: 'api/document/findDetail',
      params: {
        id: id || 'new'
      }
    }).then(res => {
      console.log(res)
      _this.setState({
        saveData: {
          ...res,
          documentType: res.documentType || 'DT00002'
        },
        loading: false,
        fileList: res.attachmentList && res.attachmentList.map((a) => ({ ...a, key: a.id, uid: a.id, name: a.fileName + '.' + a.suffix, })) || []
      });
    });
  }


  saveInputChange = ({ target: { value, name } }) => {
    this.setState(({ saveData }) => ({
      saveData: {
        ...saveData,
        [name]: value
      }
    }))
  }

  submit = () => {
    const { saveData, editorContent } = this.state;
    console.log(saveData)
    if (!saveData.documentTitle) {
      return message.warning(this.switchWordByType(saveData.documentType).title + '标题不能为空');
    }
    if (!editorContent) {
      return message.warning('通知内容不能为空');
    }
    let _this = this;
    _this.setState({
      iconLoading: true
    })
    fetch({
      url: 'api/document/saveOrUpdateNotice',
      method: 'POST',
      data: {
        ...saveData,
        documentContent: editorContent
      }
    }).then(res => {
      console.log(res)
      _this.setState({
        iconLoading: false,
      });
      message.success("提交成功！");
      this.props.history.push("/index/rules")
    });

  }

  cancle = () => {
    const { id } = this.props.match.params;
    if (id) {
      this.props.history.goBack()
    } else {
      this.props.history.push("/index/workbench");
    }
  }

  // wen
  switchWordByType = (type) => {
    switch (type) {
      case 'DT00002':
        return {
          title: '通知',
          associateId: 1001
        };
      case 'DT00001':
        return {
          title: '规章制度',
          associateId: 1002
        }
    }
  }

  render() {
    const { saveData, fileList, loading, disabled } = this.state;
    const props = {
      action: BASE_URL + `api/attachment/materials?associateId=${saveData.documentType == 'DT00002' ? 1001 : 1002}&entityId=` + saveData.id,
      header: {
        Authorization: window.localStorage.getItem('token')
      },
      onChange: ({ file, fileList }) => {
        fileList = fileList.slice(-2);
        fileList = fileList.map(file => {
          if (file.response) {
            // Component will show file.url as link
            file.url = file.response.data[0].url;
          }
          return file;
        });
        this.setState({ fileList });
      },
      fileList: fileList,
      onPreview: (file) => {
        window.open(file.url);
      },
      showUploadList: { showPreviewIcon: true, showDownloadIcon: true, showRemoveIcon: false }
    };

    return (
      <div className="document-detail-page-main">
        <Spin spinning={loading}>

          <Card style={{ border: 20, margin: 20, padding: 20 }}>
            <Row gutter={16}>
              <Col className="gutter-row marginTop flex-box-row" >
                <div className="document-detail-page-main-label">
                  文档类型：
                </div>
                <div className="document-detail-page-main-value">
                  {
                    saveData.documentType ? param.find(({ value }) => value == saveData.documentType).name : '无'
                  }
                </div>
              </Col>
            </Row>

            <Row gutter={16} className="marginTop">
              <Col className="gutter-row marginTop flex-box-row">
                <div className="document-detail-page-main-label">
                  {saveData.documentType && this.switchWordByType(saveData.documentType).title}标题：
                </div>
                <div className="document-detail-page-main-value">
                  {saveData.documentTitle || '无'}
                </div>
              </Col>
            </Row>

            <Row gutter={16} className="marginTop">
              <Col className="gutter-row marginTop flex-box-row flex-start">
                <div className="document-detail-page-main-label">
                  通知内容：
                </div>
                <div className="flex-1">
                  {
                    saveData.documentContent ? <div dangerouslySetInnerHTML={{
                      __html: saveData.documentContent
                    }} style={{ width: '70%' }} /> : <div className="document-detail-page-main-value">
                        无
                  </div>
                  }
                </div>

              </Col>
            </Row>

            {/* 当有富文本内容的时候 -- 显示 */}
            {/* {
              saveData.documentContent &&
              <div dangerouslySetInnerHTML={{
                __html: saveData.documentContent
              }} style={{ width: '70%' }} className="marginTB" />
            } */}

            <Row gutter={16} className="marginTop">
              <Col className="gutter-row marginTop flex-box-row flex-start">
                <div className="document-detail-page-main-label">
                  附件：
                </div>
                {
                  saveData.attachmentList && saveData.attachmentList.length > 0 ?
                    <div className="flex-1">
                      <Upload {...props} >
                        <Button disabled={disabled} style={{ display: disabled ? 'none' : 'inline-block' }}>
                          <Icon type="upload" />上传文件</Button>
                      </Upload>
                      <Upload {...props} >
                        <Button disabled={disabled} style={{ display: disabled ? 'none' : 'inline-block' }}>
                          <Icon type="upload" />上传文件</Button>
                      </Upload>
                      <Upload {...props} >
                        <Button disabled={disabled} style={{ display: disabled ? 'none' : 'inline-block' }}>
                          <Icon type="upload" />上传文件</Button>
                      </Upload>
                      <Upload {...props} >
                        <Button disabled={disabled} style={{ display: disabled ? 'none' : 'inline-block' }}>
                          <Icon type="upload" />上传文件</Button>
                      </Upload>
                    </div> : '未上传附件'
                }
              </Col>
            </Row>

            <Row type="flex" gutter={20} style={{ marginTop: '20px' }}>
              <Col className="gutter-row" ><Button onClick={this.cancle}>返回</Button></Col>
            </Row>
          </Card>
        </Spin>
      </div>
    )
  }
}

 src/components/page/DocumentDetailPage/index.scss

New file
@@ -0,0 +1,51 @@
/* eslint-disable */
/**liuwh
 * 4/6/2020, 3:53:15 PM
 * doc comment for the file goes here
 */

/** Happy Coding */
@import '../../../style/reset.scss';

.document-detail-page {
  &-main {
    & p{
      margin: 1px 0;
    }
    &-label {
      font-size: 15px;
      font-weight: 550;
      // min-width: calc(7.5em);
    }
    & .ant-upload-list-item {
      margin-top: 0;
      margin-bottom: 4px;
    }
    & .flex-box-row {
      display: flex;
      align-items: center;
    }
    & .flex-start {
      align-items: flex-start;
    }
    & .ant-upload.ant-upload-select {
      display: flex;
    }
    & .marginTop {
      margin-top: 8px;
    }
    & .marginTB {
      margin: 12px 0;
    }
    & .w-e-text {
      overflow-y: auto;
    }
    & .w-e-text-container {
      min-height: 300px !important;
      height: auto !important;
    }
    & .ant-upload-list-item-name {
      cursor: pointer;
    }
  }
}

 src/components/page/DocumentEditPage/index.jsx

@@ -6,8 +6,8 @@

/** Happy Coding */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
// import { Link } from 'react-router-dom';
import { Card, Row, Col, Select, Button, Input, Upload, Icon, Spin, message } from 'antd';
import E from 'wangeditor';
import './index.scss';
const Option = Select.Option;
const { TextArea } = Input;
@@ -22,20 +22,36 @@
    this.config = {
    };
    this.state = {
      loading: false,
      iconLoading: false,
      savedate: {},
      fileList: [],
      loading: false,//页面加载loading
      iconLoading: false,//提交按钮loading
      saveData: {},//表单提交数据
      fileList: [],//附件列表
      disabled: false,
      editorContent: null//富文本编辑内容
    };
  }

  componentWillMount() { }

  componentDidMount() {
    this.initEditor();
    this.loadData()
  }

  initEditor = () => {
    const elem = this.refs.editorElem
    const editor = new E(elem);
    // 使用 onchange 函数监听内容的变化，并实时更新到 state 中
    editor.customConfig.onchange = html => {
      this.setState({
        editorContent: html,
      })
    }
    editor.customConfig.uploadImgShowBase64 = true;   // 使用 base64 保存图片
    editor.customConfig.showLinkImg = true;  // 隐藏“网络图片”tab
    editor.create();

  }
  loadData = () => {
    const { id } = this.props.match.params;
    console.log(this.props)
@@ -44,7 +60,7 @@
    _this.setState({
      loading: true,
      disabled: id ? true : false
    }) 
    })
    fetch({
      url: 'api/document/findDetail',
      params: {
@@ -53,39 +69,34 @@
    }).then(res => {
      console.log(res)
      _this.setState({
        savedate: {
        saveData: {
          ...res,
          documentType: res.documentType || 'DT00002'
        },
        loading: false,
        fileList: res.attachmentList && res.attachmentList.map((a) => ({ ...a, key: a.id, uid: a.id, name: a.fileName + '.' + a.suffix})) || []
        fileList: res.attachmentList && res.attachmentList.map((a) => ({ ...a, key: a.id, uid: a.id, name: a.fileName + '.' + a.suffix, })) || []
      });
    });
  }


  saveInputChange = ({ target: { value, name } }) => {
    this.setState(({ savedate }) => ({
      savedate: {
        ...savedate,
    this.setState(({ saveData }) => ({
      saveData: {
        ...saveData,
        [name]: value
      }
    }))
  }

  submit = () => {
    const { savedate } = this.state;
    console.log(savedate)
    if (savedate.documentType == 'DT00001') {
      if (!savedate.documentTitle) {
        return message.warning('规章制度标题不能为空')
      }
    } else {
      if (!savedate.documentTitle) {
        return message.warning('通知标题不能为空')
      } else if (!savedate.documentContent) {
        return message.warning('通知内容不能为空')
      }
    const { saveData, editorContent } = this.state;
    console.log(saveData)
    if (!saveData.documentTitle) {
      return message.warning(this.switchWordByType(saveData.documentType).title + '标题不能为空');
    }
    if (!editorContent) {
      return message.warning('通知内容不能为空');
    }
    let _this = this;
    _this.setState({
@@ -94,7 +105,10 @@
    fetch({
      url: 'api/document/saveOrUpdateNotice',
      method: 'POST',
      data: savedate
      data: {
        ...saveData,
        documentContent: editorContent
      }
    }).then(res => {
      console.log(res)
      _this.setState({
@@ -102,50 +116,58 @@
      });
      message.success("提交成功！");
      this.props.history.push("/index/rules")
      // this.props.history.goBack()
    });
    // Fetch.savePatrolCom(savedate)
    //   .then(res => {
    //     if (res.code === 0) {
    //       message.success("提交成功！");
    //       this.props.history.push("/companyUpd")
    //     } else {
    //       message.error('保存失败，请联系管理员', 2)
    //     }
    //   });

  }

  cancle = () => {
    // this.props.history.push("/index/workbench");
    const { id } = this.props.match.params;
    if (id) {
      this.props.history.goBack()
    } else {
      this.props.history.push("/index/workbench");
    }
    // console.log(this.props)
  }

  // wen
  switchWordByType = (type) => {
    switch (type) {
      case 'DT00002':
        return {
          title: '通知',
          associateId: 1001
        };
      case 'DT00001':
        return {
          title: '规章制度',
          associateId: 1002
        }
    }
  }

  render() {
    const { savedate, fileList, loading, disabled } = this.state;
    const { saveData, fileList, loading, disabled } = this.state;
    const props = {
      action: BASE_URL + `api/attachment/materials?associateId=${savedate.documentType == 'DT00002' ? 1001 : 1002}&entityId=` + savedate.id,
      action: BASE_URL + `api/attachment/materials?associateId=${saveData.documentType == 'DT00002' ? 1001 : 1002}&entityId=` + saveData.id,
      header: {
        Authorization: window.localStorage.getItem('token')
      },
      onChange: ({ file, fileList }) => {
        if (file.status !== 'uploading') {
          console.log(file);
          console.log(fileList);

        }
        fileList = fileList.slice(-2);
        fileList = fileList.map(file => {
          if (file.response) {
            // Component will show file.url as link
            file.url = file.response.data[0].url;
          }
          return file;
        });
        this.setState({ fileList });
      },
      fileList: fileList,
      onPreview: (file) => {
        console.log(file)
        window.open(file.url);
      },
      showUploadList: { showPreviewIcon: true, showDownloadIcon: true, showRemoveIcon: disabled ? false : true }
      showUploadList: { showPreviewIcon: true, showDownloadIcon: false, showRemoveIcon: disabled ? false : true }
      // onDownload: (file) => {
      //   console.log(file)
      //   Fetch.attachmentDownload(file.uid)
@@ -168,19 +190,20 @@
      //   });
      // }
    };

    return (
      <div className="document-edit-page-main">
        <Spin spinning={loading}>

          <Card style={{ border: 20, margin: 20, padding: 20 }}>
            <Row gutter={16}>
              <Col className="gutter-row" >
              <Col className="gutter-row marginTop" >
                文档类型：
              </Col>
            </Row>
            <Row gutter={16}>
              <Col className="gutter-row" style={{ margin: '12px 0' }} >
                <Select disabled={disabled} style={{ width: "300px" }} onChange={(value) => this.saveInputChange({ target: { name: 'documentType', value } })} value={savedate.documentType}>
              <Col className="gutter-row marginTB">
                <Select placeholder="请选择" disabled={disabled} style={{ width: "300px" }} onChange={(value) => this.saveInputChange({ target: { name: 'documentType', value } })} value={saveData.documentType}>
                  {
                    param.map((data, key) => (
                      <Option key={key} value={data.value}>{data.name}</Option>
@@ -190,53 +213,67 @@
              </Col>
            </Row>

            {
              savedate.documentType == 'DT00002' &&
              <Row gutter={16} style={{ marginTop: '12px' }}>
                <Col className="gutter-row" style={{ marginTop: '12px' }}>
                  通知标题：
                                </Col>
              </Row>
            }
            {
              savedate.documentType == 'DT00001' &&
              <Row gutter={16} style={{ marginTop: '12px' }}>
                <Col className="gutter-row" style={{ marginTop: '12px' }}>
                  规章制度标题：
                                </Col>
              </Row>
            }
            <Row gutter={16} className="marginTop">
              <Col className="gutter-row marginTop">
                {saveData.documentType && this.switchWordByType(saveData.documentType).title}标题：
                </Col>
            </Row>

            <Row gutter={16}>
              <Col className="gutter-row" style={{ margin: '12px 0' }} >
                <Input disabled={disabled} style={{ width: '300px' }} name='documentTitle' onChange={this.saveInputChange} value={savedate.documentTitle || ""} />
              <Col className="gutter-row marginTB">
                <Input placeholder="请输入" disabled={disabled} style={{ width: '300px' }} name='documentTitle' onChange={this.saveInputChange} value={saveData.documentTitle || ""} />
              </Col>
            </Row>

            {
              savedate.documentType == 'DT00002' &&
            <Row gutter={16}>
              <Col className="gutter-row marginTop">
                通知内容：
                </Col>
            </Row>

            <div ref="editorElem" className="marginTB">
            </div>

            <Row gutter={16}>
              <Col className="gutter-row marginTop">
                附件：
                </Col>
            </Row>

            <Row gutter={16} >
              <Col className="gutter-row marginTB" >
                <Upload {...props} >
                  <Button disabled={disabled} style={{ display: disabled ? 'none' : 'inline-block' }}>
                    <Icon type="upload" />上传文件</Button>
                </Upload>
              </Col>
            </Row>

            {/* {
              saveData.documentType == 'DT00002' &&
              <Row gutter={16}>
                <Col className="gutter-row" >
                <Col className="gutter-row marginTop">
                  通知内容：
                                </Col>
              </Row>
            }
            {
              savedate.documentType == 'DT00002' &&
              <Row gutter={16}>
                <Col className="gutter-row" style={{ margin: '12px 0' }} >
                  <TextArea disabled={disabled} style={{ width: '500px' }} name='documentContent' onChange={this.saveInputChange} value={savedate.documentContent || ""} />
                </Col>
              </Row>
            }
            {
              savedate.documentType == 'DT00001' &&
              saveData.documentType == 'DT00002' &&
              <Row gutter={16}>
                <Col className="gutter-row" style={{ margin: '12px 0' }} >
                  <TextArea disabled={disabled} style={{ width: '500px' }} name='documentContent' onChange={this.saveInputChange} value={saveData.documentContent || ""} />
                </Col>
              </Row>
            }
            {
              saveData.documentType == 'DT00001' &&
              <Row gutter={16} style={{ marginTop: '12px' }}>
                <Col className="gutter-row" style={{ margin: '12px 0' }} >
                  规章制度源文件：
                </Col>
              </Row>
            }
            {savedate.documentType == 'DT00001' &&
            {saveData.documentType == 'DT00001' &&
              <Row gutter={16} >
                <Col className="gutter-row" >
                  <Upload {...props} >
@@ -247,7 +284,7 @@
              </Row>
            }
            {
              savedate.documentType == 'DT00001' &&
              saveData.documentType == 'DT00001' &&
              <Row gutter={16} style={{ marginTop: '12px' }}>
                <Col className="gutter-row" >
                  通知范围：
@@ -255,20 +292,20 @@
              </Row>
            }
            {
              savedate.documentType == 'DT00002' &&
              saveData.documentType == 'DT00002' &&
              <Row gutter={16} style={{ marginTop: '12px' }}>
                <Col className="gutter-row" style={{ margin: '12px 0' }} >
                  通知范围：
                </Col>
              </Row>
            }
            {savedate.documentType == 'DT00002' &&
            {saveData.documentType == 'DT00002' &&
              <Row gutter={16} >
                <Col className="gutter-row" >
                  目前仅支持全员通知
                </Col>
              </Row>
            }
            } */}
            <Row type="flex" gutter={20} style={{ marginTop: '12px' }}>
              <Col className="gutter-row" ><Button onClick={this.cancle}>返回</Button></Col>
              <Col className="gutter-row" ><Button disabled={disabled} type="primary" loading={this.state.iconLoading} onClick={this.submit}>发布</Button></Col>

 src/components/page/DocumentEditPage/index.scss

@@ -7,9 +7,27 @@
/** Happy Coding */
.document-edit-page {
  &-main {
    & .ant-upload.ant-upload-select{
    & .ant-upload.ant-upload-select {
      display: flex;
    }

    & .marginTop {
      margin-top: 8px;
    }
    & .marginTB {
      margin: 12px 0;
    }
    & .w-e-text {
      overflow-y: auto;
    }
    & .w-e-text-container {
      min-height: 300px !important;
      height: auto !important;
    }
    & .ant-upload-list-item-name {
      cursor: pointer;
    }
    & .w-e-text p, .w-e-text h1, .w-e-text h2, .w-e-text h3, .w-e-text h4, .w-e-text h5, .w-e-text table, .w-e-text pre{
      margin: 1px 0;
    }
  }
}

 src/components/page/index/rulesList/index.jsx

@@ -6,13 +6,13 @@

/** 工作制度 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Button } from 'antd';
import { Button, Modal, Tabs, List, Avatar } from 'antd';
import TableView from '../../../common/TableView';
import SearchFormView from '../../../common/SearchFormView';
import moment from 'moment';

import './index.scss';

const { TabPane } = Tabs;

export default class RulesList extends Component {
  constructor(props) {
@@ -26,6 +26,7 @@
        title: '',
        page: 1,
        size: 10,
        visible: false//modal的可视化状态
      },
    };
  }
@@ -34,19 +35,26 @@

  componentDidMount() { }

  cancle = (id) => {
  link = (id) => {
    console.log(id)
  //   // this.props.history.push("/document/create?id=" + id);
  this.props.history.push({ pathname: "/document/create/"+id });
    this.props.history.push({ pathname: "/document/detail/" + id });
  }

  emoveTAG = (str) => {
    return str.replace(/<[^>]+>/g, "");
  }

  renderColumns = () => {
    return [
      { title: '标题', dataIndex: 'documentTitle' },
      { title: '通知内容', dataIndex: 'documentContent' },
      { title: '接受情况', dataIndex: 'groupType', render: (cur, item) => <span>{item.readNumber || 0}/{item.noticeNumber || 0}</span> },
      {
        title: '通知内容', dataIndex: 'documentContent', width: '40%', ellipsis: true, render: (cur, item) => {
          return cur ? this.emoveTAG(cur) : '无'
        }
      },
      { title: '接受情况', dataIndex: 'groupType', render: (cur, item) => <a onClick={() => { this.setState({ visible: true }) }}> <span>{item.readNumber || 0}/{item.noticeNumber || 0}</span></a> },
      { title: '发布时间', dataIndex: 'createTime', render: (cur, item) => cur !== "" && cur != null ? moment(cur).format("YYYY-MM-DD HH:mm") : "" },
      { title: '操作', render: (text, record) => <a onClick={() => this.cancle(record.id)}>查看</a> }
      { title: '操作', render: (text, record) => <a onClick={() => this.link(record.id)}>查看</a> }
    ];
  }

@@ -58,7 +66,7 @@
  }

  render() {
    const { formData } = this.state;
    const { formData, visible } = this.state;

    let tableParams = {
      url: `api/document/getNotice`,
@@ -72,6 +80,31 @@
    }
    return (
      <div className="rules-list-main">
        <Modal
          visible={visible}
          onCancel={() => this.setState({ visible: false })}
          footer={null}
          title="接收情况"
        >
          <Tabs defaultActiveKey="1" >
            <TabPane tab="未读" key="1">
              <div className="modal-list">
                {
                  [1,2,3].map((a)=>(
                    <div className="flex-box-row align-center modal-list-item" >
                      <Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
                      <span className="modal-label">柯礼钦</span>
                      <span className="modal-time">2010-10-10 24:00</span>
                    </div>
                  ))
                }
              </div>
            </TabPane>
            <TabPane tab="已读" key="2">
            </TabPane>
          </Tabs>

        </Modal>
        <SearchFormView
          formData={formData}
          setFormData={this.setFormData}

 src/components/page/index/rulesList/index.scss

@@ -12,3 +12,13 @@
    padding: 20px;
  }
}
.modal-list .modal-list-item:last-child {
  border-bottom: none;
}
.modal-list-item {
  border-bottom: 1px solid #ccc;
  padding: 5px;
  & > span {
    margin-right: 40px;
  }
}

 src/index.css

@@ -27,3 +27,7 @@
  scrollbar-width: none;
}

.ant-layout-content {
  overflow: auto;
}


 src/index.js

@@ -1,3 +1,4 @@
/* eslint-disable */
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
@@ -19,16 +20,13 @@
// 引进页面（pages）
import Index from './pages/Index';
import Login from './pages/login/login';
import JurisdictionPersonMgt from './pages/collect/jurisdictionPersonMgt'; //信息采集--辖区人口管理
import Workbench from './pages/index/workbench'; //首页--工作台
import System from './pages/index/System'; //首页--工作制度
import Announcement from './pages/index/Announcement'; //全部通知
import JurisdictionPersonMgt from './pages/collect/jurisdictionPersonMgt';//信息采集--辖区人口管理
import Workbench from './pages/index/workbench';//首页--工作台
import System from './pages/index/System';//首页--工作制度
import Announcement from './pages/index/Announcement';//全部通知



import DocumentEdit from './pages/document/DocumentEdit'; //新建文档


import DocumentEdit from './pages/document/DocumentEdit';//新建文档
import DocumentDetail from './pages/document/DocumentDetail';//文档详情

const { Content } = Layout;
const history = createHashHistory();
@@ -50,6 +48,8 @@
            <Switch>
              {/* 新建文档 */}
              <Route path="/document/create/:id?" component={DocumentEdit} />
              {/* 文档、通知详情 */}
              <Route path="/document/detail/:id" component={DocumentDetail} />

              {/* 全部通知 */}
              <Route path="/index/workbench/announcement" component={Announcement} />
@@ -58,7 +58,6 @@

              {/* 首页 */}
              <Route path="/index" component={Workbench} />


              <Route path="/login" component={Login} />
              <Route path="/" component={Workbench} />

 src/pages/document/DocumentDetail.jsx

New file
@@ -0,0 +1,42 @@
/* eslint-disable */
/**liuwh
 * 4/6/2020, 3:51:13 PM
 * doc comment for the file goes here
 */

/** Happy Coding */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
// import { Link } from 'react-router-dom';
// import { Icon } from 'antd';
import BreadcrumbView from '../../components/common/BreadcrumbView';
import DocumentDetailPage from '../../components/page/DocumentDetailPage';

export default class DocumentDetail extends Component {
  constructor(props) {
    super(props);
    this.config = {
    };
    this.state = {
    };
  }

  componentWillMount() { }

  componentDidMount() {
    console.log()
  }

  componentDidShow() { }

  render() {
    return (
      <div className="document-edit-main h-100 flex-box-column">
        <BreadcrumbView data={[{ name: '查看文档' }]} />
        <div className="flex-1">
          <DocumentDetailPage {...this.props} />
        </div>
      </div>
    )
  }
}


 src/pages/document/DocumentEdit.jsx

@@ -24,15 +24,17 @@

  componentDidMount() {
    console.log()
   }
  }

  componentDidShow() { }

  render() {
    return (
      <div className="document-edit-main">
      <div className="document-edit-main h-100 flex-box-column">
        <BreadcrumbView data={[{ name: '新建文档' }]} />
        <DocumentEditPage {...this.props}/>
        <div className="flex-1">
          <DocumentEditPage {...this.props} />
        </div>
      </div>
    )
  }

 src/style/reset.scss

@@ -40,10 +40,16 @@
  flex-direction: column;
}

// 弹性盒 -- 纵向
.flex-box-column {
  display: flex;
  flex-direction: column;
  height: 100%;
}

// 弹性盒 -- 纵向
.flex-box-row {
  display: flex;
}

.flex-1 {
@@ -51,6 +57,17 @@
  overflow-y: auto;
}

a:visited {
  color: #559DE6; /*已访问的链接颜色*/
}
.align-center{
  align-items: center;
}

.space-between {
  justify-content: space-between;
}

.ant-modal-body {
  padding: 5px 8px 15px 8px;
}
.ant-tabs-bar {
  margin-bottom: 5px;
}