116 lines
4.4 KiB
JavaScript
116 lines
4.4 KiB
JavaScript
import React from "react";
|
|
import { formatTimestamp } from "@/utils/tools";
|
|
import { Toast } from "antd-mobile";
|
|
import { useRouter } from "next/navigation";
|
|
import OwnImage from "@/components/OwnImage";
|
|
import OwnIcon from "@/components/OwnIcon";
|
|
import baseRequest from "@/utils/baseRequest";
|
|
|
|
export default function NoticeItem({ leftIcon, hasLink, data }) {
|
|
const router = useRouter();
|
|
const base = baseRequest();
|
|
|
|
return (
|
|
<div className="bg-[#FFFFFF1A] rounded-2xl mb-2 py-[24px] px-[18px]">
|
|
<div className="flex text-white">
|
|
<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 truncate">{data?.title}</p>
|
|
</div>
|
|
<pre className="text-base font-medium my-2 whitespace-pre-wrap">
|
|
{data?.message}
|
|
</pre>
|
|
{/* 链接跳转 */}
|
|
{data?.hyperlinks && data?.hyperlinks[0].action && (
|
|
<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]">
|
|
<OwnImage
|
|
outClassName="w-full h-full rounded-lg"
|
|
className="w-full h-full"
|
|
rounded="rounded-lg"
|
|
height="100%"
|
|
fit="cover"
|
|
src={data.thumbnail?.images[0].urls[0]}
|
|
/>
|
|
</div>
|
|
<div
|
|
className="flex flex-row justify-between flex-1 px-4 items-center"
|
|
onClick={() => {
|
|
if (!data.is_valid) {
|
|
Toast.show({
|
|
icon: "fail",
|
|
content: "此链接已失效",
|
|
position: "top",
|
|
});
|
|
return;
|
|
}
|
|
const links = data?.hyperlinks;
|
|
if (links) {
|
|
if (links.length > 1) {
|
|
links[1]?.action === "app_router_path";
|
|
router.push(links[1]?.params);
|
|
} else {
|
|
if (links[0]?.action === "outward") {
|
|
// 在新的标签也打开
|
|
window.open(links[0]?.params);
|
|
} else {
|
|
// alert(links[0]?.params);
|
|
// alert(encodeURIComponent(links[0]?.params));
|
|
router.push(
|
|
`/webView/${encodeURIComponent(
|
|
links[0]?.params +
|
|
(links[0]?.action ===
|
|
"webViewWithOutHeaderInward" ||
|
|
links[0]?.action === "webViewHeaderInward"
|
|
? `?base=${encodeURIComponent(
|
|
JSON.stringify(base)
|
|
)}`
|
|
: "")
|
|
)}`
|
|
);
|
|
}
|
|
}
|
|
}
|
|
}}
|
|
>
|
|
<span className="text-base font-medium mr-2">
|
|
{hasLink.text}
|
|
</span>
|
|
<div>
|
|
{/* <FontAwesomeIcon
|
|
icon={faAngleRight}
|
|
style={{ maxWidth: "12px" }}
|
|
size="xl"
|
|
/> */}
|
|
<OwnIcon
|
|
src="/icons/32DP/angleRight.png"
|
|
className="w-[20px] h-[20px]"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
{/* 时间 */}
|
|
<div>
|
|
<span className="text-xs text-[#FFFFFF80]">
|
|
{formatTimestamp(data?.push_time || data?.ct)}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|