import { useAjax } from "@/Hook/useAjax";
import { getFreeChapterListApi } from "@/pages/weComTask/API/bookLink";
import { App, Form, InputNumber, Radio, Select, Switch } from "antd";
import React from "react";
import SelectBook from "../../selectBook";
import { LINKCLASSIFY } from "../../const";

interface Props extends BOOKLINK.BookLinkChildProps {
    wenDingCreateLinkDTO: { [x: string]: any }
    platform: string,
    mpAccountIds: number[]
}
/**
 * 文鼎作品链接
 * @returns 
 */
const BookPromoLinkCreateDTO: React.FC<Props> = ({ restField, name, wenDingCreateLinkDTO, platform, mpAccountIds }) => {

    /**********************************/
    const { message } = App.useApp()
    const getFreeChapterList = useAjax((params) => getFreeChapterListApi(params))
    /**********************************/

    const getChapterList = () => {
        if (platform && mpAccountIds?.length && wenDingCreateLinkDTO?.bookPromoLinkCreateDTO?.bookId) {
            getFreeChapterList.run({ platform, mpAccountIds, bookId: wenDingCreateLinkDTO.bookPromoLinkCreateDTO.bookId })
        } else {
            message.error('请先选择书城、公众号')
        }
    }

    return <>
        <Form.Item
            {...restField}
            name={[name, 'bookPromoLinkCreateDTO', 'bookId']}
            rules={[{ required: true, message: '请输入作品(书籍)ID!' }]}
            label={<strong>作品(书籍)ID</strong>}
        >
            <SelectBook
                platformKey={platform}
                searchChapterDisabled={!wenDingCreateLinkDTO?.bookPromoLinkCreateDTO?.bookId}
                searchChapterLoading={getFreeChapterList.loading}
                hanldeSearchChapter={getChapterList}

            />
        </Form.Item>
        <Form.Item
            {...restField}
            name={[name, 'bookPromoLinkCreateDTO', 'chapterId']}
            label={<strong>章节</strong>}
            rules={[{ required: true, message: '请选择章节!' }]}
        >
            <Select
                showSearch
                placeholder="请选择章节"
                filterOption={(input, option) =>
                    ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
                }
                allowClear
                options={getFreeChapterList?.data?.data?.chapterList?.map(item => ({ value: item.chapterId, label: item.chapterName }))}
            />
        </Form.Item>
        <Form.Item
            {...restField}
            name={[name, 'bookPromoLinkCreateDTO', 'qrcodeOpenStatus']}
            label={<strong>二维码展示</strong>}
            rules={[{ required: true, message: '请选择二维码展示!' }]}
        >
            <Radio.Group
                buttonStyle="solid"
                options={[
                    { value: 0, label: '关闭' },
                    { value: 1, label: '开启' },
                ]}
            />
        </Form.Item>
        <Form.Item
            {...restField}
            name={[name, 'bookPromoLinkCreateDTO', 'linkClassify']}
            label={<strong>关注类型</strong>}
            rules={[{ required: true, message: '请选择关注类型!' }]}
        >
            <Select
                showSearch
                placeholder="请选择关注类型"
                filterOption={(input, option) =>
                    ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
                }
                allowClear
                options={Object.keys(LINKCLASSIFY)?.map(key => ({ value: key, label: LINKCLASSIFY[key] }))}
            />
        </Form.Item>
    </>
}

export default React.memo(BookPromoLinkCreateDTO);