agentworkshop 0.7.24 → 0.7.33

package/app/pages/workshop/agents.vue

@@ -370,7 +370,16 @@ useHead({ title: () => tt('titles.agents') })
           <a-select
             v-model:value="form.harness"
             :options="harnessOptions"
-          />
+          >
+            <template #option="{ value, label }">
+              <span
+                class="h-opt"
+                :class="{ off: isUnavailable(String(value)) }"
+              >
+                <span class="h-opt-dot" /> {{ label }}
+              </span>
+            </template>
+          </a-select>
           <div
             v-if="harnesses.length > 0"
             class="harness-status"
@@ -378,6 +387,13 @@ useHead({ title: () => tt('titles.agents') })
           >
             <template v-if="isUnavailable(form.harness)">
               <span class="i-tabler-plug-off" /> {{ harnessById.get(form.harness)?.error }}
+              <a
+                v-if="harnessById.get(form.harness)?.homepage"
+                class="h-install"
+                :href="harnessById.get(form.harness)?.homepage"
+                target="_blank"
+                rel="noopener"
+              >{{ tt('agents.installLink') }}</a>
             </template>
             <template v-else-if="harnessById.get(form.harness)?.inprocess">
               <span class="i-tabler-plug-connected" /> {{ tt('agents.harnessInprocess') }}
@@ -428,6 +444,12 @@ useHead({ title: () => tt('titles.agents') })
   border-radius: 3px;
   opacity: 0.75;
 }
