fix: preserve exploration demonstration source and recording scope

apps/showcase_ui/src/app/components/agent-stream/agent-stream.component.html

@@ -571,7 +571,7 @@ limitations under the License.
             <article class="exploration-message" [class.user]="message.role === 'user'" [class.assistant]="message.role === 'assistant'" [class.question]="pendingQuestion() === message.id" [class.system]="message.role === 'system'">
               <small><span class="material-symbols-outlined">{{message.role === 'user' ? 'person' : message.role === 'assistant' ? 'auto_awesome' : 'info'}}</span>{{message.role === 'user' ? '你的指导' : message.role === 'assistant' ? '探索助手' : '探索记录'}} · {{message.created_at * 1000 | date:'HH:mm:ss'}} @if(pendingQuestion() === message.id){<b>等待你回答</b>}</small>
               <div class="markdown-content" [innerHTML]="renderMarkdown(message.text, phase.id)"></div>
-              @if(message.recommendation){<div class="recommendation">建议：{{message.recommendation}} @if(pendingQuestion() === message.id){<button (click)="useRecommendation.emit(message.recommendation)">采用建议</button>}</div>}
+              @if(message.recommendation){<div class="recommendation">建议回复：{{message.recommendation}} @if(pendingQuestion() === message.id){<button (click)="useRecommendation.emit(message.recommendation)">填入回复</button>}</div>}
             </article>
           } @else {
           <div class="phase-container">

apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.html

@@ -1,5 +1,5 @@
 @if(session(); as s) {
-  <app-agent-stream [conversationMessages]="messages()" [demonstrations]="s.demonstrations" [pendingQuestion]="s.pending_question || ''" (useRecommendation)="text = $event; send()">
+  <app-agent-stream [conversationMessages]="messages()" [demonstrations]="s.demonstrations" [pendingQuestion]="s.pending_question || ''" (useRecommendation)="fillRecommendation($event)">
     <section task-summary class="session-summary">
       <div class="row"><strong><span class="material-symbols-outlined">explore</span> {{activeValidation() ? '用例复跑中' : label(s.status)}}</strong><small>{{s.config.model}} / {{s.config.reasoning_effort}} · 续接 {{s.continuation_count}} 次</small></div>
       <div class="exploration-goal"><app-favorite-button sourceKind="exploration" [sourceId]="s.id" label="收藏为重新探索" /><p>{{s.goal}}</p></div>
@@ -28,7 +28,7 @@
     @if(error()){<p role="alert" class="feedback error">{{error()}} <button (click)="refresh()">重试读取</button></p>}
     @if(notice()){<p role="status" class="feedback">{{notice()}}</p>}
     @if(s.pending_question) {
-      <div class="question-banner" role="status" aria-live="polite"><span class="material-symbols-outlined">chat_bubble</span><div><strong>探索已暂停，等待你回答</strong><p>{{pendingQuestion()?.text || '探索助手有一个问题需要你确认，请查看上方对话。'}}</p>@if(pendingQuestion()?.recommendation; as suggestion){<button (click)="text = suggestion; send()" [disabled]="busy()">采用建议并继续</button>}</div></div>
+      <div class="question-banner" role="status" aria-live="polite"><span class="material-symbols-outlined">chat_bubble</span><div><strong>探索已暂停，等待你回答</strong><p>{{pendingQuestion()?.text || '探索助手有一个问题需要你确认，请查看上方对话。'}}</p>@if(pendingQuestion()?.recommendation; as suggestion){<button (click)="fillRecommendation(suggestion)" [disabled]="busy()">填入建议回复</button>}</div></div>
     } @else if(finalizing()) {
       <div class="feedback" role="status">设备操作已结束，正在根据已验证的步骤提炼用例。完成后会在上方展示。</div>
     }
@@ -44,7 +44,7 @@
 
     @if(activeValidation()){<p class="feedback">用例正在独立复跑，请进入复跑任务查看或指导。<button (click)="agent.selectSession(s.active_run_id!,true)">查看当前复跑</button></p>}
     <div class="composer-heading"><label for="exploration-message">{{s.pending_question ? '回答探索助手' : '与探索助手交流'}}</label><span class="composer-status" [class.waiting]="!!s.pending_question">{{label(s.status)}}</span></div>
-    <textarea id="exploration-message" [(ngModel)]="text" (keydown)="onKeyDown($event)" rows="2" maxlength="10000" [placeholder]="s.pending_question ? '在这里回答，发送后继续探索…' : '告诉我下一步怎么做，或补充你的想法…'" [disabled]="busy() || activeValidation() || finalizing()"></textarea>
+    <textarea #messageInput id="exploration-message" [(ngModel)]="text" (keydown)="onKeyDown($event)" rows="2" maxlength="10000" [placeholder]="s.pending_question ? '在这里回答，发送后继续探索…' : '告诉我下一步怎么做，或补充你的想法…'" [disabled]="busy() || activeValidation() || finalizing()"></textarea>
     <div class="actions composer-actions">
       @if(!activeDemo() && s.active_run_id && !activeValidation() && ['running','waiting_user'].includes(s.status)){<button class="tool-button" (click)="demoOptionsOpen.set(!demoOptionsOpen())" [attr.aria-expanded]="demoOptionsOpen()"><span class="material-symbols-outlined">touch_app</span>我来操作</button>}
       @if(!activeValidation() && !s.pending_question && (!s.active_run_id || s.status === 'paused')){<button (click)="action(s.status === 'draft' ? 'start' : 'continue')" [disabled]="busy()">{{s.status === 'draft' ? '开始探索' : '继续探索'}}</button>}

apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.scss

@@ -1,6 +1,6 @@
 :host { display:flex; flex-direction:column; min-height:0; height:100%; overflow:hidden; color:#334155; font-size:13px; }
 .exploration-panel { padding:18px; display:flex; flex-direction:column; gap:16px; }
-header,.row,.actions,.manual-control { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
+header,.row,.actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
 header,.row { justify-content:space-between; }
 header strong { font-size:15px; color:#0f172a; }
 p { margin:8px 0; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
@@ -27,9 +27,6 @@ summary { cursor:pointer; font-size:12px; color:#475569; }
 .recommendation button { margin:6px 0 0 8px; }
 .composer { border-top:1px solid #e2e8f0; padding-top:4px; }
 .composer > button { margin-top:8px; }
-.manual-control { padding:10px 12px; border:1px solid #dbe3ec; border-radius:10px; background:#fafcfd; }
-.manual-control label { flex:1; margin:0; }
-.manual-control button { align-self:flex-end; }
 .demo { border:1px solid #bbf7d0; border-radius:12px; padding:12px; background:#f0fdf4; }
 .demo.warning { background:#fffbeb; border-color:#fcd34d; }
 .record-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#94a3b8; margin-right:6px; }
@@ -52,11 +49,15 @@ app-agent-stream {flex:1;min-height:0;display:block}
 .composer label {margin:0 0 6px}.composer textarea {resize:none}.composer-actions {margin-top:8px}.composer-actions small {flex:1}
 .session-summary {margin-bottom:18px;background:#fff}.session-summary p {margin:6px 0}.session-summary .row strong {display:flex;align-items:center;gap:6px}
 .execution-history {margin-top:8px;border:0;padding:4px 0}.case-editor {margin:16px 0;background:#fff}.case-compact {display:flex;flex-wrap:wrap;align-items:center;gap:8px}.case-compact .actions {margin-left:auto}
-.manual-control {padding:0;margin-bottom:8px;border:0;background:transparent;justify-content:flex-end}.manual-control label {flex:none;flex-direction:row;align-items:center}.manual-control select {width:auto}.demo {padding:8px 10px;margin-bottom:8px}.demo p {margin:4px 0}
+.demo {padding:8px 10px;margin-bottom:8px}.demo p {margin:4px 0}
 
 .composer {margin:0 24px 18px;padding:14px 18px;border-radius:22px;box-shadow:0 6px 24px #0f172a08;max-height:50%;box-sizing:border-box;min-width:0}
 .composer-heading {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
 .composer-heading label {margin:0;font-size:12px;color:#64748b}
+.composer .manual-control {display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin:0 0 10px}
+.composer .manual-control label {display:flex;flex-direction:row;align-items:center;gap:8px;margin:0;min-width:0}
+.composer .manual-control select {width:auto;min-width:110px;height:36px;padding:6px 10px}
+.composer .manual-control button {align-self:center;height:36px;white-space:nowrap}
 .composer-status {font-size:11px;border-radius:20px;padding:3px 8px;background:#eef2ff;color:#4f46e5}
 .composer-status.waiting {color:#92400e;background:#fef3c7}
 .composer textarea {border:0;border-radius:0;padding:10px 0;background:transparent;min-height:66px;max-height:140px;font-size:14px;box-shadow:none}

apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.spec.ts

@@ -1,5 +1,6 @@
 import { Component, input, output, signal } from '@angular/core';
 import { TestBed, fakeAsync, flushMicrotasks } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
 import { ExplorationPanelComponent } from './exploration-panel.component';
 import { ExplorationService, ExplorationSession } from '../../services/exploration.service';
 import { AgentService } from '../../services/agent.service';
@@ -45,6 +46,27 @@ describe('Exploration conversation', () => {
     expect(api.act).not.toHaveBeenCalled();expect(fixture.componentInstance.text).toBe('返回主页');
     expect(fixture.nativeElement.querySelector('textarea').disabled).toBeTrue();fixture.destroy();
   }));
+  it('fills a suggested reply for review from either entry point and only sends after submission', fakeAsync(() => {
+    current.status='waiting_user'; current.pending_question='q';
+    current.messages=[{id:'q',sequence:1,role:'assistant',kind:'question',text:'是否按示范流程继续？',recommendation:'确认，按示范流程继续探索。',created_at:1}];
+    const fixture=render();
+    fixture.nativeElement.querySelector('.question-banner button').click();
+    fixture.detectChanges(); flushMicrotasks();
+    const input: HTMLTextAreaElement = fixture.nativeElement.querySelector('#exploration-message');
+    expect(input.value).toBe('确认，按示范流程继续探索。');
+    expect(document.activeElement).toBe(input);
+    expect(api.act).not.toHaveBeenCalled();
+    const stream = fixture.debugElement.query(By.directive(StreamStub)).componentInstance as StreamStub;
+    stream.useRecommendation.emit(current.messages[0].recommendation!);
+    expect(api.act).not.toHaveBeenCalled();
+    fixture.componentInstance.text='确认，按示范流程继续，最后返回顶部。';
+    fixture.detectChanges();
+    fixture.nativeElement.querySelector('.send-button').click(); flushMicrotasks();
+    expect(api.act).toHaveBeenCalledTimes(1);
+    expect(api.act.calls.mostRecent().args.slice(0,3)).toEqual(['s','messages',{text:'确认，按示范流程继续，最后返回顶部。'}]);
+    expect(fixture.componentInstance.text).toBe('');
+    fixture.destroy();
+  }));
   it('only invites manual input when the recorder is ready, and warns before its deadline', fakeAsync(() => {
     current.active_demonstration_id='demo';
     current.demonstrations=[{id:'demo',run_id:'run',source:'android',status:'requested',warning_seconds:60,media:[]}];

apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.ts

@@ -1,4 +1,4 @@
-import { Component, ChangeDetectionStrategy, DestroyRef, effect, inject, signal, untracked, input } from '@angular/core';
+import { Component, ChangeDetectionStrategy, DestroyRef, ElementRef, effect, inject, signal, untracked, input, viewChild } from '@angular/core';
 import { FavoriteButtonComponent } from '../favorite-button/favorite-button.component';
 import { FormsModule } from '@angular/forms';
 import { AgentStreamComponent } from '../agent-stream/agent-stream.component';
@@ -27,6 +27,7 @@ export class ExplorationPanelComponent {
   editorOpen = signal(false);
   rerunOpen = signal(false);
   demoOptionsOpen = signal(false);
+  private messageInput = viewChild<ElementRef<HTMLTextAreaElement>>('messageInput');
   get text() { return this.api.drafts.get(this.sessionId()) || ''; }
   set text(value: string) { this.api.drafts.set(this.sessionId(), value); }
   source = 'android';
@@ -132,6 +133,11 @@ export class ExplorationPanelComponent {
     const text = this.text.trim(), id = this.sessionId(); if (!text || this.activeValidation() || this.finalizing()) return;
     if (await this.action('messages', {text}) && this.api.drafts.get(id)?.trim() === text) this.api.drafts.delete(id);
   }
+  fillRecommendation(reply: string) {
+    if (this.busy() || this.activeValidation() || this.finalizing() || this.pendingQuestion()?.recommendation !== reply) return;
+    this.text = reply;
+    this.messageInput()?.nativeElement.focus();
+  }
   demoAction(action: string) {
     const demo = this.activeDemo();
     if (demo) void this.action(`demonstrations/${demo.id}/${action}`, action === 'extend' ? {seconds: this.session()?.config.demonstration_timeout_seconds || 900} : {});

apps/showcase_ui/src/app/components/task-history/task-history.component.ts

@@ -20,7 +20,45 @@ import { AgentService } from '../../services/agent.service';
     @if(!loading() && !total()){<p>没有符合条件的历史任务。</p>}
     <div class="pager"><button [disabled]="page === 1 || loading()" (click)="page=page-1;load()">上一页</button><span>{{page}} / {{pages()}}</span><button [disabled]="page >= pages() || loading()" (click)="page=page+1;load()">下一页</button></div>
   </section>`,
-  styles:[`:host{display:block;font-size:12px;color:inherit}h3{display:flex;align-items:center;gap:6px;font-size:14px;margin:14px 0 8px}.query-status{margin-left:auto;font-size:11px;font-weight:400;white-space:nowrap}small{opacity:.6}input,select,button{font:inherit;color:inherit;border:1px solid #64748b55;border-radius:6px;padding:8px;background:transparent;box-sizing:border-box}input{width:100%}select option{background:white;color:#1e293b}.filters{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.filters label{flex:1;min-width:110px}.filters input,.filters select{display:block;width:100%}summary{padding:10px 0;cursor:pointer}.row{display:flex;flex-direction:column;gap:6px;width:100%;text-align:left;cursor:pointer;margin:5px 0;overflow-wrap:anywhere}.row strong{font-weight:600}.row.selected{border-color:#60a5fa;background:#3b82f615}.history-item{position:relative;border:1px solid #cbd5e1;border-left:3px solid #94a3b8;border-radius:8px;margin:6px 0;padding:8px;background:#fff}.history-item.status-completed,.history-item.status-success{border-left-color:#16a34a}.history-item.status-failed{border-left-color:#dc2626;background:#fffafa}.history-item.status-cancelled,.history-item.status-interrupted{border-left-color:#d97706;background:#fffdf8}.history-item.status-skipped{border-left-color:#64748b}.history-item:has(.row.selected){border-color:#60a5fa;background:#eff6ff}.history-item .row{border:0;padding:0;margin:0 0 4px}.history-item .row.selected{background:transparent}.history-item .row{padding-right:35px}.history-heading{display:flex;align-items:flex-start;gap:5px;min-width:0}.history-heading>app-favorite-button{margin-top:-5px}.history-heading>.row{flex:1;min-width:0;width:auto}.history-meta{display:flex;gap:5px;align-items:center;flex-wrap:wrap;color:#475569;font-size:11px}.history-status{display:inline-flex;align-items:center;box-sizing:border-box;height:20px;line-height:14px;border-radius:5px;padding:0 6px;background:#f1f5f9;color:#334155}.status-completed .history-status,.status-success .history-status{background:#dcfce7;color:#166534}.status-failed .history-status{background:#fee2e2;color:#991b1b}.status-cancelled .history-status,.status-interrupted .history-status{background:#fef3c7;color:#92400e}.history-error{font-size:11px;color:#b91c1c;line-height:1.4}.delete-history{position:absolute;right:5px;top:8px;border:0;padding:3px;color:#64748b;cursor:pointer;font-size:12px}.delete-history .material-symbols-outlined{font-size:16px}.delete-history:hover{color:#b91c1c}.pager{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0}button:disabled{opacity:.4}p{opacity:.7}`]
+  styles:[`
+    :host{display:block;font-size:12px;color:inherit}
+    h3{display:flex;align-items:center;gap:6px;font-size:14px;margin:14px 0 8px}
+    .query-status{margin-left:auto;font-size:11px;font-weight:400;white-space:nowrap}
+    small{opacity:.6}
+    input,select,button{font:inherit;color:inherit;border:1px solid #64748b55;border-radius:6px;padding:8px;background:transparent;box-sizing:border-box}
+    input{width:100%}
+    select option{background:white;color:#1e293b}
+    .filters{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
+    .filters label{flex:1;min-width:110px}
+    .filters input,.filters select{display:block;width:100%}
+    summary{padding:10px 0;cursor:pointer}
+    .row{display:flex;flex-direction:column;gap:6px;width:100%;text-align:left;cursor:pointer;margin:5px 0;overflow-wrap:anywhere}
+    .row strong{font-weight:600;display:flex;align-items:center;min-height:28px;padding-left:33px}
+    .row.selected{border-color:#60a5fa;background:#3b82f615}
+    .history-item{position:relative;border:1px solid #cbd5e1;border-left:3px solid #94a3b8;border-radius:8px;margin:6px 0;padding:8px;background:#fff}
+    .history-item.status-completed,.history-item.status-success{border-left-color:#16a34a}
+    .history-item.status-failed{border-left-color:#dc2626;background:#fffafa}
+    .history-item.status-cancelled,.history-item.status-interrupted{border-left-color:#d97706;background:#fffdf8}
+    .history-item.status-skipped{border-left-color:#64748b}
+    .history-item:has(.row.selected){border-color:#60a5fa;background:#eff6ff}
+    .history-item .row{border:0;padding:0 35px 0 0;margin:0 0 4px}
+    .history-item .row.selected{background:transparent}
+    .history-heading{position:relative;min-width:0}
+    .history-heading>app-favorite-button{position:absolute;left:0;top:0;z-index:1}
+    .history-heading>.row{min-width:0;width:100%}
+    .history-meta{display:flex;gap:5px;align-items:center;flex-wrap:wrap;color:#475569;font-size:11px}
+    .history-status{display:inline-flex;align-items:center;box-sizing:border-box;height:20px;line-height:14px;border-radius:5px;padding:0 6px;background:#f1f5f9;color:#334155}
+    .status-completed .history-status,.status-success .history-status{background:#dcfce7;color:#166534}
+    .status-failed .history-status{background:#fee2e2;color:#991b1b}
+    .status-cancelled .history-status,.status-interrupted .history-status{background:#fef3c7;color:#92400e}
+    .history-error{font-size:11px;color:#b91c1c;line-height:1.4}
+    .delete-history{position:absolute;right:5px;top:8px;border:0;padding:3px;color:#64748b;cursor:pointer;font-size:12px}
+    .delete-history .material-symbols-outlined{font-size:16px}
+    .delete-history:hover{color:#b91c1c}
+    .pager{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0}
+    button:disabled{opacity:.4}
+    p{opacity:.7}
+  `]
 })
 export class TaskHistoryComponent {
   agent=inject(AgentService); private http=inject(HttpClient); query='';start='';end='';status='';page=1;