import useNewToken from '@/Hook/useNewToken';
import React, { useContext, useState } from 'react';
import { DispatchMomentsTaskCreate } from '../..';
import style from '../../../../businessPlan/create/index.less'
import { Button, Empty, Popconfirm } from 'antd';
import SettingsStrategy from './settingsStrategy';
import PreviewMomentsStrategy from './previewMomentsStrategy';

const Strategy: React.FC = () => {

    /*********************************/
    const { token } = useNewToken()
    const { setSettings, settings, onPreviewReset, isEditSc } = useContext(DispatchMomentsTaskCreate)!;
    const [newVisible, setNewVisible] = useState<boolean>(false);
    /*********************************/

    return <>
        <div className={`${style.settingsBody_content_row}`} style={{ width: '35%' }}>
            <div className={`${style.settingsBody_content_col}`} style={{ width: '100%' }}>
                <div className={style.title}>
                    <span>策略</span>
                    {(settings?.massSendingStrategy && !isEditSc) && Object.keys(settings?.massSendingStrategy).length > 0 && <Popconfirm
                        title="确定清空？"
                        onConfirm={() => {
                            setSettings(undefined)
                            onPreviewReset();
                        }}
                        disabled={isEditSc}
                    >
                        <a style={{ color: 'red' }}>清空</a>
                    </Popconfirm>}
                </div>
                <div className={style.detail}>
                    <div className={style.detail_title}>朋友圈策略配置</div>
                    <div className={style.detail_body}>
                        {settings?.massSendingStrategy && Object.keys(settings?.massSendingStrategy).length > 0 ? <>
                            <PreviewMomentsStrategy massSendingStrategy={settings?.massSendingStrategy} />
                        </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
                    </div>
                </div>
                <div className={style.detail_footer}>
                    <Button type="link" style={{ padding: 0, fontSize: 12 }} disabled={isEditSc} size="small" onClick={() => setNewVisible(true)}>编辑</Button>
                </div>
            </div>
        </div>

        {/* 配置基础信息 */}
        {newVisible && <SettingsStrategy
            visible={newVisible}
            value={settings?.massSendingStrategy}
            onClose={() => {
                setNewVisible(false);
            }}
            onChange={(values) => {
                const corpUsers = settings?.corpUsers?.map(item => {
                    delete item?.groupMsgContent
                    return item
                })
                setSettings({
                    ...settings,
                    corpUsers,
                    massSendingStrategy: values
                });
                onPreviewReset();
                setNewVisible(false);
            }}
        />}
    </>;
};

export default Strategy;