import {useEffect, useState} from 'react'
import {useRouter} from '@tarojs/taro'
import {Divider} from '@nutui/nutui-react-taro'
import {CmsArticle} from "@/api/cms/cmsArticle/model"
// import {Eye} from '@nutui/icons-react-taro'
// import dayjs from 'dayjs';
// 显示html富文本
import {View, RichText} from '@tarojs/components'
import Line from "@/components/Gap";
import {getCmsArticle} from "@/api/cms/cmsArticle";

function Detail() {
    const {params} = useRouter();
    // 文章详情
    const [item, setItem] = useState<CmsArticle>()
    // 浏览量
    // const [views, setViews] = useState<number>()

    const reload = () => {
        getCmsArticle(Number(params.id)).then(data => {
            if (data) {
                setItem(data)
                // setViews(data.actualViews)
            }
        })
    }

    useEffect(() => {
        reload();
    }, []);

    return (
        <div className={'bg-white'}>
            <div className={'p-3 font-bold text-lg'}>{item?.title}</div>
            {/*<div className={'flex items-center text-gray-400 text-xs px-3 gap-3'}>*/}
            {/*    <div className={'text-red-800'}>{item?.author}</div>*/}
            {/*    <div>{dayjs(item?.createTime).format('YYYY-MM-DD')}</div>*/}
            {/*    <div className={'flex items-center gap-1'}><Eye size={14}/>{views}</div>*/}
            {/*</div>*/}
            <Divider/>
            <View className={'content text-gray-700 text-sm'}>
                <RichText
                    nodes={item?.content || '暂无内容'}
                    space="nbsp"
                />
            </View>
            <Line height={44}/>
        </div>
    )
}

export default Detail
