import React, { Component } from 'react'
import { Tabs } from 'antd'
import SelectorList from './selector-list'
import SelectedList from './selected-list'

export default class index extends Component {
    state = {
        userId: '',
    }

    selectorList = React.createRef()
    selectedList = React.createRef()

    /**
     * mount后回调
     */
    componentDidMount() {
        this.props.created && this.props.created(this)
    }

    /**
     * 填充数据
     * 可以在设置this.record之后对其作出数据结构调整
     * [异步,必要]
     * @param {*} params
     */
    async fillData(params) {
        this.setState({
            userId: params.id,
        })
    }

    //#region 自定义方法
    onReloadAll() {
        if (this.selectorList.current) {
            this.selectorList.current.table.current.onReloadData()
        }
        if (this.selectedList.current) {
            this.selectedList.current.table.current.onReloadData()
        }
    }
    //#endregion

    render() {
        const { userId } = this.state

        return (
            <Tabs tabBarStyle={{ padding: '0 24px' }}>
                <Tabs.TabPane key="1" tab="选房">
                    <SelectorList
                        userId={userId}
                        ref={this.selectorList}
                        onReloadAll={() => this.onReloadAll()}
                    />
                </Tabs.TabPane>
                <Tabs.TabPane key="2" tab="已选">
                    <SelectedList
                        userId={userId}
                        ref={this.selectedList}
                        onReloadAll={() => this.onReloadAll()}
                    />
                </Tabs.TabPane>
            </Tabs>
        )
    }
}
