修改

liuwh

2020-04-06 84fa518cc6973c26d2e006b57d3e5570d4625075

 src/components/page/AnnouncementPage/index.jsx

@@ -1,199 +1,90 @@
/* eslint-disable */
/**liuwh
 * 4/6/2020, 12:33:28 PM
/**柯礼钦
 * 4/6/2020, 5:17:40 PM
 * doc comment for the file goes here
 */

/** Happy Coding */
/** 全部通知 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
// import { Link } from 'react-router-dom';
import moment from 'moment'
import { DatePicker, Table, Card, Row, Col, Icon, Form, Input, Button, Select, message } from 'antd';
import TableView from '../../common/TableView';
import SearchFormView from '../../common/SearchFormView';
import moment from 'moment';

import './index.scss';

import fetch from '../../../api/request';
const { MonthPicker, RangePicker } = DatePicker;
const FormItem = Form.Item;

export default class AnnouncementPage extends Component {
  constructor(props) {
    super(props);
    this.config = {
    };
    this.state = {
      loading: true,
      totalElements: 1,
      size: 10,
      page: 1,
      resetKey: Date.now(),
      formdata: {
      formData: {
        __key: Date.now(),
        type: '',
        title: '',
        startTime: '',
        endTime: ''
      }
        page: 1,
        size: 10,
      },
    };
  }




  componentWillMount() { }

  componentDidMount() {
    this.loadData(this.state.formdata, this.state.page, this.state.size);
  componentDidMount() { }

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

  onShowSizeChange = (current, size) => {
    console.log('pageSize', size)
    this.setState({ size, page: 1 });
    this.getData(this.state.formdata, this.state.page, this.state.size);
  };

  handleSubmit = (e) => {
    e.preventDefault();
    this.loadData(this.state.formdata, 1, this.state.size);
  renderColumns = () => {
    return [
      { title: '标题', dataIndex: 'documentTitle' },
      { title: '通知内容', dataIndex: 'documentContent' },
      { 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> }
    ];
  }

  loadData = (formdata, page, size) => {
    console.log('111')
    let _this = this;
    _this.setState({
      loading: true
    })
    fetch({
      url: 'api/document/getNotice',
      params: {
        ...formdata,
        page,
        size
      }
    }).then(res => {
      console.log(res)
      _this.setState({
        tableData: res.content,
        loading: false,
        totalElements: res.totalElements,
        page
      });
  setFormData = data => {
    console.log('form', data);
    this.setState({
      formData: data,
    });
  }

  //查询
  Seaech = () => {
    const { formdata, page, size } = this.state;
    if (formdata.areaId) {
      formdata.areaId = parseInt(formdata.areaId[1]);
    }
    this.loadData(formdata, 1, size)
  }

  //重置
  Reset = () => {
    this.setState({
      resetKey: Date.now(),
      formdata: {},
      page: 1,
      size: 10
    }, this.loadData({}, 1, this.state.size))
  }

  onInputChange = ({ target: { value, name } }) => {
    this.setState(({ formdata }) => ({
      formdata: {
        ...formdata,
        [name]: this.trim(value)
      }
    }))
  }

  onTimeChange = (value, dateString) => {
    this.onChange('startTime', moment(dateString[0]).format('YYYY-MM-DD HH:mm'));
    this.onChange('endTime', moment(dateString[1]).format('YYYY-MM-DD HH:mm'));
  }

  onChange = (field, value) => {
    this.setState(({ formdata }) => ({
      formdata: {
        ...formdata,
        [field]: value
      }
    }))
  }

  trim = (str) => {
    str = str.replace(/^(\s|\u00A0)+/, '');
    for (var i = str.length - 1; i >= 0; i--) {
      if (/\S/.test(str.charAt(i))) {
        str = str.substring(0, i + 1);
        break;
      }
    }
    return str;
  }

  getColumns = () => {
    let obj = this;
    return [
      { title: '通知标题', className: "txt-c", dataIndex: 'documentItle;' },
      { title: '通知内容', className: "txt-c", dataIndex: 'documentContent' },
      // { title: '文档类型', className: "txt-c", dataIndex: 'documentType', render: (text, record) => text == "DT00001" ? "规章制度" : text == "DT00002" ? "通知公告" : text },
      { title: '接受情况', className: "txt-c", dataIndex: 'groupType', render: (text, record) => <span>{readNumber || 0}/{noticeNumber || 0}</span> },
      { title: '通知时间', className: "txt-c", dataIndex: 'createTime', render: (text, record) => text !== "" && text != null ? moment(text).format("YYYY-MM-DD HH:mm") : "" },
      // {
      //   title: '操作', className: "txt-c", key: 'operation', render: (text, record) => {
      //     return <div>
      //       <Link to={{ pathname: "/baseManage/groupDetail/" + record.id + '/Modify', query: { id: record.id } }}>修改</Link>
      //       <span>&nbsp;|&nbsp;</span>
      //       <a href="javascript:void(0);" onClick={() => this.delete(record.id)}>删除</a>
      //     </div>
      //   }
      // }
    ]
  }

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

    let tableParams = {
      url: `api/document/getNotice`,
      formData,
      key: formData.__key,
      columns: this.renderColumns(),
      extraFromData: {
        type: '',
      },
      setFormData: this.setFormData
    }
    return (
      <div className="announcement-page-main">
        <Card style={{ border: 20, margin: 20, padding: 20 }}>
          <Row style={{ margin: '10px' }} key={resetKey}>
            <Col span={1} style={{ display: 'flex', justifyContent: 'center', lineHeight: '28px' }}>标题:</Col>
            <Col className="gutter-row" span={4}>
              <Input placeholder="标题" name='name' onChange={this.onInputChange} />
            </Col>
            <Col span={2} style={{ display: 'flex', justifyContent: 'center', lineHeight: '28px' }}>工作时间:</Col>
            <Col className="gutter-row" span={6}>
              <RangePicker placeholder={['开始时间', '结束时间']} showTime format="YYYY-MM-DD HH:mm" onChange={this.onTimeChange} />
            </Col>
            <Col className="gutter-row" span={2}>
              <Button type="primary" onClick={this.Seaech}>查询</Button>
            </Col>
            <Col className="gutter-row" span={2}>
              <Button onClick={this.Reset}>重置</Button>
            </Col>
          </Row>
          <Row>
            <Table key={this.state.tableKey}
              size="middle"
              className="rowColor"
              dataSource={this.state.tableData}
              loading={{ spinning: this.state.loading }}
              columns={this.getColumns()}
              pagination={{
                size: this.state.size,
                onChange: this.pageChange,
                total: this.state.totalElements,
                showSizeChanger: true,
                onShowSizeChange: this.onShowSizeChange,
                showTotal: (total, range) => `共${total}条记录 `,
                itemRender: this.itemRender,
                showQuickJumper: true,
                defaultCurrent: 1,
                current: this.state.page
              }}
            />
          </Row>
        </Card>
      <div className="rules-list-main">
        <SearchFormView
          formData={formData}
          setFormData={this.setFormData}
          data={[
            { type: 'input', name: '标题', label: '标题', key: 'documentTitle' },
            {
              type: 'rangePicker',
              label: '通知时间',
              name: JSON.stringify(['开始时间', '结束时间']),
              key: JSON.stringify(['startTime', 'endTime']),
              keylistName: 'rangeTimelist',
            },
          ]} />
        <TableView {...tableParams} />
      </div>
    )
  }