Echo 演示
调用已注册的 echo 节点，验证前端到后端再到节点进程的完整链路。
@@ -31,6 +34,7 @@等待运行...
节点管理
+注册节点
@@ -30,6 +32,7 @@已注册节点
@@ -48,6 +51,7 @@
调用节点
@@ -68,6 +72,7 @@
等待调用...+
节点实例
diff --git a/assets/app.js b/assets/app.js
index c86e776..a924d87 100644
--- a/assets/app.js
+++ b/assets/app.js
@@ -1,3 +1,6 @@
+// WOV 静态前端公共脚本：所有页面共用的 API 封装、渲染函数与事件绑定。
+
+// Echo 演示节点的预置 manifest，便于管理后台一键填入。
const ECHO_MANIFEST = {
id: "echo",
name: "Echo Node",
@@ -14,6 +17,7 @@ const ECHO_MANIFEST = {
keep_warm: false,
};
+// 演示“视频字幕生成”工作流的 DAG 定义，预填在工作流编排页。
const DEMO_WORKFLOW = {
name: "视频字幕生成",
version: 1,
@@ -55,6 +59,7 @@ const DEMO_WORKFLOW = {
},
};
+// 统一封装 fetch：自动携带 JSON 头、解析响应并在失败时抛出可读错误。
async function api(path, options = {}) {
const response = await fetch(path, {
headers: { "Content-Type": "application/json", ...(options.headers || {}) },
@@ -62,12 +67,14 @@ async function api(path, options = {}) {
});
const data = await response.json().catch(() => null);
if (!response.ok) {
+ // FastAPI 的校验错误 detail 可能是数组，统一序列化为字符串展示。
const detail = data && data.detail ? JSON.stringify(data.detail) : response.statusText;
throw new Error(`${response.status} ${detail}`);
}
return data;
}
+// 转义用户可控文本，防止 XSS 注入到表格或状态 HTML 中。
function escapeHtml(value) {
return String(value)
.replaceAll("&", "&")
@@ -77,7 +84,9 @@ function escapeHtml(value) {
.replaceAll("'", "'");
}
+// 根据状态生成带语义颜色的徽章 HTML。
function badge(status) {
+ // 统一转小写比较，兼容后端返回的不同大小写。
const value = String(status).toLowerCase();
const className =
value === "ready" || value === "completed" || value === "ok"
@@ -88,12 +97,14 @@ function badge(status) {
return `${escapeHtml(status)}`;
}
+// 把 ISO 时间格式化为本地时间；非法值原样返回。
function formatTime(value) {
if (!value) return "";
const date = new Date(value);
return Number.isNaN(date.getTime()) ? value : date.toLocaleString();
}
+// 计算距给定时间的流逝时长，用于任务页展示已运行时间。
function formatElapsed(value) {
if (!value) return "";
const seconds = Math.floor((Date.now() - new Date(value).getTime()) / 1000);
@@ -102,6 +113,7 @@ function formatElapsed(value) {
return `${Math.floor(seconds / 60)} 分钟`;
}
+// 健康检查失败时在页面顶部展示后端不可用提示。
async function loadHealth() {
try {
await api("/health");
@@ -113,6 +125,7 @@ async function loadHealth() {
}
}
+// 加载已注册节点并渲染节点表格与调用下拉框。
async function loadNodes() {
const nodes = await api("/api/admin/nodes");
const tbody = document.getElementById("nodeList");
@@ -136,6 +149,7 @@ async function loadNodes() {
.join("");
}
+// 加载节点实例并渲染实例表格。
async function loadInstances() {
const instances = await api("/api/admin/node-instances");
const tbody = document.getElementById("instanceList");
@@ -156,10 +170,12 @@ async function loadInstances() {
: '暂无实例 暂无工作流 暂无任务
+
WOV 应用中心
选择一个已发布的应用，上传或输入内容后由后台自动执行。
+
+
diff --git a/workflow.html b/workflow.html
index 3992a05..014cdcd 100644
--- a/workflow.html
+++ b/workflow.html
@@ -1,4 +1,5 @@
+
@@ -20,6 +21,7 @@
视频字幕生成
上传视频后自动执行提音、转写、翻译和 VR 双眼 ASS 生成。
diff --git a/tasks.html b/tasks.html index fc7a549..14af2a1 100644 --- a/tasks.html +++ b/tasks.html @@ -1,4 +1,5 @@ + @@ -21,6 +22,7 @@任务管理
查看所有任务的执行状态；失败的任务可以重新排队执行。
+