Jerry/rc-plugin
1
0
Fork 0
mirror of https://github.com/Jerryplusy/rc-plugin.git synced 2025-10-14 08:09:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨feat: 增加一个🐔手动刷新按钮

Browse Source
This commit is contained in:
zhiyu1998 2024-11-23 22:11:22 +08:00
parent c283f41fb4
commit 17dbaa3290
1 changed files with 34 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
server/components/home/bot-item.jsx
View File

@ -4,40 +4,59 @@ import { BOT_INFO_URL } from "../../constants/api.js";
export function BotItem() { export function BotItem() {
const [user, setUser] = useState(null); const [user, setUser] = useState(null);
const [isLoading, setIsLoading] = useState(false);
const fetchBotInfo = async () => {
setIsLoading(true);
try {
const response = await fetch(BOT_INFO_URL);
const data = await response.json();
setUser(data);
} catch (error) {
console.error("获取机器人信息失败:", error);
} finally {
setIsLoading(false);
}
};
useEffect(() => { useEffect(() => {
fetch(BOT_INFO_URL) fetchBotInfo();
.then(response => {
return response.json();
})
.then(data => setUser(data))
}, []); }, []);
return ( return (
<div className="card bg-base-100 shadow-xl"> <div className="card bg-base-100 shadow-xl">
<div className="card-body"> <div className="card-body">
<h2 className="card-title">🐔状态</h2> <h2 className="card-title">🐔状态</h2>
<div className="flex flex-row pt-5 justify-between items-center"> <div className="flex flex-col sm:flex-row pt-5 items-center sm:items-start gap-6 sm:gap-8">
<div className={ `avatar z-0 ${ user?.online ? "online" : "offline" }` }> <div className={`avatar z-0 ${user?.online ? "online" : "offline"}`}>
<div className="w-24 rounded-full"> <div className="w-24 rounded-full">
<img src={ `http://q1.qlogo.cn/g?b=qq&nk=${ user?.user_id }&s=100` }/> <img src={`http://q1.qlogo.cn/g?b=qq&nk=${user?.user_id}&s=100`} alt="Bot Avatar" />
</div> </div>
</div> </div>
<div className="flex flex-col ml-12 space-y-2"> <div className="flex flex-col space-y-4 text-center sm:text-left">
<div className="space-y-2"> <div className="space-y-2">
<div className="font-bold">昵称：{ user?.nickname || "未获取" }</div> <div className="font-bold">昵称：{user?.nickname || "未获取"}</div>
<div className="text-sm opacity-50">QQ号：{ user?.user_id || "NaN" }</div> <div className="text-sm opacity-50">QQ号：{user?.user_id || "NaN"}</div>
</div> </div>
<div className="space-y-2"> <div className="space-y-2">
<div className="font-bold">协议信息：</div> <div className="font-bold">协议信息：</div>
<div className="space-x-1"> <div className="flex flex-wrap justify-center sm:justify-start gap-2">
<div className="badge badge-ghost">{ user?.app_name }</div> <div className="badge badge-ghost">{user?.app_name}</div>
<div className="badge badge-ghost">{ user?.app_version }</div> <div className="badge badge-ghost">{user?.app_version}</div>
<div className="badge badge-ghost">{ user?.protocol_version }</div> <div className="badge badge-ghost">{user?.protocol_version}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="card-actions justify-end mt-4">
<button
className={`btn btn-sm btn-ghost ${isLoading ? 'loading' : ''}`}
onClick={fetchBotInfo}
disabled={isLoading}
>
{isLoading ? '刷新中...' : '刷新信息'}
</button>
</div>
</div> </div>
</div> </div>
) )