@auto-ai/agent 2.1.104 → 2.1.106

package/dist/agent-office.html

@@ -127,6 +127,68 @@
       overflow: hidden;
       text-overflow: ellipsis;
     }
+    .agent-list-team {
+      font-size: 0.78rem;
+      color: var(--ds-accent);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .office-team-section {
+      margin-bottom: 1rem;
+      padding-top: 0.25rem;
+      border-top: 1px solid var(--ds-border);
+    }
+    .office-team-section h3 {
+      margin: 0 0 0.5rem;
+      font-size: 0.88rem;
+      font-weight: 600;
+    }
+    .office-team-chips {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 6px;
+      margin-bottom: 0.65rem;
+      min-height: 28px;
+    }
+    .office-team-chip {
+      display: inline-flex;
+      align-items: center;
+      gap: 4px;
+      padding: 0.2rem 0.45rem 0.2rem 0.55rem;
+      border-radius: 999px;
+      background: rgba(10, 132, 255, 0.1);
+      border: 1px solid rgba(10, 132, 255, 0.25);
+      font-size: 0.78rem;
+    }
+    .office-team-chip button {
+      border: none;
+      background: transparent;
+      color: var(--ds-muted);
+      cursor: pointer;
+      font-size: 1rem;
+      line-height: 1;
+      padding: 0 2px;
+    }
+    .office-team-chip button:hover { color: var(--ds-danger); }
+    .office-team-empty {
+      font-size: 0.8rem;
+      color: var(--ds-muted);
+      margin: 0 0 0.5rem;
+    }
+    .office-team-add {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+    }
+    .office-team-add select {
+      flex: 1;
+      min-width: 0;
+      border: 1px solid var(--ds-border);
+      border-radius: 10px;
+      padding: 0.45rem 0.55rem;
+      font: inherit;
+    }
     .agent-list-arrow {
       flex-shrink: 0;
       color: var(--ds-muted);
@@ -289,6 +351,17 @@
               <label for="officeAgentPrompt">agent.md</label>
               <textarea id="officeAgentPrompt" spellcheck="false" placeholder="Agent 提示词"></textarea>
             </div>
+            <section class="office-team-section" id="officeTeamSection" hidden>
+              <h3>绑定队员</h3>
+              <p id="officeTeamEmpty" class="office-team-empty" hidden>尚未绑定队员</p>
+              <div id="officeTeamChips" class="office-team-chips"></div>
+              <div class="office-team-add">
+                <select id="officeTeamPick" aria-label="选择队员">
+                  <option value="">选择要添加的 Agent…</option>
+                </select>
+                <button type="button" class="office-btn office-btn-primary" id="btnOfficeAddTeamMember">添加</button>
+              </div>
+            </section>
             <div class="office-form-actions">
               <button type="button" class="office-btn office-btn-primary" id="btnOfficeSave">保存</button>
               <button type="button" class="office-btn office-btn-danger" id="btnOfficeDelete">删除</button>
@@ -332,6 +405,73 @@
         ).toString()
       }
 
