import { Swiper, SwiperItem, Image, Navigator } from "@tarojs/components";
import React from "react";
import './index.less'
import { IndexStore } from "@src/store";
/**轮播图 */
interface BannerBoxProps {
    data?: IndexStore["indexBanners"]
}
function BannerBox(props: BannerBoxProps) {
    const { data } = props
    return <Swiper
        className='banner_box'
        indicatorColor='#999'
        indicatorActiveColor='#333'
        vertical={false}
        circular
        indicatorDots
        autoplay
    >
        {
            data?.map((item, index: number) => {
                let { bookId, bannerType, bannerImage, activityPagePath } = item
                console.log(bannerType === 0 ? '/pages/book/bookDetails/index?bookId=' + bookId : '/' + activityPagePath)
                return <SwiperItem key={index}>
                    <Navigator url={bannerType === 0 ? '/pages/book/bookDetails/index?bookId=' + bookId : '/' + activityPagePath} hoverClass="none">
                        <Image src={bannerImage} className='img' />
                    </Navigator>
                </SwiperItem>
            })
        }
    </Swiper>
}

export default React.memo(BannerBox)