import { Card, Tabs } from 'antd';
import React from 'react';
import '../../../tencentAdPutIn/index.less'
import Group from './components/group';
import SelectAdAccount from '@/components/SelectAdAccount';
import PageTieUp from './components/pageTieUp';
import LandingPageTieUp from './components/landingPageTieUp';
import TencentGroup from './components/tencentGroup';

/**
 * 客服管理
 * @returns 
 */
const EnterpriseWechat: React.FC = () => {

    /**********************************/
    const accountStr = localStorage.getItem('ADQ_ACCOUNTID')
    const [adAccountId, setAdAccountId] = React.useState<number | undefined>(accountStr ? Number(accountStr) : undefined);
    const [accessKey, setAccessKey] = React.useState<string>('1');
    /**********************************/

    return <Card
        className="cardResetCss"
    >
        <div className="flexStart" style={{ gap: 8, marginBottom: 16 }}>
            <SelectAdAccount
                isReturnFirstValue
                value={adAccountId ? [adAccountId] : undefined}
                type="radio"
                onChange={(value) => {
                    setAdAccountId(value as number)
                    localStorage.setItem('ADQ_ACCOUNTID', String(value))
                }}
                allowClear={false}
            />
        </div>
        
        <Tabs
            accessKey={accessKey}
            onChange={(key) => setAccessKey(key)}
            items={[
                { label: '客服组', key: '1', children: accessKey === '1' ? <Group adAccountId={adAccountId} /> : undefined },
                { label: '腾讯客服组', key: '2', children: accessKey === '2' ? <TencentGroup adAccountId={adAccountId} /> : undefined },
                { label: '官方落地页与客服组关系', key: '3', children: accessKey === '3' ? <PageTieUp adAccountId={adAccountId} /> : undefined },
                { label: '原生落地页与客服组关系', key: '4', children: accessKey === '4' ? <LandingPageTieUp adAccountId={adAccountId} /> : undefined },
            ]}
            size="small"
        />
    </Card>
};

export default EnterpriseWechat;