
import HocError from '@/Hoc/HocError'
import { Button, Card, Form, Input, Select, Space, Table, Tag } from 'antd'
import React, { useCallback, useEffect, useState } from 'react'
import { columnsMp } from './tableConfig'
import { useModel } from 'umi'


/** 投放管理 */
const AdAuthorize: React.FC = () => {
    const [form] = Form.useForm();
    const [paging, setPaging] = useState<{ pageSize: number, pageNum: number, withChannel: boolean, uname?: string, selectServer?: number }>({ pageSize: 20, pageNum: 1, withChannel: true }) // 用户表格参数
    const { getAdAccount } = useModel('useLaunchAdq.useAdAuthorize')
    /** 查询 */
    const submitForm = useCallback((values: any) => {
        setPaging({ ...paging, ...values, pageNum: 1 })
    }, [paging])
    /** 重置 */
    const onReset = useCallback(() => {
        form.resetFields();
    }, [])

    useEffect(() => {
        // 获取账号列表
        getAdAccount.run()
    }, [])

    return <Card
        title={<Space wrap>
            <Form
                layout="inline"
                form={form}
                onFinish={submitForm}
            >
                <Form.Item label="广告主名称" name="uname">
                    <Input placeholder="输入广告主" />
                </Form.Item>
                <Form.Item>
                    <Space>
                        <Button type="primary" htmlType="submit">查询</Button>
                        <Button onClick={onReset}>重置</Button>
                    </Space>
                </Form.Item>
            </Form>
        </Space>}
    >
        <Table dataSource={getAdAccount?.data?.data?.records} loading={getAdAccount?.loading} columns={columnsMp()} size="small" bordered
            pagination={{
                position: ['bottomRight'],
                total: getAdAccount?.data?.data?.total,//总共多少条数据,服务器给,设置后分页自动计算页数
                showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
                showSizeChanger: true,
                showLessItems: true,
                defaultCurrent: 1,
                defaultPageSize: 20,//默认初始的每页条数
                current: paging?.pageNum || 1,
                pageSize: paging?.pageSize || 20,
                onChange: (page, pageSize) => { setPaging({ ...paging, pageNum: page, pageSize: pageSize as number }) }
            }}
            rowKey={(row) => row.id}
        />
    </Card>
}

export default HocError(AdAuthorize)