import { copy } from "@/utils/utils"
import { Button, Popconfirm, Space, Tooltip } from "antd"
import { ColumnsType } from "antd/es/table"
import { tableDfixed } from "@/utils/tableDfixed"
import DivideIntoGroups from "./divideIntoGroups"
import { UploadOutlined } from '@ant-design/icons'

export function WeTableConfig(
    activeKey: string,
    groupId?: number,
    onRefresh?: () => void,
    del?: (groupId: number, accountId: number) => void,
): ColumnsType<any> {

    const arr: ColumnsType<any> = [
        {
            title: '企微号ID',
            dataIndex: 'corpUserId',
            key: 'corpUserId',
            align: 'center',
            width: 150,
            ellipsis: true,
            fixed: 'left',
            render: (a: string) => {
                return <a onClick={() => copy(a)}>{a}</a>
            }
        },
        {
            title: '企微号',
            dataIndex: 'name',
            key: 'name',
            align: 'center',
            width: 80,
        },
        {
            title: '所属企业',
            dataIndex: 'corpName',
            key: 'corpName',
            align: 'center',
            width: 120,
            ellipsis: true
        },
        {
            title: '企业ID',
            dataIndex: 'corpId',
            key: 'corpId',
            align: 'center',
            width: 120,
            ellipsis: true,
            render: (a: string) => {
                return <a onClick={() => copy(a)}>{a}</a>
            }
        },
        {
            title: '投手',
            dataIndex: 'putUser',
            key: 'putUser',
            align: 'center',
            width: 80,
            render: (a: { nickName: string }) => {
                return <span>{a?.nickName || '--'}</span>
            }
        },
        {
            title: '运营',
            dataIndex: 'operUser',
            key: 'operUser',
            align: 'center',
            width: 80,
            render: (a: { nickName: string }) => {
                return <span>{a?.nickName || '--'}</span>
            }
        },
        {
            title: '公众号',
            dataIndex: 'name',
            key: 'name',
            align: 'center',
            width: 80,
            render: (_, record) => {
                return <span>{record?.mpAccountInfo?.name || '--'}</span>
            }
        },
        {
            title: '书城',
            dataIndex: 'platformName',
            key: 'platformName',
            align: 'center',
            width: 80,
            render: (_, record) => {
                return <span>{record?.mpAccountInfo?.platformName || '--'}</span>
            }
        },
        {
            title: '操作',
            dataIndex: 'cz',
            key: 'cz',
            align: 'center',
            width: 170,
            fixed: 'right',
            render: (a, b) => {
                return <Space wrap size={'small'}>
                    {activeKey === '1' && <>
                        {!groupId && <DivideIntoGroups groupIds={b?.groupIds} onRefresh={onRefresh} corpUserList={[{ corpId: b?.corpId, corpUserId: b?.corpUserId }]} />}
                    </>}
                    {groupId && <Popconfirm
                        title={`是否把${b?.corpUserId}移出该分组?`}
                        onConfirm={() => { del?.(groupId, b) }}
                        okText="是"
                        cancelText="否"
                    >
                        <Tooltip title="移出分组">
                            <Button size="small" style={{ color: 'red' }}><UploadOutlined /></Button>
                        </Tooltip>
                    </Popconfirm>}
                </Space>
            }
        },
    ]
    return tableDfixed(arr)
}


export function WeTableSelectConfig(): ColumnsType<any> {

    const arr: ColumnsType<any> = [
        {
            title: '企微号ID',
            dataIndex: 'corpUserId',
            key: 'corpUserId',
            align: 'center',
            width: 80,
            ellipsis: true,
            fixed: 'left',
            render: (a: string) => {
                return <a onClick={() => copy(a)}>{a}</a>
            }
        },
        {
            title: '企微号',
            dataIndex: 'name',
            key: 'name',
            align: 'center',
            width: 80,
            fixed: 'left'
        },
        {
            title: '所属企业',
            dataIndex: 'corpName',
            key: 'corpName',
            align: 'center',
            width: 120,
            ellipsis: true,
            render: (text) => text || '--'
        },
        {
            title: '企业ID',
            dataIndex: 'corpId',
            key: 'corpId',
            align: 'center',
            width: 120,
            ellipsis: true,
            render: (a: string) => {
                return <a onClick={() => copy(a)}>{a}</a>
            }
        },
        {
            title: '投手',
            dataIndex: 'putUser',
            key: 'putUser',
            align: 'center',
            width: 80,
            render: (a: { nickName: string }) => {
                return <span>{a?.nickName || '--'}</span>
            }
        },
        {
            title: '运营',
            dataIndex: 'operUser',
            key: 'operUser',
            align: 'center',
            width: 80,
            render: (a: { nickName: string }) => {
                return <span>{a?.nickName || '--'}</span>
            }
        },
        {
            title: '公众号',
            dataIndex: 'name',
            key: 'name',
            align: 'center',
            width: 80,
            render: (_, record) => {
                return <span>{record?.mpAccountInfo?.name || '--'}</span>
            }
        },
        {
            title: '书城',
            dataIndex: 'platformName',
            key: 'platformName',
            align: 'center',
            width: 80,
            render: (_, record) => {
                return <span>{record?.mpAccountInfo?.platformName || '--'}</span>
            }
        }
    ]
    return tableDfixed(arr)
}