salary-management-front/pc4mobx/hrmSalary/pages/payroll/SalarySendList.js

import React from 'react'
import { inject, observer } from 'mobx-react';
import { Table, Menu, Dropdown, message } from 'antd'
import { WeaTable } from 'ecCom'
import moment from 'moment'


import CustomTable from '../../components/customTable';
import CustomPaginationTable from '../../components/customPaginationTable'

@inject('payrollStore')
@observer
export default class SalarySendList extends React.Component {
    constructor(props) {
        super(props)
        this.searchParams = {salaryYearMonth: this.props.salaryYearMonth}
        this.pageInfo = {current: 1, pageSize: 10}
    }

    componentWillMount() {
        const { payrollStore: {getPayrollList} } = this.props;
        getPayrollList()
    }

    // 发放回调
    handleGrant(record) {
        window.open("/spa/hrmSalary/static/index.html#/main/hrmSalary/payrollGrant?id=" + record.id)
    }

    // 查看详情
    handleShowDetail(record) {
        window.open("/spa/hrmSalary/static/index.html#/main/hrmSalary/payrollDetail?id=" + record.id)
    }

    // 更新模板
    handleUpdateTemplate(record) {
        let templateRecord = {}
        templateRecord.id = record.templateId;
        if(!record.templateId) {
            message.warning("请设置默认模板")
            return
        }
        this.props.onEditTemplate && this.props.onEditTemplate(templateRecord)
    }

   

    // 获取表头数据
    getColumns() {
        const {payrollStore : {salarySendTableStore}} = this.props;
        const{ columns } = salarySendTableStore
        if(!columns) {
            return [];
        }
        
        let result =  columns.filter(item => item.hide == "false")
        result.map(item => {
            if(item.dataIndex == "salaryYearMonth") {
                item.render = (text, record) => {
                    return <span>{moment(parseInt(text)).format("YYYY-MM")}</span>
                }
            } else if(item.dataIndex == "lastSendTime") {
                item.render = (text, record) => {
                    return <span>{moment(parseInt(text)).format("YYYY-MM-DD HH:mm:ss")}</span>
                }
            }
        })
        return result
            .concat([
                {
                    title: "操作",
                    key: "operate",
                    render: (text, record) => {
                        return (
                            <a onClick={() => {this.handleGrant(record)}}>发放</a>
                        )
                    }
                },
                {
                    title : '',
                    key: "moreOperate",
                    dataIndex: "moreOperate",
                    render: (text, record) => {
                        return (
                            <Dropdown overlay={<Menu>
                                <Menu.Item>
                                  <a onClick={() => {
                                      this.handleShowDetail(record)
                                  }}>查看详情</a>
                                </Menu.Item>
                                <Menu.Item>
                                  <a onClick={() => {
                                      this.handleUpdateTemplate(record)
                                  }}>更新模板</a>
                                </Menu.Item>
                              </Menu>}>
                                <i className="icon-coms-more"></i>
                            </Dropdown>
                            
                        );
                    }
                }
            ])
    }

    render() {
        const { payrollStore } = this.props;
        const { salarySendTableStore, salarySendDataSource, pageInfo, loading } = payrollStore;
        return (
            <div>
                <CustomPaginationTable 
                    loading={loading}
                    columns={this.getColumns()}
                    dataSource={salarySendDataSource}
                    total={pageInfo.total}
                    current={pageInfo.pageNum}
                    pageSize={this.pageInfo.pageSize}
                    onPageChange={(value) => {
                        this.pageInfo.current = value
                        this.props.handleListDataPageChange(value, this.pageInfo)
                    }}
                    onShowSizeChange={(current, pageSize) => {
                        this.pageInfo = {current, pageSize}
                        this.props.handleListShowSizeChange(this.pageInfo)
                    }}
                    />
                
            </div>
        )
    }
}