+      /** 构建队员管理子资源地址 */
+      function buildAgentTeamMembersUrl(leaderId) {
+        return new URL(
+          '/api/agents/' +
+            encodeURIComponent(String(leaderId || '').trim()) +
+            '/team-members',
+          httpOriginForApi() + '/',
+        ).toString()
+      }
+
+      function buildAgentTeamMemberUrl(leaderId, agentType) {
+        return new URL(
+          '/api/agents/' +
+            encodeURIComponent(String(leaderId || '').trim()) +
+            '/team-members/' +
+            encodeURIComponent(String(agentType || '').trim()),
+          httpOriginForApi() + '/',
+        ).toString()
+      }
+
+      /**
+       * 拉取可绑定队员候选：仅 agent-runtime 下已创建的 Agent（与 agent.json.agentTeams 同源）。
+       * 不使用 /api/agent-teams（那是仓库内置 subagent 类型，不能写入 agentTeams）。
+       */
+      async function fetchTeamMemberCatalog(leaderId) {
+        const leader = String(leaderId || '').trim()
+        const agents = await fetchAgentsList()
+        const out = []
+        for (let i = 0; i < agents.length; i++) {
+          const row = agents[i]
+          const id = String(row.id || '').trim()
+          if (!id || id === leader) continue
+          out.push({
+            agentType: id,
+            whenToUse: typeof row.whentouse === 'string' ? row.whentouse : '',
+          })
+        }
+        out.sort((a, b) => a.agentType.localeCompare(b.agentType))
+        return out
+      }
+
+      /** 向 leader 追加一名绑定队员 */
+      async function addTeamMember(leaderId, agentType) {
+        const r = await fetch(buildAgentTeamMembersUrl(leaderId), {
+          method: 'POST',
+          headers: { 'content-type': 'application/json; charset=utf-8' },
+          body: JSON.stringify({ agentType: String(agentType || '').trim() }),
+        })
+        const body = await r.json().catch(() => ({}))
+        if (!r.ok) {
+          throw new Error(body.message || body.error || r.statusText)
+        }
+        return body.agent || null
+      }
+
+      /** 从 leader 移除一名绑定队员 */
+      async function removeTeamMember(leaderId, agentType) {
+        const r = await fetch(buildAgentTeamMemberUrl(leaderId, agentType), {
+          method: 'DELETE',
+        })
+        const body = await r.json().catch(() => ({}))
+        if (!r.ok) {
+          throw new Error(body.message || body.error || r.statusText)
+        }
+        return body.agent || null
+      }
+
       /** 校验新建 agent id：字母数字下划线中划线，1~64 */
       function isValidAgentIdInput(id) {
         return /^[a-zA-Z0-9_-]{1,64}$/.test(String(id || '').trim())
@@ -505,6 +645,19 @@
         return s.length <= max ? s : s.slice(0, max - 1) + '…'
       }
 
+      /** 列表副标题：绑定队员摘要 */
+      function formatAgentTeamLine(row) {
+        const members = Array.isArray(row.agentTeamMembers)
+          ? row.agentTeamMembers
+          : []
+        if (!members.length) return ''
+        const names = members.map((m) => String(m.agentType || '').trim()).filter(Boolean)
+        const n = names.length
+        const preview = names.slice(0, 3).join('、')
+        const suffix = n > 3 ? '…' : ''
+        return n + ' 名队员 · ' + preview + suffix
+      }
+
       /** Agent 列表 DOM 渲染 */
       class AgentList {
         constructor(container, onPick) {
@@ -558,6 +711,14 @@
             body.appendChild(title)
             body.appendChild(desc)
 
+            const teamLine = formatAgentTeamLine(row)
+            if (teamLine) {
+              const team = document.createElement('span')
+              team.className = 'agent-list-team'
+              team.textContent = teamLine
+              body.appendChild(team)
+            }
+
             const arrow = document.createElement('span')
             arrow.className = 'agent-list-arrow'
             arrow.textContent = '›'
@@ -604,6 +765,12 @@
           this.btnWorkbench = root.querySelector('#btnOfficeWorkbench')
           this.btnClose = root.querySelector('#btnOfficePanelClose')
           this.toastEl = root.querySelector('#officeToast')
+          this.teamSection = root.querySelector('#officeTeamSection')
+          this.teamChips = root.querySelector('#officeTeamChips')
+          this.teamEmpty = root.querySelector('#officeTeamEmpty')
+          this.teamPick = root.querySelector('#officeTeamPick')
+          this.btnAddTeamMember = root.querySelector('#btnOfficeAddTeamMember')
+          this.boundTeamMembers = []
 
           this.bindEvents()
           this.hidePanel()
@@ -635,6 +802,150 @@
                 '/ws-test.html?agent=' + encodeURIComponent(id)
             })
           }
