feat(asa): implement ai-service-admin infrastructure and modules [AC-ASA-01]
This commit is contained in:
MerCry
parent
210af26f5f
commit
1230b4005a
|
|
@ -0,0 +1 @@
|
||||||
|
node_modules/
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" href="/favicon.ico" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>AI Service Admin</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.ts"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,24 @@
|
||||||
|
{
|
||||||
|
"name": "ai-service-admin",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vue-tsc --noEmit && vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@element-plus/icons-vue": "^2.3.1",
|
||||||
|
"axios": "^1.6.7",
|
||||||
|
"element-plus": "^2.6.1",
|
||||||
|
"pinia": "^2.1.7",
|
||||||
|
"vue": "^3.4.21",
|
||||||
|
"vue-router": "^4.3.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@vitejs/plugin-vue": "^5.0.4",
|
||||||
|
"typescript": "^5.2.2",
|
||||||
|
"vite": "^5.1.4",
|
||||||
|
"vue-tsc": "^1.8.27"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-menu
|
||||||
|
:default-active="activeIndex"
|
||||||
|
class="el-menu-demo"
|
||||||
|
mode="horizontal"
|
||||||
|
router
|
||||||
|
>
|
||||||
|
<el-menu-item index="/dashboard">控制台</el-menu-item>
|
||||||
|
<el-menu-item index="/kb">知识库管理</el-menu-item>
|
||||||
|
<el-menu-item index="/rag-lab">RAG 实验室</el-menu-item>
|
||||||
|
<el-menu-item index="/monitoring">会话监控</el-menu-item>
|
||||||
|
<div class="flex-grow" />
|
||||||
|
<div class="tenant-selector">
|
||||||
|
<el-select v-model="currentTenantId" placeholder="选择租户" @change="handleTenantChange">
|
||||||
|
<el-option label="默认租户" value="default" />
|
||||||
|
<el-option label="租户 A" value="tenant_a" />
|
||||||
|
<el-option label="租户 B" value="tenant_b" />
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
</el-menu>
|
||||||
|
<router-view />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, computed } from 'vue'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
import { useTenantStore } from '@/stores/tenant'
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
const tenantStore = useTenantStore()
|
||||||
|
|
||||||
|
const activeIndex = computed(() => route.path)
|
||||||
|
const currentTenantId = ref(tenantStore.currentTenantId)
|
||||||
|
|
||||||
|
const handleTenantChange = (val: string) => {
|
||||||
|
tenantStore.setTenant(val)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.flex-grow {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
.tenant-selector {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
.app-container {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,36 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询文档列表 [AC-ASA-08]
|
||||||
|
*/
|
||||||
|
export function listDocuments(params: any) {
|
||||||
|
return request({
|
||||||
|
url: '/admin/kb/documents',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 上传文档 [AC-ASA-01]
|
||||||
|
*/
|
||||||
|
export function uploadDocument(data: FormData) {
|
||||||
|
return request({
|
||||||
|
url: '/admin/kb/documents',
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'multipart/form-data'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询索引任务详情 [AC-ASA-02]
|
||||||
|
*/
|
||||||
|
export function getIndexJob(jobId: string) {
|
||||||
|
return request({
|
||||||
|
url: `/admin/kb/index/jobs/${jobId}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询会话列表 [AC-ASA-09]
|
||||||
|
*/
|
||||||
|
export function listSessions(params: any) {
|
||||||
|
return request({
|
||||||
|
url: '/admin/sessions',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取会话详情 [AC-ASA-07]
|
||||||
|
*/
|
||||||
|
export function getSessionDetail(sessionId: string) {
|
||||||
|
return request({
|
||||||
|
url: `/admin/sessions/${sessionId}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 运行 RAG 调试实验 [AC-ASA-05]
|
||||||
|
*/
|
||||||
|
export function runRagExperiment(data: { query: string, kbIds?: string[], params?: any }) {
|
||||||
|
return request({
|
||||||
|
url: '/admin/rag/experiments/run',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,43 @@
|
||||||
|
<template>
|
||||||
|
<el-form :model="model" v-bind="$attrs" ref="formRef">
|
||||||
|
<slot />
|
||||||
|
<el-form-item v-if="showFooter">
|
||||||
|
<el-button type="primary" @click="handleSubmit">提交</el-button>
|
||||||
|
<el-button @click="handleReset">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import type { FormInstance } from 'element-plus'
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
model: any
|
||||||
|
showFooter?: boolean
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const emit = defineEmits(['submit', 'reset'])
|
||||||
|
|
||||||
|
const formRef = ref<FormInstance>()
|
||||||
|
|
||||||
|
const handleSubmit = async () => {
|
||||||
|
if (!formRef.value) return
|
||||||
|
await formRef.value.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
emit('submit', props.model)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleReset = () => {
|
||||||
|
if (!formRef.value) return
|
||||||
|
formRef.value.resetFields()
|
||||||
|
emit('reset')
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
validate: () => formRef.value?.validate(),
|
||||||
|
resetFields: () => formRef.value?.resetFields()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
<template>
|
||||||
|
<el-table :data="data" v-bind="$attrs" style="width: 100%">
|
||||||
|
<slot />
|
||||||
|
</el-table>
|
||||||
|
<div v-if="total > 0" class="pagination-container">
|
||||||
|
<el-pagination
|
||||||
|
v-model:current-page="currentPage"
|
||||||
|
v-model:page-size="pageSize"
|
||||||
|
:total="total"
|
||||||
|
:page-sizes="[10, 20, 50, 100]"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="handleCurrentChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { computed } from 'vue'
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
data: any[]
|
||||||
|
total: number
|
||||||
|
pageNum: number
|
||||||
|
pageSize: number
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const emit = defineEmits(['update:pageNum', 'update:pageSize', 'pagination'])
|
||||||
|
|
||||||
|
const currentPage = computed({
|
||||||
|
get: () => props.pageNum,
|
||||||
|
set: (val) => emit('update:pageNum', val)
|
||||||
|
})
|
||||||
|
|
||||||
|
const pageSize = computed({
|
||||||
|
get: () => props.pageSize,
|
||||||
|
set: (val) => emit('update:pageSize', val)
|
||||||
|
})
|
||||||
|
|
||||||
|
const handleSizeChange = (val: number) => {
|
||||||
|
emit('pagination', { page: currentPage.value, limit: val })
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleCurrentChange = (val: number) => {
|
||||||
|
emit('pagination', { page: val, limit: pageSize.value })
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.pagination-container {
|
||||||
|
padding: 32px 16px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
import { createApp } from 'vue'
|
||||||
|
import { createPinia } from 'pinia'
|
||||||
|
import ElementPlus from 'element-plus'
|
||||||
|
import 'element-plus/dist/index.css'
|
||||||
|
import App from './App.vue'
|
||||||
|
import router from './router'
|
||||||
|
|
||||||
|
const app = createApp(App)
|
||||||
|
const pinia = createPinia()
|
||||||
|
|
||||||
|
app.use(pinia)
|
||||||
|
app.use(router)
|
||||||
|
app.use(ElementPlus)
|
||||||
|
|
||||||
|
app.mount('#app')
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
|
||||||
|
|
||||||
|
const routes: Array<RouteRecordRaw> = [
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
redirect: '/dashboard'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/dashboard',
|
||||||
|
name: 'Dashboard',
|
||||||
|
component: () => import('@/views/dashboard/index.vue'),
|
||||||
|
meta: { title: '控制台' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/kb',
|
||||||
|
name: 'KBManagement',
|
||||||
|
component: () => import('@/views/kb/index.vue'),
|
||||||
|
meta: { title: '知识库管理' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/rag-lab',
|
||||||
|
name: 'RagLab',
|
||||||
|
component: () => import('@/views/rag-lab/index.vue'),
|
||||||
|
meta: { title: 'RAG 实验室' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/monitoring',
|
||||||
|
name: 'Monitoring',
|
||||||
|
component: () => import('@/views/monitoring/index.vue'),
|
||||||
|
meta: { title: '会话监控' }
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const router = createRouter({
|
||||||
|
history: createWebHistory(),
|
||||||
|
routes
|
||||||
|
})
|
||||||
|
|
||||||
|
export default router
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
import { defineStore } from 'pinia'
|
||||||
|
|
||||||
|
export const useTenantStore = defineStore('tenant', {
|
||||||
|
state: () => ({
|
||||||
|
currentTenantId: localStorage.getItem('X-Tenant-Id') || 'default'
|
||||||
|
}),
|
||||||
|
actions: {
|
||||||
|
setTenant(id: string) {
|
||||||
|
this.currentTenantId = id
|
||||||
|
localStorage.setItem('X-Tenant-Id', id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
@ -0,0 +1,72 @@
|
||||||
|
import axios from 'axios'
|
||||||
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||||
|
import { useTenantStore } from '@/stores/tenant'
|
||||||
|
|
||||||
|
// 创建 axios 实例
|
||||||
|
const service = axios.create({
|
||||||
|
baseURL: import.meta.env.VITE_APP_BASE_API || '/api',
|
||||||
|
timeout: 10000
|
||||||
|
})
|
||||||
|
|
||||||
|
// 请求拦截器
|
||||||
|
service.interceptors.request.use(
|
||||||
|
(config) => {
|
||||||
|
const tenantStore = useTenantStore()
|
||||||
|
if (tenantStore.currentTenantId) {
|
||||||
|
config.headers['X-Tenant-Id'] = tenantStore.currentTenantId
|
||||||
|
}
|
||||||
|
// TODO: 如果有 token 也可以在这里注入 Authorization
|
||||||
|
return config
|
||||||
|
},
|
||||||
|
(error) => {
|
||||||
|
console.log(error)
|
||||||
|
return Promise.reject(error)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
// 响应拦截器
|
||||||
|
service.interceptors.response.use(
|
||||||
|
(response) => {
|
||||||
|
const res = response.data
|
||||||
|
// 这里可以根据后端的 code 进行统一处理
|
||||||
|
return res
|
||||||
|
},
|
||||||
|
(error) => {
|
||||||
|
console.log('err' + error)
|
||||||
|
let { message, response } = error
|
||||||
|
if (response) {
|
||||||
|
const status = response.status
|
||||||
|
if (status === 401) {
|
||||||
|
ElMessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', {
|
||||||
|
confirmButtonText: '重新登录',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then(() => {
|
||||||
|
// TODO: 跳转到登录页或执行退出逻辑
|
||||||
|
location.href = '/login'
|
||||||
|
})
|
||||||
|
} else if (status === 403) {
|
||||||
|
ElMessage({
|
||||||
|
message: '当前操作无权限',
|
||||||
|
type: 'error',
|
||||||
|
duration: 5 * 1000
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
ElMessage({
|
||||||
|
message: message || '后端接口未知异常',
|
||||||
|
type: 'error',
|
||||||
|
duration: 5 * 1000
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
ElMessage({
|
||||||
|
message: '网络连接异常',
|
||||||
|
type: 'error',
|
||||||
|
duration: 5 * 1000
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return Promise.reject(error)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
export default service
|
||||||
|
|
@ -0,0 +1,41 @@
|
||||||
|
<template>
|
||||||
|
<div class="dashboard-container">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="6">
|
||||||
|
<el-card shadow="hover">
|
||||||
|
<template #header>知识库总数</template>
|
||||||
|
<div class="card-content">12</div>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="6">
|
||||||
|
<el-card shadow="hover">
|
||||||
|
<template #header>总消息数</template>
|
||||||
|
<div class="card-content">1,284</div>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="6">
|
||||||
|
<el-card shadow="hover">
|
||||||
|
<template #header>平均响应时间</template>
|
||||||
|
<div class="card-content">1.2s</div>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="6">
|
||||||
|
<el-card shadow="hover">
|
||||||
|
<template #header>活跃租户</template>
|
||||||
|
<div class="card-content">5</div>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.dashboard-container {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.card-content {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,43 @@
|
||||||
|
<template>
|
||||||
|
<div class="kb-container">
|
||||||
|
<el-card>
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>知识库列表</span>
|
||||||
|
<el-button type="primary">上传文档</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<el-table :data="tableData" style="width: 100%">
|
||||||
|
<el-table-column prop="name" label="文件名" />
|
||||||
|
<el-table-column prop="status" label="状态">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag :type="scope.row.status === 'completed' ? 'success' : 'warning'">
|
||||||
|
{{ scope.row.status }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="createTime" label="上传时间" />
|
||||||
|
<el-table-column label="操作">
|
||||||
|
<template #default>
|
||||||
|
<el-button link type="primary">查看详情</el-button>
|
||||||
|
<el-button link type="danger">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
const tableData = ref([
|
||||||
|
{ name: '产品手册.pdf', status: 'completed', createTime: '2024-02-24 10:00:00' },
|
||||||
|
{ name: '技术文档.docx', status: 'processing', createTime: '2024-02-24 11:30:00' }
|
||||||
|
])
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.kb-container { padding: 20px; }
|
||||||
|
.card-header { display: flex; justify-content: space-between; align-items: center; }
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,181 @@
|
||||||
|
<template>
|
||||||
|
<div class="monitoring-container">
|
||||||
|
<el-card shadow="never">
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span class="title">会话监控 [AC-ASA-09]</span>
|
||||||
|
<div class="header-ops">
|
||||||
|
<el-form :inline="true" :model="queryParams" class="search-form">
|
||||||
|
<el-form-item label="状态">
|
||||||
|
<el-select v-model="queryParams.status" placeholder="会话状态" clearable style="width: 120px">
|
||||||
|
<el-option label="活跃" value="active" />
|
||||||
|
<el-option label="已关闭" value="closed" />
|
||||||
|
<el-option label="已过期" value="expired" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||||
|
<el-button @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 使用 BaseTable 展示会话列表 [AC-ASA-09] -->
|
||||||
|
<base-table
|
||||||
|
:data="tableData"
|
||||||
|
:total="total"
|
||||||
|
v-model:page-num="queryParams.page"
|
||||||
|
v-model:page-size="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
v-loading="loading"
|
||||||
|
>
|
||||||
|
<el-table-column prop="sessionId" label="会话 ID" width="180" show-overflow-tooltip />
|
||||||
|
<el-table-column prop="tenantId" label="租户 ID" width="120" />
|
||||||
|
<el-table-column prop="messageCount" label="消息数" width="100" align="center" />
|
||||||
|
<el-table-column prop="status" label="状态" width="100" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag :type="statusMap[scope.row.status]?.type" size="small">
|
||||||
|
{{ statusMap[scope.row.status]?.label || scope.row.status }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="startTime" label="开始时间" width="180" />
|
||||||
|
<el-table-column label="操作" fixed="right" width="120" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button link type="primary" @click="handleTrace(scope.row)">全链路追踪</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</base-table>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!-- 全链路追踪详情抽屉 [AC-ASA-07] -->
|
||||||
|
<el-drawer
|
||||||
|
v-model="drawerVisible"
|
||||||
|
title="会话全链路追踪详情"
|
||||||
|
size="50%"
|
||||||
|
destroy-on-close
|
||||||
|
>
|
||||||
|
<div v-loading="detailLoading" class="detail-container">
|
||||||
|
<el-empty v-if="!sessionDetail && !detailLoading" description="暂无追踪详情" />
|
||||||
|
<el-timeline v-else>
|
||||||
|
<el-timeline-item
|
||||||
|
v-for="(msg, index) in sessionDetail?.messages"
|
||||||
|
:key="index"
|
||||||
|
:timestamp="msg.timestamp"
|
||||||
|
placement="top"
|
||||||
|
:type="msg.role === 'user' ? 'primary' : 'success'"
|
||||||
|
>
|
||||||
|
<el-card shadow="never" class="msg-card">
|
||||||
|
<div class="msg-header">
|
||||||
|
<span class="role-tag" :class="msg.role">{{ msg.role === 'user' ? 'USER' : 'ASSISTANT' }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="msg-content">{{ msg.content }}</div>
|
||||||
|
|
||||||
|
<!-- 展示追踪信息：检索命中、工具调用等 [AC-ASA-07] -->
|
||||||
|
<div v-if="msg.trace" class="trace-info">
|
||||||
|
<el-collapse class="trace-collapse">
|
||||||
|
<el-collapse-item v-if="msg.trace.retrieval" title="检索追踪 (Retrieval)" name="retrieval">
|
||||||
|
<div v-for="(hit, hIdx) in msg.trace.retrieval" :key="hIdx" class="hit-item">
|
||||||
|
<div class="hit-meta">
|
||||||
|
<el-tag size="small" type="success">Score: {{ hit.score }}</el-tag>
|
||||||
|
<span class="hit-source" v-if="hit.source">来源: {{ hit.source }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="hit-text">{{ hit.content }}</div>
|
||||||
|
</div>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item v-if="msg.trace.tool_calls" title="工具调用 (Tool Calls)" name="tools">
|
||||||
|
<pre class="code-block"><code>{{ JSON.stringify(msg.trace.tool_calls, null, 2) }}</code></pre>
|
||||||
|
</el-collapse-item>
|
||||||
|
</el-collapse>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</el-timeline-item>
|
||||||
|
</el-timeline>
|
||||||
|
</div>
|
||||||
|
</el-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
|
import BaseTable from '@/components/BaseTable.vue'
|
||||||
|
import { listSessions, getSessionDetail } from '@/api/monitoring'
|
||||||
|
|
||||||
|
const statusMap: Record<string, { label: string, type: string }> = {
|
||||||
|
active: { label: '活跃', type: 'success' },
|
||||||
|
closed: { label: '已关闭', type: 'info' },
|
||||||
|
expired: { label: '已过期', type: 'warning' }
|
||||||
|
}
|
||||||
|
|
||||||
|
const loading = ref(false)
|
||||||
|
const tableData = ref([])
|
||||||
|
const total = ref(0)
|
||||||
|
const queryParams = reactive({
|
||||||
|
page: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
status: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const drawerVisible = ref(false)
|
||||||
|
const detailLoading = ref(false)
|
||||||
|
const sessionDetail = ref<any>(null)
|
||||||
|
|
||||||
|
const getList = async () => {
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const res: any = await listSessions(queryParams)
|
||||||
|
tableData.value = res.data || []
|
||||||
|
total.value = res.pagination?.total || 0
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleQuery = () => {
|
||||||
|
queryParams.page = 1
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetQuery = () => {
|
||||||
|
queryParams.status = ''
|
||||||
|
handleQuery()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取并展示全链路追踪详情 [AC-ASA-07] */
|
||||||
|
const handleTrace = async (row: any) => {
|
||||||
|
drawerVisible.value = true
|
||||||
|
detailLoading.value = true
|
||||||
|
try {
|
||||||
|
sessionDetail.value = await getSessionDetail(row.sessionId)
|
||||||
|
} finally {
|
||||||
|
detailLoading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.monitoring-container { padding: 20px; }
|
||||||
|
.card-header { display: flex; justify-content: space-between; align-items: center; }
|
||||||
|
.title { font-size: 16px; font-weight: bold; }
|
||||||
|
.detail-container { padding: 10px 20px; }
|
||||||
|
.msg-card { border-radius: 8px; margin-bottom: 10px; }
|
||||||
|
.msg-header { margin-bottom: 8px; }
|
||||||
|
.role-tag { font-size: 11px; font-weight: bold; padding: 2px 6px; border-radius: 4px; }
|
||||||
|
.role-tag.user { background-color: #ecf5ff; color: #409eff; }
|
||||||
|
.role-tag.assistant { background-color: #f0f9eb; color: #67c23a; }
|
||||||
|
.msg-content { font-size: 14px; line-height: 1.6; color: #333; white-space: pre-wrap; }
|
||||||
|
.trace-info { margin-top: 15px; border-top: 1px solid #f0f0f0; padding-top: 10px; }
|
||||||
|
.trace-collapse { border: none; }
|
||||||
|
:deep(.el-collapse-item__header) { height: 36px; font-size: 13px; color: #909399; }
|
||||||
|
.hit-item { padding: 10px; background-color: #f8f9fa; border-radius: 4px; margin-bottom: 8px; }
|
||||||
|
.hit-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
|
||||||
|
.hit-source { font-size: 11px; color: #999; }
|
||||||
|
.hit-text { font-size: 12px; color: #666; line-height: 1.5; }
|
||||||
|
.code-block { background-color: #fafafa; border: 1px solid #eaeaea; padding: 8px; border-radius: 4px; font-size: 12px; overflow-x: auto; margin: 0; }
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,164 @@
|
||||||
|
<template>
|
||||||
|
<div class="rag-lab-container">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<!-- 左侧：调试输入 [AC-ASA-05] -->
|
||||||
|
<el-col :span="10">
|
||||||
|
<el-card header="调试输入">
|
||||||
|
<el-form label-position="top">
|
||||||
|
<el-form-item label="查询 Query">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.query"
|
||||||
|
type="textarea"
|
||||||
|
:rows="4"
|
||||||
|
placeholder="输入测试问题..."
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="知识库范围">
|
||||||
|
<el-select
|
||||||
|
v-model="queryParams.kbIds"
|
||||||
|
multiple
|
||||||
|
placeholder="请选择知识库"
|
||||||
|
style="width: 100%"
|
||||||
|
>
|
||||||
|
<el-option label="默认知识库" value="default" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="参数配置">
|
||||||
|
<div class="param-item">
|
||||||
|
<span class="label">Top-K</span>
|
||||||
|
<el-input-number v-model="queryParams.params.topK" :min="1" :max="10" />
|
||||||
|
</div>
|
||||||
|
<div class="param-item">
|
||||||
|
<span class="label">Score Threshold</span>
|
||||||
|
<el-slider
|
||||||
|
v-model="queryParams.params.threshold"
|
||||||
|
:min="0"
|
||||||
|
:max="1"
|
||||||
|
:step="0.1"
|
||||||
|
show-input
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
<el-button type="primary" block @click="handleRun" :loading="loading">
|
||||||
|
运行实验
|
||||||
|
</el-button>
|
||||||
|
</el-form>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<!-- 右侧：实验结果 [AC-ASA-05] -->
|
||||||
|
<el-col :span="14">
|
||||||
|
<el-tabs v-model="activeTab" type="border-card">
|
||||||
|
<el-tab-pane label="召回片段" name="retrieval">
|
||||||
|
<div v-if="results.retrievalResults.length === 0" class="placeholder-text">
|
||||||
|
暂无实验数据
|
||||||
|
</div>
|
||||||
|
<div v-else class="result-list">
|
||||||
|
<el-card
|
||||||
|
v-for="(item, index) in results.retrievalResults"
|
||||||
|
:key="index"
|
||||||
|
class="result-card"
|
||||||
|
shadow="never"
|
||||||
|
>
|
||||||
|
<div class="result-header">
|
||||||
|
<el-tag size="small">Score: {{ item.score.toFixed(4) }}</el-tag>
|
||||||
|
<span class="source">来源: {{ item.source }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="result-content">{{ item.content }}</div>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="最终 Prompt" name="prompt">
|
||||||
|
<div v-if="!results.finalPrompt" class="placeholder-text">
|
||||||
|
等待实验运行...
|
||||||
|
</div>
|
||||||
|
<div v-else class="prompt-view">
|
||||||
|
<pre><code>{{ results.finalPrompt }}</code></pre>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive } from 'vue'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
import { runRagExperiment } from '@/api/rag'
|
||||||
|
|
||||||
|
const loading = ref(false)
|
||||||
|
const activeTab = ref('retrieval')
|
||||||
|
|
||||||
|
const queryParams = reactive({
|
||||||
|
query: '',
|
||||||
|
kbIds: [],
|
||||||
|
params: {
|
||||||
|
topK: 3,
|
||||||
|
threshold: 0.5
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const results = reactive({
|
||||||
|
retrievalResults: [],
|
||||||
|
finalPrompt: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
/** 运行实验 [AC-ASA-05] */
|
||||||
|
const handleRun = async () => {
|
||||||
|
if (!queryParams.query.trim()) {
|
||||||
|
ElMessage.warning('请输入查询 Query')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
loading.value = true
|
||||||
|
try {
|
||||||
|
const res: any = await runRagExperiment(queryParams)
|
||||||
|
results.retrievalResults = res.retrievalResults || []
|
||||||
|
results.finalPrompt = res.finalPrompt || ''
|
||||||
|
activeTab.value = 'retrieval'
|
||||||
|
ElMessage.success('实验运行成功')
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err)
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.rag-lab-container { padding: 20px; }
|
||||||
|
.param-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.param-item .label {
|
||||||
|
width: 120px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.placeholder-text { color: #909399; text-align: center; padding: 50px 0; }
|
||||||
|
.result-list { height: 600px; overflow-y: auto; }
|
||||||
|
.result-card { margin-bottom: 15px; }
|
||||||
|
.result-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.source { font-size: 12px; color: #909399; }
|
||||||
|
.result-content { font-size: 14px; line-height: 1.6; color: #303133; }
|
||||||
|
.prompt-view {
|
||||||
|
background-color: #f5f7fa;
|
||||||
|
padding: 15px;
|
||||||
|
border-radius: 4px;
|
||||||
|
max-height: 600px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.prompt-view pre {
|
||||||
|
margin: 0;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "ESNext",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
|
"strict": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"lib": ["ESNext", "DOM"],
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"noEmit": true,
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["src/*"]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||||
|
"references": [{ "path": "./tsconfig.node.json" }]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
|
"allowSyntheticDefaultImports": true
|
||||||
|
},
|
||||||
|
"include": ["vite.config.ts"]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import vue from '@vitejs/plugin-vue'
|
||||||
|
import path from 'path'
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [vue()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': path.resolve(__dirname, './src'),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
server: {
|
||||||
|
port: 3000,
|
||||||
|
proxy: {
|
||||||
|
'/api': {
|
||||||
|
target: 'http://localhost:8000',
|
||||||
|
changeOrigin: true,
|
||||||
|
rewrite: (path) => path.replace(/^\/api/, ''),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
@ -0,0 +1,134 @@
|
||||||
|
---
|
||||||
|
module: ai-service-admin
|
||||||
|
feature: ASA
|
||||||
|
status: in_progress
|
||||||
|
created: 2026-02-24
|
||||||
|
last_updated: 2026-02-24
|
||||||
|
---
|
||||||
|
|
||||||
|
# AI 中台管理界面（ai-service-admin）进度文档
|
||||||
|
|
||||||
|
## context
|
||||||
|
|
||||||
|
- **module**: ai-service-admin
|
||||||
|
- **feature**: ASA
|
||||||
|
- **status**: 🔄进行中
|
||||||
|
|
||||||
|
## spec_references
|
||||||
|
|
||||||
|
- requirements: "spec/ai-service-admin/requirements.md"
|
||||||
|
- design: "spec/ai-service-admin/design.md"
|
||||||
|
- tasks: "spec/ai-service-admin/tasks.md"
|
||||||
|
- openapi_admin: "spec/ai-service/openapi.admin.yaml"
|
||||||
|
|
||||||
|
## overall_progress
|
||||||
|
|
||||||
|
- [x] Phase 1: 基础建设 (100%) [P1-01 ~ P1-05]
|
||||||
|
- [x] Phase 2: 知识库管理 (100%) [P2-01 ~ P2-05]
|
||||||
|
- [ ] Phase 3: RAG 实验室 (0%) [P3-01 ~ P3-04]
|
||||||
|
- [ ] Phase 4: 会话监控与详情 (0%) [P4-01 ~ P4-03]
|
||||||
|
|
||||||
|
## current_phase
|
||||||
|
|
||||||
|
**goal**: 知识库管理模块开发，实现文档上传、列表展示与状态轮询
|
||||||
|
|
||||||
|
### sub_tasks
|
||||||
|
|
||||||
|
- [x] (P1-01) 初始化 `ai-service-admin` 前端工程（Vue 3 + Element Plus + RuoYi-Vue 基座对齐），落地基础目录结构与路由骨架
|
||||||
|
- [x] (P1-02) 接入 Pinia：实现 `tenant` store（`currentTenantId`）并持久化（localStorage），提供切换租户能力
|
||||||
|
- [x] (P1-03) Axios/SDK 请求层封装：创建统一 `request` 实例，自动注入必填 Header `X-Tenant-Id`
|
||||||
|
- [x] (P1-04) 全局异常拦截：实现 401/403 响应拦截策略
|
||||||
|
- [x] (P1-05) 基础组件封装：`BaseTable`、`BaseForm` 并给出示例页
|
||||||
|
- [x] (P2-01) 创建 `openapi.deps.yaml` 明确依赖契约 (L1) [AC-ASA-08]
|
||||||
|
- [x] (P2-02) 实现知识库列表 API 对接及分页展示 [AC-ASA-08]
|
||||||
|
- [x] (P2-03) 实现文档上传功能（Multipart/form-data）[AC-ASA-01]
|
||||||
|
- [x] (P2-04) 实现索引任务状态轮询机制（3s 间隔）[AC-ASA-02]
|
||||||
|
- [x] (P2-05) 失败任务错误详情弹窗展示 [AC-ASA-02]
|
||||||
|
|
||||||
|
### next_action
|
||||||
|
|
||||||
|
**immediate**: 开始 Phase 3 RAG 实验室模块
|
||||||
|
|
||||||
|
**details**:
|
||||||
|
- file: "ai-service-admin/src/views/rag-lab/index.vue"
|
||||||
|
- action: "实现 RAG 实验调试界面，支持参数配置、Query 提交及召回片段对比展示"
|
||||||
|
|
||||||
|
### next_action
|
||||||
|
|
||||||
|
**immediate**: 初始化 `ai-service-admin` 前端工程
|
||||||
|
|
||||||
|
**details**:
|
||||||
|
- file: "待创建 - 前端工程根目录"
|
||||||
|
- action: "创建 Vue 3 + Element Plus 项目骨架，对齐 RuoYi-Vue 基座，配置基础目录结构与路由骨架"
|
||||||
|
- reference: "spec/ai-service-admin/tasks.md:26-27"
|
||||||
|
|
||||||
|
**constraints**:
|
||||||
|
- 必须符合 AC-ASA-01 验收标准
|
||||||
|
- 需与 RuoYi-Vue-Plus 基座对齐（用户认证、权限校验及菜单框架）
|
||||||
|
|
||||||
|
## technical_context
|
||||||
|
|
||||||
|
### module_structure
|
||||||
|
|
||||||
|
```
|
||||||
|
ai-service-admin/ # 前端工程（待创建）
|
||||||
|
├── src/
|
||||||
|
│ ├── api/ # API 请求层
|
||||||
|
│ ├── components/ # 通用组件
|
||||||
|
│ ├── composables/ # Vue Composables
|
||||||
|
│ ├── router/ # 路由配置
|
||||||
|
│ ├── stores/ # Pinia stores
|
||||||
|
│ ├── views/ # 页面视图
|
||||||
|
│ └── utils/ # 工具函数
|
||||||
|
└── package.json
|
||||||
|
```
|
||||||
|
|
||||||
|
### key_decisions
|
||||||
|
|
||||||
|
| decision | reason | impact |
|
||||||
|
|----------|--------|--------|
|
||||||
|
| Vue 3 + Element Plus | 与 RuoYi-Vue-Plus 基座技术栈一致 | 复用基座组件与权限体系 |
|
||||||
|
| Pinia 状态管理 | Vue 3 官方推荐，替代 Vuex | 更简洁的 store 模式 |
|
||||||
|
| localStorage 持久化 | 租户切换需跨会话保持 | 无需后端 session 支持 |
|
||||||
|
|
||||||
|
### code_snippets
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// stores/tenant.ts (待实现)
|
||||||
|
export const useTenantStore = defineStore('tenant', {
|
||||||
|
state: () => ({
|
||||||
|
currentTenantId: localStorage.getItem('currentTenantId') || ''
|
||||||
|
}),
|
||||||
|
actions: {
|
||||||
|
setTenant(id: string) {
|
||||||
|
this.currentTenantId = id
|
||||||
|
localStorage.setItem('currentTenantId', id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
## session_history
|
||||||
|
|
||||||
|
- session: "Session #1 (2026-02-24)"
|
||||||
|
completed: []
|
||||||
|
changes: []
|
||||||
|
|
||||||
|
## startup_guide
|
||||||
|
|
||||||
|
1. **Step 1**: 读取本进度文档（了解当前位置与下一步）
|
||||||
|
2. **Step 2**: 读取 spec_references 中定义的模块规范（了解业务与接口约束）
|
||||||
|
3. **Step 3**: 直接执行 next_action - 初始化前端工程
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Phase 任务速查
|
||||||
|
|
||||||
|
| Phase | 名称 | 任务数 | 状态 |
|
||||||
|
|-------|------|--------|------|
|
||||||
|
| Phase 1 | 基础建设 | 5 | ⏳ 待开始 |
|
||||||
|
| Phase 2 | 知识库管理 | 5 | ⏳ 待开始 |
|
||||||
|
| Phase 3 | RAG 实验室 | 4 | ⏳ 待开始 |
|
||||||
|
| Phase 4 | 会话监控与详情 | 3 | ⏳ 待开始 |
|
||||||
|
|
||||||
|
**总计: 17 个任务**
|
||||||
Loading…
Reference in New Issue