添加banner

This commit is contained in:
al 2025-01-15 18:29:11 +08:00
parent b9df8af95c
commit 06808d0afe
8 changed files with 251 additions and 86 deletions

View File

@ -1,30 +1,74 @@
import { Text, View, Dimensions } from "react-native";
import { Text, View, Dimensions, TouchableOpacity } from "react-native";
import React from "react";
import Swiper from "react-native-swiper";
import { Image } from "expo-image";
import { useTailwind } from "tailwind-rn";
export default function Banner({ urls }) {
import * as Linking from "expo-linking";
import { goToPage } from "../../utils/tools";
export default function Banner({
navigation,
banners,
width = Dimensions.get("window").width - 40,
height = 160,
}) {
const tailwind = useTailwind();
const screenWidth = Dimensions.get("window").width;
return (
<Swiper
autoplay
width={screenWidth}
height={(screenWidth * 2) / 7}
width={width}
height={height}
paginationStyle={tailwind("bottom-2")}
activeDotStyle={tailwind("bg-fuchsia-400")}
>
{urls.map((url) => (
<View key={url} style={tailwind("px-2 py-1")}>
{/* <View
style={tailwind("flex flex-row justify-between w-full h-full bg-white")}
>
<Text style={tailwind("text-white")}>1</Text>
</View>
<View style={tailwind("flex flex-row justify-between w-full h-full")}>
<Text style={tailwind("text-white")}>2</Text>
</View>
<View style={tailwind("flex flex-row justify-between w-full h-full")}>
<Text style={tailwind("text-white")}>3</Text>
</View> */}
{banners.map((banner, index) => (
<TouchableOpacity
key={index}
style={tailwind("w-full h-full")}
onPress={() => {
console.log("Pressed", banner?.link);
const linkAndParams = goToPage(banner?.link);
console.log(linkAndParams);
if (typeof linkAndParams === "string") {
try {
//
Linking.openURL(linkAndParams).catch(() => {
//
Alert.alert(
"错误提醒",
"打开链接失败,请返回重试或者联系在线客服",
[{ text: "确认", style: "cancel" }],
{ cancelable: false }
);
});
} catch (error) {
// URL
console.error(error);
}
} else {
navigation.navigate(...linkAndParams);
}
}}
>
<Image
source={url}
source={banner.url}
contentFit="cover"
transition={1000}
cachePolicy="disk"
style={tailwind("w-full h-full rounded-lg overflow-hidden")}
/>
</View>
</TouchableOpacity>
))}
</Swiper>
);

View File

@ -36,7 +36,7 @@ const WebSocketComponent = ({ getData, state, changeCount }) => {
async function connect_socket() {
const appInfo = await get("app_info");
const base = await baseRequest();
if (socket && socket.readyState === 1) return;
if (socket && socket?.readyState === 1) return;
// WebSocket
socket = new WebSocket(
`${process.env.EXPO_PUBLIC_WEBSOCKET_URL}/ws?b_mid=${base.b_mid}&b_did=${base.b_did}&b_dt=1&b_token=${base.b_token}&b_ch${appInfo.b_ch}`
@ -60,10 +60,12 @@ const WebSocketComponent = ({ getData, state, changeCount }) => {
try {
const data = JSON.parse(temp);
if (data.t === 2 && data.msg.ping_interval) {
if (socket.readyState == WebSocket.OPEN) socket.send("ping");
if (socket && socket?.readyState == WebSocket.OPEN)
socket.send("ping");
interval = setInterval(() => {
// ping
if (socket.readyState == WebSocket.OPEN) socket.send("ping");
if (socket && socket?.readyState == WebSocket.OPEN)
socket.send("ping");
// ping
// socket.on("ping", () => {
// socket.senrd("pong");

View File

@ -108,6 +108,9 @@ const MessageList = ({ navigation, noticeCount, refInstance }) => {
const body = {
mid: base.b_mid,
};
const receive = await requireAPI("POST", "/api/notification/receive", {
body,
});
const _data = await requireAPI(
"POST",
"/api/notification/get_unread_count",
@ -128,7 +131,7 @@ const MessageList = ({ navigation, noticeCount, refInstance }) => {
(acc, cur) => acc + cur.unread_cnt,
0
);
dispatch(getNoticeCount(noticeCount));
setData(_data.data);
setInfoItems((old) => {
const newInfoItems = [...old];

View File

@ -5,6 +5,7 @@ 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";
export default function NoticeItem({ navigation, leftIcon, hasLink, data }) {
const tailwind = useTailwind();
// const currentLink = useMemo(() => {
@ -64,30 +65,64 @@ export default function NoticeItem({ navigation, leftIcon, hasLink, data }) {
}
if (data?.hyperlinks) {
// const linkStr = goToPage(data?.hyperlinks[0]?.params);
const linkAndParams = goToPage(data?.hyperlinks[0]?.params);
console.log("linkAndParams", data?.hyperlinks);
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);
}
const links = data?.hyperlinks;
let link = null;
if (links.length > 1) {
link = links.filter(
(it) => it.inward_action_type === "app"
)[0]?.params;
} else {
link = links[0]?.params;
}
const linkAndParams = goToPage({
url: link,
action: links[0]?.inward_action_type,
});
console.log("links", linkAndParams);
console.log("linkAndParams", {
url: link,
action: links[0]?.inward_action_type,
});
if (typeof linkAndParams === "string") {
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) {

View File

@ -13,11 +13,16 @@ import { get } from "../../../utils/storeInfo";
import baseRequest from "../../../utils/baseRequest";
import { generateSignature } from "../../../utils/crypto";
import { useNavigation } from "@react-navigation/native";
import Banner from "../../../components/Banner";
import requireAPI from "../../../utils/requireAPI";
import * as Linking from "expo-linking";
import { goToPage } from "../../../utils/tools";
export default function HostList() {
const navigation = useNavigation();
const tailwind = useTailwind();
const screenWidth = Dimensions.get("window").width;
const [hostList, setHostList] = useState([]);
const [bannerList, setBannerList] = useState([]);
useEffect(() => {
const getHostList = async () => {
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
@ -45,10 +50,53 @@ export default function HostList() {
console.error(error);
}
};
const getBannerList = async () => {
try {
const _data = await requireAPI(
"POST",
"/api/activity_banner/list",
null,
true
);
if (_data.ret === -1) {
Toast.show({
icon: "fail",
content: _data.msg,
position: "top",
});
return;
}
const bannerList = _data.data.list.map((item) => {
const links = item?.hyperlinks;
let link = null;
if (links.length > 1) {
link = links.filter((it) => it.inward_action_type === "app")[0]
?.url;
} else {
link = links[0]?.url;
}
return {
link: {
url: link,
action: links[0]?.inward_action_type,
},
url: item?.image.images[0]?.urls[0],
id: item?.id,
};
});
setBannerList(bannerList);
} catch (error) {
console.error(error);
}
};
getHostList();
getBannerList();
}, []);
return (
<View style={tailwind("flex-1 px-4 mt-2")}>
<View style={tailwind("flex-1 px-4")}>
<View style={tailwind("mb-4")}>
<Banner banners={bannerList} navigation={navigation} />
</View>
<View style={tailwind("flex flex-row justify-between items-center")}>
<Text style={tailwind("text-white text-xl font-medium")}>猜你想看</Text>
<TouchableOpacity
@ -70,14 +118,42 @@ export default function HostList() {
<View>
{hostList.length > 0 &&
hostList.map((item, index) => (
<ListItem
key={item.mid}
containerStyle={tailwind("p-0 bg-[#07050A]")}
>
<ListItem key={index} containerStyle={tailwind("p-0 bg-[#07050A]")}>
<TouchableOpacity
onPress={() =>
navigation.navigate("SpaceIntroduce", { mid: item.mid })
}
onPress={() => {
const links = item?.hyperlinks;
let link = null;
if (links.length > 1) {
link = links.filter(
(it) => it.inward_action_type === "app"
)[0]?.url;
} else {
link = links[0]?.url;
}
const linkAndParams = goToPage({
action: links[0]?.inward_action_type,
url: link,
});
if (typeof linkAndParams === "string") {
try {
//
Linking.openURL(linkAndParams).catch(() => {
//
Alert.alert(
"错误提醒",
"打开链接失败,请返回重试或者联系在线客服",
[{ text: "确认", style: "cancel" }],
{ cancelable: false }
);
});
} catch (error) {
// URL
console.error(error);
}
} else {
navigation.navigate(...linkAndParams);
}
}}
style={tailwind("flex-row py-3")}
>
<Image
@ -102,42 +178,46 @@ export default function HostList() {
/>
)}
<View
style={tailwind(
"flex-row items-center py-0.5 px-2 ml-1 bg-[#FFFFFF1A] rounded-full"
)}
>
<NativeImage
source={
item.gender
? require("../../../assets/icon/12DP/female.png")
: require("../../../assets/icon/12DP/male.png")
}
/>
<Text
style={tailwind(
"text-white text-xs font-medium ml-0.5"
)}
>
{item.age}
</Text>
</View>
<View
style={tailwind(
"flex-row items-center py-0.5 px-2 ml-1 bg-[#FFFFFF1A] rounded-full"
)}
>
<NativeImage
source={require("../../../assets/icon/12DP/location.png")}
/>
<Text
style={tailwind(
"text-white text-xs font-medium ml-0.5"
)}
>
{item.city}
</Text>
</View>
{!!item.age && (
<>
<View
style={tailwind(
"flex-row items-center py-0.5 px-2 ml-1 bg-[#FFFFFF1A] rounded-full"
)}
>
<NativeImage
source={
item.gender
? require("../../../assets/icon/12DP/female.png")
: require("../../../assets/icon/12DP/male.png")
}
/>
<Text
style={tailwind(
"text-white text-xs font-medium ml-0.5"
)}
>
{item.age}
</Text>
</View>
<View
style={tailwind(
"flex-row items-center py-0.5 px-2 ml-1 bg-[#FFFFFF1A] rounded-full"
)}
>
<NativeImage
source={require("../../../assets/icon/12DP/location.png")}
/>
<Text
style={tailwind(
"text-white text-xs font-medium ml-0.5"
)}
>
{item.city}
</Text>
</View>
</>
)}
</View>
<Text
style={tailwind("text-sm text-[#FFFFFF80]")}

View File

@ -753,7 +753,7 @@ export default function Search({ navigation, route }) {
}}
style={{
...tailwind(
"pl-4 flex-1 rounded-xl flex-row items-center justify-around"
"flex-1 rounded-xl flex-row items-center justify-around"
),
borderColor: "#ff75c8",
borderWidth: filtersValue.comprehensiveUsed.used ? 1 : 0,

View File

@ -73,14 +73,14 @@ export default function Stream({ navigation }) {
tabStyle={{ width: "auto" }}
renderIndicator={renderIndicator}
/>
<TouchableOpacity
{/* <TouchableOpacity
style={tailwind(
"flex items-center justify-center w-9 h-9 mr-4 bg-[#FFFFFF1A] rounded-full"
)}
onPress={() => navigation.navigate("Search")}
>
<NativeImage source={require("../../assets/icon/32DP/search.png")} />
</TouchableOpacity>
</TouchableOpacity> */}
</View>
),
[]

View File

@ -54,8 +54,9 @@ export function debounce(fn, delay) {
};
}
// 跳转页面
export function goToPage(link) {
let linkArr = link.split("?");
export function goToPage({ url, action }) {
if (action !== "app") return url;
let linkArr = url.split("?");
const params = linkArr[1]?.split("&");
if (!params) return linkArr[0];