anln_2.2 (#43)

Co-authored-by: al <al@cdhncy.com>
Reviewed-on: https://git.wishpal.cn/wishpal_ironfan/tiefen_space_h5/pulls/43
This commit is contained in:
yezian 2025-03-12 18:25:31 +08:00
parent ec2d00930b
commit 102db693a6
7 changed files with 100 additions and 41 deletions

View File

@ -39,7 +39,7 @@ export default function Found() {
const [activeIndex, setActiveIndex] = useState(0); const [activeIndex, setActiveIndex] = useState(0);
const [account, setAccount] = useState(null); const [account, setAccount] = useState(null);
const [scrollHeight, setScrollHeight] = useState(0); const [scrollHeight, setScrollHeight] = useState(0);
const [loading, setLoading] = useState(false);
// useEffect(() => { // useEffect(() => {
// const info = get("account"); // const info = get("account");
// console.log("info",info) // console.log("info",info)
@ -48,11 +48,14 @@ export default function Found() {
// } // }
// }, [] // }, []
// ) // )
const childrenFunc = () => { const childrenFunc = async () => {
setLoading(true);
if (!activeIndex) { if (!activeIndex) {
recommPostRef.current?.doRefresh(); await recommPostRef.current?.doRefresh();
setLoading(false);
} else { } else {
followPostRef.current?.doRefresh(); await followPostRef.current?.doRefresh();
setLoading(false);
} }
}; };
useEffect(() => { useEffect(() => {
@ -119,7 +122,9 @@ export default function Found() {
</Swiper.Item> </Swiper.Item>
</Swiper> </Swiper>
<div <div
className={`fixed bottom-[50px] right-4 z-[50] w-10 h-10 flex items-center justify-center bg-[#1d1d1d71] rounded-full`} className={`fixed bottom-[50px] right-4 z-[50] w-10 h-10 flex items-center justify-center bg-[#1d1d1d71] rounded-full ${
loading ? "animate-spin" : ""
}`}
style={{ zIndex: 999 }} style={{ zIndex: 999 }}
> >
<FontAwesomeIcon <FontAwesomeIcon

View File

@ -21,13 +21,17 @@ export default function MessageDetail({}) {
// const [hasMore, setHasMore] = useState(true); // const [hasMore, setHasMore] = useState(true);
const router = useRouter(); const router = useRouter();
const searchParams = useSearchParams(); const searchParams = useSearchParams();
const [oldMessages, setOldMessages] = useState([]); const [oldMessages, setOldMessages] = useState({
list: [],
isGetHistory: false,
});
const [messages, setMessages] = useState([]); const [messages, setMessages] = useState([]);
const [handledmessages, setHandledmessages] = useState([]); const [handledmessages, setHandledmessages] = useState([]);
const [sessionId, setSessionId] = useState(); const [sessionId, setSessionId] = useState();
const [userInfo, setUserInfo] = useState(null); const [userInfo, setUserInfo] = useState(null);
const [newMessage, setNewMessage] = useState(""); const [newMessage, setNewMessage] = useState("");
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [sendding, setSendding] = useState(false);
const [offset, setOffset] = useState(0); const [offset, setOffset] = useState(0);
const [more, setMore] = useState(1); const [more, setMore] = useState(1);
const scrollBox = useRef(); const scrollBox = useRef();
@ -60,9 +64,10 @@ export default function MessageDetail({}) {
}, []); }, []);
useEffect(() => { useEffect(() => {
const intervalId = setInterval(() => { const intervalId = setInterval(() => {
// debugger;
// console.log("oldMessages[0]", oldMessages[0]); // console.log("oldMessages[0]", oldMessages[0]);
if (oldMessages[0]) { if (oldMessages.list[0]) {
updateMessages(oldMessages[0]?.id, 0, oldMessages); updateMessages(oldMessages.list[0]?.id, 0, oldMessages.list);
// toScrollBottom.current = 1; // toScrollBottom.current = 1;
} }
}, 3000); // 间隔时间为3秒 }, 3000); // 间隔时间为3秒
@ -71,13 +76,14 @@ export default function MessageDetail({}) {
return () => { return () => {
clearInterval(intervalId); clearInterval(intervalId);
}; };
}, [oldMessages]); }, [oldMessages.list]);
useEffect(() => { useEffect(() => {
if (toScrollBottom.current) { // debugger;
if (toScrollBottom.current && !oldMessages.isGetHistory) {
scrollBox.current?.scrollTo(0, scrollBox.current.scrollHeight + 50); scrollBox.current?.scrollTo(0, scrollBox.current.scrollHeight + 50);
toScrollBottom.current = 0; toScrollBottom.current = 0;
} }
}, [messages]); }, [oldMessages.list, oldMessages.isGetHistory]);
useEffect(() => { useEffect(() => {
if (sessionId && userInfo.mid) { if (sessionId && userInfo.mid) {
loadEarlierHistory().then((res) => { loadEarlierHistory().then((res) => {
@ -190,7 +196,10 @@ export default function MessageDetail({}) {
} }
setOffset(data.data.offset); setOffset(data.data.offset);
setMore(data.data.more); setMore(data.data.more);
let mathNewMessages = handleData([...oldMessages, ...data.data.list]); let mathNewMessages = handleData(
[...oldMessages.list, ...data.data.list],
oldMessages.list.length > 0
);
// setMessages((prev) => [...prev, ...temMessages]); // setMessages((prev) => [...prev, ...temMessages]);
setLoading(false); setLoading(false);
return mathNewMessages; return mathNewMessages;
@ -212,6 +221,7 @@ export default function MessageDetail({}) {
//查询历史记录的时候后移一位,防止记录重复 //查询历史记录的时候后移一位,防止记录重复
setOffset((prev) => prev + 1); setOffset((prev) => prev + 1);
//请求接口发送私信 //请求接口发送私信
setSendding(true);
try { try {
const data = await requireAPI( const data = await requireAPI(
"POST", "POST",
@ -224,6 +234,7 @@ export default function MessageDetail({}) {
}, },
} }
); );
setSendding(false);
if (data.ret === -1) { if (data.ret === -1) {
Toast.show({ Toast.show({
icon: "error", icon: "error",
@ -240,6 +251,7 @@ export default function MessageDetail({}) {
}); });
} catch (error) { } catch (error) {
// console.error(error); // console.error(error);
setSendding(false);
} }
// //每次发送都缓存信息到本地 // //每次发送都缓存信息到本地
// addArr(`${selfData.mid}_to_${params.mid}_messages`, messages); // addArr(`${selfData.mid}_to_${params.mid}_messages`, messages);
@ -265,7 +277,7 @@ export default function MessageDetail({}) {
} }
} }
const handleData = (list) => { const handleData = (list, isGetHistory) => {
// console.log("list", list); // console.log("list", list);
const account = get("account"); const account = get("account");
const temMessages = list.map((item) => { const temMessages = list.map((item) => {
@ -293,7 +305,9 @@ export default function MessageDetail({}) {
user: { user: {
_id: 0, _id: 0,
name: "客服", name: "客服",
avatar: process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/images/icon.png", avatar:
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/images/icon_border.png",
}, },
}; };
} }
@ -301,7 +315,16 @@ export default function MessageDetail({}) {
// console.log("handledmessages......", handledmessages); // console.log("handledmessages......", handledmessages);
// console.log("[...messages, ...temMessages]", temMessages); // console.log("[...messages, ...temMessages]", temMessages);
setHandledmessages(temMessages); setHandledmessages(temMessages);
setOldMessages(list); setOldMessages((old) => {
// debugger;
if (old.list.length === list.length) {
return old;
} else {
// debugger;
return { list, isGetHistory: !!isGetHistory };
}
});
let newMessages = temMessages.reverse(); let newMessages = temMessages.reverse();
let mathNewMessages = newMessages.reduce( let mathNewMessages = newMessages.reduce(
(accumulator, currentValue, index, sourceArray) => { (accumulator, currentValue, index, sourceArray) => {
@ -415,11 +438,16 @@ export default function MessageDetail({}) {
<div className="my-2"> <div className="my-2">
<p>触发按钮</p> <p>触发按钮</p>
<ul className="grid grid-cols-2 gap-2 mt-2"> <ul className="grid grid-cols-2 gap-2 mt-2">
{btns.map((item) => { {btns.map((item, index) => {
return ( return (
<li <li
key={index}
onClick={() => { onClick={() => {
onSend(item, oldMessages[0]?.id || -1, oldMessages); onSend(
item,
oldMessages[0]?.id || -1,
oldMessages.list
);
}} }}
className="bg-[#3333331A] rounded text-center px-4 py-1" className="bg-[#3333331A] rounded text-center px-4 py-1"
> >
@ -436,7 +464,7 @@ export default function MessageDetail({}) {
} }
// data.m_type===1?it?.text.split("|")it?.text // data.m_type===1?it?.text.split("|")it?.text
}, },
[sessionId] [sessionId, oldMessages.list]
); );
return ( return (
<div className="bg-[#13121F] h-screen overflow-y-auto" ref={scrollBox}> <div className="bg-[#13121F] h-screen overflow-y-auto" ref={scrollBox}>
@ -549,9 +577,22 @@ export default function MessageDetail({}) {
<Button <Button
size="middle" size="middle"
block block
onClick={() => disabled={sendding}
onSend(newMessage, oldMessages[0]?.id || -1, oldMessages) onClick={() => {
} if (newMessage.includes("|")) {
Toast.show({
icon: "fail",
content: "消息不能包含|",
position: "top",
});
return;
}
onSend(
newMessage,
oldMessages.list[0]?.id || -1,
oldMessages.list
);
}}
style={{ style={{
"--background-color": "#FF669E", "--background-color": "#FF669E",
"--border-radius": "10px", "--border-radius": "10px",

View File

@ -181,6 +181,7 @@ export default function Relationship() {
hasMore={hasMore} hasMore={hasMore}
isEmpty={data.length == 0} isEmpty={data.length == 0}
showNoMore={data.length === 0} showNoMore={data.length === 0}
type="friendship"
/> />
</InfiniteScroll> </InfiniteScroll>
</List> </List>
@ -238,6 +239,7 @@ export default function Relationship() {
hasMore={hasMore} hasMore={hasMore}
isEmpty={data.length == 0} isEmpty={data.length == 0}
showNoMore={data.length === 0} showNoMore={data.length === 0}
type="friendship"
/> />
</InfiniteScroll> </InfiniteScroll>
</List> </List>

View File

@ -43,8 +43,6 @@ export default function Feedback() {
// console.log("media",media) // console.log("media",media)
const account = await get("account"); const account = await get("account");
debugger;
try { try {
const data = await requireAPI( const data = await requireAPI(
"POST", "POST",

View File

@ -250,7 +250,9 @@ const MessageList = ({ mid, changeNoticeCount, refInstance, noticeCount }) => {
</div> </div>
</div> </div>
<p className="text-xs text-[#FFFFFFB2]"> <p className="text-xs text-[#FFFFFFB2]">
{data?.recent_contact_cs_msg || "暂无新消息"} {(data?.recent_contact_cs_msg?.includes("|")
? data?.recent_contact_cs_msg?.split("|")[0]
: data?.recent_contact_cs_msg) || "暂无新消息"}
</p> </p>
</div> </div>
<div> <div>

View File

@ -321,6 +321,8 @@ const SpacesList = forwardRef(({ scrollHeight }, ref) => {
hasMore={hasMore} hasMore={hasMore}
isEmpty={spacesList.length == 0} isEmpty={spacesList.length == 0}
showNoMore={spacesList.length === 0} showNoMore={spacesList.length === 0}
zoneEmpty={true}
type="nospace"
/> />
</InfiniteScroll> </InfiniteScroll>
</div> </div>
@ -434,7 +436,12 @@ const SpacePostList = forwardRef(({ scrollHeight }, ref) => {
)} )}
{spacePostList?.map((item, index) => ( {spacePostList?.map((item, index) => (
<List.Item key={item.id + "_" + index} className="!p-0"> <List.Item key={item.id + "_" + index} className="!p-0">
<PostItem type="post" data={item} date={new Date(item.ct * 1000)} /> <PostItem
type="post"
showFollow={false}
data={item}
date={new Date(item.ct * 1000)}
/>
</List.Item> </List.Item>
))} ))}
{!spacePostList?.length && ( {!spacePostList?.length && (
@ -442,7 +449,7 @@ const SpacePostList = forwardRef(({ scrollHeight }, ref) => {
className={`flex flex-col items-center justify-center h-screen`} className={`flex flex-col items-center justify-center h-screen`}
style={{ height: `calc(100vh - 133px)` }} style={{ height: `calc(100vh - 133px)` }}
> >
<Empty type="nodata" /> <Empty type="nospace" />
</div> </div>
)} )}
</List> </List>

View File

@ -8,6 +8,8 @@ export default function InfiniteScrollContent({
hasMore = 0, hasMore = 0,
isEmpty, isEmpty,
showNoMore = true, showNoMore = true,
zoneEmpty = false,
type = "nodata",
}) { }) {
const router = useRouter(); const router = useRouter();
return ( return (
@ -24,21 +26,23 @@ export default function InfiniteScrollContent({
className={`flex flex-col items-center mt-28`} className={`flex flex-col items-center mt-28`}
// style={{ height: `${scrollHeight}px` }} // style={{ height: `${scrollHeight}px` }}
> >
<Empty type="nodata" /> <Empty type={type} />
<div className="text-white"> {zoneEmpty && (
<p <div className="text-white">
onClick={() => router.push("/search")} <p
className="text-base font-medium flex items-center justify-center bg-[#FFFFFF1A] mt-2 rounded-full w-[190px] h-[46px]" onClick={() => router.push("/search")}
> className="text-base font-medium flex items-center justify-center bg-[#FFFFFF1A] mt-2 rounded-full w-[190px] h-[46px]"
搜索空间 >
</p> 搜索空间
<p </p>
onClick={() => router.push("/found")} <p
className="text-base font-medium flex items-center justify-center bg-[#FFFFFF1A] mt-2 rounded-full w-[190px] h-[46px]" onClick={() => router.push("/found")}
> className="text-base font-medium flex items-center justify-center bg-[#FFFFFF1A] mt-2 rounded-full w-[190px] h-[46px]"
查看推荐 >
</p> 查看推荐
</div> </p>
</div>
)}
</div> </div>
)} )}
</> </>