import React, { useEffect, useState, useMemo } from 'react';
import { Table, Drawer, Pagination, AutoTableContainer } from 'kts-xui';
import agent from '../Server';
import moment from 'moment';
import { DigitalAssetVerification } from '../..';

export default function TemplateList(props: any) {
    const [pageMeta, setPage] = useState<any>();
    const uuid=React.useMemo(()=>props.uuid,[]);
    const [params, setParams] = useState<any>({ pageNum: 1, pageSize: 10 });
    const [list, setList] = useState([]);
    const columns = [
        {
            title: '历史规则时间',
            dataIndex: 'createTime',
            render: text => moment(text).format('YYYY-MM-DD HH:mm')
        },
        {
            title: '操作',
            dataIndex: 'fileName',
            width: 100,
            render: (text) => <a onClick={() => { onDownload([text]); }}>下载</a>
        },
    ];
    const onDownload = async (id) => {
        const response = await agent.post('/web/verifiedTask/getFileDownloadUrl', { fileNameList: id }, null);
        const res = response.res[0];
        const href = `${res}`;
        let a = window.document.createElement('a');
        a.setAttribute('href', href);
        a.setAttribute('target', '_blank');
        a.setAttribute('download', `历史规则_${moment(new Date()).format('YYYYMMDDHHmmss')}.xls`);
        a.click();
    }
    const onClose = () => {
        props.onClose();
    };
    const onPageChange = (pageNum, pageSize) => {
        setParams({
            ...params,
            pageNum,
            pageSize
        })
    };
    useEffect(() => {
        (async () => {
            const data = {
                ...params,
                templateUuid:uuid
            }
            const res: any = await agent.post('/web/verifier/rule/record/queryPage', data, null);
            if (res.res) {
                setList(res.res.items);
                setPage(res.res.pageMeta)
            }
        })()
    }, [params]);
    return (

        <Drawer title='历史规则' visible={true} onClose={onClose}>
            <AutoTableContainer style={{ flex: 1 }} >
                <Table
                    dataSource={list}
                    columns={columns as any}
                    bordered={true}
                    pagination={false}
                    rowKey='id'
                />
            </AutoTableContainer>
            {pageMeta && <Pagination onChange={onPageChange} showTotal={(total, range) => `第 ${range[0]}-${range[1]} 条,  共有 ${total} 条`} style={{ padding: '16px 0', flex: 'none', background: 'white', textAlign: 'center' }} total={pageMeta.total} pageSize={pageMeta.pageSize} current={pageMeta.pageNum} showSizeChanger={true} />}
        </Drawer>
    );
}