修改问题

This commit is contained in:
al 2024-07-15 20:00:44 +08:00
parent 988ed7d7cb
commit 56bee22165
12 changed files with 278 additions and 205 deletions

View File

@ -2,13 +2,10 @@
import React, { useState, useRef, useEffect, useCallback } from "react"; import React, { useState, useRef, useEffect, useCallback } from "react";
import baseRequest from "@/utils/baseRequest";
import { generateSignature } from "@/utils/crypto";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleLeft } from "@fortawesome/free-solid-svg-icons"; import { faAngleLeft } from "@fortawesome/free-solid-svg-icons";
import { Input, Button, Toast, Avatar, DotLoading } from "antd-mobile"; import { Input, Button, Toast, Avatar, DotLoading } from "antd-mobile";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
const blurhash = "LcKUTa%gOYWBYRt6xuoJo~s8V@fk";
import { get } from "@/utils/storeInfo"; import { get } from "@/utils/storeInfo";
import require from "@/utils/require"; import require from "@/utils/require";
import { formatDeadline } from "@/utils/tools"; import { formatDeadline } from "@/utils/tools";
@ -60,7 +57,7 @@ export default function MessageDetail({}) {
scrollBox.current?.scrollTo(0, scrollBox.current.scrollHeight+50); scrollBox.current?.scrollTo(0, scrollBox.current.scrollHeight+50);
toScrollBottom.current = 0; toScrollBottom.current = 0;
} }
}, [toScrollBottom.current]); }, [messages]);
// useEffect(() => { // useEffect(() => {
// if (offset == 12) { // if (offset == 12) {
// console.log("offset--------", offset); // console.log("offset--------", offset);
@ -355,7 +352,7 @@ export default function MessageDetail({}) {
}} }}
/> />
</div> </div>
<p className="text-base text-center">在线</p> <p className="text-base text-center">在线</p>
</div> </div>
<div> <div>
<div className="my-[57px]"> <div className="my-[57px]">

View File

