JellyAI
/
hts
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

.

This commit is contained in:
hailin 2025-04-02 23:00:54 +08:00
parent d36c396db1
commit ba239d8988
1 changed files with 40 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
apps/blogai/components/header.tsx
View File

@ -407,12 +407,11 @@ export function DetailPageHeader({ data }: { data: any }) {
const [loading, setLoading] = useState(false);
const [statusText, setStatusText] = useState(data?.statusText || "加载中...");
const [progress, setProgress] = useState(data?.progress || "0%");
const [showDelete, setShowDelete] = useState(false); // 默认隐藏避免闪烁
const [showDelete, setShowDelete] = useState(false);
const [hasWSConnected, setHasWSConnected] = useState(false);
const [statusLoaded, setStatusLoaded] = useState(false);
const socketRef = useRef<WebSocket | null>(null);
// ✅ 初始化 WebSocket
const initWebSocket = (userName: string, id: number) => {
if (socketRef.current) socketRef.current.close();
@ -425,24 +424,23 @@ export function DetailPageHeader({ data }: { data: any }) {
};
socket.onmessage = (event) => {
console.log("收到进度信息：", event.data);
const msg = event.data;
console.log("收到进度信息：", msg);
setStatusText(msg);
const match = msg.match(/进度[:：]?\s*(\d+)%/);
if (match && match[1]) {
const percent = match[1] + "%";
setProgress(percent);
setProgress(match[1] + "%");
}
};
socket.onerror = (error) => {
console.error("WebSocket 出错：", error);
socket.onerror = (err) => {
console.error("WebSocket 出错：", err);
setStatusText("WebSocket 出错");
};
socket.onclose = () => {
console.log("🔌 WebSocket 连接已关闭");
console.log("🔌 WebSocket 已关闭");
setHasWSConnected(false);
socketRef.current = null;
};
@ -457,7 +455,7 @@ export function DetailPageHeader({ data }: { data: any }) {
try {
const userData = JSON.parse(localStorage.getItem("UserData") || "null");
if (!userData?.user_name) {
setStatusText("未登录，正在跳转登录页面...");
setStatusText("未登录，跳转中...");
window.location.href = "/auth/sign-in/";
return;
}
@ -465,7 +463,7 @@ export function DetailPageHeader({ data }: { data: any }) {
const userName = userData.user_name;
const id = data?.id;
if (!id) {
setStatusText("数据缺失：找不到组件 ID");
setStatusText("缺少组件 ID");
return;
}
@ -475,18 +473,16 @@ export function DetailPageHeader({ data }: { data: any }) {
body: JSON.stringify({ id, user_name: userName }),
});
if (!res.ok) throw new Error(`HTTP 请求失败：${res.status}`);
const json = await res.json();
if (json?.header?.code === 0) {
setStatusText("部署已启动，正在监听进度...");
setStatusText("部署已启动，监听中...");
initWebSocket(userName, id);
} else {
setStatusText(json.header.message || "操作失败（后端返回错误）");
setStatusText(json.header.message || "操作失败（后端）");
}
} catch (err) {
console.error("请求出错：", err);
setStatusText("操作失败，请检查网络或服务状态");
setStatusText("请求失败");
} finally {
setLoading(false);
}
@ -494,15 +490,13 @@ export function DetailPageHeader({ data }: { data: any }) {
const handleDelete = () => {
if (loading) return;
const confirmed = window.confirm("确定要删除模型吗？");
if (confirmed) {
if (window.confirm("确定要删除吗？")) {
setLoading(true);
console.log("模型已删除");
console.log("模拟删除执行...");
setLoading(false);
}
};
// ✅ 拉取部署状态
useEffect(() => {
const fetchDeployStatus = async () => {
try {
@ -513,42 +507,46 @@ export function DetailPageHeader({ data }: { data: any }) {
}).then((res) => res.json());
console.log("====> deploy status result:", result);
const status = result?.data?.data?.status;
console.log("🟡 [fetch] 拉取状态 status =", status);
const userData = JSON.parse(localStorage.getItem("UserData") || "null");
const userName = userData?.user_name;
const id = data?.id;
setStatusLoaded(true);
if (status === "deploying" && userName && id && !hasWSConnected) {
console.log("🔄 自动连接 WebSocket: 正在部署中...");
setStatusText("检测到正在部署，连接中...");
initWebSocket(userName, id);
}
if (!result || result.header?.code !== 1006) {
console.warn("🚫 状态接口返回失败或 code 错误", result.header);
setStatusText(result?.header?.message || "操作失败（后端返回错误）");
if (!result) {
setStatusText("接口响应为空");
setShowDelete(false);
return;
}
setStatusText(result.header.message || "部署成功");
const code = result?.header?.code;
const status = result?.data?.data?.status;
const userData = JSON.parse(localStorage.getItem("UserData") || "null");
const userName = userData?.user_name;
const id = data?.id;
console.log("🟡 状态码 code =", code, "状态 status =", status);
// ✅ 1006 表示无记录，不显示删除
if (code === 1006) {
setStatusText("尚未部署");
setShowDelete(false);
return;
}
if (status === "deploying" && userName && id && !hasWSConnected) {
setStatusText("检测到正在部署，连接中...");
initWebSocket(userName, id);
}
setStatusText(result?.header?.message || "部署状态读取成功");
// ✅ 只在 running / stopped 显示删除按钮
if (status === "running" || status === "stopped") {
console.log("✅ 状态允许删除，显示删除按钮");
console.log("✅ 允许删除（status =", status, ")");
setShowDelete(true);
} else {
console.log("❌ 状态不允许删除，隐藏按钮");
console.log("❌ 不允许删除（status =", status, ")");
setShowDelete(false);
}
} catch (err) {
console.error("请求部署状态失败：", err);
setStatusText("请求失败");
console.error("获取状态失败：", err);
setStatusText("状态拉取失败");
setShowDelete(false);
}
};
@ -556,7 +554,6 @@ export function DetailPageHeader({ data }: { data: any }) {
fetchDeployStatus();
}, [data?.id]);
// ✅ 卸载时关闭 WebSocket
useEffect(() => {
return () => {
if (socketRef.current) {
@ -640,7 +637,6 @@ export function DetailPageHeader({ data }: { data: any }) {
// export function Header() {
// const router = useRouter();