224 lines
8.5 KiB
JavaScript
224 lines
8.5 KiB
JavaScript
import { View, TouchableOpacity, Text, Alert } from "react-native";
|
||
import React from "react";
|
||
import { Icon } from "@rneui/themed";
|
||
import { useTailwind } from "tailwind-rn";
|
||
import { formatDate, goToPage } from "../../../../utils/tools";
|
||
import { Image } from "expo-image";
|
||
import Toast from "react-native-toast-message";
|
||
import * as Linking from "expo-linking";
|
||
import dayjs from "dayjs";
|
||
export default function NoticeItem({ navigation, leftIcon, hasLink, data }) {
|
||
const tailwind = useTailwind();
|
||
// const currentLink = useMemo(() => {
|
||
// if (hasLink && data?.hyperlinks) {
|
||
// const hasAppLink = data.hyperlinks.filter(
|
||
// (it) => it.action === "app_router_path"
|
||
// )[0];
|
||
// return hasAppLink ?? null;
|
||
// }
|
||
// }, [data]);
|
||
//日期格式
|
||
const renderDay = (time) => {
|
||
const now = dayjs();
|
||
if (now.diff(dayjs(time * 1000), "hour") - now.hour() < 1) {
|
||
return dayjs(time * 1000).format("HH:mm");
|
||
} else if (now.diff(dayjs(time * 1000), "hour") - now.hour() < 24) {
|
||
return "昨天" + dayjs(time * 1000).format("HH:mm");
|
||
} else {
|
||
return dayjs(time * 1000).format("MM-DD");
|
||
}
|
||
};
|
||
return (
|
||
<View
|
||
style={{
|
||
...tailwind("bg-[#FFFFFF1A] rounded-2xl mb-2"),
|
||
paddingHorizontal: 24,
|
||
paddingVertical: 18,
|
||
}}
|
||
>
|
||
<View style={tailwind("flex flex-row")}>
|
||
<View style={tailwind("flex-1")}>
|
||
{/* 内容 */}
|
||
<View>
|
||
{/* 文本内容 */}
|
||
<View style={{ ...tailwind("flex-row items-center") }}>
|
||
{/* 头像 */}
|
||
<View
|
||
style={{
|
||
...tailwind(
|
||
"flex justify-center items-center rounded-full mr-2"
|
||
),
|
||
width: 28,
|
||
height: 28,
|
||
}}
|
||
>
|
||
{/* <Icon type="ionicon" name="megaphone" size={24} color="white" /> */}
|
||
{leftIcon}
|
||
</View>
|
||
<Text style={tailwind("text-lg text-white font-medium mr-2")}>
|
||
{data?.title}
|
||
</Text>
|
||
</View>
|
||
<Text style={tailwind("text-base text-white font-medium my-2")}>
|
||
{data?.message}
|
||
</Text>
|
||
{/* 链接跳转 */}
|
||
{!!data?.link_text && (
|
||
<TouchableOpacity
|
||
onPress={() => {
|
||
console.log("此链接已失效", data.is_valid);
|
||
if (!data.is_valid) {
|
||
Toast.show({
|
||
type: "error",
|
||
text1: "此链接已失效",
|
||
topOffset: 60,
|
||
});
|
||
return;
|
||
}
|
||
if (data?.hyperlinks) {
|
||
// const linkStr = goToPage(data?.hyperlinks[0]?.params);
|
||
const links = data?.hyperlinks;
|
||
let link = null;
|
||
if (links.length > 1) {
|
||
link = links.filter((it) => it.action === "inward")[0]
|
||
?.params;
|
||
} else {
|
||
link = links[0]?.params;
|
||
}
|
||
const linkAndParams = goToPage({
|
||
url: link,
|
||
action: links[0]?.action,
|
||
});
|
||
if (typeof linkAndParams === "string") {
|
||
if (
|
||
links[0]?.action === "webViewHeaderInward" ||
|
||
links[0]?.action === "webViewHeaderOutward"
|
||
) {
|
||
navigation.navigate("WebWithHeader", {
|
||
title: "",
|
||
uri: linkAndParams,
|
||
});
|
||
return;
|
||
} else if (
|
||
links[0]?.action === "webViewWithOutHeaderInward" ||
|
||
links[0]?.action === "webViewWithOutHeaderOutward"
|
||
) {
|
||
navigation.navigate("WebWithoutHeader", {
|
||
title: "",
|
||
uri: linkAndParams,
|
||
});
|
||
return;
|
||
}
|
||
try {
|
||
// 尝试启动微信客户端
|
||
Linking.openURL(linkAndParams).catch(() => {
|
||
// 启动微信客户端失败，弹出提示安装对话框
|
||
Alert.alert(
|
||
"错误提醒",
|
||
"打开链接失败，请返回重试或者联系在线客服",
|
||
[{ text: "确认", style: "cancel" }],
|
||
{ cancelable: false }
|
||
);
|
||
});
|
||
} catch (error) {
|
||
// 启动微信客户端失败，继续加载URL
|
||
console.error(error);
|
||
}
|
||
} else {
|
||
navigation.navigate(...linkAndParams);
|
||
}
|
||
// if (linkAndParams) {
|
||
// if (typeof linkAndParams === "object") {
|
||
// navigation.navigate(...linkAndParams);
|
||
// } else {
|
||
// // if (linkAndParams.indexOf("JoinStreamer") != -1) {
|
||
// // navigation.navigate("StreamerVerification", {
|
||
// // screen: "JoinStreamer",
|
||
// // });
|
||
// // } else if (
|
||
// // linkAndParams.indexOf(
|
||
// // "CompleteStreamerInformation"
|
||
// // ) != -1
|
||
// // ) {
|
||
// // navigation.navigate("StreamerVerification", {
|
||
// // screen: "CompleteStreamerInformation",
|
||
// // });
|
||
// // return;
|
||
// // }
|
||
// navigation.navigate(linkAndParams);
|
||
// }
|
||
// }
|
||
// console.log(linkStr);
|
||
|
||
// if (linkStr.indexOf("JoinStreamer") != -1) {
|
||
// navigation.navigate("StreamerVerification", {
|
||
// screen: "JoinStreamer",
|
||
// });
|
||
// return;
|
||
// } else if (
|
||
// linkStr.indexOf("CompleteStreamerInformation") != -1
|
||
// ) {
|
||
// navigation.navigate("StreamerVerification", {
|
||
// screen: "CompleteStreamerInformation",
|
||
// });
|
||
// return;
|
||
// }
|
||
// navigation.navigate(linkStr);
|
||
}
|
||
}}
|
||
style={{
|
||
...tailwind("rounded-xl p-2 flex flex-row items-center my-2"),
|
||
backgroundColor: "#FFFFFF1A",
|
||
}}
|
||
>
|
||
<View
|
||
style={{
|
||
...tailwind("mr-2 bg-white rounded-lg"),
|
||
width: 50,
|
||
height: 50,
|
||
}}
|
||
>
|
||
<Image
|
||
style={tailwind("h-full rounded-lg")}
|
||
source={data.thumbnail?.images[0].urls[0]}
|
||
contentFit="cover"
|
||
transition={100}
|
||
cachePolicy="disk"
|
||
/>
|
||
</View>
|
||
|
||
<View
|
||
style={{
|
||
...tailwind("flex flex-row justify-between flex-1 px-4"),
|
||
alignItems: "center",
|
||
}}
|
||
>
|
||
<Text
|
||
style={tailwind("text-base text-white font-medium mr-2")}
|
||
>
|
||
{hasLink.text}
|
||
</Text>
|
||
<View>
|
||
<Icon
|
||
type="ionicon"
|
||
name="chevron-forward"
|
||
color="white"
|
||
size={24}
|
||
/>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
)}
|
||
</View>
|
||
{/* 时间 */}
|
||
<View>
|
||
<Text style={{ ...tailwind("text-xs"), color: "#FFFFFF80" }}>
|
||
{renderDay(data?.push_time || data?.ct)}
|
||
</Text>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
);
|
||
}
|