import { QuestionCircleFilled } from "@ant-design/icons";
import { Button, Popconfirm, Popover, Space, Typography } from "antd";
import { ColumnsType } from "antd/es/table";
import FilterUserTooltip from "./filterUserTooltip";

export function TableConfig(editHandle: (data: any, isCopy?: boolean) => void, delHandle: (id: number) => void, bookCityList: { label: string, value: string }[]): ColumnsType<any> {
    let arr: ColumnsType<any> = [
        {
            title: '人群包名称',
            dataIndex: 'configName',
            key: 'configName',
            width: 350,
            fixed: 'left',
            render(value, records) {
                return <div style={{ width: '100%', display: 'flex', alignItems: 'center' }}>
                    <div style={{ width: 'calc(100% - 20px)' }}><Typography.Text ellipsis={{ tooltip: true }}>{value}</Typography.Text></div>
                    <Popover
                        placement="right"
                        styles={{ body: { maxWidth: 350, maxHeight: 350, overflow: 'hidden', overflowY: 'auto' } }}
                        mouseEnterDelay={0.5}
                        content={<FilterUserTooltip
                            configType={records?.configType}
                            bookCityList={bookCityList}
                            configName={value}
                            data={records?.configContent ? JSON.parse(records?.configContent) : {}}
                        />}
                    >
                        <QuestionCircleFilled />
                    </Popover>
                </div>
            }
        },
        {
            title: '创建人',
            dataIndex: 'createByName',
            key: 'createByName',
            align: 'center',
            width: 100,
            ellipsis: true,
            render(value) {
                return value || '--'
            }
        },
        {
            title: '创建时间',
            dataIndex: 'createTime',
            key: 'createTime',
            align: 'center',
            width: 140,
            ellipsis: true,
        },
        {
            title: '更新时间',
            dataIndex: 'updateTime',
            key: 'updateTime',
            align: 'center',
            width: 140,
            ellipsis: true,
        },
        {
            title: '操作',
            dataIndex: 'cz',
            key: 'cz',
            align: 'center',
            fixed: 'right',
            width: 100,
            render: (a: any, b: any) => {
                return <Space wrap>
                    <Button type="link" style={{ padding: 0 }} size="small" onClick={() => { editHandle(b) }} >编辑</Button>
                    <Button type="link" style={{ padding: 0 }} size="small" onClick={() => { editHandle(b, true) }} >复制</Button>
                    <Popconfirm
                        title="确定删除？"
                        onConfirm={() => delHandle(b.id)}
                    >
                        <Button type="link" style={{ padding: 0 }} danger size="small">删除</Button>
                    </Popconfirm>
                </Space>
            }
        },
    ]
    return arr
}