import { Image, Text, View } from "@tarojs/components"
import next from '@/images/next.png'
import './index.scss'
import { useState } from "react"
import Taro from "@tarojs/taro"
import backNav from '@/images/backNav.png'
import { useEffect } from "react"
import { useRouter } from "@tarojs/taro"
import { msgDetail } from "../../utils/api"
import { formatDateByStr } from "../../utils/utils"


const Login = () => {

    const params = useRouter().params
    const [id] = useState(params.id)
    const [detail, setDetail] = useState({})

    useEffect(() => {
        if (!id) return
        msgDetail(id).then(rs => {
            if (!rs) return
            setDetail(rs)
        })
    }, [id])

    // 返回页面
    const backFn = () => {
        Taro.getCurrentPages().length > 0 && Taro.navigateBack()
    }


    return <View className="message-frame  h-screen text-base">
        <View className='addr-detail-title'>
            <Image src={backNav} className="square-35 absolute left-10 nav-icon" onClick={backFn} />
            消息中心
        </View>
        <View className="message-detail-container flex-col items-center">
            <View className="message-detail-title">{detail.title}</View>
            <View className="message-detail-time">{formatDateByStr(detail.created_at)}</View>
            <View className="message-detail-content">
                {detail.content}
            </View>
        </View>
    </View>
}


export default Login