import { Component } from 'react'
import { observer, inject } from 'mobx-react'
import { View } from '@tarojs/components'
import './index.less'
import CustomNavbar from '@src/components/TopNavBar'
import BookboxRowBig from '@src/components/PupPetry/BookBox/BookboxRowBig'
import { Store } from '@src/app'
interface NormalListState {
    title: string,
    dataName: string,//store 中的参数名称
    data: any[]
}
interface Props {
    store: Store;
}
@inject('store')
@observer
class indexMore extends Component<Props> {
    state: NormalListState = {
        title: '',
        dataName: '',
        data: []
    }
    onLoad(opt: { title: string, dataName: string }) {
        let { indexStore } = this.props.store
        let { title, dataName } = opt
        console.log(indexStore[dataName])
        this.setState({
            title,
            data: indexStore[dataName]?.longBookInfoAppVOS ||  indexStore[dataName]?.shortBookInfoAppVOS
        })
    }

    render() {
        let { title, data } = this.state
        let Page: any = CustomNavbar(function Page() {
            return <View className='indexMore pd_btm'>
                {/* 头部bar */}
                <View className='w  row for_top'>
                    {
                        data?.map((item, index) => {
                            return <View key={index}><BookboxRowBig {...item} /></View>
                        })
                    }

                </View>
            </View>
        }, { title, isToBack: true })
        return <Page />
    }
}
export default indexMore