feat: add prompt history management

ai_knowledge_base_v2/apps/admin-web/src/styles.css

@@ -635,11 +635,175 @@ textarea {
 
 .agent-workbench {
   display: grid;
-  grid-template-columns: minmax(380px, 0.9fr) minmax(420px, 1.1fr) minmax(280px, 0.7fr);
+  grid-template-columns: minmax(500px, 0.9fr) minmax(520px, 1.1fr);
   gap: 18px;
   align-items: start;
 }
 
+.agent-page-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 24px;
+}
+
+.agent-current-summary {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+  color: #667a73;
+  font-size: 13px;
+}
+
+.agent-current-summary span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.agent-control-panel {
+  min-width: 0;
+  min-height: 620px;
+}
+
+.agent-config-tabs > .el-tabs__header {
+  margin-bottom: 18px;
+}
+
+.agent-section-intro {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 14px;
+}
+
+.agent-section-intro h3,
+.agent-section-intro p {
+  margin: 0;
+}
+
+.agent-section-intro h3 {
+  margin-bottom: 5px;
+  font-size: 16px;
+}
+
+.agent-section-intro p,
+.agent-editor-meta,
+.agent-preview-head small {
+  color: #667a73;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.agent-prompt-editor textarea {
+  height: clamp(300px, calc(100vh - 440px), 420px) !important;
+  min-height: 300px !important;
+  line-height: 1.75;
+}
+
+.agent-editor-meta {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  margin-top: 8px;
+}
+
+.agent-primary-actions {
+  margin-top: 16px;
+}
+
+.agent-advanced-settings {
+  margin-top: 8px;
+  border: 1px solid #e2eae7;
+  border-radius: 8px;
+  padding: 0 14px;
+}
+
+.agent-trace-wide {
+  grid-column: 1 / -1;
+  height: 420px;
+}
+
+.prompt-history-list {
+  min-height: 240px;
+  max-height: clamp(320px, calc(100vh - 430px), 520px);
+  overflow: auto;
+  padding-right: 4px;
+}
+
+.prompt-history-item {
+  padding: 14px;
+  border: 1px solid #e1e9e6;
+  border-radius: 8px;
+  background: #fff;
+}
+
+.prompt-history-item + .prompt-history-item {
+  margin-top: 10px;
+}
+
+.prompt-history-item.current {
+  border-color: #8dcabb;
+  background: #f3faf7;
+}
+
+.prompt-history-head,
+.prompt-history-foot,
+.prompt-history-detail-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.prompt-history-head > span:last-child {
+  margin-left: auto;
+  color: #667a73;
+  font-size: 12px;
+}
+
+.prompt-history-item > p {
+  display: -webkit-box;
+  overflow: hidden;
+  margin: 10px 0;
+  color: #40524b;
+  line-height: 1.65;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+.prompt-history-foot {
+  justify-content: space-between;
+  color: #667a73;
+  font-size: 12px;
+}
+
+.prompt-history-detail-meta {
+  flex-wrap: wrap;
+  margin-bottom: 14px;
+}
+
+.prompt-history-detail-meta > span:last-child {
+  margin-left: auto;
+  color: #667a73;
+  font-size: 12px;
+}
+
+.prompt-history-detail pre {
+  max-height: 58vh;
+  overflow: auto;
+  margin: 0;
+  padding: 16px;
+  border: 1px solid #e1e9e6;
+  border-radius: 8px;
+  background: #f7faf9;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  font-family: "SFMono-Regular", Consolas, "PingFang SC", monospace;
+  line-height: 1.7;
+}
+
 .agent-config-panel,
 .agent-preview-panel,
 .agent-trace-panel {
@@ -752,6 +916,17 @@ textarea {
   font-size: 17px;
 }
 
+.agent-preview-head > div:first-child h3 {
+  margin-bottom: 3px;
+}
+
+.agent-preview-head-actions {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
 .agent-preview-head span {
   overflow: hidden;
   color: #667a73;
@@ -1178,7 +1353,7 @@ textarea {
 
 @media (max-width: 1450px) {
   .agent-workbench {
-    grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
+    grid-template-columns: minmax(440px, 0.95fr) minmax(460px, 1.05fr);
   }
 
   .agent-trace-panel {
@@ -1205,6 +1380,15 @@ textarea {
   .agent-trace-panel {
     grid-column: auto;
   }
+
+  .agent-page-head,
+  .agent-current-summary {
+    align-items: flex-start;
+  }
+
+  .agent-page-head {
+    flex-direction: column;
+  }
 }
 
 @media (max-width: 860px) {
@@ -1212,6 +1396,19 @@ textarea {
     min-width: 0;
   }
 
+  .agent-current-summary,
+  .prompt-history-head,
+  .prompt-history-foot,
+  .prompt-history-detail-meta {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .prompt-history-head > span:last-child,
+  .prompt-history-detail-meta > span:last-child {
+    margin-left: 0;
+  }
+
   .login-page {
     padding: 18px;
   }