@mokuyoaxis/dsh-iris 0.3.0-alpha.1 → 0.3.0-beta.1

package/lib/web/app.js

@@ -6,46 +6,75 @@ import { createCreationPanel } from './creation.js';
 import { createGallery } from './gallery.js';
 import { createProviderPanel } from './providers.js';
 import { createAppearance } from './appearance.js';
+import { createNetworkPanel } from './network.js';
 
 const $ = selector => document.querySelector(selector);
 const urls = new Set();
 let client = null, mediaClient = null, recoveryTicket = 0, epoch = 0, runTicket = 0, runController = null, current = null;
 let runs = [], nextCursor = null, historyBusy = false, connecting = false, capabilities = [], page = 'studio', historyTotal = 0;
-let canManageProviders = false, audioEnabled = false;
+let canManageProviders = false, audioEnabled = false, videoEnabled = false;
+let modeLabel = '只读预览';
 let loginController = null;
 let startupSequence = 0;
 const passwordMode = document.documentElement.dataset.auth === 'password';
 let passwordLogin, passwordLoginLoading;
 let plugins = null;
+let pluginStatus = null, pluginStatusSession = null;
 const RUN = /^run_[a-f0-9]{24}$/;
 const TOKEN = /^[A-Za-z0-9_-]{43}$/, SESSION_KEY = 'iris.workbench.session.v0';
 const date = value => new Date(value).toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' });
 const valid = context => context.epoch === epoch && context.client === client;
 const context = () => ({ epoch, client });
+const videoRun = view => view?.recipe === 'video-generate/v0';
 const audioRun = view => ['speech/v0', 'transcribe/v0'].includes(view?.recipe);
-const recipeLabel = recipe => ({ 'image-edit/v0': '图片编辑', 'image-generate/v0': '图片生成', 'speech/v0': '语音合成', 'transcribe/v0': '音频转写' })[recipe];
+const recipeLabel = recipe => ({ 'image-edit/v0': '图片编辑', 'image-generate/v0': '图片生成', 'speech/v0': '语音合成', 'transcribe/v0': '音频转写', 'video-generate/v0': '视频生成' })[recipe];
 const connectionPanel = createConnectionPanel({ describe });
 const gallery = createGallery({ openRun: id => loadRun(id), describe });