+          if (this.btnAddTeamMember) {
+            this.btnAddTeamMember.addEventListener('click', () =>
+              void this.handleAddTeamMember(),
+            )
+          }
+        }
+
+        /** 同步侧栏队员 chips 与下拉候选 */
+        renderTeamMembers(leaderId, members, catalog) {
+          if (!this.teamSection) return
+          const isEdit = this.mode === 'edit' && !!leaderId
+          this.teamSection.hidden = !isEdit
+          if (!isEdit) return
+
+          const list = Array.isArray(members) ? members : []
+          this.boundTeamMembers = list
+
+          if (this.teamEmpty) {
+            this.teamEmpty.hidden = list.length > 0
+          }
+          if (this.teamChips) {
+            this.teamChips.innerHTML = ''
+            const boundSet = new Set(
+              list.map((m) => String(m.agentType || '').trim()).filter(Boolean),
+            )
+            for (let i = 0; i < list.length; i++) {
+              const m = list[i]
+              const agentType = String(m.agentType || '').trim()
+              if (!agentType) continue
+              const chip = document.createElement('span')
+              chip.className = 'office-team-chip'
+              chip.title =
+                typeof m.whentouse === 'string' && m.whentouse.trim()
+                  ? m.whentouse.trim()
+                  : agentType
+              const label = document.createElement('span')
+              label.textContent = agentType
+              const rm = document.createElement('button')
+              rm.type = 'button'
+              rm.setAttribute('aria-label', '移除 ' + agentType)
+              rm.textContent = '×'
+              rm.addEventListener('click', () =>
+                void this.handleRemoveTeamMember(agentType),
+              )
+              chip.appendChild(label)
+              chip.appendChild(rm)
+              this.teamChips.appendChild(chip)
+            }
+
+            if (this.teamPick) {
+              this.teamPick.innerHTML =
+                '<option value="">选择要添加的 Agent…</option>'
+              const types = Array.isArray(catalog) ? catalog : []
+              for (let j = 0; j < types.length; j++) {
+                const t = types[j]
+                const id = String(t.agentType || '').trim()
+                if (!id || id === leaderId || boundSet.has(id)) continue
+                const opt = document.createElement('option')
+                opt.value = id
+                const whenRaw =
+                  typeof t.whenToUse === 'string'
+                    ? t.whenToUse
+                    : typeof t.whentouse === 'string'
+                      ? t.whentouse
+                      : ''
+                const when = whenRaw.trim()
+                opt.textContent = when ? id + ' — ' + when.slice(0, 40) : id
+                this.teamPick.appendChild(opt)
+              }
+            }
+          }
+        }
+
+        async handleAddTeamMember() {
+          const leaderId = this.editingId
+          if (!leaderId || !this.teamPick) return
+          const agentType = this.teamPick.value.trim()
+          if (!agentType) {
+            this.showToast('请先选择要添加的队员', true)
+            return
+          }
+          try {
+            const agent = await addTeamMember(leaderId, agentType)
+            await this.refreshAgents()
+            const members =
+              agent && Array.isArray(agent.agentTeamMembers)
+                ? agent.agentTeamMembers
+                : this.boundTeamMembers
+            this.syncBaseConfigFromTeamAgent(agent)
+            const catalog = await fetchTeamMemberCatalog(leaderId)
+            this.renderTeamMembers(leaderId, members, catalog)
+            this.teamPick.value = ''
+            this.showToast('已添加队员 ' + agentType)
+          } catch (e) {
+            this.showToast('添加队员失败: ' + String(e), true)
+          }
+        }
+
+        async handleRemoveTeamMember(agentType) {
+          const leaderId = this.editingId
+          if (!leaderId) return
+          if (
+            !window.confirm('确定移除队员「' + agentType + '」？')
+          ) {
+            return
+          }
+          try {
+            const agent = await removeTeamMember(leaderId, agentType)
+            await this.refreshAgents()
+            const members =
+              agent && Array.isArray(agent.agentTeamMembers)
+                ? agent.agentTeamMembers
+                : []
+            this.syncBaseConfigFromTeamAgent(agent)
+            const catalog = await fetchTeamMemberCatalog(leaderId)
+            this.renderTeamMembers(leaderId, members, catalog)
+            this.showToast('已移除队员')
+          } catch (e) {
+            this.showToast('移除队员失败: ' + String(e), true)
+          }
+        }
+
+        /** 队员增删后同步 baseConfig，避免点「保存」把 agentTeams 写回旧值 */
+        syncBaseConfigFromTeamAgent(agentRow) {
+          if (!agentRow || typeof agentRow !== 'object') return
+          const teams = Array.isArray(agentRow.agentTeams)
+            ? agentRow.agentTeams.map(String)
+            : []
+          if (this.baseConfig && typeof this.baseConfig === 'object') {
+            this.baseConfig = { ...this.baseConfig, agentTeams: teams }
+            return
+          }
+          this.baseConfig = {
+            tools: [],
+            disallowedTools: [],
+            mcpServers: [],
+            skills: [],
+            agentTeams: teams,
+            model: '',
+            background: false,
+            isolation: '',
+            whentouse: this.whenInput ? this.whenInput.value : '',
+            env: {},
+          }
         }
 
         showToast(msg, isError) {
@@ -653,6 +964,7 @@
           this.editingId = null
           this.baseConfig = null
           this.mode = 'idle'
+          this.renderTeamMembers('', [], [])
           this.list.render(this.agents, null)
         }
 
