qc-EnterpriseWeChat-Pro/src/pages/weComTask/page/groupChat/create/tableConfig.tsx

import { Badge, Popover, Space, Typography } from "antd";
import { AnyObject } from "antd/es/_util/type"
import { ColumnsType } from "antd/es/table"
import { businessPlanData, TIME_TYPE } from "../../businessPlan/create/const";
import FilterUserTooltip from "@/pages/weComTask/components/filterUser/filterUserTooltip";
import { QuestionCircleFilled } from "@ant-design/icons";
const { Paragraph, Title, Text } = Typography;


export const PreviewColumns = (bookPlatForm: TASK_CREATE.BookPlatFormProps[], bookList: TASK_CREATE.BookListProps[]): ColumnsType<AnyObject> => {

    return [
        {
            title: '企微号信息',
            dataIndex: 'corpUser',
            key: 'corpName',
            width: 150,
            fixed: 'left',
            render(value) {
                return <>
                    <Title level={5} style={{ margin: 0 }}>{value?.corpName || '--'}</Title>
                    <Paragraph style={{ margin: 0 }}>{value?.name || '--'}</Paragraph>
                </>
            }
        },
        {
            title: '基础信息',
            dataIndex: 'taskName',
            key: 'taskName',
            width: 130,
            render(value, record) {
                return <>
                    <Title level={5} style={{ margin: 0 }}>标题：{value}</Title>
                    {record?.bizType && <Paragraph style={{ margin: 0 }}>业务类型：{record?.bizType === 'novel' ? '小说' : record?.bizType === 'game' ? '游戏' : '<空>'}</Paragraph>}
                    {record?.platform && <Paragraph style={{ margin: 0 }}>书城：{record?.platform ? bookPlatForm?.find(item => item.id === record?.platform)?.platformName : '<空>'}</Paragraph>}
                    {record?.templateProductId && <Paragraph style={{ margin: 0 }}>适用产品：{record?.templateProductId ? bookList?.find(item => item.id === record?.templateProductId)?.bookName : '<空>'}</Paragraph>}
                </>
            }
        },
        {
            title: '群主号',
            dataIndex: 'corpUserChat',
            key: 'corpUserChat',
            width: 130,
            render(value) {
                return value.map((item, index) => <Paragraph style={{ margin: 0 }} key={index}>{item.label}</Paragraph>)
            }
        },
        {
            title: '机器人客服号',
            dataIndex: 'robotCorpUsers',
            key: 'robotCorpUsers',
            width: 130,
            render(value) {
                return value?.length > 0 ? value?.map((item, index) => <Paragraph style={{ margin: 0 }} key={index}>{item.name}（{item.corpName}）</Paragraph>) : '--'
            }
        },
        {
            title: '策略信息',
            dataIndex: 'strategyData',
            key: 'strategyData',
            width: 200,
            render(_, record) {
                return <>
                    <Title level={5} style={{ margin: 0 }}>策略{record.strategyIndex + 1}</Title>
                    <Paragraph style={{ margin: 0 }}>名称：{record?.strategyName || '<空>'}</Paragraph>
                    <Paragraph style={{ margin: 0 }}>执行类型：{TIME_TYPE[record?.timeRepeatType]}</Paragraph>
                    {record?.sendDay && <Paragraph style={{ margin: 0 }}>执行时间：{record?.sendDay}</Paragraph>}
                    {record?.startTime && <Paragraph style={{ margin: 0 }}>执行日期：{record?.startTime}~{record?.endTime ? record?.endTime : '长期执行'}</Paragraph>}
                    {record?.sendTime && <Paragraph style={{ margin: 0 }}>执行时间：{record?.sendTime}</Paragraph>}
                    {record?.repeatArray && <Paragraph style={{ margin: 0 }}>执行天数：{record?.repeatArray.join('、')}</Paragraph>}
                </>
            }
        },
        {
            title: '群名称',
            dataIndex: 'groupObjectName',
            key: 'groupObjectName',
            width: 120,
            ellipsis: true,
            fixed: 'left'
        },
        {
            title: '是否开启已有旧群聊补缺',
            dataIndex: 'isRepair',
            key: 'isRepair',
            width: 150,
            ellipsis: true,
            render(value, record, index) {
                return value ? <Space>
                    <Badge status="success" text="开启" />
                    <span>近{record.repairTimes}天</span>
                </Space> : <Badge status="error" text="关闭" />
            },
        },
        {
            title: '进群对象',
            dataIndex: 'externalUserFilter',
            key: 'externalUserFilter',
            width: 90,
            align: 'center',
            render(value) {
                return value ? <div style={{ display: 'flex', alignItems: 'center' }}>
                    <div style={{ flex: '1 0', overflow: 'hidden' }}>
                        <Text ellipsis>指定</Text>
                    </div>
                    <Popover
                        placement="right"
                        styles={{ body: { maxWidth: 350, maxHeight: 350, overflow: 'hidden', overflowY: 'auto' } }}
                        mouseEnterDelay={0.5}
                        content={<FilterUserTooltip
                            bookCityList={bookPlatForm?.map(item => ({ label: item.platformName, value: item.platformKey }))}
                            configName={value?.configName}
                            data={value?.configContent}
                        />}
                    >
                        <a style={{ color: '#000' }}><QuestionCircleFilled /></a>
                    </Popover>
                </div> : '全部'
            },
        },
        {
            title: '群递增起始编号',
            dataIndex: 'groupIndex',
            key: 'groupIndex',
            width: 60,
            align: 'center'
        },
        {
            title: '群固定人数',
            dataIndex: 'groupUserCount',
            key: 'groupUserCount',
            width: 50,
            align: 'center'
        },
        {
            title: '邀请客户进群完毕后客服号是否退群',
            dataIndex: 'autoOutGroup',
            key: 'autoOutGroup',
            width: 85,
            align: 'center',
            render(value) {
                return value ? <span style={{ color: '#1890ff' }}>是</span> : <span style={{ color: 'red' }}>否</span>
            },
        },
        {
            title: '是否排除已在群的客户',
            dataIndex: 'excludeInGroup',
            key: 'excludeInGroup',
            width: 60,
            align: 'center',
            render(value) {
                return value ? <span style={{ color: '#1890ff' }}>是</span> : <span style={{ color: 'red' }}>否</span>
            },
        },
        {
            title: '拉群完成后自动删除拉群标签',
            dataIndex: 'excludeInGroup',
            key: 'excludeInGroup',
            width: 70,
            align: 'center',
            render(value) {
                return value ? <span style={{ color: '#1890ff' }}>是</span> : <span style={{ color: 'red' }}>否</span>
            },
        },
        {
            title: '群聊关联公众号',
            dataIndex: 'weChatAppid',
            key: 'weChatAppid',
            width: 100,
            align: 'center',
            render(value) {
                return value || '--'
            },
        },
        {
            title: '拉群完成后群聊备注',
            dataIndex: 'remark',
            key: 'remark',
            width: 140,
            render(value) {
                return value || '--'
            },
        },
        {
            title: '拉群完成后群聊智能标签',
            dataIndex: 'tagDTO',
            key: 'tagDTO',
            width: 200,
            render(value) {
                return value && Object.keys(value)?.length > 0 ?
                    <Paragraph ellipsis style={{ margin: 0 }}>{Object.keys(value).map(key => {
                        if (key === 'business' && value[key]) {
                            return `业务（来源渠道）：${businessPlanData.find(i => i.value === value.business)?.label || '<空>'}`
                        } else if (key === 'bookCity' && value[key]) {
                            return `书城（来源渠道）：${bookPlatForm.find(i => i.id === value.bookCity)?.platformName || '<空>'}`
                        } else if (key === 'product' && value[key]) {
                            return `产品（来源渠道）：${bookList.find(i => i.id === value.product)?.bookName || '<空>'}`
                        }
                        return ''
                    }).join('、')}</Paragraph> : '--'
            },
        },
        {
            title: '建群成功发送内容',
            dataIndex: 'groupSendMsg',
            key: 'groupSendMsg',
            width: 140,
            render(value) {
                return value ? value : '--'
            },
        },
    ]

}