/**
 * 考核信息-列表
 */

import React from 'react';
import { useSetState } from 'ahooks';
import VMTable from '../vm-table';
import { SubTabsLine } from '../vm-sub-tabs';
interface ListProps {
    zgData: Array<any>;
    khData: Array<any>;
}

const List = (props: ListProps) => {
    const { zgData, khData } = props;
    const [state, setState] = useSetState({
        filterKey: 'kh',
    });
    const { filterKey } = state;
    // const { khData, zgData } = BaseService.useAppraisal(id, startTime, endTime);
    const columns = [
        {
            title: '考核扣分',
            dataIndex: 'totalDeductPoints',
            key: 'totalDeductPoints',
        },
        {
            title: '考核时间',
            dataIndex: 'checkDate',
            key: 'checkDate',
            width: 140,
        },
        {
            title: '考核单位',
            dataIndex: 'checkDepartName',
            key: 'checkDepartName',
            width: 160,
            ellipsis: true,
        },
        {
            title: '考核人',
            dataIndex: 'checkUserName',
            key: 'checkUserName',
        },
        {
            title: '记录状态',
            dataIndex: 'statusName',
            key: 'statusName',
        },
        {
            title: '操作',
            dataIndex: 'operation',
            key: 'operation',
            render: () => {
                return <a onClick={() => {}}>查看图片集</a>;
            },
        },
    ];

    const zgColumns = [
        {
            title: '问题来源',
            dataIndex: 'problemFromStr',
            key: 'problemFromStr',
        },
        {
            title: '问题分类',
            dataIndex: 'problemCategoryName',
            key: 'problemCategoryName',
        },
        {
            title: '问题描述',
            dataIndex: 'memo',
            key: 'memo',
            ellipsis: true,
        },
        {
            title: '上报时间',
            dataIndex: 'reportDateTimeStr',
            key: 'reportDateTimeStr',
        },
        {
            title: '上报单位',
            dataIndex: 'responsibleUnitName',
            key: 'responsibleUnitName',
        },
        {
            title: '上报人员',
            dataIndex: 'reportStaffName',
            key: 'reportStaffName',
        },
        {
            title: '状态',
            dataIndex: 'orderStatusStr',
            key: 'orderStatusStr',
        },
        {
            title: '操作',
            dataIndex: 'operation',
            key: 'operation',
            render: () => {
                return <a onClick={() => {}}>查看图片集</a>;
            },
        },
    ];

    const tableProps = {
        height: 440,
        pagination: {
            current: 1,
            pageSize: 10,
        },
    };

    return (
        <div className="appraisal-content-list">
            <SubTabsLine
                items={[
                    {
                        label: `考核 (${khData.length})`,
                        key: 'kh',
                    },
                    {
                        label: `整改 (${zgData.length})`,
                        key: 'zg',
                    },
                ]}
                activeKey={filterKey}
                onChange={key => {
                    setState({
                        filterKey: key,
                    });
                }}
            />
            <div className="appraisal-content-list-table">
                <VMTable
                    columns={filterKey === 'kh' ? columns : zgColumns}
                    rowKey="key"
                    {...tableProps}
                    dataSource={filterKey === 'kh' ? khData : zgData}
                />
            </div>
        </div>
    );
};

export default List;