@ -15,7 +15,6 @@ export default function EditUserName() {
useEffect(() => { useEffect(() => {
const getName = async () => { const getName = async () => {
setName(account.name); setName(account.name);
}; };
getName(); getName();

View File

@ -10,7 +10,6 @@ import { get } from "@/utils/storeInfo";
import require from "@/utils/require"; import require from "@/utils/require";
const My = () => { const My = () => {
const [userInfo, setUserInfo] = useState({}); const [userInfo, setUserInfo] = useState({});
const searchParams = useSearchParams();
const router = useRouter(); const router = useRouter();
useEffect(() => { useEffect(() => {
const userInfo = get("account"); const userInfo = get("account");
@ -60,6 +59,7 @@ const My = () => {
/> />
</div> </div>
</div> </div>
{userInfo?.role === 3 ? (
<div <div
className="flex items-center justify-between mb-4" className="flex items-center justify-between mb-4"
onClick={() => router.push("profile/" + userInfo.mid)} onClick={() => router.push("profile/" + userInfo.mid)}
@ -67,7 +67,6 @@ const My = () => {
<div className="flex items-center"> <div className="flex items-center">
<Avatar <Avatar
rounded-full rounded-full
mr-4
src={userInfo.avatar?.images[0].urls[0]} src={userInfo.avatar?.images[0].urls[0]}
className="mr-4" className="mr-4"
style={{ "--size": "76px", "--border-radius": "50%" }} style={{ "--size": "76px", "--border-radius": "50%" }}
@ -96,6 +95,33 @@ const My = () => {
}} }}
/> />
</div> </div>
) : (
<div
className="flex items-center justify-between mb-4"
>
<div className="flex items-center">
<Avatar
rounded-full
src={userInfo.avatar?.images[0].urls[0]}
className="mr-4"
style={{ "--size": "76px", "--border-radius": "50%" }}
/>
<div>
<p className="text-2xl font-bold">{userInfo.name}</p>
<div className="h-4 flex items-center text-xs bg-[#ffffff18] rounded-full px-2 py-2.5 mt-1 w-max">
<Image
src="/icons/info/ID.png"
width={14}
height={14}
className="w-4 h-full mr-1"
placeholder=""
/>
<span>{userInfo.user_id}</span>
</div>
</div>
</div>
</div>
)}
<ul className="grid grid-cols-4 mb-4"> <ul className="grid grid-cols-4 mb-4">
<li <li
className="text-center" className="text-center"
@ -257,7 +283,10 @@ const My = () => {
className="h-4 text-gray-300" className="h-4 text-gray-300"
/> />
</li> </li>
<li className="flex justify-between items-center p-3 py-2" onClick={()=>router.push("my/unlockedWechat")}> <li
className="flex justify-between items-center p-3 py-2"
onClick={() => router.push("my/unlockedWechat")}
>
<div className="flex items-center"> <div className="flex items-center">
<Image <Image
className="mr-2" className="mr-2"

View File

@ -10,6 +10,7 @@ import {
Toast, Toast,
} from "antd-mobile"; } from "antd-mobile";
import { useRouter, useParams } from "next/navigation"; import { useRouter, useParams } from "next/navigation";
import Link from "next/link";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { import {
faAngleLeft, faAngleLeft,
@ -24,6 +25,7 @@ import { handleFollow, checkRelation } from "@/api/public";
import { getStreamerDetailInfo } from "@/api/space"; import { getStreamerDetailInfo } from "@/api/space";
import { get } from "@/utils/storeInfo"; import { get } from "@/utils/storeInfo";
import { handleShowVideos } from "@/utils/tools/handleFuns"; import { handleShowVideos } from "@/utils/tools/handleFuns";
import clipboard from "copy-to-clipboard";
// import * as Clipboard from "expo-clipboard"; // import * as Clipboard from "expo-clipboard";
export default function PersonSpace() { export default function PersonSpace() {
const { mid } = useParams(); const { mid } = useParams();
@ -99,6 +101,16 @@ export default function PersonSpace() {
const temIsFollowed = await checkRelation(subMid, objMid, 0); const temIsFollowed = await checkRelation(subMid, objMid, 0);
setIsFollow(temIsFollowed); setIsFollow(temIsFollowed);
}; };
//保存内容到剪贴板
const copy = (_data) => {
console.log("_data",_data)
clipboard(_data);
Toast.show({
icon: "success",
content: "已复制到剪贴板",
position: "top",
});
};
return ( return (
<div className="h-screen overflow-x-hidden overflow-y-auto"> <div className="h-screen overflow-x-hidden overflow-y-auto">
<div className="flex justify-between items-center p-4 fixed top-0 z-10 w-full"> <div className="flex justify-between items-center p-4 fixed top-0 z-10 w-full">
@ -234,9 +246,7 @@ export default function PersonSpace() {
/> />
<span>{streamerInfo?.streamer_ext?.user_id}</span> <span>{streamerInfo?.streamer_ext?.user_id}</span>
</li> </li>
<li <li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1">
className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1"
>
<Image <Image
src="/icons/info/fan.png" src="/icons/info/fan.png"
width={14} width={14}
@ -353,12 +363,12 @@ export default function PersonSpace() {
{spaceData?.previews?.images?.map((item, index) => ( {spaceData?.previews?.images?.map((item, index) => (
<div <div
key={item.id} key={item.id}
className="w-20 h-20 overflow-hidden rounded" className="w-20 h-20 overflow-hidden rounded mr-1"
> >
<Image <Image
width="20vw" width="20vw"
height="20vw" height="20vw"
className={`rounded mr-2 ${!!index && "imageBlur"}`} className={`rounded mr-2 ${spaceData?.visitor_role === 4 && "imageBlur"}`}
fit="cover" fit="cover"
src={item.urls[0]} src={item.urls[0]}
/> />
@ -368,7 +378,6 @@ export default function PersonSpace() {
</div> </div>
</div> </div>
{streamerInfo?.streamer_ext?.platforms && (
<> <>
<Divider /> <Divider />
<div> <div>
@ -385,7 +394,7 @@ export default function PersonSpace() {
/> />
<div className="text-base"> <div className="text-base">
<span>微信</span> <span>微信</span>
<span>点击查看</span> <span className="text-sky-600" onClick={() => setVisible(true)}>点击查看</span>
</div> </div>
</div> </div>
</li> </li>
@ -409,9 +418,9 @@ export default function PersonSpace() {
<div className="flex text-sm"> <div className="flex text-sm">
<div <div
className="flex items-center mr-6" className="flex items-center mr-6"
// onClick={() => { onClick={() => {
// Clipboard.setStringAsync(item.url); copy(item.url);
// }} }}
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faCopy} icon={faCopy}
@ -426,7 +435,7 @@ export default function PersonSpace() {
size="xl" size="xl"
className="h-3 mr-1" className="h-3 mr-1"
/> />
<span>前往</span> <Link href={item?.url}>前往</Link>
</div> </div>
</div> </div>
</li> </li>
@ -434,7 +443,6 @@ export default function PersonSpace() {
</ul> </ul>
</div> </div>
</> </>
)}
</div> </div>
<div className="flex justify-between items-center px-4 py-4 fixed bottom-0 bg-deepBg w-full border-t-2 border-[#FFFFFF1A]"> <div className="flex justify-between items-center px-4 py-4 fixed bottom-0 bg-deepBg w-full border-t-2 border-[#FFFFFF1A]">
<div <div
@ -457,6 +465,7 @@ export default function PersonSpace() {
price={streamerInfo?.streamer_ext?.wechat_coin_price} price={streamerInfo?.streamer_ext?.wechat_coin_price}
name={streamerInfo?.streamer_ext?.name} name={streamerInfo?.streamer_ext?.name}
streamerMid={streamerInfo?.streamer_ext?.mid} streamerMid={streamerInfo?.streamer_ext?.mid}
avatar={streamerInfo?.streamer_ext?.avatar?.images[0]?.urls[0]}
streamerData={streamerInfo} streamerData={streamerInfo}
/> />
</div> </div>

View File

@ -156,7 +156,7 @@ const ZoneItem = ({ data, showMore }) => {
return ( return (
<List.Item <List.Item
className="!p-0" className="!p-0"
onClick={() => router.push(`/space/${data.mid}`)} onClick={() => router.push(`space/profile/${data.mid}`)}
key={data.id} key={data.id}
arrow={false} arrow={false}
> >

View File

@ -165,6 +165,7 @@ export default function Space() {
<Swiper.Item> <Swiper.Item>
{!activeIndex && ( {!activeIndex && (
<div> <div>
{!loading ? (
<div className="px-4 pb-8"> <div className="px-4 pb-8">
{dataList.length > 0 ? ( {dataList.length > 0 ? (
<ul className="grid grid-cols-2 gap-2 overflow-y-auto"> <ul className="grid grid-cols-2 gap-2 overflow-y-auto">
@ -197,12 +198,12 @@ export default function Space() {
className="mt-4" className="mt-4"
src="/icons/rightarrow_border.png" src="/icons/rightarrow_border.png"
/> />
<Image {/* <Image
width={32} width={32}
height={32} height={32}
className="absolute bottom-0 right-0" className="absolute bottom-0 right-0"
src="/icons/magnifier.png" src="/icons/magnifier.png"
/> /> */}
</div> </div>
</div> </div>
</div> </div>
@ -231,8 +232,7 @@ export default function Space() {
</div> </div>
)} )}
</div> </div>
) : (
{loading && (
<div <div
className="w-full text-center flex items-center justify-center" className="w-full text-center flex items-center justify-center"
style={{ height: scrollHeight - 60 + "px" }} style={{ height: scrollHeight - 60 + "px" }}
@ -323,13 +323,13 @@ const VisitingCard = ({ data }) => {
<span className="font-bold overflow-hidden whitespace-nowrap text-ellipsis"> <span className="font-bold overflow-hidden whitespace-nowrap text-ellipsis">
{data?.streamer_ext?.name} {data?.streamer_ext?.name}
</span> </span>
<ul className="ml-2"> <ul className="flex ml-2">
{data?.admission_price !== 0 && ( {data.visitor_role === 3 && (
<li className="text-[10px] bg-primary rounded px-1 mr-1 whitespace-nowrap"> <li className="text-[10px] bg-primary rounded px-1 mr-1 whitespace-nowrap">
付费 创建者
</li> </li>
)} )}
{data.visitor_role === 3 && ( {data?.admission_price !== 0 && (
<li className="text-[10px] bg-primary rounded px-1 mr-1 whitespace-nowrap"> <li className="text-[10px] bg-primary rounded px-1 mr-1 whitespace-nowrap">
付费 付费
</li> </li>

View File

@ -4,7 +4,12 @@ import React, { useEffect, useState, useRef } from "react";
import { Image, ImageViewer, Dialog } from "antd-mobile"; import { Image, ImageViewer, Dialog } from "antd-mobile";
import { useRouter, useParams } from "next/navigation"; import { useRouter, useParams } from "next/navigation";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleLeft, faAngleRight,faClose,faSave } from "@fortawesome/free-solid-svg-icons"; import {
faAngleLeft,
faAngleRight,
faClose,
faSave,
} from "@fortawesome/free-solid-svg-icons";
import AddWeChat from "@/components/AddWeChat"; import AddWeChat from "@/components/AddWeChat";
import { getStreamerInfo } from "@/api/space"; import { getStreamerInfo } from "@/api/space";
export default function PersonSpaceIntroduce() { export default function PersonSpaceIntroduce() {
@ -24,6 +29,9 @@ export default function PersonSpaceIntroduce() {
getStreamerInfo(Number(mid)).then((res) => { getStreamerInfo(Number(mid)).then((res) => {
setData(res); setData(res);
if (res?.visitor_role!=4) {
router.push("/space/" + mid);
}
console.log("mid", mid, res); console.log("mid", mid, res);
}); });
}, []); }, []);

View File

@ -17,7 +17,6 @@ export default function AddWeChat({
}) { }) {
const [isMoneyEnough, setIsMoneyEnough] = useState(true); const [isMoneyEnough, setIsMoneyEnough] = useState(true);
//是否已经解锁微信 //是否已经解锁微信
const [isWechatUnlocked, setIsWechatUnlocked] = useState(false);
const [streamerDetailData, setStreamerDetailData] = useState(null); const [streamerDetailData, setStreamerDetailData] = useState(null);
const [wechat, setWechat] = useState(<DotLoading/>); const [wechat, setWechat] = useState(<DotLoading/>);
const router = useRouter(); const router = useRouter();
@ -31,13 +30,13 @@ export default function AddWeChat({
}, [streamerData]); }, [streamerData]);
useEffect(() => { useEffect(() => {
console.log("avatar",avatar) console.log("avatar",avatar)
if (!streamerDetailData && !streamerDetailData?.is_unlock_wechat) return; if (!streamerDetailData || !streamerDetailData?.is_unlock_wechat) return;
require("POST", "/api/vas/query_wechat", { require("POST", "/api/vas/query_wechat", {
body: { body: {
uid: streamerMid, uid: streamerMid,
}, },
}).then(res=>{ }).then(res=>{
setWechat(res.data.wechat_contact) setWechat(res.data?.wechat_contact)
}) })
}, [streamerDetailData]); }, [streamerDetailData]);

View File

@ -1,7 +1,7 @@
"use client"; "use client";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { Image, ImageViewer, Dialog } from "antd-mobile"; import { Image, ImageViewer, Dialog, Swiper } from "antd-mobile";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleUp, faClose, faSave } from "@fortawesome/free-solid-svg-icons"; import { faAngleUp, faClose, faSave } from "@fortawesome/free-solid-svg-icons";
@ -10,27 +10,44 @@ const tabItems = [
{ key: "follow", title: "关注" }, { key: "follow", title: "关注" },
]; ];
export default function Photos({ media }) { export default function Photos({ isUnlocked, mediaAmount, media }) {
const [seeAllPhotos, setSeeAllPhotos] = useState(false); const [seeAllPhotos, setSeeAllPhotos] = useState(false);
const [currentPhotos, setCurrentPhotos] = useState([]); const [currentPhotos, setCurrentPhotos] = useState([]);
const [photos, setPhotos] = useState([]); const [photos, setPhotos] = useState([]);
useEffect(() => { useEffect(() => {
if (media) { if (media) {
let imgArr = media.images.map(item=>({type:"img",url:item.urls?.[0]})) let imgArr = media.images.map((item) => ({
let videoArr = media.videos.map(item=>({type:"video",url:item.cover_urls?.[0],mp4:item.urls?.[0]})) type: "img",
let arr=[...imgArr,...videoArr] url: item.urls?.[0],
}));
let videoArr = media.videos.map((item) => ({
type: "video",
url: item.cover_urls?.[0],
mp4: item.urls?.[0],
}));
let arr = [...imgArr, ...videoArr];
let newPhotos = [...arr]; let newPhotos = [...arr];
setPhotos(arr);
if (arr.length > 9) { if (mediaAmount && !isUnlocked) {
newPhotos = Array(mediaAmount)
.fill(null)
.map((item, index) => {
return newPhotos[index]
? newPhotos[index]
: { url: newPhotos[0]?.url, type: "hid" };
});
}
setPhotos(newPhotos);
if (newPhotos.length > 9) {
newPhotos = newPhotos.slice(0, 9); newPhotos = newPhotos.slice(0, 9);
} }
console.log("newPhotos", newPhotos);
setCurrentPhotos(newPhotos); setCurrentPhotos(newPhotos);
} }
}, [media]); }, [media]);
const showPhotos = (photos, index) => { const showPhotos = (photos, index) => {
ImageViewer.Multi.show({ ImageViewer.Multi.show({
images: photos.map((item) => item.url), images: photos.map((item) => item?.url),
defaultIndex: index, defaultIndex: index,
}); });
}; };
@ -55,12 +72,10 @@ export default function Photos({ media }) {
height="100%" height="100%"
controls controls
className="w-screen h-[70vh] rounded-lg object-contain" className="w-screen h-[70vh] rounded-lg object-contain"
poster={video.url} poster={video?.url}
autoPlay={true}
> >
<source <source src={video.mp4} type="video/mp4" />
src={video.mp4}
type="video/mp4"
/>
您的浏览器不支持 Video 标签 您的浏览器不支持 Video 标签
</video> </video>
</div> </div>
@ -97,20 +112,26 @@ export default function Photos({ media }) {
}; };
return ( return (
<> <>
<div className={`grid ${currentPhotos.length > 1?"grid-cols-3 gap-1.5":"grid-cols-1"}`}> <div
className={`grid ${
currentPhotos.length > 1 ? "grid-cols-3 gap-1.5" : "grid-cols-1"
}`}
>
{currentPhotos.map((item, index) => { {currentPhotos.map((item, index) => {
return ( return (
<div <div
className="relative w-mfull" className="relative w-mfull"
key={index} key={index}
onClick={() => { onClick={() => {
if (item.type == "video") { if (item?.type == "video") {
handleShowVideo(item); handleShowVideo(item);
} else { } else {
showPhotos(photos, index); showPhotos(photos, index);
} }
}} }}
> >
{
<div className="overflow-hidden rounded">
<Image <Image
// lazy={true} // lazy={true}
placeholder={ placeholder={
@ -118,11 +139,15 @@ export default function Photos({ media }) {
} }
width={currentPhotos.length > 1 ? "24vw" : "100%"} width={currentPhotos.length > 1 ? "24vw" : "100%"}
height={currentPhotos.length > 1 ? "24vw" : "100%"} height={currentPhotos.length > 1 ? "24vw" : "100%"}
className={`rounded max-w-full`} className={`rounded max-w-full ${
item?.type == "hid" ? "imageBlur" : ""
}`}
fit="cover" fit="cover"
src={item.url} src={item?.url}
/> />
{item.type == "video" && ( </div>
}
{item?.type == "video" && (
<div className="absolute top-0 w-full h-full rounded flex justify-center items-center bg-[#33333348]"> <div className="absolute top-0 w-full h-full rounded flex justify-center items-center bg-[#33333348]">
<Image <Image
className="" className=""
@ -151,6 +176,7 @@ export default function Photos({ media }) {
</div> </div>
); );
})} })}
{seeAllPhotos && ( {seeAllPhotos && (
<div <div
className="flex justify-center items-center bg-[#33333348] rounded" className="flex justify-center items-center bg-[#33333348] rounded"

View File

@ -74,7 +74,13 @@ export default function PostItem({
)} )}
</div> </div>
<div className="mr-8"> <div className="mr-8">
{data.media_component && <Photos media={data.media_component} />} {data.media_component && (
<Photos
media={data.media_component}
isUnlocked={data.is_zone_moment_unlocked}
mediaAmount={data.media_amount}
/>
)}
{type == "space" && !isCreator && !!data.c_type && ( {type == "space" && !isCreator && !!data.c_type && (
<PaySpacePost <PaySpacePost
type={data.is_ironfan_visible ? "ironFan" : "superFan"} type={data.is_ironfan_visible ? "ironFan" : "superFan"}
@ -90,7 +96,7 @@ export default function PostItem({
{type == "post" ? ( {type == "post" ? (
<div <div
className="flex items-center" className="flex items-center"
onClick={() => router.push("/profile/" + data.mid)} onClick={() => router.push("/space/person_space_introduce/" + data.mid)}
> >
{data.is_active_within_a_week ? ( {data.is_active_within_a_week ? (
<> <>

View File

@ -35,7 +35,7 @@ export default function SeeTiefen({
expenditure / 100 expenditure / 100
} / ${ironfanship_price / 100}`}</p> } / ${ironfanship_price / 100}`}</p>
<p className="text-left my-2 text-sm text-[#FFFFFF40]"> <p className="text-left my-2 text-sm text-[#FFFFFF40]">
空间内累计消费达到1280即可成为 空间内累计消费达到{ironfanship_price / 100}即可成为
<span className="text-primary">铁粉</span> <span className="text-primary">铁粉</span>
可查看所有铁粉专享内容哟快来成为我的铁粉吧~ 可查看所有铁粉专享内容哟快来成为我的铁粉吧~
</p> </p>

View File

@ -109,8 +109,8 @@ export async function uploadImage(asset) {
}); });
if (uploadResponse.status === 200) { if (uploadResponse.status === 200) {
console.log(asset); // console.log(asset);
debugger // debugger
const info = await calculateFileMetadata(asset); const info = await calculateFileMetadata(asset);
const item = { const item = {
src_id: auth.directory + "/" + auth.filename, src_id: auth.directory + "/" + auth.filename,