修复document未定义问题

This commit is contained in:
al 2024-08-15 21:03:10 +08:00
parent 4f6c890380
commit 957abda50a
10 changed files with 235 additions and 119 deletions

View File

@ -36,6 +36,7 @@ export default function RootLayout({ children }) {
useEffect(() => { useEffect(() => {
// 禁止双指放大 // 禁止双指放大
window.onload = function () { window.onload = function () {
if (typeof window !== "undefined") {
document.addEventListener("touchstart", function (event) { document.addEventListener("touchstart", function (event) {
if (event.touches.length > 1) { if (event.touches.length > 1) {
event.preventDefault(); event.preventDefault();
@ -56,6 +57,7 @@ export default function RootLayout({ children }) {
document.addEventListener("gesturestart", function (event) { document.addEventListener("gesturestart", function (event) {
event.preventDefault(); event.preventDefault();
}); });
}
}; };
}, []); }, []);
useEffect(() => { useEffect(() => {

View File

@ -47,7 +47,28 @@ export default function PersonSpace() {
const showPhotos = (photos, index) => { const showPhotos = (photos, index) => {
currentIndex.current = index; currentIndex.current = index;
const interval = setInterval(() => { const interval = setInterval(() => {
console.log("bbbbbb") console.log("bbbbbb");
if (typeof window == "undefined") return;
document.addEventListener("touchstart", function (event) {
if (event.touches.length > 1) {
event.preventDefault();
}
});
var lastTouchEnd = 0;
document.addEventListener(
"touchend",
function (event) {
var now = new Date().getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
},
false
);
document.addEventListener("gesturestart", function (event) {
event.preventDefault();
});
const bodyBox = document.getElementsByClassName("photos-bodyBox")[0]; const bodyBox = document.getElementsByClassName("photos-bodyBox")[0];
if (bodyBox) { if (bodyBox) {
bodyBox.firstChild.lastChild.style.transform = `translateX(-${ bodyBox.firstChild.lastChild.style.transform = `translateX(-${
@ -57,7 +78,6 @@ export default function PersonSpace() {
} }
}, 400); }, 400);
handleShowImages(index, photos, interval); handleShowImages(index, photos, interval);
// setVisible(true) // setVisible(true)
@ -68,6 +88,7 @@ export default function PersonSpace() {
// ); // );
}; };
const handleShowImages = (index, photos, interval) => { const handleShowImages = (index, photos, interval) => {
if (typeof window == "undefined") return;
const mediaDom = document.createElement("div"); const mediaDom = document.createElement("div");
mediaDom.style.width = "100vw"; mediaDom.style.width = "100vw";
document.body.appendChild(mediaDom); document.body.appendChild(mediaDom);
@ -84,22 +105,27 @@ export default function PersonSpace() {
getContainer: mediaDom, getContainer: mediaDom,
onIndexChange: (index) => { onIndexChange: (index) => {
if (typeof window == "undefined") return;
currentIndex.current = index; currentIndex.current = index;
mediaDom.className = `${ mediaDom.className = `${
photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom" photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
}`; }`;
const leftBtn = document.getElementsByClassName("imagesBtnsControllerLeft")[0] const leftBtn = document.getElementsByClassName(
const rightBtn = document.getElementsByClassName("imagesBtnsControllerRight")[0] "imagesBtnsControllerLeft"
if(leftBtn && rightBtn){ )[0];
if(!index){ const rightBtn = document.getElementsByClassName(
leftBtn.style.opacity=0.5 "imagesBtnsControllerRight"
rightBtn.style.opacity=1 )[0];
}else if(index==photos.length-1){ if (leftBtn && rightBtn) {
leftBtn.style.opacity=1 if (!index) {
rightBtn.style.opacity=0.5 leftBtn.style.opacity = 0.5;
}else{ rightBtn.style.opacity = 1;
leftBtn.style.opacity=1 } else if (index == photos.length - 1) {
rightBtn.style.opacity=1 leftBtn.style.opacity = 1;
rightBtn.style.opacity = 0.5;
} else {
leftBtn.style.opacity = 1;
rightBtn.style.opacity = 1;
} }
} }
}, },
@ -244,7 +270,9 @@ export default function PersonSpace() {
} else { } else {
showPhotos( showPhotos(
topPhotos.filter((it) => it.type == "img"), topPhotos.filter((it) => it.type == "img"),
topPhotos.filter((it) => it.type == "img").indexOf(photo) topPhotos
.filter((it) => it.type == "img")
.indexOf(photo)
); );
} }
}} }}
@ -264,7 +292,10 @@ export default function PersonSpace() {
className="" className=""
width={98} width={98}
height={98} height={98}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/play.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/play.png"
}
/> />
</div> </div>
)} )}
@ -282,7 +313,12 @@ export default function PersonSpace() {
{streamerInfo?.streamer_ext?.name} {streamerInfo?.streamer_ext?.name}
</p> </p>
<div className="w-5 h-5"> <div className="w-5 h-5">
<Image src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/verification.png"} /> <Image
src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/verification.png"
}
/>
</div> </div>
</div> </div>
<ul className="flex"> <ul className="flex">
@ -300,7 +336,10 @@ export default function PersonSpace() {
<ul className="flex mb-1 flex-wrap"> <ul className="flex mb-1 flex-wrap">
<li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1"> <li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1">
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/ID.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/ID.png"
}
width={14} width={14}
height={14} height={14}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
@ -309,7 +348,10 @@ export default function PersonSpace() {
</li> </li>
<li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1"> <li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1">
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/fan.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/fan.png"
}
width={14} width={14}
height={14} height={14}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
@ -322,14 +364,20 @@ export default function PersonSpace() {
<li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1"> <li className="h-4 flex items-center text-xs bg-[#FFFFFF1A] rounded-full px-2 py-2.5 mb-1 mr-1">
{streamerInfo?.streamer_ext?.gender === 1 ? ( {streamerInfo?.streamer_ext?.gender === 1 ? (
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/female.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/female.png"
}
width={14} width={14}
height={14} height={14}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
/> />
) : ( ) : (
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/male.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/male.png"
}
width={14} width={14}
height={14} height={14}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
@ -345,7 +393,10 @@ export default function PersonSpace() {
<Image <Image
width={14} width={14}
height={14} height={14}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/height.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/height.png"
}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
/> />
<span className="text-white text-xs font-medium ml-0.5"> <span className="text-white text-xs font-medium ml-0.5">
@ -358,7 +409,10 @@ export default function PersonSpace() {
<Image <Image
width={14} width={14}
height={14} height={14}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/weight.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/weight.png"
}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
/> />
<span className="text-white text-xs font-medium ml-0.5"> <span className="text-white text-xs font-medium ml-0.5">
@ -371,7 +425,10 @@ export default function PersonSpace() {
<Image <Image
width={14} width={14}
height={14} height={14}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/constellation.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/constellation.png"
}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
/> />
<span className="text-white text-xs font-medium ml-0.5"> <span className="text-white text-xs font-medium ml-0.5">
@ -384,7 +441,10 @@ export default function PersonSpace() {
<Image <Image
width={14} width={14}
height={14} height={14}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/location.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/location.png"
}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
/> />
<span className="text-white text-xs font-medium ml-0.5"> <span className="text-white text-xs font-medium ml-0.5">
@ -394,11 +454,17 @@ export default function PersonSpace() {
)} )}
</ul> </ul>
{streamerInfo?.streamer_ext?.bio && ( {streamerInfo?.streamer_ext?.bio && (
<div className="whitespace-pre-wrap" style={{overflowWrap:"anywhere"}}><span className="text-[#ffffff88]">个性签名</span>{streamerInfo?.streamer_ext?.bio}</div> <div
className="whitespace-pre-wrap"
style={{ overflowWrap: "anywhere" }}
>
<span className="text-[#ffffff88]">个性签名</span>
{streamerInfo?.streamer_ext?.bio}
</div>
)} )}
</div> </div>
</div> </div>
{spaceData&&!!spaceData?.previews?.images?.length&& {spaceData && !!spaceData?.previews?.images?.length && (
<> <>
<Divider /> <Divider />
<div> <div>
@ -428,7 +494,9 @@ export default function PersonSpace() {
</div> </div>
</div> </div>
<div className="flex "> <div className="flex ">
{spaceData?.previews?.images?.slice(0,4).map((item, index) => ( {spaceData?.previews?.images
?.slice(0, 4)
.map((item, index) => (
<div <div
key={item.id} key={item.id}
className="w-20 h-20 overflow-hidden rounded mr-1" className="w-20 h-20 overflow-hidden rounded mr-1"
@ -448,7 +516,7 @@ export default function PersonSpace() {
</div> </div>
</div> </div>
</> </>
} )}
<> <>
<Divider /> <Divider />
@ -462,7 +530,10 @@ export default function PersonSpace() {
height={32} height={32}
width={32} width={32}
className="mr-2" className="mr-2"
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/images/platform_wechat.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/images/platform_wechat.png"
}
/> />
<div className="text-base"> <div className="text-base">
<span>微信</span> <span>微信</span>
@ -479,7 +550,7 @@ export default function PersonSpace() {
<li <li
key={item.id} key={item.id}
className="grid gap-1 justify-between border-[1.5px] border-[#ffffff43] rounded-xl p-2" className="grid gap-1 justify-between border-[1.5px] border-[#ffffff43] rounded-xl p-2"
style={{gridTemplateColumns:"calc(100% - 130px) 130px"}} style={{ gridTemplateColumns: "calc(100% - 130px) 130px" }}
> >
<div className="flex items-center"> <div className="flex items-center">
<Image <Image
@ -508,7 +579,10 @@ export default function PersonSpace() {
height={24} height={24}
width={24} width={24}
className="mr-1" className="mr-1"
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/copy.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/copy.png"
}
/> />
<span className="whitespace-nowrap">复制</span> <span className="whitespace-nowrap">复制</span>
</div> </div>
@ -522,9 +596,14 @@ export default function PersonSpace() {
height={24} height={24}
width={24} width={24}
className="mr-1" className="mr-1"
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/goto.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/goto.png"
}
/> />
<Link href={item?.url} className="whitespace-nowrap">前往</Link> <Link href={item?.url} className="whitespace-nowrap">
前往
</Link>
</div> </div>
</div> </div>
</li> </li>
@ -542,7 +621,11 @@ export default function PersonSpace() {
</div> </div>
<div <div
className="text-base bg-[#FFFFFF1A] py-2 px-6 rounded-full whitespace-nowrap" className="text-base bg-[#FFFFFF1A] py-2 px-6 rounded-full whitespace-nowrap"
onClick={() => router.push("/messageDetail?mid="+streamerInfo?.streamer_ext?.mid)} onClick={() =>
router.push(
"/messageDetail?mid=" + streamerInfo?.streamer_ext?.mid
)
}
> >
私聊 私聊
</div> </div>

View File

@ -144,20 +144,21 @@ export default function PersonSpace() {
setLoading(false); setLoading(false);
setOffset(data.data.offset); setOffset(data.data.offset);
setHasMore(data.data.more) setHasMore(data.data.more);
return data.data.list; return data.data.list;
} catch (error) { } catch (error) {
setLoading(false); setLoading(false);
} }
}; };
const firstRequest = (currentKey) => { const firstRequest = (currentKey) => {
if (typeof window == "undefined") return;
let floatingPanel = document.getElementsByClassName( let floatingPanel = document.getElementsByClassName(
"adm-floating-panel-content" "adm-floating-panel-content"
)[0]; )[0];
floatingPanel?.scrollTo(0, 0); floatingPanel?.scrollTo(0, 0);
setOffset(0); setOffset(0);
setHasMore(true); setHasMore(true);
if(!postList.length)return; if (!postList.length) return;
if (streamerInfo) { if (streamerInfo) {
getPostList(streamerInfo.id, currentKey, 0).then((res) => { getPostList(streamerInfo.id, currentKey, 0).then((res) => {
setPostList(res || []); setPostList(res || []);
@ -200,7 +201,7 @@ export default function PersonSpace() {
visitor_role: streamerInfo?.visitor_role, visitor_role: streamerInfo?.visitor_role,
avatar: avatar:
streamerInfo?.streamer_ext?.avatar?.images[0]?.urls[0], streamerInfo?.streamer_ext?.avatar?.images[0]?.urls[0],
admission_price:streamerInfo?.admission_price admission_price: streamerInfo?.admission_price,
}) })
) )
) )
@ -212,7 +213,9 @@ export default function PersonSpace() {
<div <div
className="bg-no-repeat bg-cover bg-center" className="bg-no-repeat bg-cover bg-center"
style={{ style={{
backgroundImage: `url(${streamerInfo?.streamer_ext?.cover?.images[0]?.urls[0] || ""})`, backgroundImage: `url(${
streamerInfo?.streamer_ext?.cover?.images[0]?.urls[0] || ""
})`,
}} }}
> >
<div className="px-4 pt-24 pb-8 bg-[#181818a9]"> <div className="px-4 pt-24 pb-8 bg-[#181818a9]">

View File

@ -43,7 +43,7 @@ export default function PersonSpaceIntroduce() {
const showPhotos = (photos, index) => { const showPhotos = (photos, index) => {
currentIndex.current = index; currentIndex.current = index;
const interval = setInterval(() => { const interval = setInterval(() => {
console.log("bbbbbb") if (typeof window == "undefined") return;
const bodyBox = document.getElementsByClassName("photos-bodyBox")[0]; const bodyBox = document.getElementsByClassName("photos-bodyBox")[0];
if (bodyBox) { if (bodyBox) {
bodyBox.firstChild.lastChild.style.transform = `translateX(-${ bodyBox.firstChild.lastChild.style.transform = `translateX(-${
@ -53,7 +53,6 @@ export default function PersonSpaceIntroduce() {
} }
}, 400); }, 400);
handleShowImages(index, photos, interval); handleShowImages(index, photos, interval);
// setVisible(true) // setVisible(true)
@ -64,6 +63,7 @@ export default function PersonSpaceIntroduce() {
// ); // );
}; };
const handleShowImages = (index, photos, interval) => { const handleShowImages = (index, photos, interval) => {
if (typeof window == "undefined") return;
const mediaDom = document.createElement("div"); const mediaDom = document.createElement("div");
mediaDom.style.width = "100vw"; mediaDom.style.width = "100vw";
document.body.appendChild(mediaDom); document.body.appendChild(mediaDom);
@ -80,22 +80,27 @@ export default function PersonSpaceIntroduce() {
getContainer: mediaDom, getContainer: mediaDom,
onIndexChange: (index) => { onIndexChange: (index) => {
if (typeof window == "undefined") return;
currentIndex.current = index; currentIndex.current = index;
mediaDom.className = `${ mediaDom.className = `${
photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom" photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
}`; }`;
const leftBtn = document.getElementsByClassName("imagesBtnsControllerLeft")[0] const leftBtn = document.getElementsByClassName(
const rightBtn = document.getElementsByClassName("imagesBtnsControllerRight")[0] "imagesBtnsControllerLeft"
if(leftBtn && rightBtn){ )[0];
if(!index){ const rightBtn = document.getElementsByClassName(
leftBtn.style.opacity=0.5 "imagesBtnsControllerRight"
rightBtn.style.opacity=1 )[0];
}else if(index==photos.length-1){ if (leftBtn && rightBtn) {
leftBtn.style.opacity=1 if (!index) {
rightBtn.style.opacity=0.5 leftBtn.style.opacity = 0.5;
}else{ rightBtn.style.opacity = 1;
leftBtn.style.opacity=1 } else if (index == photos.length - 1) {
rightBtn.style.opacity=1 leftBtn.style.opacity = 1;
rightBtn.style.opacity = 0.5;
} else {
leftBtn.style.opacity = 1;
rightBtn.style.opacity = 1;
} }
} }
}, },
@ -166,7 +171,10 @@ export default function PersonSpaceIntroduce() {
</p> </p>
<div className="h-4 flex items-center text-xs bg-[#ffffff18] rounded-full px-2 py-2.5 mb-1 w-max"> <div className="h-4 flex items-center text-xs bg-[#ffffff18] rounded-full px-2 py-2.5 mb-1 w-max">
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/info/ID.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/info/ID.png"
}
width={14} width={14}
height={14} height={14}
className="w-4 h-full mr-1" className="w-4 h-full mr-1"
@ -181,7 +189,10 @@ export default function PersonSpaceIntroduce() {
> >
<div className="w-9 h-9 flex items-center justify-center bg-[#1d1d1d71] rounded-full mb-1"> <div className="w-9 h-9 flex items-center justify-center bg-[#1d1d1d71] rounded-full mb-1">
<Image <Image
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/images/wechat.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/images/wechat.png"
}
width={22} width={22}
height={22} height={22}
className="w-4 h-full" className="w-4 h-full"
@ -226,7 +237,9 @@ export default function PersonSpaceIntroduce() {
className="" className=""
width={98} width={98}
height={98} height={98}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/play.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/icons/play.png"
}
placeholder="" placeholder=""
/> />
</div> </div>
@ -314,7 +327,10 @@ export default function PersonSpaceIntroduce() {
height={18} height={18}
placeholder="" placeholder=""
className="mr-2" className="mr-2"
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/money_pink.png"} src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL +
"/icons/money_pink.png"
}
/> />
)} )}
<span> <span>

View File

@ -17,7 +17,10 @@ import {
import { createRoot } from "react-dom/client"; import { createRoot } from "react-dom/client";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import baseRequest from "@/utils/baseRequest"; import baseRequest from "@/utils/baseRequest";
const root = createRoot(document?.getElementById("maskDomBox")); const root =
typeof window !== "undefined"
? createRoot(document?.getElementById("maskDomBox"))
: null;
function ImagesMask({}, ref) { function ImagesMask({}, ref) {
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [images, setImages] = useState([]); const [images, setImages] = useState([]);
@ -139,6 +142,7 @@ const ImagesMaskContaint = forwardRef(
fetch(url) fetch(url)
.then((res) => res.blob()) .then((res) => res.blob())
.then((blob) => { .then((blob) => {
if (typeof window == "undefined") return;
var a = document.createElement("a"); var a = document.createElement("a");
a.href = URL.createObjectURL(blob); a.href = URL.createObjectURL(blob);
a.download = randomNum + ".jpg"; a.download = randomNum + ".jpg";

View File

@ -244,6 +244,7 @@ export default function Photos({
onClick={() => { onClick={() => {
if (item?.type == "video") { if (item?.type == "video") {
if (!isUnlocked && type == "space") { if (!isUnlocked && type == "space") {
if (typeof window == "undefined") return;
const mediaDom = document.createElement("div"); const mediaDom = document.createElement("div");
document.body.appendChild(mediaDom); document.body.appendChild(mediaDom);
ImageViewer.show({ ImageViewer.show({

View File

@ -3,7 +3,7 @@ import { DotLoading, Image, ImageViewer } from "antd-mobile";
import { uploadImage, uploadVideo } from "@/utils/upload"; import { uploadImage, uploadVideo } from "@/utils/upload";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAdd, faClose } from "@fortawesome/free-solid-svg-icons"; import { faAdd, faClose } from "@fortawesome/free-solid-svg-icons";
export default function UploadImgs({assets, getImgs }) { export default function UploadImgs({ assets, getImgs }) {
const maxCount = 6; const maxCount = 6;
const [fileList, setFileList] = useState([]); const [fileList, setFileList] = useState([]);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
@ -14,14 +14,15 @@ export default function UploadImgs({assets, getImgs }) {
if (file.type.indexOf("image/") != -1) { if (file.type.indexOf("image/") != -1) {
// const image = await uploadImage(file); // const image = await uploadImage(file);
// getImgs((old) => [...old, image.id]); // getImgs((old) => [...old, image.id]);
const newFiles = [ const newFiles = [...assets, file];
...assets, const newAssets = newFiles.map((item) => ({
file, type: "img",
]; src: URL.createObjectURL(item),
const newAssets = newFiles.map(item=>({ type: "img", src: URL.createObjectURL(item) })); }));
setFileList(newAssets); setFileList(newAssets);
getImgs(newFiles); getImgs(newFiles);
} else if (file.type.indexOf("video/") != -1) { } else if (file.type.indexOf("video/") != -1) {
if (typeof window == "undefined") return;
const videoD = document.getElementById("videoD"); const videoD = document.getElementById("videoD");
const videoC = document.getElementById("videoC"); const videoC = document.getElementById("videoC");
// console.log("videoC", videoC); // console.log("videoC", videoC);
@ -43,11 +44,11 @@ export default function UploadImgs({assets, getImgs }) {
// const video = await uploadVideo(file); // const video = await uploadVideo(file);
// getImgs((old) => [...old, video.id]); // getImgs((old) => [...old, video.id]);
// setFileList((old) => [...old, video]); // setFileList((old) => [...old, video]);
const newFiles = [ const newFiles = [...assets, file];
...assets, const newAssets = newFiles.map((item) => ({
file, type: "video",
]; src: URL.createObjectURL(item),
const newAssets = newFiles.map(item=>({ type: "video", src: URL.createObjectURL(item) })); }));
setFileList(newAssets); setFileList(newAssets);
} }

View File

@ -1,4 +1,5 @@
export default function copy(text = "") { export default function copy(text = "") {
if (typeof window == "undefined") return;
let input = document.createElement("input"); let input = document.createElement("input");
input.style.position = "fixed"; input.style.position = "fixed";
input.style.top = "-10000px"; input.style.top = "-10000px";

View File

@ -1,8 +1,8 @@
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faClose} from "@fortawesome/free-solid-svg-icons"; import { faClose } from "@fortawesome/free-solid-svg-icons";
import { Dialog,Toast } from "antd-mobile"; import { Dialog, Toast } from "antd-mobile";
import html2canvas from "html2canvas"; import html2canvas from "html2canvas";
import {checkRole} from "../auth"; import { checkRole } from "../auth";
import Player from "next-video/player"; import Player from "next-video/player";
// export const handleShowVideos = (video) => { // export const handleShowVideos = (video) => {
// Dialog.className = "videoMask"; // Dialog.className = "videoMask";
@ -52,10 +52,13 @@ export const handleShowVideo = (video) => {
Dialog.className = "videoMask"; Dialog.className = "videoMask";
Dialog.show({ Dialog.show({
title: "", title: "",
bodyStyle:{paddingTop:0}, bodyStyle: { paddingTop: 0 },
content: ( content: (
<div className="h-screen flex justify-center items-center relative" > <div className="h-screen flex justify-center items-center relative">
<div className="h-screen w-screen absolute" onClick={() => Dialog.clear()}></div> <div
className="h-screen w-screen absolute"
onClick={() => Dialog.clear()}
></div>
<div className="w-screen flex flex-col gap-2 pointer-events-none absolute top-0"> <div className="w-screen flex flex-col gap-2 pointer-events-none absolute top-0">
<div className="flex w-full justify-end"> <div className="flex w-full justify-end">
<div <div
@ -113,6 +116,7 @@ export const handleShowVideo = (video) => {
}; };
//保存div内容为图片 //保存div内容为图片
export const saveImage = async (divId) => { export const saveImage = async (divId) => {
if (typeof window == "undefined") return;
const div = document.getElementById(divId); const div = document.getElementById(divId);
html2canvas(div, { useCORS: true }).then(function (canvas) { html2canvas(div, { useCORS: true }).then(function (canvas) {
// 创建一个图片元素 // 创建一个图片元素
@ -138,6 +142,7 @@ export const saveFile = async (href) => {
}); });
return; return;
} }
if (typeof window == "undefined") return;
var link = document.createElement("a"); var link = document.createElement("a");
link.href = href; link.href = href;
link.target = "_blank"; link.target = "_blank";

View File

@ -45,7 +45,7 @@ async function calculateFileMetadata(file) {
const fileData = event.target.result; const fileData = event.target.result;
const wordArray = CryptoJS.lib.WordArray.create(fileData); const wordArray = CryptoJS.lib.WordArray.create(fileData);
const md5Hash = CryptoJS.MD5(wordArray).toString(); const md5Hash = CryptoJS.MD5(wordArray).toString();
if (typeof window == "undefined") return;
const mediaElement = document.createElement( const mediaElement = document.createElement(
file.type.startsWith("image/") ? "img" : "video" file.type.startsWith("image/") ? "img" : "video"
); );