优化代码

This commit is contained in:
al 2024-11-06 14:19:26 +08:00
parent e01fbaa9af
commit de9e8e747e
8 changed files with 48 additions and 93 deletions

View File

@ -299,7 +299,6 @@ function Login({ handleLogin }) {
<OwnInput
clearable={true}
placeholder="请输入手机号"
// disabled={true}
name="phone_number"
type="number"
maxLength={11}
@ -330,7 +329,6 @@ function Login({ handleLogin }) {
/> */}
<OwnInput
placeholder="请输入验证码"
// disabled={true}
name="veriCode"
type="number"
onChange={setVeriCode}
@ -382,7 +380,6 @@ function Login({ handleLogin }) {
<OwnInput
clearable={true}
placeholder="请输入手机号"
// disabled={true}
name="phone_number"
type="number"
maxLength={11}
@ -417,7 +414,6 @@ function Login({ handleLogin }) {
<OwnInput
clearable={true}
placeholder="请输入密码"
// disabled={true}
name="password"
type="password"
onChange={(value) => {

View File

@ -36,6 +36,7 @@ import requireAPI from "@/utils/requireAPI";
import { get } from "@/utils/storeInfo";
import UploadImgs from "@/components/UploadImgs";
import { multiUploadImage } from "@/utils/upload";
import { getVideoBase64 } from "@/utils/tools";
const constellations = [
{ label: "白羊座", value: "白羊座" },
{ label: "金牛座", value: "金牛座" },
@ -480,41 +481,19 @@ export default function CompleteStreamerInformation() {
],
}));
} else {
creatVideoCanvas(file);
setFormData((old) => ({
...old,
displayVideo: [
{
url: frameImageUrl,
const url = URL.createObjectURL(file);
getVideoBase64(url).then((src) => {
setFrameImageUrl(src);
setFormData((old) => ({
...old,
displayVideo: {
url: src,
file: Array.from(e.target.files),
},
],
}));
}));
});
}
};
const creatVideoCanvas = (file) => {
if (typeof window == "undefined") return;
const videoD = document.getElementById("video_complete");
const url = URL.createObjectURL(file);
videoD.src = url;
videoD.addEventListener("loadeddata", function () {
videoD.pause();
videoD.currentTime = 1;
});
videoD.addEventListener("seeked", function () {
const canvas = document.createElement("canvas");
canvas.width = videoD.videoWidth;
canvas.height = videoD.videoHeight;
canvas
.getContext("2d")
.drawImage(videoD, 0, 0, canvas.width, canvas.height);
const canvasImg = canvas.toDataURL();
setFrameImageUrl(canvasImg);
// URL
URL.revokeObjectURL(url);
});
};
//
if (isWaitingReview) {
return (
@ -1131,12 +1110,6 @@ export default function CompleteStreamerInformation() {
<SpinLoading color="default" />
</div>
</Mask>
<div className="hidden">
<video id="video_complete" controls autoPlay name="media">
<source />
您的浏览器不支持 Video 标签
</video>
</div>
</div>
);
}

View File

@ -281,7 +281,7 @@ export default function PersonSpace() {
</div>
<ul className="flex mt-8">
<li
className="flex flex-col items-center mr-6"
className="flex flex-col items-center mr-4"
onClick={() =>
setMaskVisible({ visible: true, type: "weChat" })
}
@ -298,7 +298,7 @@ export default function PersonSpace() {
placeholder=""
/>
</div>
<p className="text-xs">查看微信</p>
<p className="text-xs whitespace-nowrap">查看微信</p>
</li>
<li
className="flex flex-col items-center mr-6"
@ -318,7 +318,7 @@ export default function PersonSpace() {
placeholder=""
/>
</div>
<p className="text-xs">
<p className="text-xs whitespace-nowrap">
{streamerInfo?.is_ironfanship_unlocked === 1
? "已是铁粉"
: "成为铁粉"}
@ -362,7 +362,7 @@ export default function PersonSpace() {
placeholder=""
/>
</div>
<p className="text-xs">
<p className="text-xs whitespace-nowrap">
{streamerInfo?.is_superfanship_unlocked === 1
? "尊贵超粉"
: "成为超粉"}
@ -387,7 +387,7 @@ export default function PersonSpace() {
placeholder=""
/>
</div>
<p className="text-xs">举报</p>
<p className="text-xs whitespace-nowrap">举报</p>
</li>
{streamerInfo?.visitor_role === 3 && (
<li
@ -406,7 +406,7 @@ export default function PersonSpace() {
placeholder=""
/>
</div>
<p className="text-xs">审核未通过</p>
<p className="text-xs whitespace-nowrap">审核未通过</p>
</li>
)}
</ul>

View File

@ -7,6 +7,7 @@ import { faAngleRight, faAngleLeft } from "@fortawesome/free-solid-svg-icons";
import UploadImgs from "@/components/UploadImgs";
import requireAPI from "@/utils/requireAPI";
import { multiUploadImage } from "@/utils/upload";
import { getVideoBase64 } from "@/utils/tools";
export default function EditStreamerMedia() {
const router = useRouter();
//
@ -92,14 +93,17 @@ export default function EditStreamerMedia() {
},
}));
} else {
creatVideoCanvas(file);
setFormData((old) => ({
...old,
displayVideo: {
url: frameImageUrl,
file: Array.from(e.target.files),
},
}));
const url = URL.createObjectURL(file);
getVideoBase64(url).then((src) => {
setFrameImageUrl(src);
setFormData((old) => ({
...old,
displayVideo: {
url: src,
file: Array.from(e.target.files),
},
}));
});
}
setLoading(false);
};
@ -189,29 +193,6 @@ export default function EditStreamerMedia() {
}
};
const creatVideoCanvas = (file) => {
if (typeof window == "undefined") return;
const videoD = document.getElementById("video_edit_streamer");
const url = URL.createObjectURL(file);
videoD.src = url;
videoD.addEventListener("loadeddata", function () {
videoD.pause();
videoD.currentTime = 1;
});
videoD.addEventListener("seeked", function () {
const canvas = document.createElement("canvas");
canvas.width = videoD.videoWidth;
canvas.height = videoD.videoHeight;
canvas
.getContext("2d")
.drawImage(videoD, 0, 0, canvas.width, canvas.height);
const canvasImg = canvas.toDataURL();
setFrameImageUrl(canvasImg);
// URL
URL.revokeObjectURL(url);
});
};
useEffect(() => {
setFormData((old) => ({ ...old, imageAssets: oldPhotos }));
}, [oldPhotos]);
@ -364,12 +345,6 @@ export default function EditStreamerMedia() {
</Button>
</div>
</div>
<div className="hidden">
<video id="video_edit_streamer" controls name="media">
<source />
您的浏览器不支持 Video 标签
</video>
</div>
</div>
);
}

View File

@ -2,7 +2,7 @@
import React, { useState, useEffect } from "react";
import { Image } from "antd-mobile";
import { get,save } from "@/utils/storeInfo";
import { get, save } from "@/utils/storeInfo";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleUp, faClose } from "@fortawesome/free-solid-svg-icons";
export default function AddToHome() {
@ -24,7 +24,7 @@ export default function AddToHome() {
fit="cover"
className="rounded-md mr-3"
// src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/nodata.png"}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/images/icon.png"}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/images/icon.png"}
placeholder=""
width={46}
height={46}
@ -34,11 +34,11 @@ export default function AddToHome() {
建议您添加<span className="text-primary">铁粉空间</span>
到手机桌面
</p>
<p className="text-[#ffffffb2] text-xs">以便随时关注圈子动态</p>
<p className="text-[#ffffffb2] text-xs">以便随时关注空间动态</p>
</div>
</div>
<div
className="bg-primary px-4 py-2 rounded-full font-bold"
className="bg-primary px-4 py-2 rounded-full font-bold whitespace-nowrap"
onClick={() => setFirstLogin((old) => ({ ...old, second: true }))}
>
去添加
@ -66,7 +66,9 @@ export default function AddToHome() {
<Image
fit="cover"
// src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/nodata.png"}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/ios_share.png"}
src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/icons/ios_share.png"
}
placeholder=""
width={32}
height={32}
@ -76,7 +78,9 @@ export default function AddToHome() {
<Image
fit="contain"
// src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/icons/nodata.png"}
src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL+"/images/addToHome.png"}
src={
process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/images/addToHome.png"
}
placeholder=""
width={54}
height={70}

View File

@ -11,9 +11,9 @@ export default function OwnInput({
name,
placeholder,
clearable,
disabled,
disabled = false,
className,
inputClassName,
inputClassName = "",
fontSize,
id,
}) {

View File

@ -87,7 +87,13 @@ export default function UploadImgs({
} else {
Modal.show({
content: (
<video autoPlay playsInline controls muted={true}>
<video
autoPlay
playsInline
controls
muted={true}
controlslist="nodownload"
>
<source src={videoUrl} />
</video>
),

View File

@ -85,6 +85,7 @@ export const handleShowVideo = (video) => {
{/* <Video as={ReactPlayer} src={video.mp4} /> */}
<Player
src={video.mp4}
controlslist="nodownload"
poster={video?.url.src}
blurDataURL={video?.url.blurDataURL}
autoPlay={true}