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

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


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

@inject('payrollStore')
@observer
export default class SalarySendList extends React.Component {
    constructor(props) {
        super(props)
        this.searchParams = {}
    }

    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) {
        window.open("")
        
    }

    // 页面跳转
    handleDataPageChange(value) {
        this.searchParams.current = value;
        const { payrollStore: {getPayrollList} } = this.props;
        getPayrollList(this.searchParams)
    }

    // 获取表头数据
    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>
                <CustomTable loading={loading} columns={this.getColumns()} dataSource={salarySendDataSource}
                    pagination={{
                        onChange: (value) => {this.handleDataPageChange(value)},
                        total: pageInfo.total,
                        current: pageInfo.pageNum
                    }}
                />
            </div>
        )
    }
}