101 lines
3.2 KiB
React
101 lines
3.2 KiB
React
|
"use client";
|
|||
|
|
|
|||
|
|
import React, { useState, useEffect } from "react";
|
|||
|
|
import baseRequest from "@/utils/baseRequest";
|
|||
|
|
import { Toast } from "antd-mobile";
|
|||
|
|
import InOtherApp from "@/components/InOtherApp";
|
|||
|
|
import { generateSignature } from "@/utils/crypto";
|
|||
|
|
import Image from "next/image";
|
|||
|
|
import verification from "@/public/icon/verification.png";
|
|||
|
|
import Link from "next/link";
|
|||
|
|
|
|||
|
|
export default function Weibo({ params }) {
|
|||
|
|
//页面数据
|
|||
|
|
const [data, setData] = useState({});
|
|||
|
|
useEffect(() => {
|
|||
|
|
const getData = async () => {
|
|||
|
|
try {
|
|||
|
|
const base = baseRequest();
|
|||
|
|
const signature = generateSignature({
|
|||
|
|
user_id: parseInt(params.user_id, 10),
|
|||
|
|
...base,
|
|||
|
|
});
|
|||
|
|
const detailResponse = await fetch(
|
|||
|
|
`/api/streamer/list_ext_by_user_id?signature=${signature}`,
|
|||
|
|
{
|
|||
|
|
method: "POST",
|
|||
|
|
headers: {
|
|||
|
|
"Content-Type": "application/json",
|
|||
|
|
},
|
|||
|
|
body: JSON.stringify({
|
|||
|
|
user_id: parseInt(params.user_id, 10),
|
|||
|
|
...base,
|
|||
|
|
}),
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
const detailData = await detailResponse.json();
|
|||
|
|
if (detailData.ret === -1) {
|
|||
|
|
Toast.show({
|
|||
|
|
content: detailData.msg,
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
setData(detailData.data.streamer_ext);
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error(error);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
getData();
|
|||
|
|
}, []);
|
|||
|
|
|
|||
|
|
//将主播链接复制到剪贴板
|
|||
|
|
const copyInviter = async () => {
|
|||
|
|
let input = document.createElement("input");
|
|||
|
|
input.style.position = "fixed";
|
|||
|
|
input.style.top = "-10000px";
|
|||
|
|
input.style.zIndex = "-999";
|
|||
|
|
document.body.appendChild(input);
|
|||
|
|
input.value = `【${data?.name}】『ID：${data?.user_id}』，复制此条消息，打开铁粉空间APP，查看详情https://tiefen.fun/${data?.user_id}`;
|
|||
|
|
input.focus();
|
|||
|
|
input.select();
|
|||
|
|
try {
|
|||
|
|
let result = document.execCommand("copy");
|
|||
|
|
document.body.removeChild(input);
|
|||
|
|
if (!result || result === "unsuccessful") {
|
|||
|
|
console.log("复制失败");
|
|||
|
|
} else {
|
|||
|
|
console.log("复制成功");
|
|||
|
|
}
|
|||
|
|
} catch (e) {
|
|||
|
|
document.body.removeChild(input);
|
|||
|
|
console.log("当前浏览器不支持复制功能，请检查更新或更换其他浏览器操作");
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<section className="flex flex-1 flex-col container relative">
|
|||
|
|
<InOtherApp />
|
|||
|
|
<div className="flex flex-col flex-1 justify-center px-4 z-10">
|
|||
|
|
<div className="flex flex-col items-center gap-8">
|
|||
|
|
<div className="w-[74px] h-[74px] rounded-full overflow-hidden">
|
|||
|
|
<img
|
|||
|
|
src={data?.avatar?.images[0].urls[0]}
|
|||
|
|
alt=""
|
|||
|
|
className="w-full h-full object-cover"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
<div className="flex flex-row items-center mt-3">
|
|||
|
|
<p className="text-white text-2xl font-medium mr-1">{data?.name}</p>
|
|||
|
|
<Image src={verification} alt="" className="w-6 h-6" />
|
|||
|
|
</div>
|
|||
|
|
<Link className="p-2" href="/" onClick={copyInviter}>
|
|||
|
|
<p className="btn w-48 bg-gradient-to-r from-[#FF668B] to-[#FF66F0] rounded-full text-white font-medium">
|
|||
|
|
成为Ta的铁粉
|
|||
|
|
</p>
|
|||
|
|
</Link>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
);
|
|||
|
|
}
|