import { Button, Space, TableProps } from "antd"
import React from "react"
import { EditOutlined } from "@ant-design/icons"
import GroupUserInfo from "./groupUserInfo"
import CloseSwitch from "./closeSwitch"
import AssociateCSG from "./associateCSG"

const columns = (handleEdit: (data: any) => void, refresh: () => void): TableProps<any>['columns'] => {

    return [
        {
            title: '客服组名称',
            dataIndex: 'csgroupName',
            key: 'csgroupName',
            width: 280,
            fixed: 'left',
            render(value, records) {
                return <span style={{ fontSize: 12 }}>{value}（ID：{records.id}）</span>
            }
        },
        {
            title: '媒体账户',
            dataIndex: 'accountId',
            key: 'accountId',
            width: 80,
            render(value, records) {
                return <span style={{ fontSize: 12 }}>{value}</span>
            }
        },
        {
            title: '是否组集',
            dataIndex: 'type',
            key: 'type',
            width: 80,
            align: 'center',
            render(value) {
                return <span style={{ fontSize: 12 }}>{value == 1 ? '否' : '是'}</span>
            }
        },
        {
            title: '归属组集',
            dataIndex: 'parentName',
            key: 'parentName',
            width: 150,
            align: 'center',
            ellipsis: true,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value || '--'}</span>
            }
        },
        {
            title: '企业名称',
            dataIndex: 'tencentCorpName',
            key: 'tencentCorpName',
            width: 110,
            align: 'center',
            ellipsis: true,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value || '--'}</span>
            }
        },
        {
            title: '企业ID',
            dataIndex: 'tencentCorpId',
            key: 'tencentCorpId',
            width: 280,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value || '--'}</span>
            }
        },
        {
            title: '切号策略',
            dataIndex: 'policyName',
            key: 'policyName',
            width: 160,
            align: 'center',
            ellipsis: true,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value || '--'}</span>
            }
        },
        {
            title: '在线通知人数',
            dataIndex: 'callOnlineCount',
            key: 'callOnlineCount',
            width: 70,
            align: 'center',
            render(value) {
                return <span style={{ fontSize: 12 }}>{value}</span>
            }
        },
        {
            title: '指派用户',
            dataIndex: 'assignUserList',
            key: 'assignUserList',
            width: 120,
            ellipsis: true,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value?.length > 0 ? value?.map((item: { userName: any }) => item.userName) : '--'}</span>
            }
        },
        {
            title: '通知用户',
            dataIndex: 'callUserList',
            key: 'callUserList',
            width: 120,
            ellipsis: true,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value?.length > 0 ? value?.map((item: { userName: any }) => item.userName) : '--'}</span>
            }
        },
        {
            title: '创建时间',
            dataIndex: 'createTime',
            key: 'createTime',
            width: 150,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value}</span>
            }
        },
        {
            title: '更新时间',
            dataIndex: 'updateTime',
            key: 'updateTime',
            width: 150,
            render(value) {
                return <span style={{ fontSize: 12 }}>{value}</span>
            }
        },
        {
            title: '关闭状态开关',
            dataIndex: 'closeSwitch',
            key: 'closeSwitch',
            width: 70,
            align: 'center',
            fixed: 'right',
            render(value, record) {
                return <CloseSwitch id={record.id} value={value} onChange={refresh} />
            }
        },
        {
            title: '操作',
            dataIndex: 'cz',
            key: 'cz',
            width: 200,
            fixed: 'right',
            render(_, record) {
                return <Space>
                    {/* <UserInfo userInfoList={record.userInfoList} createTime={record.createTime} groupMemberCnt={record.groupMemberCnt} /> */}
                    {record.type == 1 && <GroupUserInfo adAccountId={record.accountId} groupData={record} />}
                    <Button icon={<EditOutlined />} style={{ border: 'none', fontSize: 12, padding: 0 }} size='small' onClick={() => handleEdit(record)}>修改</Button>
                    {!record?.parentId && <AssociateCSG localCorpCsgroupId={record.id} />}
                </Space>
            }
        }
    ]
}
export default columns