/**书架中书籍的box容器横小 */

import { Text, View, Image, Button, Navigator } from "@tarojs/components";
import React from 'react'
import './index.less'
import BookStore from "@src/store/book"
import { setReadLog } from "@src/utils/loginSto";
export interface BookboxRowSmallProps {
    bookInfo: {
        bookId: number,//书ID
        authorName: string,//作者
        bookName: string,//书名称
        bookDesc: string,//描述
        picUrl: string,//封面
        bookStatus: number,//完本|连载状态
        wordCount: number,//字数
        labelInfoList: { name: string }[],//标签
        readLogId: string,//上次阅读的记录
        vipFree: boolean
    }
    lastReadingTime: string,//最近阅读时间
}
function BookboxRowSmall(props: BookboxRowSmallProps) {
    const { lastReadingTime, bookInfo } = props
    const { bookName, picUrl, authorName, bookId, readLogId, vipFree } = bookInfo
    const click = () => {
        BookStore.setData({ openBookData: props })
        if (readLogId) {
            setReadLog({ [bookId]: readLogId })
        }
    }
    return <View className='book_box_row_small' onClick={click} style={{ margin: 0 }}>
        <Navigator url={`/pages/book/bookArticle/index?bookId=${bookId}`} hoverClass="none">
            <Image src={picUrl} className={`img ${vipFree ? "isVip" : ""}`}></Image>
            <View className='right'>
                <Text className='title'>{bookName}</Text>
                <View className='content'>
                    <View className='left'>
                        <Text className='author'>{authorName}</Text>
                        <View className='bottom'>
                            {
                                true ? <>
                                    <Text className='time'>{lastReadingTime}</Text>
                                    {/* <Text className='section'>{chapter_name}</Text> */}
                                </>
                                    :
                                    <Text className='null'>未读</Text>
                            }
                        </View>
                    </View>
                    <Button className='btn' plain={true}>继续阅读</Button>
                </View>
            </View>
        </Navigator>
    </View>
}
export default React.memo(BookboxRowSmall)