@@ -681,6 +993,7 @@
           if (this.promptInput) this.promptInput.value = ''
           if (this.btnDelete) this.btnDelete.disabled = true
           if (this.btnWorkbench) this.btnWorkbench.disabled = true
+          this.renderTeamMembers('', [], [])
           this.list.render(this.agents, null)
         }
 
@@ -714,21 +1027,36 @@
               this.promptInput.value =
                 typeof agent.prompt === 'string' ? agent.prompt : ''
             }
+            const members = Array.isArray(agent.agentTeamMembers)
+              ? agent.agentTeamMembers
+              : []
+            const catalog = await fetchTeamMemberCatalog(agentId)
+            this.renderTeamMembers(agentId, members, catalog)
+            if (this.baseConfig && typeof this.baseConfig === 'object') {
+              this.baseConfig.agentTeams = Array.isArray(agent.agentTeams)
+                ? agent.agentTeams.map(String)
+                : members.map((m) => String(m.agentType || '')).filter(Boolean)
+            }
             if (this.panelMetaEl) {
+              const teamHint =
+                members.length > 0
+                  ? ' · ' + members.length + ' 名队员'
+                  : ''
               this.panelMetaEl.textContent =
                 '共 ' +
                 String(this.agents.length) +
-                ' 个 Agent · 上下文：' +
-                this.contextAgent
+                ' 个 Agent' +
+                teamHint
             }
           } catch (e) {
             if (this.panelMetaEl) this.panelMetaEl.textContent = '加载失败'
+            this.renderTeamMembers('', [], [])
             this.showToast('加载 Agent 失败: ' + String(e), true)
           }
         }
 
         async refreshAgents() {
-          this.agents = await fetchAgentsList(this.contextAgent)
+          this.agents = await fetchAgentsList()
           this.list.render(this.agents, this.controller.selectedId)
           if (this.hooks.onAgentsLoaded) this.hooks.onAgentsLoaded(this.agents)
           return this.agents
@@ -773,6 +1101,11 @@
             if (this.panelTitleEl) this.panelTitleEl.textContent = 'Agent · ' + id
             this.controller.selectAgent(id)
             this.syncUrlAgentParam(id)
+            if (isEdit) {
+              await this.loadAgentIntoForm(id)
+            } else {
+              this.showPanelForAgent(id)
+            }
             this.showToast(isEdit ? '已保存' : '已创建')
           } catch (e) {
             this.showToast((isEdit ? '保存失败: ' : '创建失败: ') + String(e), true)