+.h-opt { display: inline-flex; align-items: center; gap: 7px; }
+.h-opt-dot { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--tone-success-dot, #4a6b57); }
+.h-opt.off .h-opt-dot { background: var(--tone-danger-dot, #c25a4e); }
+.h-opt.off { opacity: 0.6; }
+.h-install { margin-left: 8px; color: var(--accent); text-decoration: none; }
+.h-install:hover { text-decoration: underline; }
 .harness-status {
   display: flex;
   gap: 6px;

package/app/pages/workshop/teams.vue

@@ -5,7 +5,7 @@
  * admin:全量视图(含他人私有),附创建者;可改删任意非内置编组。
  */
 import { message } from 'ant-design-vue'
-import { useWorkshopApi, type TeamDto, type AgentTemplateDto, type ChannelDto } from '../../composables/workshop/useWorkshopApi'
+import { useWorkshopApi, type TeamDto, type AgentTemplateDto, type ChannelDto, type WorkshopPluginDto, type ChannelPluginStateDto } from '../../composables/workshop/useWorkshopApi'
 import { useUserStore } from '../../stores/workshop/user'
 
 const { t } = useI18n()
@@ -79,17 +79,49 @@ const visTag = (team: TeamDto): { text: string, color: string, icon?: string } =
 
 const createOpen = ref(false)
 const createForm = reactive({ name: '', description: '', visibility: 'private' as 'private' | 'public' })
+
+// ===== 插件(创建时勾选启用哪些;平台清单中 enabled 的插件,默认全选) =====
+const platformPlugins = ref<WorkshopPluginDto[]>([])
+const createPluginSel = ref<Record<string, boolean>>({})
+const loadPlatformPlugins = async (): Promise<void> => {
+  try {
+    const res = await api.listPlugins()
+    // 顶层 plugins key(非信封);兼容 {code,data} 信封;只取平台已启用的插件
+    const list = res?.plugins ?? (res as { data?: { plugins?: WorkshopPluginDto[] } })?.data?.plugins ?? []
+    const enabled = (Array.isArray(list) ? list : []).filter(p => p.enabled !== false)
+    platformPlugins.value = enabled
+    const sel: Record<string, boolean> = {}
+    for (const p of enabled) sel[p.name] = true
+    createPluginSel.value = sel
+  }
+  catch { /* 清单不可得时隐藏插件多选(创建仍可走默认) */ }
+}
+if (import.meta.client) void loadPlatformPlugins()
+
+/** checkbox-group 双向绑定(勾选集 ↔ plugins 开关视图) */
+const pluginChecked = computed({
+  get: () => Object.entries(createPluginSel.value).filter(([, v]) => v).map(([k]) => k),
+  set: (vals: Array<string>) => {
+    const next: Record<string, boolean> = {}
+    for (const p of platformPlugins.value) next[p.name] = vals.includes(p.name)
+    createPluginSel.value = next
+  },
+})
+
 const create = async (): Promise<void> => {
   if (!createForm.name.trim()) {
     message.warning(t('teams.k1bvcdo2021'))
     return
   }
-  await api.createTeam({ name: createForm.name.trim(), description: createForm.description || undefined, visibility: createForm.visibility })
+  // 勾选结果作为 plugins:[{name,enabled}] 附加(后端创建时写入该团队的插件开关)
+  const plugins = Object.entries(createPluginSel.value).map(([name, enabled]) => ({ name, enabled }))
+  await api.createTeam({ name: createForm.name.trim(), description: createForm.description || undefined, visibility: createForm.visibility, plugins })
   message.success(t('teams.k3n5hak022'))
   createOpen.value = false
   createForm.name = ''
   createForm.description = ''
   createForm.visibility = 'private'
+  createPluginSel.value = Object.fromEntries(Object.entries(createPluginSel.value).map(([k]) => [k, true]))
   void load()
 }
 
@@ -170,6 +202,56 @@ const removeTeam = async (team: TeamDto): Promise<void> => {
   void load()
 }
 
+// ===== 团队级插件开关(GET → 展示各插件开关;切换即 PUT) =====
+const plugOpen = ref(false)
+const plugTeamRef = ref<TeamDto | null>(null)
+const plugRows = ref<ChannelPluginStateDto[]>([])
+const plugSource = ref<'explicit' | 'default'>('default')
+const plugLoading = ref(false)
+const plugSaving = ref<string | null>(null)
+const openPlugins = (team: TeamDto): void => {
+  plugTeamRef.value = team
+  plugRows.value = []
+  plugSource.value = 'default'
+  plugOpen.value = true
+  void loadTeamPlugins(team)
+}
+const loadTeamPlugins = async (team: TeamDto): Promise<void> => {
+  plugLoading.value = true
+  try {
+    const res = await api.listTeamPlugins(team.id)
+    const data = res?.data ?? {}
+    plugRows.value = data.plugins ?? []
+    plugSource.value = data.source === 'explicit' ? 'explicit' : 'default'
+  }
+  catch (e) {
+    message.error(apiErrorMessage(e))
+  }
+  finally {
+    plugLoading.value = false
+  }
+}
+const toggleTeamPlugin = async (row: ChannelPluginStateDto, next: boolean): Promise<void> => {
+  if (!plugTeamRef.value || plugSaving.value) return
+  const teamId = plugTeamRef.value.id
+  plugSaving.value = row.name
+  try {
+    // PUT 全量提交当前开关视图(仅翻转目标行)
+    const payload = plugRows.value.map(r => ({ name: r.name, enabled: r.name === row.name ? next : r.enabled }))
+    const res = await api.putTeamPlugins(teamId, { plugins: payload })
+    const data = res?.data ?? {}
+    plugRows.value = data.plugins ?? payload.map(p => ({ ...p }))
+    plugSource.value = data.source === 'explicit' ? 'explicit' : 'default'
+    message.success(t('teams.k1plugon043'))
+  }
+  catch (e) {
+    message.error(apiErrorMessage(e))
+  }
+  finally {
+    plugSaving.value = null
+  }
+}
+
 useHead({ title: () => t('titles.teams') })
 </script>
 
@@ -246,6 +328,9 @@ useHead({ title: () => t('titles.teams') })
                   <a-menu-item @click="openDeploy(team)">
                     部署到 Channel…
                   </a-menu-item>
+                  <a-menu-item @click="openPlugins(team)">
+                    {{ $t('teams.k1plugon047') }}
+                  </a-menu-item>
                   <a-menu-item
                     danger
                     @click="removeTeam(team)"
@@ -331,6 +416,30 @@ useHead({ title: () => t('titles.teams') })
             </a-radio>
           </a-radio-group>
         </a-form-item>
+        <a-form-item
+          v-if="platformPlugins.length"
+          :label="$t('teams.k1plugon041')"
+        >
+          <a-checkbox-group
+            v-model:value="pluginChecked"
+            class="plug-create-group"
+          >
+            <a-checkbox
+              v-for="p in platformPlugins"
+              :key="p.name"
+              :value="p.name"
+            >
+              <span class="aw-mono">{{ p.name }}</span>
+              <span
+                v-if="p.builtin"
+                class="plug-builtin-tag"
+              >{{ $t('teams.k3x23c018') }}</span>
+            </a-checkbox>
+          </a-checkbox-group>
+          <div class="plug-hint">
+            {{ $t('teams.k1plugon042') }}
+          </div>
+        </a-form-item>
       </a-form>
     </a-modal>
 
@@ -378,6 +487,53 @@ useHead({ title: () => t('titles.teams') })
         </a-form-item>
       </a-form>
     </a-modal>
+
+    <a-modal
+      v-model:open="plugOpen"
+      :title="$t('teams.k1plugon040', { p0: plugTeamRef?.name ?? '' })"
+      :footer="null"
+    >
+      <a-spin :spinning="plugLoading">
+        <p class="plug-source">
+          <template v-if="plugSource === 'explicit'">
+            {{ $t('teams.k1plugon045') }}
+          </template>
+          <template v-else>
+            {{ $t('teams.k1plugon044') }}
+          </template>
+        </p>
+        <div
+          v-for="row in plugRows"
+          :key="row.name"
+          class="plug-row"
+        >
+          <div class="plug-text">
+            <div class="plug-name">
+              <span class="aw-mono">{{ row.name }}</span>
+              <span
+                v-if="row.builtin"
+                class="plug-builtin-tag"
+              >{{ $t('teams.k3x23c018') }}</span>
+            </div>
+            <div class="plug-desc">
+              {{ row.description || '—' }}
+            </div>
+          </div>
+          <a-switch
+            :checked="row.enabled"
+            size="small"
+            :loading="plugSaving === row.name"
+            @change="(v: unknown) => toggleTeamPlugin(row, v === true)"
+          />
+        </div>
+        <div
+          v-if="plugRows.length === 0 && !plugLoading"
+          class="plug-hint"
+        >
+          {{ $t('teams.k1plugon046') }}
+        </div>
+      </a-spin>
+    </a-modal>
   </div>
 </template>
 
@@ -467,4 +623,58 @@ h2 { margin: 0 0 4px; }
   border-style: dashed;
 }
 .big { font-size: 28px; }
+
+/* ===== 插件开关(创建勾选 + 团队弹层) ===== */
+.plug-create-group {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.plug-builtin-tag {
+  margin-left: 6px;
+  padding: 0 6px;
+  font-family: var(--font-mono);
+  font-size: 10.5px;
+  color: var(--ink-faint);
+  border: 1px solid var(--line-strong);
+  border-radius: var(--radius-pill, 999px);
+}
+.plug-hint {
+  margin-top: 6px;
+  font-size: 11.5px;
+  line-height: 1.5;
+  color: var(--ink-faint);
+}
+.plug-source {
+  margin: 0 0 10px;
+  font-size: 12px;
+  color: var(--ink-faint);
+}
+.plug-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 14px;
+  padding: 10px 0;
+  border-bottom: 1px solid var(--line);
+}
+.plug-row:last-of-type {
+  border-bottom: 0;
+}
+.plug-text {
+  min-width: 0;
+}
+.plug-name {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+  font-size: 13px;
+  font-weight: 500;
+}
+.plug-desc {
+  margin-top: 2px;
+  font-size: 11.5px;
+  line-height: 1.5;
+  color: var(--ink-faint);
+}
 </style>

package/app/plugins/aw-plugins.client.ts

@@ -1,21 +1,33 @@
 /**
  * aw 插件客户端装载器 —— 前端增强入口(支持热注入/热卸载)。
  * - 启动期拉取 /api/plugins/manifest → 对启用且含 client 的插件动态 import 装载
+ * - i18n:启动/热重载时拉取 /api/plugins/i18n(插件根目录 i18n.json 汇编),
+ *   按 vue-i18n 命名空间 `plugin.<name>` 合并 → 插件设置标签/面板文案多语言;
+ *   语言切换经 i18n:changed 钩子广播给全部客户端插件
+ * - UI 注入:ctx.ui.registerPanel → usePluginPanels 注册表 → 页面 <PluginSlot> 渲染;
+ *   ctx.t 为插件命名空间翻译
  * - 热通道双保险:WS `plugins.reloaded` 事件(TownBus 桥) + 15s 轮询 diff
- *   → 新启用插件即时注入;停用插件即时 dispose 卸载
+ *   → 新启用插件即时注入;停用插件即时 dispose 卸载(面板/订阅全回收)
  * - 错误隔离:单插件装载失败仅告警,不影响应用与其他插件
  * 插件契约见 docs/plugins.md;信任模型与 aw commands 相同(仅装可信代码)。
  */
+import { watch } from 'vue'
 import { createClientContext, type ClientContext } from '@/sdk/client.mjs'
+import { usePluginPanels } from '@/app/composables/workshop/usePluginPanels'
 import type { TownBus } from '~/composables/workshop/useTownBus'
 
 interface ManifestEntry { name: string, enabled?: boolean, hasClient?: boolean }
+interface I18nBundle { i18n?: Record<string, Record<string, Record<string, string>>> }
 
 export default defineNuxtPlugin(async (nuxtApp) => {
   if (!import.meta.client) return
 
   /** name → ctx(已装载客户端插件) */
   const loaded = new Map<string, ClientContext>()
+  const { unregisterPlugin } = usePluginPanels()
+  const panels = usePluginPanels()
+  const i18n: { mergeLocaleMessage?: (locale: string, messages: Record<string, unknown>) => void, locale?: unknown } | null
+    = (nuxtApp.$i18n as never) ?? null
   let bus: TownBus | null = null
   try {
     bus = useTownBus()
@@ -36,6 +48,50 @@ export default defineNuxtPlugin(async (nuxtApp) => {
     })
   }
 
+  /** 插件消息树(locale → plugin → key 树);ctx.t 自解析,不依赖 vue-i18n 实例差异 */
+  const messageTree: Record<string, Record<string, Record<string, string>>> = {}
+  let currentLocale = ''
+
+  function localeOf(): string {
+    const loc = i18n?.locale as { value?: string } | string | undefined
+    return typeof loc === 'string' ? loc : (loc?.value ?? 'zh-CN')
+  }
+
+  function resolveKey(locale: string, plugin: string, key: string): string {
+    let cur: unknown = messageTree[locale]?.[plugin]
+    for (const seg of key.split('.')) {
+      if (!cur || typeof cur !== 'object') return ''
+      cur = (cur as Record<string, unknown>)[seg]
+    }
+    return typeof cur === 'string' ? cur : ''
+  }
+
+  /** 拉取并合并插件 i18n 消息(命名空间 plugin.<name>;幂等) */
+  async function syncI18n(): Promise<void> {
+    try {
+      const res = await fetch('/api/plugins/i18n', { headers: { accept: 'application/json' } })
+      if (!res.ok) return
+      const body = (await res.json().catch(() => null)) as I18nBundle | null
+      for (const [plugin, locales] of Object.entries(body?.i18n ?? {})) {
+        for (const [locale, messages] of Object.entries(locales)) {
+          ;(messageTree[locale] ??= {})[plugin] = messages
+          // 同时并入 vue-i18n(设置页等宿主组件经 t() 解析插件设置标签)
+          i18n?.mergeLocaleMessage?.(locale, { plugin: { [plugin]: messages } })
+        }
+      }
+      currentLocale = localeOf()
+    }
+    catch { /* i18n 包不可达:插件文案回落声明里的 label */ }
+  }
+
+  /** 翻译助手:插件命名空间自解析(messageTree;未命中回落声明键) */
+  function translatorFor(name: string): (key: string, params?: Record<string, unknown>) => string {
+    return (key, _params) => {
+      const hit = resolveKey(localeOf(), name, key) || resolveKey(currentLocale, name, key)
+      return hit || key
+    }
+  }
+
   async function loadOne(name: string): Promise<boolean> {
     try {
       const mod = await import(/* @vite-ignore */ `/api/plugins/client/${encodeURIComponent(name)}`)
@@ -44,7 +100,19 @@ export default defineNuxtPlugin(async (nuxtApp) => {
         console.warn(`[aw-plugins] ${name} 客户端入口缺少 setup(ctx)`)
         return false
       }
-      const ctx = createClientContext({ name, eventBridge: bridgeFactory(bus) })
+      const ctx = createClientContext({
+        name,
+        eventBridge: bridgeFactory(bus),
+        ui: {
+          slots: ['plugins.page', 'settings.plugins', 'dashboard.widgets'],
+          registerPanel: entry => panels.registerPanel({ ...entry, plugin: name }),
+        },
+        t: translatorFor(name),
+        getLocale: () => {
+          const loc = i18n?.locale as { value?: string } | string | undefined
+          return typeof loc === 'string' ? loc : loc?.value ?? ''
+        },
+      })
       await (setup as (ctx: unknown) => void | Promise<void>)(ctx)
       void ctx.hooks.emit('client:init', { name })
       loaded.set(name, ctx)
@@ -62,32 +130,53 @@ export default defineNuxtPlugin(async (nuxtApp) => {
     if (!ctx) return
     ctx.dispose()
     loaded.delete(name)
+    unregisterPlugin(name) // 回收其注册的全部 UI 面板
     console.info(`[aw-plugins] 客户端插件已卸载: ${name}`)
   }
 
-  /** 全量同步:启用的新插件注入;停用/移除的插件卸载 */
+  /** 全量同步:启用的新插件注入;停用/移除的插件卸载;i18n 包随增量刷新 */
   async function syncPlugins(): Promise<void> {
     try {
       const res = await fetch('/api/plugins/manifest', { headers: { accept: 'application/json' } })
       if (!res.ok) return
       const body = await res.json().catch(() => null) as { plugins?: ManifestEntry[] } | null
       const list = body?.plugins ?? []
+      let changed = false
       for (const p of list) {
-        if (p.enabled !== false && p.hasClient && !loaded.has(p.name))
+        if (p.enabled !== false && p.hasClient && !loaded.has(p.name)) {
           await loadOne(p.name)
+          changed = true
+        }
       }
       for (const name of [...loaded.keys()]) {
         const p = list.find(x => x.name === name)
-        if (!p || p.enabled === false || !p.hasClient)
+        if (!p || p.enabled === false || !p.hasClient) {
           unloadOne(name)
+          changed = true
+        }
       }
+      if (changed) await syncI18n()
     }
     catch { /* 网络不可达:保留现状,下轮再试 */ }
   }
 
-  // 首次装载
+  // 首次装载(i18n 先行:面板/设置标签直接以正确语言渲染)
+  await syncI18n()
   await syncPlugins()
 
+  // 语言切换 → 广播 i18n:changed(插件面板据此重渲染)
+  const localeRef = i18n?.locale as { value?: string } | undefined
+  if (localeRef && typeof localeRef === 'object') {
+    watch(localeRef, (loc) => {
+      for (const { ctx } of loaded.values()) {
+        try {
+          ctx?.hooks?.emit('i18n:changed', { locale: loc })
+        }
+        catch { /* 单插件广播失败不阻断 */ }
+      }
+    })
+  }
+
   // 页面切换广播(已装载插件均可感知;防御性隔离——单插件异常不影响路由)
   if (loaded.size) {
     nuxtApp.hooks.hook('page:finish', () => {

package/app/plugins/runtime-config.client.ts

@@ -12,25 +12,15 @@ export default defineNuxtPlugin(() => {
   const store = useRuntimeConfigStore()
   const appStore = useAppStore()
 
-  let darkTouched = false
-  let lastDarkFromRuntime: boolean | null = null
-
-  // 用户手动切换过暗色后，禁止运行时主题覆盖（尊重本地偏好）
-  watch(
-    () => appStore.isDark,
-    (v) => {
-      if (lastDarkFromRuntime !== null && v !== lastDarkFromRuntime) darkTouched = true
-    },
-  )
-
-  // 主题模式:runtime 默认 → 应用首次暗态（仅当用户未手动切换）
+  // 主题模式:服务端 runtime 默认只对"从未显式选择过"的会话生效。
+  // 一旦用户在设置页/页头切过一次(toggleDark 置 themeTouched),本地偏好即锁定,
+  // 服务端 theme.mode 的热更新不再夺走控制权 —— 否则每次刷新都被默认值冲掉。
   watch(
     () => store.effective['theme.mode'],
     (v) => {
       if (v !== 'light' && v !== 'dark') return
-      if (darkTouched) return
+      if (appStore.themeTouched) return
       const target = v === 'dark'
-      lastDarkFromRuntime = target
       if (appStore.isDark !== target) appStore.isDark = target
     },
     { immediate: true },

package/app/plugins/theme.client.ts

@@ -2,14 +2,24 @@ import { useAppStore } from '~/stores/app'
 
 /**
  * 暗色模式同步插件（仅客户端）
- * 将 Pinia 的 isDark 状态同步为 <html> 的 .dark class，
- * 供 UnoCSS / 自定义暗色样式（main.css、布局层）消费。
- * antd 组件本身的暗色由 app.vue 的 ConfigProvider algorithm 驱动。
+ * 1. 将 Pinia 的 isDark 状态同步为 <html> 的 .dark class，
+ *    供 UnoCSS / 自定义暗色样式（main.css、布局层）消费。
+ *    antd 组件本身的暗色由 app.vue 的 ConfigProvider algorithm 驱动。
+ * 2. 把偏好镜像进 aw-theme cookie —— SSR 阶段读不到 localStorage，
+ *    没有这枚 cookie，服务端只能按 config.yml 渲浅色，客户端首帧再翻深色，
+ *    antd cssinjs 不会为相同 hash 重注入样式（深色下部分组件会掉样式）。
  */
 export default defineNuxtPlugin(() => {
   const store = useAppStore()
+  const cookie = useCookie<'dark' | 'light'>('aw-theme', {
+    maxAge: 60 * 60 * 24 * 365,
+    sameSite: 'lax',
+    path: '/',
+  })
 
   watchEffect(() => {
     document.documentElement.classList.toggle('dark', store.isDark)
+    const next = store.isDark ? 'dark' : 'light'
+    if (cookie.value !== next) cookie.value = next
   })
 })

package/app/stores/app.ts

@@ -5,6 +5,12 @@ export const useAppStore = defineStore('app', () => {
   // 默认暗色 = Digital Twin 控制室是产品首态(可切换亮色,选择被持久化)
   const isDark = ref(true)
   const sidebarCollapsed = ref(false)
+  /**
+   * 用户是否在设置页/页头显式切换过明暗。
+   * 只有"显式选择"才锁死主题,阻止服务端 theme.mode 的运行时跟随——
+   * 否则每次刷新都会被服务端默认值冲掉本地偏好(设置项形同虚设)。
+   */
+  const themeTouched = ref(false)
   /**
    * 主题强调色(warm-editorial:默认墨色药丸;设置页可换 muted 预设,实时生效并持久化)。
    * null = 跟随 config.yml 默认(config.primaryColor 注入的 --color-primary)。
@@ -13,6 +19,7 @@ export const useAppStore = defineStore('app', () => {
 
   function toggleDark() {
     isDark.value = !isDark.value
+    themeTouched.value = true
   }
 
   function toggleSidebar() {
@@ -23,10 +30,10 @@ export const useAppStore = defineStore('app', () => {
     accent.value = color
   }
 
-  return { isDark, sidebarCollapsed, accent, toggleDark, toggleSidebar, setAccent }
+  return { isDark, sidebarCollapsed, accent, themeTouched, toggleDark, toggleSidebar, setAccent }
 }, {
   persist: {
-    pick: ['isDark', 'sidebarCollapsed', 'accent'],
+    pick: ['isDark', 'sidebarCollapsed', 'accent', 'themeTouched'],
     storage: piniaPluginPersistedstate.localStorage(),
   },
 })