-const providerPanel = createProviderPanel({ describe, onSaved: () => loadModels(context()), onSettings: (value, error) => overview.setSettings(value, error),
-  onProbe: options => creation.prepareVerification(options) });
+const providerPanel = createProviderPanel({ describe, onSaved: () => { void networkPanel.refresh(); return loadModels(context()); }, onSettings: (value, error) => overview.setSettings(value, error),
+  onProbe: options => creation.prepareVerification(options), onNetworkOpen: id => { tab('network'); networkPanel.focusProvider(id); } });
+const networkPanel = createNetworkPanel({ describe, onChanged: value => providerPanel.setNetworkFacts(value) });
 const creation = createCreationPanel({ openRun: loadRun, refreshHistory: () => loadHistory(context(), false, false),
   showDraft, describe, recover: recoverActions, renderOperation });
 const overview = createOverviewPanel();
 function tab(next = 'studio') {
   page = next;
   document.body.dataset.page = page;
-  $('#overview-panel').hidden = page !== 'overview'; $('#workspace').hidden = page !== 'studio'; $('#connections-panel').hidden = page !== 'connections'; $('#gallery-panel').hidden = page !== 'gallery'; $('#providers-panel').hidden = page !== 'providers';
-  for (const [id, target] of [['overview-tab', 'overview'], ['studio-tab', 'studio'], ['media-tab', 'gallery'], ['connections-tab', 'connections'], ['providers-tab', 'providers']]) {
+  $('#overview-panel').hidden = page !== 'overview'; $('#workspace').hidden = page !== 'studio'; $('#connections-panel').hidden = page !== 'connections'; $('#gallery-panel').hidden = page !== 'gallery'; $('#providers-panel').hidden = page !== 'providers'; $('#plugins-panel').hidden = page !== 'plugins';
+  $('#network-panel').hidden = page !== 'network';
+  for (const [id, target] of [['overview-tab', 'overview'], ['studio-tab', 'studio'], ['media-tab', 'gallery'], ['connections-tab', 'connections'], ['providers-tab', 'providers'], ['network-tab', 'network'], ['plugins-tab', 'plugins']]) {
     $('#' + id).setAttribute('aria-current', page === target ? 'page' : 'false');
   }
-  $('#page-label').textContent = { overview: '总览', studio: '创作', gallery: '作品', connections: '客户端连接', providers: '模型服务' }[page];
+  $('#page-label').textContent = { overview: '总览', studio: '创作', gallery: '作品', connections: '客户端连接', providers: '模型服务', network: '网络出口', plugins: '插件' }[page];
+  $('#mode-badge').textContent = page === 'network' ? '出口管理' : modeLabel;
   plugins?.show(page);
   if (page === 'plugin-settings') $('#page-label').textContent = '扩展设置';
   else if (page === 'plugin-history') $('#page-label').textContent = '业务记录';
   else if (page.startsWith('plugin:')) $('#page-label').textContent = $('#plugin-page-title').textContent;
   connectionPanel.show(page === 'connections'); gallery.show(page === 'gallery'); creation.show(page === 'studio');
   providerPanel.show(page === 'providers');
-  if (page !== 'studio') { closePreview(); for (const id of ['source-audio', 'output-audio', 'audio-input-preview']) $('#' + id).pause(); }
+  networkPanel.show(page === 'network');
+  pluginStatus?.show(page === 'plugins');
+  if (page === 'plugins' && !pluginStatus) void openPluginStatus();
+  if (page !== 'studio') { closePreview(); for (const id of ['source-audio', 'output-audio', 'audio-input-preview', 'output-video']) $('#' + id).pause(); }
+}
+
+async function openPluginStatus() {
+  const ctx = context();
+  if (!ctx.client) return;
+  $('#plugins-refresh').disabled = true;
+  $('#plugins-feedback').hidden = false; $('#plugins-feedback').classList.remove('error'); $('#plugins-feedback').textContent = '正在载入插件页面…';
+  try {
+    const { createPluginStatusPanel } = await import('./plugin-status.js');
+    if (!valid(ctx) || page !== 'plugins') return;
+    if (!pluginStatus) { pluginStatus = createPluginStatusPanel({ describe, navigate: tab }); pluginStatus.connect(ctx.client, pluginStatusSession); }
+    pluginStatus.show(true);
+  } catch (error) {
+    if (valid(ctx) && page === 'plugins') {
+      $('#plugins-feedback').hidden = false;
+      $('#plugins-feedback').classList.add('error');
+      $('#plugins-feedback').textContent = '插件页面未能载入，请核对服务版本；源码更新后需正常重启 Core 并刷新页面。' + describe(error);
+    }
+  }
 }
 
 function feedback(message, error = false) {
@@ -118,11 +147,11 @@ function showDraft(preview, mode = 'edit') {
   runTicket++; current = null; releaseMedia(); tab();
   history.replaceState(null, '', location.pathname);
   $('#viewer').setAttribute('aria-busy', 'false'); $('#viewer-empty').hidden = false; $('#run-view').hidden = true;
-  $('#viewer-empty h2').textContent = ({ generate: '从一句想法开始', edit: '从一张图片开始', tts: '让文字有声音', transcribe: '把声音留下来' })[mode];
+  $('#viewer-empty h2').textContent = ({ generate: '从一句想法开始', edit: '从一张图片开始', tts: '让文字有声音', transcribe: '把声音留下来', video: '让想法动起来' })[mode];
   $('#viewer-empty p').textContent = ({ generate: '写下你想看见的画面，选一个模型。作品会保存在当前工作区。', edit: '选好原图，写下想法。作品会保存在当前工作区。',
-    tts: '写下要朗读的内容，选择语音模型。合成后可在这里试听、下载。', transcribe: '选择一段音频和转写模型。原音频与文字结果都会保存在当前工作区。' })[mode];
-  $('.canvas-label').textContent = ['tts', 'transcribe'].includes(mode) ? '声音工作台' : '创作画布';
-  $('#view-modes').hidden = mode !== 'edit'; $('#reuse-selected').hidden = ['tts', 'transcribe'].includes(mode);
+    video: '描述主体与动作，选择实际视频模型。原任务的结果可在这里播放、下载。', tts: '写下要朗读的内容，选择语音模型。合成后可在这里试听、下载。', transcribe: '选择一段音频和转写模型。原音频与文字结果都会保存在当前工作区。' })[mode];
+  $('.canvas-label').textContent = mode === 'video' ? '动态工作台' : ['tts', 'transcribe'].includes(mode) ? '声音工作台' : '创作画布';
+  $('#view-modes').hidden = mode !== 'edit'; $('#reuse-selected').hidden = ['tts', 'transcribe', 'video'].includes(mode);
   $('#draft-preview').removeAttribute('src'); $('#draft-preview').hidden = !preview; if (preview) $('#draft-preview').src = preview;
   $('#prompt').textContent = ''; $('#run-facts').replaceChildren(); $('#run-parameter-values').replaceChildren(); $('#run-parameters').hidden = true; $('#download').disabled = true;
   $('#run-details').open = false; $('[data-view="overlay"]').disabled = true; setView('pair'); feedback(''); renderHistory();
@@ -134,18 +163,24 @@ function renderOperation(operation) {
   $('#operation-note').textContent = active ? '只读取已接收操作的本地进度；停止仅结束本地等待。'
     : operation.state === 'canceled' ? '已停止本地等待。远端取消未请求，不代表退款或未计费。'
       : operation.state === 'interrupted' ? '原操作已中断，现有任务与结果仍保留；不会自动重提。'
+        : operation.state === 'failed' ? '本地操作未完成，原记录仍保留。请核对任务及 Core 错误记录后，再决定是否继续。'
         : '本次操作已结束，作品进展以当前流程为准。';
   if (active) {
-    $('#status-title').textContent = operation.state === 'queued' ? '本次操作已接收' : '正在处理';
-    $('#status-message').textContent = '可以离开此页，已接收的事实仍会保存。';
+    const waiting = { remote_capacity: ['等待远端任务名额', '已有任务尚未确认结束，本次生成还没有提交。'],
+      cooldown: ['等待模型冷却', '达到可用时间后继续，不会重复提交原请求。'],
+      rate_limit: ['等待发送窗口', '请求按当前发送速率排队。'], http_queue: ['等待网络名额', '其他请求正在提交、查询或下载。'],
+      candidates: ['正在核对模型', '核对本次模型与原连接身份。'] }[operation.scheduling?.phase];
+    $('#status-title').textContent = waiting?.[0] || (operation.state === 'queued' ? '本次操作已接收' : '正在处理');
+    $('#status-message').textContent = waiting?.[1] || '可以离开此页，已接收的事实仍会保存。';
   }
 }
 function releaseMedia() {
   plugins?.clearPreview();
   runController?.abort(); runController = null;
   closePreview();
-  for (const id of ['source-audio', 'output-audio']) { const player = $('#' + id); player.pause(); player.removeAttribute('src'); player.load(); }
+  for (const id of ['source-audio', 'output-audio', 'output-video']) { const player = $('#' + id); player.pause(); player.removeAttribute('src'); player.load(); }
   for (const id of ['audio-source-result', 'audio-output-result', 'transcript-result']) $('#' + id).hidden = true;
+  $('#output-video').hidden = true; $('#video-result').hidden = true; $('#video-result-note').textContent = '';
   $('#transcript-result').textContent = ''; $('#audio-result-note').textContent = ''; $('#audio-result').hidden = true;
   for (const kind of ['source', 'output']) $('#overlay-' + kind).removeAttribute('src');
   for (const url of urls) URL.revokeObjectURL(url);
@@ -157,17 +192,20 @@ function releaseMedia() {
   }
 }
 function disconnect(message = '', { forget = true } = {}) {
+  pluginStatus?.disconnect(); pluginStatusSession = null;
+  $('#plugins-panel').hidden = true; $('#plugins-feedback').textContent = ''; $('#plugins-feedback').hidden = true;
   plugins?.disconnect();
   loginController?.abort(); loginController = null;
   if (forget) { if (passwordMode) passwordLogin?.forget(); else storedSession('removeItem'); }
-  providerPanel.disconnect(); overview.disconnect(); canManageProviders = audioEnabled = false; $('#providers-panel').hidden = true; $('#providers-tab').hidden = true;
+  providerPanel.disconnect(); overview.disconnect(); canManageProviders = audioEnabled = videoEnabled = false; $('#providers-panel').hidden = true; $('#providers-tab').hidden = true;
+  networkPanel.disconnect(); $('#network-panel').hidden = true; $('#network-tab').hidden = true;
   creation.disconnect(); gallery.disconnect(); capabilities = []; document.body.classList.remove('connected');
   epoch++; runTicket++; recoveryTicket++; mediaClient?.close(); mediaClient = null; client?.close(); client = null; current = null;
   $('#recovery-panel').hidden = true; $('#recovery-panel').open = false;
   $('#recovery-list').replaceChildren(); $('#recovery-note').textContent = ''; $('#recovery-summary').textContent = '';
   $('#recovery-clear-confirm').hidden = true;
   connectionPanel.disconnect(); $('#workspace-nav').hidden = true; $('#app-sidebar').hidden = true; $('#connections-panel').hidden = true; $('#gallery-panel').hidden = true;
-  $('#mode-badge').textContent = '只读预览';
+  modeLabel = '只读预览'; $('#mode-badge').textContent = modeLabel;
   connecting = false; historyBusy = false; runs = []; nextCursor = null; historyTotal = 0;
   releaseMedia(); $('#connect').disabled = false; $('#token').value = ''; $('#token-file').value = '';
   $('#workspace').hidden = true; $('#connection').hidden = false; $('#disconnect').hidden = true;
@@ -198,19 +236,21 @@ async function connectToken(raw, { restoring = false } = {}) {
     if (session.contractVersion !== 0 || !session.operations.includes('runs.inspect')) throw new TypeError('不支持的工作台会话');
     if (!passwordMode) storedSession('setItem', token);
     mediaClient = createMediaClient({ client: ctx.client, session, origin: location.origin });
-    capabilities = session.operations; audioEnabled = session.audio === true; overview.connect(session); creation.connect(ctx.client, mediaClient, session); gallery.connect(ctx.client, session);
+    capabilities = session.operations; audioEnabled = session.audio === true; videoEnabled = session.video === true; overview.connect(session); creation.connect(ctx.client, mediaClient, session); gallery.connect(ctx.client, session);
     if (!plugins && (session.pluginExecution || session.panelContributions?.pages.length || session.panelContributions?.settings.length || session.panelContributions?.renderers.length)) {
       const { createPluginPanel } = await import('./plugin-panel.js');
       if (!valid(ctx)) return;
       plugins = createPluginPanel({ navigate: tab, describe, onProvidersSaved: result => { overview.setSettings(result); void loadModels(context()); } });
     }
     plugins?.connect(ctx.client, session);
+    pluginStatusSession = session; pluginStatus?.connect(ctx.client, session);
     canManageProviders = session.providerManagement === true; $('#providers-tab').hidden = !canManageProviders;
+    $('#network-tab').hidden = session.networkManagement !== true;
     document.body.classList.add('connected'); $('#app-sidebar').hidden = false;
     $('#connection').hidden = true; $('#workspace').hidden = false; $('#disconnect').hidden = false;
     tab(); $('#workspace-nav').hidden = false; $('#connections-tab').hidden = !session.connectionManagement;
     $('#recent-panel').open = !matchMedia('(max-width:850px)').matches;
-    $('#mode-badge').textContent = session.operations.includes('runs.continue') ? '可创作' : session.connectionManagement ? 'Core 工作台' : session.readOnly ? '只读预览' : '可选择作品';
+    modeLabel = session.operations.includes('runs.continue') ? '可创作' : session.connectionManagement ? 'Core 工作台' : session.readOnly ? '只读预览' : '可选择作品'; $('#mode-badge').textContent = modeLabel;
     const overviewRequested = location.hash === '#overview';
     if (!RUN.test(location.hash.slice(1))) creation.beginDraft();
     if (overviewRequested) { history.replaceState(null, '', '#overview'); tab('overview'); }
@@ -218,7 +258,7 @@ async function connectToken(raw, { restoring = false } = {}) {
     $('#main-content').focus({ preventScroll: true });
     feedback('');
     await Promise.all([loadModels(ctx), loadHistory(ctx), recoverActions(ctx), ...(session.connectionManagement ? [connectionPanel.connect(ctx.client)] : []),
-      ...(canManageProviders ? [providerPanel.connect(ctx.client)] : [])]);
+      ...(canManageProviders ? [providerPanel.connect(ctx.client)] : []), ...(session.networkManagement ? [networkPanel.connect(ctx.client)] : [])]);
   } catch (error) {
     if (valid(ctx)) disconnect(describe(error), { forget: !restoring || error.status === 401 || error.message.startsWith('不支持') });
   } finally {
@@ -245,7 +285,7 @@ async function recoverActions(ctx = context()) {
       ? '当前只保留内存中的动作标识，刷新恢复受限。请先核对原结果。' : '这里只读取原请求与已保存结果，不会自动开始或继续生成。');
     $('#recovery-check').hidden = saved.blocked || !saved.actions.length;
     $('#recovery-clear').hidden = !saved.blocked && !saved.actions.length;
-    const labels = { 'image-import': '素材保存', 'flow-create': '改图流程创建', 'generation-create': '生图流程创建', 'audio-import': '音频保存',
+    const labels = { 'image-import': '素材保存', 'flow-create': '改图流程创建', 'generation-create': '生图流程创建', 'video-create': '视频流程创建', 'audio-import': '音频保存',
       'speech-create': '语音流程创建', 'transcription-create': '转写流程创建', continue: '执行', selection: '作品选择', stop: '本地停止' };
     const states = { confirmed: '已读取原结果', prepared: '本地意图已保存，仍需明确接回', current: '已读取当前选择',
       active: '原操作仍在处理中', not_found: '尚未找到原请求，请保留原身份后明确处理',
@@ -281,7 +321,7 @@ async function recoverActions(ctx = context()) {
 
 async function loadModels(ctx) {
   try {
-    const results = await Promise.all([ctx.client.get('/api/v0/models'), ...(audioEnabled ? [ctx.client.get('/api/v0/audio-models')] : [])]);
+    const results = await Promise.all([ctx.client.get('/api/v0/models'), ...(audioEnabled ? [ctx.client.get('/api/v0/audio-models')] : []), ...(videoEnabled ? [ctx.client.get('/api/v0/video-models').then(value => ({ ...value, models: value.models.map(model => ({ ...model, capability: 'video-gen' })) }))] : [])]);
     if (!valid(ctx)) return;
     if (results.some(result => result.contractVersion !== 0)) throw new TypeError('不支持的模型列表版本');
     const models = results.flatMap(result => result.models), configured = results[0].configured;
@@ -290,7 +330,7 @@ async function loadModels(ctx) {
     $('#model-note').textContent = !configured ? '启动时可传入 --provider-config。读取已有作品不需要模型配置。'
       : '以下是配置中的候选，尚不代表已实测。此页面不会探测或调用模型。';
     $('#model-list').replaceChildren(...models.map(model => {
-      const item = document.createElement('li'); item.textContent = model.displayName + (model.capability ? model.capability === 'tts' ? ' · 语音合成' : ' · 音频转写' : model.supportsImageEdit ? ' · 支持改图协议' : ''); return item;
+      const item = document.createElement('li'); item.textContent = model.displayName + (model.capability ? model.capability === 'video-gen' ? ' · 视频生成' : model.capability === 'tts' ? ' · 语音合成' : ' · 音频转写' : model.supportsImageEdit ? ' · 支持改图协议' : ''); return item;
     }));
   } catch (error) {
     if (valid(ctx)) { $('#model-summary').textContent = '配置不可用'; $('#model-note').textContent = describe(error); overview.setModels(null, describe(error)); }
@@ -303,9 +343,9 @@ function createOverviewPanel() {
     { id: 'image', cap: 'image-gen', title: '图片', subtitle: '生成、修改，或运行 ComfyUI 工作流。',
       icon: 'M4 4h16v16H4z M4 16l5-5 4 4 3-3 4 4 M8 8h.01', modes: [['generate', '生成图片', 'generations.create'], ['edit', '修改图片', 'runs.create']],
       detail: 'API 与 ComfyUI 共用图片作品。修改图片需所选协议支持带图编辑；ComfyUI 参数来自已保存工作流，真实服务仍需单独验收。', command: 'run image' },
-    { id: 'video', cap: 'video-gen', title: '视频', subtitle: '文生视频、图生视频与语音驱动视频。',
-      icon: 'M3 6h12v12H3z M15 10l6-3v10l-6-3', modes: [],
-      detail: 'CLI 与 DSH 已有生成和原任务跟踪。Core 创作页与通用 MCP 尚未接入，配置用途不会自动增加入口。', command: 'run video' },
+    { id: 'video', cap: 'video-gen', title: '视频', subtitle: '从一段动态描述开始，接回原任务的视频。',
+      icon: 'M3 6h12v12H3z M15 10l6-3v10l-6-3', modes: [['video', '生成视频', 'videos.create']],
+      detail: '新 v4 工作区提供固定文生视频流程，支持可选尺寸与时长。明确开始后才调用模型；MP4/WebM 原件可播放下载。图生视频与 S2V 仍使用 CLI / DSH。', command: 'run video' },
     { id: 'tts', cap: 'tts', title: '语音', subtitle: '让一段文字成为可以试听的声音。',
       icon: 'M4 10h4l5-4v12l-5-4H4z M16 8c3 2 3 6 0 8 M19 5c5 4 5 10 0 14', modes: [['tts', '合成语音', 'speeches.create']],
       detail: '新 v3 音频工作区提供 Web / MCP 流程，当前内置合成接口为 DashScope Qwen-TTS 普通 HTTP；音色须与实际模型匹配。', command: 'run tts' },
@@ -328,24 +368,25 @@ function createOverviewPanel() {
   const operations = () => info?.operations || [];
   const executable = () => operations().includes('runs.continue');
   const candidates = feature => catalog?.models.filter(model => feature.id === 'image' ? !model.capability : model.capability === feature.cap);
-  const supported = feature => feature.id === 'image' || feature.modes.length && info?.audio === true;
+  const supported = feature => feature.id === 'image' || feature.modes.length && (feature.id === 'video' ? info?.video === true : info?.audio === true);
   function fact(list, title, value) { list.append(node('dt', title), node('dd', value)); }
   function card(feature, index) {
     const article = node('article', undefined, 'overview-capability card'); article.dataset.overviewCapability = feature.id; article.dataset.providerTone = String(index);
     const heading = node('div', undefined, 'overview-capability-heading'), mark = node('span', undefined, 'overview-capability-icon');
     const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'), path = document.createElementNS(svg.namespaceURI, 'path');
     svg.setAttribute('viewBox', '0 0 24 24'); svg.setAttribute('aria-hidden', 'true'); path.setAttribute('d', feature.icon); svg.append(path); mark.append(svg);
-    heading.append(mark, node('h3', feature.title), node('span', supported(feature) ? '面板已接入' : feature.modes.length ? '需音频工作区' : 'CLI / DSH', 'overview-entry'));
+    heading.append(mark, node('h3', feature.title), node('span', supported(feature) ? '面板已接入' : feature.modes.length ? feature.id === 'video' ? '需视频工作区' : '需音频工作区' : 'CLI / DSH', 'overview-entry'));
     article.append(heading, node('p', feature.subtitle, 'overview-capability-description'));
     const declared = settings?.providers.flatMap(provider => provider.models.filter(model => model.capabilities.includes(feature.cap)));
     const policy = settings?.assignments[feature.cap], values = candidates(feature);
+    const workspaceKind = feature.id === 'video' ? '视频' : '音频';
     const config = errors.settings ? '配置读取失败，未作判断' : settings
       ? declared.length + ' 个已标注 · ' + ({ auto: '自动选择', manual: '手动排序', disabled: '功能已停用' })[policy.mode]
-      : info.providerManagement ? '读取已保存配置…' : !feature.modes.length ? '当前会话未提供配置详情' : !supported(feature) ? '当前工作区未提供音频候选'
+      : info.providerManagement ? '读取已保存配置…' : !feature.modes.length ? '当前会话未提供配置详情' : !supported(feature) ? '当前工作区未提供' + workspaceKind + '候选'
         : errors.models ? '候选读取失败' : !catalog ? '读取模型候选…' : !catalog.configured ? '未指定配置' : values.length + ' 个候选';
     const facts = node('dl', undefined, 'overview-capability-facts'); fact(facts, '配置', config);
     if (feature.modes.length && info.providerManagement) fact(facts, '候选', errors.models ? '读取失败，未作判断'
-      : !catalog ? '读取中…' : !supported(feature) ? '此工作区未接入音频流程' : values.length + ' 个当前候选');
+      : !catalog ? '读取中…' : !supported(feature) ? '此工作区未接入' + workspaceKind + '流程' : values.length + ' 个当前候选');
     const records = declared?.map(model => model.verified[feature.cap]).filter(Boolean), passed = records?.filter(record => record.ok).length;
     const evidence = errors.settings ? '记录读取失败' : !settings ? info.providerManagement ? '读取实测记录…' : '当前会话未提供记录'
       : !records.length ? '尚无实测记录' : passed + ' 通过 · ' + (records.length - passed) + ' 未通过';
@@ -379,9 +420,9 @@ function createOverviewPanel() {
     if (!info) return;
     const stats = $('#overview-stats'); stats.replaceChildren();
     const state = node('div'); fact(state, '当前服务', executable() ? '可创作' : '仅浏览');
-    state.append(node('span', info.audio ? '图片、语音与转写工作区' : '图片工作区', 'overview-stat-note')); stats.append(state);
+    state.append(node('span', info.video ? '图片、视频、语音与转写工作区' : info.audio ? '图片、语音与转写工作区' : '图片工作区', 'overview-stat-note')); stats.append(state);
     const models = node('div'); fact(models, '创作候选', errors.models ? '读取失败' : !catalog ? '读取中…' : !catalog.configured ? '未指定配置' : new Set(catalog.models.map(model => model.modelRef)).size + ' 个');
-    models.append(node('span', info.audio ? '图片/语音/转写，按模型去重' : '图片候选，按模型去重', 'overview-stat-note')); stats.append(models);
+    models.append(node('span', info.video ? '图片/视频/语音/转写，按模型去重' : info.audio ? '图片/语音/转写，按模型去重' : '图片候选，按模型去重', 'overview-stat-note')); stats.append(models);
     const history = node('div'); fact(history, '已保存流程', errors.history ? '读取失败' : total === null ? '读取中…' : total + ' 个');
     history.append(node('span', '仅统计当前工作区', 'overview-stat-note')); stats.append(history);
     const expanded = new Set([...document.querySelectorAll('#overview-capabilities details[open]')].map(details => details.closest('[data-overview-capability]').dataset.overviewCapability));
@@ -428,7 +469,7 @@ function renderHistory() {
   $('#history-list').replaceChildren(...runs.map((run, index) => {
     const button = document.createElement('button'); button.type = 'button'; button.className = 'history-item';
     button.dataset.runId = run.id; button.setAttribute('aria-current', run.id === current?.id ? 'true' : 'false');
-    const title = document.createElement('strong'); title.textContent = (audioRun(run) ? recipeLabel(run.recipe) : '图片流程') + ' · ' + date(run.createdAt);
+    const title = document.createElement('strong'); title.textContent = (audioRun(run) || videoRun(run) ? recipeLabel(run.recipe) : '图片流程') + ' · ' + date(run.createdAt);
     const label = document.createElement('span'); label.textContent = run.modelRef;
     const number = document.createElement('small'); number.textContent = String(index + 1).padStart(2, '0');
     button.append(number, title, label); button.addEventListener('click', () => loadRun(run.id)); return button;
@@ -496,6 +537,19 @@ async function loadAudioMedia(ctx, ticket, kind, artifactId, signal) {
     if (valid(ctx) && ticket === runTicket && !signal.aborted) $('#audio-result-note').textContent += (text ? '文字' : '音频') + '读取失败：' + describe(error) + ' ';
   }
 }
+async function loadVideoMedia(ctx, ticket, artifactId, signal) {
+  $('#video-result-note').textContent = artifactId ? '正在读取原视频…' : '明确执行后，原任务的视频会保存在这里。';
+  if (!artifactId) return;
+  try {
+    const blob = await ctx.client.get('/api/v0/artifacts/' + artifactId + '/video', { binary: true, signal });
+    if (!valid(ctx) || ticket !== runTicket || signal.aborted) return;
+    if (!['video/mp4', 'video/webm'].includes(blob.type) || blob.size > 32 * 1024 * 1024) throw new TypeError('不支持的视频格式或大小');
+    const url = URL.createObjectURL(blob); urls.add(url);
+    $('#output-video').src = url; $('#output-video').hidden = false;
+    $('#video-result-note').textContent = '原视频已载入。点击播放或下载；播放器支持取决于当前浏览器。';
+    return { artifactId, mediaType: blob.type };
+  } catch (error) { if (valid(ctx) && ticket === runTicket && !signal.aborted) $('#video-result-note').textContent = '视频读取失败：' + describe(error); }
+}
 async function loadRun(id, { fromAction = false } = {}) {
   const ctx = context(); if (!ctx.client || !RUN.test(id)) return;
   if (!fromAction) creation.cancelChain();
@@ -510,22 +564,22 @@ async function loadRun(id, { fromAction = false } = {}) {
   try {
     const view = await ctx.client.get('/api/v0/runs/' + id, { signal });
     if (!valid(ctx) || ticket !== runTicket) return;
-    const presentation = presentFlow(view, capabilities), isAudio = audioRun(view); current = view;
+    const presentation = presentFlow(view, capabilities), isAudio = audioRun(view), isVideo = videoRun(view); current = view;
     history.replaceState(null, '', '#' + view.id); renderHistory();
     $('#status-title').textContent = presentation.title; $('#status-message').textContent = presentation.message;
     $('#run-view').dataset.tone = presentation.tone;
     $('#run-view').dataset.hasOutput = String(Boolean(view.output));
-    $('#run-view').dataset.recipe = view.recipe; $('#source-card').hidden = !view.source; $('#view-modes').hidden = isAudio || !view.source;
+    $('#run-view').dataset.recipe = view.recipe; $('#source-card').hidden = !view.source; $('#view-modes').hidden = isAudio || isVideo || !view.source;
     $('#prompt-title').textContent = isAudio ? view.recipe === 'speech/v0' ? '朗读内容' : '转写来源' : view.source ? '修改要求' : '画面描述';
     $('[data-view="overlay"]').disabled = !view.source || !view.output; if (!sameRun || !view.output || !view.source) setView('pair');
-    if (isAudio) { $('#image-pair').hidden = true; $('#overlay-view').hidden = true; }
-    $('#audio-result').hidden = !isAudio; $('#reuse-selected').hidden = isAudio;
-    $('.canvas-label').textContent = isAudio ? '声音工作台' : '创作画布';
+    if (isAudio || isVideo) { $('#image-pair').hidden = true; $('#overlay-view').hidden = true; }
+    $('#audio-result').hidden = !isAudio; $('#video-result').hidden = !isVideo; $('#reuse-selected').hidden = isAudio || isVideo;
+    $('.canvas-label').textContent = isVideo ? '动态工作台' : isAudio ? '声音工作台' : '创作画布';
     $('#audio-result-kind').textContent = view.recipe === 'speech/v0' ? 'VOICE' : 'TRANSCRIPT';
     $('#audio-result-title').textContent = view.recipe === 'speech/v0' ? '让文字有声音' : '声音里的文字';
     $('#audio-result-note').textContent = view.output ? '作品已保存；点击播放或下载即可使用。' : '明确执行后，原任务的结果会保存在这里。';
     $('#operation-note').hidden = true;
-    $('#selection-feedback').textContent = isAudio ? view.output ? view.recipe === 'speech/v0' ? '音频已保存，可以试听或下载。' : '转写已保存，可下载 UTF-8 文本。' : '结果尚未保存。'
+    $('#selection-feedback').textContent = isVideo ? view.output ? '视频已保存，可以播放或下载原件。' : '原任务结果尚未保存。' : isAudio ? view.output ? view.recipe === 'speech/v0' ? '音频已保存，可以试听或下载。' : '转写已保存，可下载 UTF-8 文本。' : '结果尚未保存。'
       : view.selection ? '当前选择已记录，可以下载原始图片。' : capabilities.includes('runs.select')
       ? '选择喜欢的版本，再保存到设备。' : '当前未开启选择权限；已有选择仍可下载。';
     $('#run-meta').textContent = view.input.modelRef + ' · ' + date(view.createdAt);
@@ -542,19 +596,24 @@ async function loadRun(id, { fromAction = false } = {}) {
     $('#output-card').classList.toggle('is-selected', !$('#output-selected').hidden);
     $('#select-source').setAttribute('aria-pressed', String(!$('#source-selected').hidden));
     $('#select-output').setAttribute('aria-pressed', String(!$('#output-selected').hidden));
-    $('#download').disabled = isAudio ? !view.output : !view.selection;
-    $('#download').textContent = isAudio ? view.recipe === 'speech/v0' ? '下载音频' : '下载文字' : '下载已选作品';
-    $('#run-details .muted').hidden = isAudio;
+    $('#download').disabled = isAudio || isVideo ? !view.output : !view.selection;
+    $('#download').textContent = isVideo ? '下载视频' : isAudio ? view.recipe === 'speech/v0' ? '下载音频' : '下载文字' : '下载已选作品';
+    $('#run-details .muted').hidden = isAudio || isVideo;
     $('#run-facts').replaceChildren(); if (!sameRun) $('#run-details').open = false;
     creation.view(view, { sameRun });
     addFact('流程', view.id); addFact('版本', String(view.revision)); addFact('保存时间', date(view.updatedAt));
     addFact('类型', recipeLabel(view.recipe));
     if (view.input.voice) addFact('音色', view.input.voice);
+    if (view.input.duration !== undefined) addFact('时长', String(view.input.duration) + ' 秒');
+    if (isVideo && view.input.size) addFact('尺寸', view.input.size);
     if (view.source) addFact(isAudio ? '原音频' : '原图', view.source.artifactId); addFact('结果', view.output?.artifactId || '尚未保存');
     addFact('原任务', view.task?.id || '尚未创建');
+    const route = view.task?.networkRoutes?.reduce((latest, value) => !latest || value.lastAt > latest.lastAt ? value : latest, null);
+    if (view.task) addFact('最近记录的出口', route ? [route.route === 'proxy' ? '出口池 ' + route.poolId + ' / ' + route.nodeId : route.route === 'direct' ? '明确直连' : '继承环境',
+      ({ discover: '目录检查', prepareInput: '输入准备', submit: '提交', poll: '查询', download: '交付', cancel: '取消', vision: '视觉' })[route.operation], date(route.lastAt)].join(' · ') : '未记录');
     if (view.metrics) addFact('像素差异', (view.metrics.ratio * 100).toFixed(2) + '%');
     $('#viewer-empty').hidden = true; $('#run-view').hidden = false;
-    const previewArtifacts = await Promise.all(isAudio ? [loadAudioMedia(ctx, ticket, 'source', view.source?.artifactId, signal),
+    const previewArtifacts = await Promise.all(isVideo ? [loadVideoMedia(ctx, ticket, view.output?.artifactId, signal)] : isAudio ? [loadAudioMedia(ctx, ticket, 'source', view.source?.artifactId, signal),
       loadAudioMedia(ctx, ticket, view.recipe === 'speech/v0' ? 'output' : 'transcript', view.output?.artifactId, signal)]
       : [loadMedia(ctx, ticket, 'source', view.source?.artifactId, signal), loadMedia(ctx, ticket, 'output', view.output?.artifactId, signal)]);
     if (valid(ctx) && ticket === runTicket && !signal.aborted) plugins?.previewArtifacts(previewArtifacts, view.selection?.artifactId || view.output?.artifactId);
@@ -565,7 +624,7 @@ async function loadRun(id, { fromAction = false } = {}) {
   } finally { if (valid(ctx) && ticket === runTicket) $('#viewer').setAttribute('aria-busy', 'false'); }
 }
 async function download() {
-  if (!(audioRun(current) ? current?.output : current?.selection) || $('#download').disabled) return;
+  if (!(audioRun(current) || videoRun(current) ? current?.output : current?.selection) || $('#download').disabled) return;
   const ctx = context(), id = current.id, ticket = runTicket;
   $('#download').disabled = true; feedback('正在读取作品…');
   try {
@@ -573,11 +632,11 @@ async function download() {
     if (!valid(ctx) || ticket !== runTicket) return;
     const url = URL.createObjectURL(blob); urls.add(url);
     const link = document.createElement('a'); link.href = url;
-    const extension = { 'image/png': 'png', 'image/jpeg': 'jpg', 'image/webp': 'webp', 'audio/wav': 'wav', 'audio/mpeg': 'mp3', 'audio/ogg': 'ogg', 'audio/flac': 'flac', 'text/plain': 'txt' }[blob.type];
+    const extension = { 'image/png': 'png', 'image/jpeg': 'jpg', 'image/webp': 'webp', 'audio/wav': 'wav', 'audio/mpeg': 'mp3', 'audio/ogg': 'ogg', 'audio/flac': 'flac', 'text/plain': 'txt', 'video/mp4': 'mp4', 'video/webm': 'webm' }[blob.type];
     if (!extension) throw new TypeError('不支持的下载格式');
     // The CLI may have changed the selection since this view was loaded. Use the server's
     // filename, which identifies the exact artifact returned by this download request.
-    if (!/^iris-artifact_[a-f0-9]{24}\.(?:png|jpg|webp|wav|mp3|ogg|flac|txt)$/.test(filename)) throw new TypeError('不支持的下载文件名');
+    if (!/^iris-artifact_[a-f0-9]{24}\.(?:png|jpg|webp|wav|mp3|ogg|flac|txt|mp4|webm)$/.test(filename)) throw new TypeError('不支持的下载文件名');
     link.download = filename; link.click();
     setTimeout(() => { URL.revokeObjectURL(url); urls.delete(url); }, 60000);
     feedback('下载请求已交给浏览器，请在浏览器下载记录中查看。');
@@ -612,6 +671,7 @@ $('#overview-tab').addEventListener('click', () => tab('overview'));
 $('#studio-tab').addEventListener('click', () => tab());
 $('#media-tab').addEventListener('click', () => tab('gallery'));
 $('#connections-tab').addEventListener('click', () => tab('connections'));
+$('#plugins-tab').addEventListener('click', () => tab('plugins'));
 for (const id of ['new-run', 'gallery-new']) $('#' + id).addEventListener('click', () => creation.beginDraft());
 for (const button of document.querySelectorAll('#view-modes button')) button.addEventListener('click', () => { if (!button.disabled) setView(button.dataset.view); });
 $('#compare-split').addEventListener('input', event => $('#overlay-output').style.setProperty('--split', event.target.value + '%'));
@@ -626,6 +686,7 @@ for (const details of document.querySelectorAll('details')) details.addEventList
 });
 createAppearance();
 $('#providers-tab').addEventListener('click', () => { if (canManageProviders) tab('providers'); });
+$('#network-tab').addEventListener('click', () => { if (!$('#network-tab').hidden) tab('network'); });
 $('#manage-models').addEventListener('click', () => {
   if (canManageProviders) tab('providers');
   else feedback('当前服务未开启供应商管理。启动时添加 --allow-provider-management 并指定 --provider-config 后可配置。');