import React from "react";
import { ACTICITYTHEME, ACTICITYTHEMEXH, DISPLAYTYPE, DISPLAYTYPEHUASHENG, FANQIELINKTYPEEle, FANQIEPAGETYPE, HUASHENGLINKTYPEEle, LINKCLASSIFY, LINKTYPE, LINKTYPEEle, PAGETYPE, RECHARGETYPE, RESOURCETTYPE, WENDINGLINKTYPEELE } from "./const";
import { Table } from "antd";

interface Props {
    linkType: keyof typeof LINKTYPE,
    platform: string,
    linkContent: { [x: string]: any }
}

const Details: React.FC<Props> = ({ linkType, linkContent, platform }) => {

    if (platform === 'YUE_WEN') {
        if (linkType === 1) {
            return <div>
                <div>链接类型：{LINKTYPEEle[linkType]}</div>
                <div>页面类型：<span style={{ color: '#1890ff' }}>{PAGETYPE[linkContent?.pageType] || linkContent?.pageType}</span></div>
                {linkContent?.cost && <div>消耗：<span style={{ color: '#1890ff' }}>{linkContent?.cost}</span></div>}
            </div>
        } else if (linkType === 2) {
            return <div>
                <div>链接类型：{LINKTYPEEle[linkType]}</div>
                <div>作品(书籍)ID：<span style={{ color: '#1890ff' }}>{linkContent?.bookId}</span></div>
                <div>章节ID：<span style={{ color: '#1890ff' }}>{linkContent?.chapterId}</span></div>
                <div>强关设置：<span style={{ color: '#1890ff' }}>{linkContent?.forceStyle === '1' ? '不设置强关' : linkContent?.forceStyle === '2' ? '主动强关' : '强制关注'}</span></div>
                {linkContent?.forceChapter && <div>强关章节序号：<span style={{ color: '#1890ff' }}>{linkContent?.forceChapter}</span></div>}
                <div>是否添加底部关注引导：<span style={{ color: '#1890ff' }}>{linkContent?.isOpenBottom ? '是' : '否'}</span></div>
                {linkContent?.cost && <div>消耗：<span style={{ color: '#1890ff' }}>{linkContent?.cost}</span></div>}
            </div>
        } else if (linkType === 3) {
            return <div>
                <div>链接类型：{LINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动主题：<span style={{ color: '#1890ff' }}>{ACTICITYTHEME[linkContent?.activityTheme]}</span></div>
                <div>充值挡位：<span style={{ color: '#1890ff' }}>充值{linkContent?.rechargeAmount}元，送{linkContent?.giftAmount}书卷</span></div>
                <div>活动次数：<span style={{ color: '#1890ff' }}>{linkContent?.rechargeCount}</span></div>
                <div>是否每日充值活动：<span style={{ color: '#1890ff' }}>{linkContent?.isDayRepeat ? '是' : '否'}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>活动时间状态：<span style={{ color: '#1890ff' }}>{linkContent?.timeIsShow ? '开启' : '关闭'}</span></div>
                {linkContent?.display && <div>活动展示位：<span style={{ color: '#1890ff' }}>{linkContent.display.split(',').map(item => DISPLAYTYPE[item]).join('、')}</span></div>}
            </div>
        } else if (linkType === 4) {
            return <div>
                <div>链接类型：{LINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>赠送道具：<span style={{ color: '#1890ff' }}>{RESOURCETTYPE[linkContent?.resourceType]}</span></div>
                <div>赠送书卷量：<span style={{ color: '#1890ff' }}>{linkContent?.freeAmount}</span></div>
                <div>书卷有效期：<span style={{ color: '#1890ff' }}>{linkContent?.expire}天</span></div>
                <div>赠送名额：<span style={{ color: '#1890ff' }}>{linkContent?.totalGift}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                {linkContent?.display && <div>活动展示位：<span style={{ color: '#1890ff' }}>{linkContent.display.split(',').map(item => DISPLAYTYPE[item]).join('、')}</span></div>}
            </div>
        } else if (linkType === 5) {
            return <div>
                <div>链接类型：{LINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动主题：<span style={{ color: '#1890ff' }}>{ACTICITYTHEMEXH[linkContent?.activityTheme]}</span></div>
                <div>购买章节数量：<span style={{ color: '#1890ff' }}>{linkContent?.unlockChapter}</span></div>
                <div>生效书籍：<span style={{ color: '#1890ff' }}>{linkContent?.bookId || '全部'}</span></div>
                <div>赠送书卷数量：<span style={{ color: '#1890ff' }}>{linkContent?.giftAmount}</span></div>
                <div>赠送名额：<span style={{ color: '#1890ff' }}>{linkContent?.totalGift}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                {linkContent?.display && <div>活动展示位：<span style={{ color: '#1890ff' }}>{linkContent.display.split(',').map(item => DISPLAYTYPE[item]).join('、')}</span></div>}
            </div>
        }
    } else if (platform === 'FAN_QIE') { // f番茄
        if (linkType === 1) {
            return <div>
                <div>链接类型：{FANQIELINKTYPEEle[linkType]}</div>
                <div>页面类型：<span style={{ color: '#1890ff' }}>{FANQIEPAGETYPE[linkContent?.pageType] || linkContent?.pageType}</span></div>
            </div>
        } else if (linkType === 2) {
            return <div>
                <div>链接类型：{FANQIELINKTYPEEle[linkType]}</div>
                <div>作品(书籍)ID：<span style={{ color: '#1890ff' }}>{linkContent?.bookId}</span></div>
                <div>章节ID：<span style={{ color: '#1890ff' }}>{linkContent?.chapterId}</span></div>
            </div>
        } else if (linkType === 3) {
            return <div>
                <div>链接类型：{FANQIELINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>充值挡位：<span style={{ color: '#1890ff' }}>充值{linkContent?.rechargeAmount}元，送{linkContent?.giftAmount}元</span></div>
                <div>充值次数：<span style={{ color: '#1890ff' }}>{linkContent?.rechargeCount === -1 ? '不限次' : linkContent?.rechargeCount + '次'}</span></div>
            </div>
        } else if (linkType === 4) {
            return <div>
                <div>链接类型：{FANQIELINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>会员时长：<span style={{ color: '#1890ff' }}>{linkContent?.vipDuration}年</span></div>
                <div>活动价格：<span style={{ color: '#1890ff' }}>{linkContent?.activityPrice}元</span></div>
                <div>原价：<span style={{ color: '#1890ff' }}>{linkContent?.originalPrice}元</span></div>
                <div>充值次数：<span style={{ color: '#1890ff' }}>{linkContent?.rechargeCount}次</span></div>
            </div>
        } else if (linkType === 5) {
            return <div>
                <div>链接类型：{FANQIELINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>赠送书币：<span style={{ color: '#1890ff' }}>{linkContent?.giftAmount}个</span></div>
                <div>赠送总次数：<span style={{ color: '#1890ff' }}>{linkContent?.rechargeCount}次</span></div>
                <div>频率限制：<span style={{ color: '#1890ff' }}>{linkContent?.activityFrequencies?.activityFrequenciesEnum == 2 ? '每天一次' : '每周一次'}</span></div>
            </div>
        }
    } else if (platform === 'HUA_SHENG') {
        if (linkType === 1) {
            return <div>
                <div>链接类型：{HUASHENGLINKTYPEEle[linkType]}</div>
                <div>作品(书籍)ID：<span style={{ color: '#1890ff' }}>{linkContent?.bookId}</span></div>
                <div>章节ID：<span style={{ color: '#1890ff' }}>{linkContent?.chapterId}</span></div>
                <div>强关章节序号：<span style={{ color: '#1890ff' }}>{linkContent?.forceChapter}</span></div>
                <div>消耗：<span style={{ color: '#1890ff' }}>{linkContent?.cost}</span></div>
            </div>
        } else if (linkType === 2) {
            return <div>
                <div>链接类型：{HUASHENGLINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>充值挡位：<span style={{ color: '#1890ff' }}>{linkContent?.productName}</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>活动状态：<span style={{ color: '#1890ff' }}>{linkContent?.status === 'normal' ? '上架' : '下架'}</span></div>
                <div>限购类型：<span style={{ color: '#1890ff' }}>{linkContent?.chargeType === 0 ? '整体限购' : '每天限购'}</span></div>
                {linkContent?.display && <div>活动展示位：<span style={{ color: '#1890ff' }}>{linkContent.display.split(',').map(item => DISPLAYTYPEHUASHENG[item]).join('、')}</span></div>}
                <div>限购次数：<span style={{ color: '#1890ff' }}>{linkContent?.chargeCount}次</span></div>
                <div>展示粉丝：<span style={{ color: '#1890ff' }}>{linkContent?.userType === 1 ? '全部粉丝' : '条件粉丝'}</span></div>
                {linkContent?.userType === 2 && <>
                    <div>充值状态：<span style={{ color: '#1890ff' }}>{linkContent?.charge === 0 ? '不限' : linkContent?.charge === 1 ? '已充值' : '未充值'}</span></div>
                    <div>关注时间：<span style={{ color: '#1890ff' }}>{linkContent?.commonType === 0 ? '不限' : linkContent?.charge === 1 ? '24小时以上' : linkContent?.charge === 1 ? '48小时以上' : '72小时以上'}</span></div>
                </>}
            </div>
        } else if (linkType === 3) {
            return <div>
                <div>链接类型：{HUASHENGLINKTYPEEle[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动挡位：<span style={{ color: '#1890ff' }}>{linkContent?.freeAmount}书币</span></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>活动状态：<span style={{ color: '#1890ff' }}>{linkContent?.status === 'normal' ? '上架' : '下架'}</span></div>
                {linkContent?.display && <div>活动展示位：<span style={{ color: '#1890ff' }}>{linkContent.display.split(',').map(item => DISPLAYTYPEHUASHENG[item]).join('、')}</span></div>}
                <div>展示粉丝：<span style={{ color: '#1890ff' }}>{linkContent?.userType === 1 ? '全部粉丝' : '条件粉丝'}</span></div>
                {linkContent?.userType === 2 && <>
                    <div>充值状态：<span style={{ color: '#1890ff' }}>{linkContent?.charge === 0 ? '不限' : linkContent?.charge === 1 ? '已充值' : '未充值'}</span></div>
                    <div>关注时间：<span style={{ color: '#1890ff' }}>{linkContent?.commonType === 0 ? '不限' : linkContent?.charge === 1 ? '24小时以上' : linkContent?.charge === 1 ? '48小时以上' : '72小时以上'}</span></div>
                </>}
            </div>
        }
    } else if (platform === 'WEN_DING') {
        if (linkType === 1) {
            return <div>
                <div>链接类型：{WENDINGLINKTYPEELE[linkType]}</div>
                <div>作品(书籍)ID：<span style={{ color: '#1890ff' }}>{linkContent?.bookId}</span></div>
                <div>章节ID：<span style={{ color: '#1890ff' }}>{linkContent?.chapterId}</span></div>
                <div>二维码展示：<span style={{ color: '#1890ff' }}>{linkContent?.qrcodeOpenStatus === 1 ? '开启' : '关闭'}</span></div>
                <div>关注类型：<span style={{ color: '#1890ff' }}>{LINKCLASSIFY[linkContent?.linkClassify]}</span></div>
            </div>
        } else if (linkType === 2) {
            return <div>
                <div>链接类型：{WENDINGLINKTYPEELE[linkType]}</div>
                <div>活动名称：<span style={{ color: '#1890ff' }}>{linkContent?.activityName}</span></div>
                <div>活动页标题：<span style={{ color: '#1890ff' }}>{linkContent?.viewTitle}</span></div>
                <div>活动充值项<Table
                    style={{ marginTop: 10 }}
                    dataSource={linkContent?.configs.map((item, index) => ({ ...item, id: index + 1 }))}
                    columns={[
                        {
                            title: '充值类型',
                            dataIndex: 'rechargeType',
                            key: 'rechargeType',
                            align: 'center',
                            render(value) {
                                return RECHARGETYPE[value]
                            },
                        },
                        {
                            title: '充值金额',
                            dataIndex: 'price',
                            key: 'price',
                            render(value) {
                                return (value || value === 0) ? value + '元' : '--'
                            },
                        },
                        {
                            title: '赠送金额',
                            dataIndex: 'hongbao',
                            key: 'hongbao',
                            render(value) {
                                return (value || value === 0) ? value + '元' : '--'
                            },
                        },
                        {
                            title: '限购次数',
                            dataIndex: 'rechargeFrequency',
                            key: 'rechargeFrequency',
                            render(value, record: any) {
                                return value === 0 ? record.rechargeTimes === -1 ? '不限' : (record.rechargeTimes + '次') : record.rechargeTimes === -1 ? '不限' : ('每天' + record.rechargeTimes + '次')
                            },
                        }
                    ]}
                    rowKey={'id'}
                    size='small'
                    bordered
                    pagination={false}
                /></div>
                <div>活动时间：<span style={{ color: '#1890ff' }}>{linkContent?.startTime}~{linkContent?.endTime}</span></div>
                <div>活动倒计时：<span style={{ color: '#1890ff' }}>{linkContent?.hideCountDown === 1 ? '隐藏' : '显示'}</span></div>
                <div>目标用户：<span style={{ color: '#1890ff' }}>{linkContent?.userGroup === 10 ? '标签用户' : '全部用户'}</span></div>
            </div>
        }
    }

    return null
}

export default React.memo(Details);