feat: 全新智能体功能

- 基于先进智能体框架，增加智能体编排功能
- 增加智能体聊天，并对接持久化

easyflow-ui-admin/app/src/views/ai/agents/components/AgentInspectorPanel.vue

@@ -0,0 +1,180 @@
+<script setup lang="ts">
+import type {AgentDraftState, AgentOption, AgentValidationIssue,} from '../types';
+
+import {computed} from 'vue';
+
+import {Close} from '@element-plus/icons-vue';
+import {ElButton} from 'element-plus';
+
+import AgentBaseForm from './AgentBaseForm.vue';
+import AgentKnowledgeForm from './AgentKnowledgeForm.vue';
+import AgentToolForm from './AgentToolForm.vue';
+import AgentTryoutPanel from './AgentTryoutPanel.vue';
+
+const props = defineProps<{
+  categories: AgentOption[];
+  issues: AgentValidationIssue[];
+  knowledges: AgentOption[];
+  models: AgentOption[];
+  pluginTools: AgentOption[];
+  state: AgentDraftState;
+  workflows: AgentOption[];
+}>();
+
+const emit = defineEmits<{
+  change: [];
+  closeTryout: [];
+  removeCapability: [];
+  selectIssue: [nodeId: string];
+}>();
+
+const selectedKnowledge = computed(() => {
+  if (!props.state.selectedNodeId.startsWith('knowledge:')) return;
+  const localId = props.state.selectedNodeId.slice('knowledge:'.length);
+  return props.state.knowledgeBindings.find((item) => item.localId === localId);
+});
+
+const selectedTool = computed(() => {
+  if (!props.state.selectedNodeId.startsWith('tool:')) return;
+  const localId = props.state.selectedNodeId.slice('tool:'.length);
+  return props.state.toolBindings.find((item) => item.localId === localId);
+});
+
+const selectedToolKind = computed(() =>
+  String(selectedTool.value?.toolType || '').toUpperCase() === 'WORKFLOW'
+    ? 'workflow'
+    : 'plugin',
+);
+</script>
+
+<template>
+  <aside class="agent-inspector">
+    <template v-if="state.panelMode === 'tryout'">
+      <AgentTryoutPanel
+        :agent="state.agent"
+        :tool-bindings="state.toolBindings"
+        :knowledge-bindings="state.knowledgeBindings"
+        @close="emit('closeTryout')"
+      />
+    </template>
+    <template v-else>
+      <header class="agent-inspector__header">
+        <div>
+          <div class="agent-inspector__title">
+            {{ state.panelMode === 'base' ? '基座智能体' : '能力配置' }}
+          </div>
+          <div class="agent-inspector__subtitle">
+            {{ state.panelMode === 'base' ? '核心设定' : '绑定关系' }}
+          </div>
+        </div>
+      </header>
+
+      <div class="agent-inspector__body">
+        <div v-if="issues.length > 0" class="agent-inspector__issues">
+          <button
+            v-for="issue in issues"
+            :key="`${issue.nodeId}-${issue.field || issue.message}`"
+            class="agent-inspector__issue"
+            type="button"
+            @click="emit('selectIssue', issue.nodeId)"
+          >
+            {{ issue.message }}
+          </button>
+        </div>
+
+        <AgentBaseForm
+          v-if="state.panelMode === 'base'"
+          :agent="state.agent"
+          :categories="categories"
+          :models="models"
+          @change="emit('change')"
+        />
+        <AgentKnowledgeForm
+          v-else-if="selectedKnowledge"
+          :binding="selectedKnowledge"
+          :knowledges="knowledges"
+          @change="emit('change')"
+          @remove="emit('removeCapability')"
+        />
+        <AgentToolForm
+          v-else-if="selectedTool"
+          :binding="selectedTool"
+          :kind="selectedToolKind"
+          :options="selectedToolKind === 'workflow' ? workflows : pluginTools"
+          @change="emit('change')"
+          @remove="emit('removeCapability')"
+        />
+        <div v-else class="agent-inspector__empty">
+          <ElButton :icon="Close" text @click="emit('closeTryout')">
+            返回基座
+          </ElButton>
+        </div>
+      </div>
+    </template>
+  </aside>
+</template>
+
+<style scoped>
+.agent-inspector {
+  position: absolute;
+  top: 24px;
+  right: 24px;
+  bottom: 96px;
+  z-index: 20;
+  display: flex;
+  flex-direction: column;
+  width: min(420px, calc(100vw - 320px));
+  min-height: 0;
+  overflow: hidden;
+  background: color-mix(in srgb, var(--el-bg-color) 94%, transparent);
+  border: 1px solid var(--el-border-color-lighter);
+  border-radius: 8px;
+  box-shadow: var(--el-box-shadow-light);
+  backdrop-filter: blur(16px);
+}
+
+.agent-inspector__header {
+  padding: 16px;
+  border-bottom: 1px solid var(--el-border-color-lighter);
+}
+
+.agent-inspector__body {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden auto;
+  overscroll-behavior: contain;
+}
+
+.agent-inspector__title {
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.agent-inspector__subtitle {
+  margin-top: 4px;
+  font-size: 12px;
+  color: var(--el-text-color-secondary);
+}
+
+.agent-inspector__issues {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 12px 16px 0;
+}
+
+.agent-inspector__issue {
+  padding: 8px 10px;
+  font-size: 12px;
+  color: var(--el-color-danger);
+  text-align: left;
+  cursor: pointer;
+  background: var(--el-color-danger-light-9);
+  border: 0;
+  border-radius: 8px;
+}
+
+.agent-inspector__empty {
+  padding: 16px;
+}
+</style>