87 lines
3.2 KiB
React
87 lines
3.2 KiB
React
|
import React, { useMemo } from "react";
|
||
|
|
import { formatTimestamp, goToPage } from "@/utils/tools";
|
||
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||
|
|
import { faAngleRight } from "@fortawesome/free-solid-svg-icons";
|
||
|
|
import { useRouter } from "next/navigation";
|
||
|
|
export default function NoticeItem({ navigation, leftIcon, hasLink, data }) {
|
||
|
|
const router = useRouter();
|
||
|
|
const currentLink = useMemo(() => {
|
||
|
|
if (hasLink && data?.hyperlinks) {
|
||
|
|
const hasAppLink = data.hyperlinks.filter(
|
||
|
|
(it) => it.action === "app_router_path"
|
||
|
|
)[0];
|
||
|
|
return hasAppLink ?? null;
|
||
|
|
}
|
||
|
|
}, [data]);
|
||
|
|
return (
|
||
|
|
<div className="bg-[#FFFFFF1A] rounded-2xl mb-2 py-[24px] px-[18px]">
|
||
|
|
<div className="flex">
|
||
|
|
<div className="flex-1">
|
||
|
|
{/* 内容 */}
|
||
|
|
<div>
|
||
|
|
{/* 文本内容 */}
|
||
|
|
<div className="flex items-center">
|
||
|
|
{/* 头像 */}
|
||
|
|
<div className="flex justify-center items-center rounded-full mr-2 w-[28px] h-[28px]">
|
||
|
|
{/* <Icon type="ionicon" name="megaphone" size={24} color="white" /> */}
|
||
|
|
{leftIcon}
|
||
|
|
</div>
|
||
|
|
<p className="text-lg font-medium mr-2">{data?.title}</p>
|
||
|
|
</div>
|
||
|
|
<p className="text-base font-medium my-2">{data?.message}</p>
|
||
|
|
{/* 链接跳转 */}
|
||
|
|
{!!data?.link_text && (
|
||
|
|
<div
|
||
|
|
onClick={() => {}}
|
||
|
|
className="rounded-xl p-2 flex flex-row items-center my-2 bg-[#FFFFFF1A]"
|
||
|
|
>
|
||
|
|
<div className="mr-2 bg-white rounded-lg w-[50px] h-[50px]">
|
||
|
|
{/* <NativeImage
|
||
|
|
// style={{ transform: [{ scale: 0.9 }] }}
|
||
|
|
width={120}
|
||
|
|
height={120}
|
||
|
|
source={data.thumbnail.images[0].urls[0]}
|
||
|
|
/> */}
|
||
|
|
</div>
|
||
|
|
<div
|
||
|
|
className="flex flex-row justify-between flex-1 px-4 items-center"
|
||
|
|
onClick={() => {
|
||
|
|
if (data?.hyperlinks) {
|
||
|
|
// const linkAndParams = goToPage(
|
||
|
|
// data?.hyperlinks[1]?.params
|
||
|
|
// );
|
||
|
|
// if (linkAndParams) {
|
||
|
|
// typeof linkAndParams === "object"
|
||
|
|
// ? router.push(...linkAndParams)
|
||
|
|
// : router.push(linkAndParams);
|
||
|
|
// }
|
||
|
|
router.push(data?.hyperlinks[1]?.params);
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<span className="text-base font-medium mr-2">
|
||
|
|
{hasLink.text}
|
||
|
|
</span>
|
||
|
|
<div>
|
||
|
|
<FontAwesomeIcon
|
||
|
|
icon={faAngleRight}
|
||
|
|
style={{ maxWidth: "12px" }}
|
||
|
|
size="xl"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
{/* 时间 */}
|
||
|
|
<div>
|
||
|
|
<span className="text-xs text-[#FFFFFF80]">
|
||
|
|
{formatTimestamp(data?.push_time)}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|