import React, { useEffect, useState } from 'react';
import { Card, Table, Form } from 'antd';
import { connect } from 'umi';
import { dispatchHandle } from '@/utils/publicHandle';
import useFormTable from '@/useHooks/useFormTable';
import ToolTipsBox from '@/components/ToolTipsBox';


const KpiTaskTableNote = (props) => {
    const {
        dispatch,
        location: {
            query
        },
        kpi: {
            taskList
        }
    } = props
    const [form] = Form.useForm()
    const getListItem = (payload = {}) => {
        dispatchHandle(
            dispatch,
            'kpi/operation_service_m_task_taskList_post',
            payload
        )
    }
    const { tableProps, search } = useFormTable(getListItem, {
        form, manual: true
    })
    useEffect(() => {
        const arr = query?.time?.split('-')
        const payload = {
            userId: query?.id,
            queryFormat: 'YYYY-MM-DD HH',
            queryTime: `${arr[0]}-${arr[1]}-${arr[2]} ${arr[3]}`
        }
        search.submit(payload)
    }, [])
    const columns = [
        // { title: '时间', dataIndex: 'time' },
        { title: '任务编号', dataIndex: 'taskNumber' },
        { title: '任务名称', dataIndex: 'taskName' },
        { title: '任务类型', dataIndex: 'taskTypeName' },
        {
            title: '任务状态', dataIndex: 'taskState',
            render: (text, record) => (
                {
                    0: <span className='btn_common'>未分派</span>,
                    1: <span className='btn_success'>未开始</span>,
                    2: <span className='btn_warning'>进行中</span>,
                    6: <span className='btn_alarm'>已超时</span>,
                    4: <span className='btn_common'>已完成</span>,
                    5: <span className='btn_disabled'>已关闭</span>,
                    7: <span className='btn_alarm'>待验收</span>,
                    8: <span className='btn_success'>验收通过</span>,
                    9: <span className='btn_fail'>验收不通过</span>,
                }[text]
            )
        },
        {
            title: '执行人', dataIndex: 'taskExecutorNames',
            render: text => <div style={{display: 'flex' , justifyContent: 'center'}}><ToolTipsBox>{text}</ToolTipsBox></div>
        },
    ]
    return <Card>
        <Table
            columns={columns}
            dataSource={taskList.list}
            pagination={taskList.pagination}
            {...tableProps}
        />
    </Card>
}

export default connect(({ kpi }) => ({
    kpi
}))(KpiTaskTableNote);