绩效考核

Mr Ke

2020-05-29 227089fcb8f0facbc0d4456f876a75a747ee6af3

 src/components/oa/merits/meritsDetail/index.jsx

@@ -7,11 +7,14 @@
/** 绩效详情 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import TableView from '../../../common/TableView';
import { Row, Col, Button, InputNumber, message } from 'antd';
import { Row, Col, Button, InputNumber, message, DatePicker } from 'antd';
import { createHashHistory } from 'history';
import './index.scss';
const history = createHashHistory();

import fetch from '../../../../api/request';
import moment from 'moment';
const { MonthPicker } = DatePicker;


export default class MeritsDetail extends Component {
@@ -22,13 +25,41 @@
    this.state = {
      formData: {
        __key: Date.now(),
        ...this.props.match.params
        // userId: this.props.match.params.userId || loginUser.userId,
        meritsMonth: this.props.match.params.meritsMonth || moment().month(moment().month() - 1).format('YYYY-MM')
      },

      title: null,
      boolean: this.props.match.params.boolean || false
    };
  }

  componentDidMount() { }
  componentDidMount() {
    var loginUser = window.localStorage.getItem('loginUser') || '{}';
    loginUser = JSON.parse(loginUser);
    this.setState({
      formData: {
        ...this.state.formData,
        userId: this.props.match.params.userId || loginUser.userId
      }
    }, () => {
      this.findTitle();
    })
  }

  findTitle = () => {
    fetch({
      url: `api/merits/assess/findTitle`,
      params: {
        userId: this.state.formData.userId
      }
    }).then(res => {
      if (res) {
        this.setState({
          title: res
        })
      }
    })
  }

  setFormData = data => {
    console.log('form', data);
@@ -40,15 +71,15 @@
  // 保存操作
  onSave = (item) => {
    console.log('item', item);
    let { id , meritsGrade} = item;
    let { id, meritsGrade } = item;
    fetch({
      url: `api/merits/assess/modifyGrade`,
      params: {
        id,
        meritsGrade
      }
    }).then( res=> {
      if(res) {
    }).then(res => {
      if (res) {
        message.success('保存成功');
        this.setState({
          formData: {
@@ -58,11 +89,10 @@
        })
      }
    })

  }

  renderColumns = () => {
    return [
    var cols = [
      { title: '编号', dataIndex: 'id', width: '3%' },
      { title: '评分项目', dataIndex: 'scoreItems', width: '6%' },
      { title: '评分目标', dataIndex: 'scoreTarget', width: '10%' },
@@ -104,41 +134,84 @@
            }} />
        }
      },
      {

    ];
    if (this.props.match.params.boolean) {
      return cols.concat({
        title: '操作', dataIndex: 'operation', width: '10%', render: (cur, item) => {
          return <a onClick={() => { this.onSave(item) }}>保存</a>
        }
      }

    ];
      })
    } else {
      return cols
    }
  }

  onBack = () => {
    history.goBack();
  }

  monthPickerChange = (m, d) => {
    let { formData } = this.state;
    this.setState({
      formData: {
        ...formData,
        meritsMonth: d
      }
    }, () => {
      this.setState({
        formData: {
          ...this.state.formData,
          __key: Date.now()
        }
      })
    })
  }

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

    let tableParams = {
      url: `api/merits/assess/findMeritsDetail`,
      formData,
      formData: {
        ...formData,
        userId: this.props.match.params.userId || JSON.parse(window.localStorage.getItem('loginUser'))
      },
      key: formData.__key,
      columns: this.renderColumns(),
      extraFromData: {},
      setFormData: this.setFormData,
      showPagination: false
      showPagination: false,
    }

    function disabledDate(current) {
      return current && current >= moment().endOf('day');
    }

    return (
      <div className="merits-detail-main">
        <h2>2020年4月绩效评分表（初级研发工程师）</h2>
        <TableView {...tableParams} ref="table-view" />
        <Row className="margin-top">

        <Row className="margin-bottom" type="flex" justify="center" gutter={20}>
          <Col>
            <Button onClick={this.onBack}>返回</Button>
            <MonthPicker value={formData.meritsMonth ? moment(formData.meritsMonth, 'YYYY-MM') : ''} format={'YYYY-MM'} onChange={this.monthPickerChange} disabledDate={disabledDate} />
          </Col>
          {
            title &&
            <Col>
              <h2>{title}</h2>
            </Col>
          }
        </Row>

        <TableView {...tableParams} ref="table-view" />
        {
          boolean &&
          <Row className="margin-top">
            <Col>
              <Button onClick={this.onBack}>返回</Button>
            </Col>
          </Row>
        }
      </div>
    )
  }