chore: 移除 AI 助手
This commit is contained in:
Ray.Hao
@@ -6,9 +6,9 @@ VITE_APP_TITLE=vue3-element-admin
|
||||
VITE_APP_BASE_API=/dev-api
|
||||
|
||||
# 接口地址
|
||||
VITE_APP_API_URL=https://api.youlai.tech # 线上
|
||||
# VITE_APP_API_URL=https://api.youlai.tech # 线上
|
||||
# VITE_APP_API_URL=https://api.youlai.tech/v2 # 线上(多租户)
|
||||
# VITE_APP_API_URL=http://localhost:8000 # 本地
|
||||
VITE_APP_API_URL=http://localhost:8000 # 本地
|
||||
|
||||
# WebSocket 端点（不配置则关闭）
|
||||
# 线上: ws://api.youlai.tech/ws
|
||||
|
||||
15
src/App.vue
15
src/App.vue
@@ -8,36 +8,23 @@
|
||||
class="wh-full"
|
||||
>
|
||||
<router-view />
|
||||
|
||||
<!-- AI 助手 -->
|
||||
<AiAssistant v-if="enableAiAssistant" />
|
||||
</el-watermark>
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useAppStore, useSettingsStore, useUserStore } from "@/store";
|
||||
import { useAppStore, useSettingsStore } from "@/store";
|
||||
import { appConfig } from "@/settings";
|
||||
import { ThemeMode, ComponentSize } from "@/enums";
|
||||
import AiAssistant from "@/components/AiAssistant/index.vue";
|
||||
|
||||
const appStore = useAppStore();
|
||||
const settingsStore = useSettingsStore();
|
||||
const userStore = useUserStore();
|
||||
|
||||
const locale = computed(() => appStore.locale);
|
||||
const size = computed(() => appStore.size as ComponentSize);
|
||||
const showWatermark = computed(() => settingsStore.showWatermark);
|
||||
const watermarkContent = appConfig.name;
|
||||
|
||||
// 只有在用户启用 AI 助手且已登录时才显示
|
||||
// 使用 userInfo 作为响应式依赖，当用户退出登录时会自动更新
|
||||
const enableAiAssistant = computed(() => {
|
||||
const isEnabled = settingsStore.enableAiAssistant;
|
||||
const isLoggedIn = userStore.userInfo && Object.keys(userStore.userInfo).length > 0;
|
||||
return isEnabled && isLoggedIn;
|
||||
});
|
||||
|
||||
// 明亮/暗黑主题水印字体颜色适配
|
||||
const fontColor = computed(() => {
|
||||
return settingsStore.theme === ThemeMode.DARK ? "rgba(255, 255, 255, .15)" : "rgba(0, 0, 0, .15)";
|
||||
|
||||
@@ -1,73 +0,0 @@
|
||||
import request from "@/utils/request";
|
||||
import type {
|
||||
AiCommandRequest,
|
||||
AiCommandResponse,
|
||||
AiExecuteRequest,
|
||||
AiExecuteResponse,
|
||||
AiAssistantRecordQueryParams,
|
||||
AiAssistantRecordItem,
|
||||
} from "@/types/api";
|
||||
|
||||
const AI_BASE_URL = "/api/v1/ai/assistant";
|
||||
|
||||
/**
|
||||
* AI 命令 API
|
||||
*/
|
||||
const AiCommandApi = {
|
||||
/**
|
||||
* 解析 AI 命令
|
||||
*
|
||||
* @param data AI 命令请求参数
|
||||
* @returns AI 命令解析响应
|
||||
*/
|
||||
parseCommand(data: AiCommandRequest) {
|
||||
return request<any, AiCommandResponse>({
|
||||
url: `${AI_BASE_URL}/parse`,
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 执行 AI 命令
|
||||
*
|
||||
* @param data AI 命令执行请求
|
||||
* @returns AI 命令执行响应
|
||||
*/
|
||||
executeCommand(data: AiExecuteRequest) {
|
||||
return request<any, AiExecuteResponse>({
|
||||
url: `${AI_BASE_URL}/execute`,
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取 AI 命令记录分页列表
|
||||
*
|
||||
* @param queryParams 查询参数
|
||||
* @returns AI 命令记录分页列表
|
||||
*/
|
||||
getPage(queryParams: AiAssistantRecordQueryParams) {
|
||||
return request<any, PageResult<AiAssistantRecordItem>>({
|
||||
url: `${AI_BASE_URL}/records`,
|
||||
method: "get",
|
||||
params: queryParams,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 删除 AI 命令记录
|
||||
*
|
||||
* @param ids 记录ID，多个以逗号分隔
|
||||
* @returns 删除结果
|
||||
*/
|
||||
deleteByIds(ids: string) {
|
||||
return request({
|
||||
url: `${AI_BASE_URL}/records/${ids}`,
|
||||
method: "delete",
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
export default AiCommandApi;
|
||||
@@ -1 +0,0 @@
|
||||
<svg t="1765953898889" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6018" width="200" height="200"><path d="M603.904 244.992c134.4 0 243.3536 108.9536 243.3536 243.3536v202.8032c0 134.4-108.9536 243.3536-243.3536 243.3536H320c-134.4 0-243.3536-108.9536-243.3536-243.3536V488.3456c0-134.4 108.9536-243.3536 243.3536-243.3536h283.904z m0 81.1008H320c-89.6 0-162.2528 72.6528-162.2528 162.2528v202.8032c0 89.6 72.6528 162.2528 162.2528 162.2528h283.904c89.6 0 162.2528-72.6528 162.2528-162.2528V488.3456c0-89.6-72.6528-162.2528-162.2528-162.2528z" p-id="6019"></path><path d="M340.224 508.6208c27.0336 0 40.5504 13.5168 40.5504 40.5504v81.1008c0 27.0336-13.5168 40.5504-40.5504 40.5504-27.0336 0-40.5504-13.5168-40.5504-40.5504v-81.1008c0-27.0336 13.5168-40.5504 40.5504-40.5504zM583.2192 501.3504c15.2576-11.4176 36.864-8.3456 48.2816 6.912a34.4832 34.4832 0 0 1-6.912 48.2816l-44.3904 33.28 44.3904 33.28a34.53952 34.53952 0 0 1 9.472 44.3392l-2.56 3.9424c-11.4176 15.2576-33.024 18.3296-48.2816 6.912l-59.4944-44.5952c-13.7728-10.3424-21.9136-26.5728-21.9136-43.8272s8.0896-33.4848 21.9136-43.8272l59.4944-44.5952zM883.5072 261.12l-19.7632 47.3088c-2.7648 6.656-9.2672 10.9568-16.4864 10.9568s-13.6704-4.3008-16.4864-10.9568L811.008 261.12a44.416 44.416 0 0 0-19.7632-21.9648l-34.8672-19.0976c-5.7344-3.1232-9.2672-9.1136-9.2672-15.6672s3.5328-12.544 9.2672-15.6672l34.8672-19.0464a44.89728 44.89728 0 0 0 19.7632-21.9648l19.7632-47.3088c2.7648-6.656 9.2672-10.9568 16.4864-10.9568s13.6704 4.3008 16.4864 10.9568l19.7632 47.3088a44.416 44.416 0 0 0 19.7632 21.9648l34.8672 19.0976c5.7344 3.1232 9.2672 9.1136 9.2672 15.6672s-3.584 12.544-9.2672 15.6672l-34.8672 19.0464c-8.9088 4.864-15.872 12.6464-19.7632 21.9648z" p-id="6020"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.7 KiB |
@@ -1,854 +0,0 @@
|
||||
<template>
|
||||
<!-- 悬浮按钮 -->
|
||||
<div class="ai-assistant">
|
||||
<!-- AI 助手图标按钮 -->
|
||||
<el-button
|
||||
v-if="!dialogVisible && !fabCollapsed"
|
||||
class="ai-fab-button"
|
||||
type="primary"
|
||||
circle
|
||||
size="large"
|
||||
:style="fabStyle"
|
||||
@contextmenu.prevent="fabCollapsed = true"
|
||||
@click="handleOpen"
|
||||
>
|
||||
<div class="i-svg:ai ai-icon" />
|
||||
</el-button>
|
||||
|
||||
<!-- 收缩态：贴边小标签，避免遮挡表单控件 -->
|
||||
<div
|
||||
v-if="!dialogVisible && fabCollapsed"
|
||||
class="ai-fab-tab"
|
||||
:style="fabStyle"
|
||||
@click="fabCollapsed = false"
|
||||
>
|
||||
AI
|
||||
</div>
|
||||
|
||||
<!-- AI 对话框 -->
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="AI 智能助手"
|
||||
width="600px"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
class="ai-assistant-dialog"
|
||||
>
|
||||
<template #header>
|
||||
<div class="dialog-header">
|
||||
<div class="i-svg:ai header-icon" />
|
||||
<span class="title">AI 智能助手</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 命令输入 -->
|
||||
<div class="command-input">
|
||||
<el-input
|
||||
v-model="command"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="试试说：修改test用户的姓名为测试人员 或者：跳转到用户管理 按 Ctrl+Enter 快速发送"
|
||||
:disabled="loading"
|
||||
@keydown.ctrl.enter="handleExecute"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 快捷命令示例 -->
|
||||
<div class="quick-commands">
|
||||
<div class="section-title">💡 试试这些命令：</div>
|
||||
<el-tag
|
||||
v-for="example in examples"
|
||||
:key="example"
|
||||
class="command-tag"
|
||||
@click="command = example"
|
||||
>
|
||||
{{ example }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<!-- AI 响应结果 -->
|
||||
<div v-if="response" class="ai-response">
|
||||
<el-alert :title="response.explanation" type="success" :closable="false" show-icon />
|
||||
|
||||
<!-- 将要执行的操作 -->
|
||||
<div v-if="response.action" class="action-preview">
|
||||
<div class="action-title">🎯 将要执行：</div>
|
||||
<div class="action-content">
|
||||
<div v-if="response.action.type === 'navigate'">
|
||||
<el-icon><Position /></el-icon>
|
||||
跳转到：
|
||||
<strong>{{ response.action.pageName }}</strong>
|
||||
<span v-if="response.action.query" class="query-info">
|
||||
并搜索：
|
||||
<el-tag type="warning" size="small">{{ response.action.query }}</el-tag>
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="response.action.type === 'navigate-and-execute'">
|
||||
<el-icon><Position /></el-icon>
|
||||
跳转至：
|
||||
<strong>{{ response.action.pageName }}</strong>
|
||||
<span v-if="response.action.query" class="query-info">
|
||||
并搜索：
|
||||
<el-tag type="warning" size="small">{{ response.action.query }}</el-tag>
|
||||
</span>
|
||||
<el-divider direction="vertical" />
|
||||
<el-icon><Tools /></el-icon>
|
||||
执行：
|
||||
<strong>{{ response.action.functionCall.name }}</strong>
|
||||
</div>
|
||||
<div v-if="response.action.type === 'execute'">
|
||||
<el-icon><Tools /></el-icon>
|
||||
执行：
|
||||
<strong>{{ response.action.functionName }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="handleClose">取消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="handleExecute">
|
||||
<el-icon><MagicStick /></el-icon>
|
||||
执行命令
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onBeforeUnmount, onMounted, watch } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ElMessage } from "element-plus";
|
||||
import AiCommandApi from "@/api/ai";
|
||||
import { useSettingsStore } from "@/store";
|
||||
|
||||
type ToolFunctionCall = {
|
||||
name: string;
|
||||
arguments: Record<string, any>;
|
||||
};
|
||||
|
||||
// 统一的动作描述（区分“跳转”、“跳转+执行”、“仅执行”三种场景）
|
||||
type AiAction =
|
||||
| {
|
||||
type: "navigate";
|
||||
path: string;
|
||||
pageName: string;
|
||||
query?: string;
|
||||
}
|
||||
| {
|
||||
type: "navigate-and-execute";
|
||||
path: string;
|
||||
pageName: string;
|
||||
query?: string;
|
||||
functionCall: ToolFunctionCall;
|
||||
}
|
||||
| {
|
||||
type: "execute";
|
||||
functionName: string;
|
||||
functionCall: ToolFunctionCall;
|
||||
};
|
||||
|
||||
type AiResponse = {
|
||||
explanation: string;
|
||||
action: AiAction | null;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
const settingsStore = useSettingsStore();
|
||||
|
||||
// 状态管理
|
||||
const dialogVisible = ref(false);
|
||||
const command = ref("");
|
||||
const loading = ref(false);
|
||||
const response = ref<AiResponse | null>(null);
|
||||
|
||||
const fabCollapsed = useStorage<boolean>("vea:ui:ai_assistant_fab_collapsed", false);
|
||||
|
||||
const fabRight = ref(30);
|
||||
const fabBottom = ref(80);
|
||||
const fabStyle = computed(() => ({
|
||||
right: `${fabRight.value}px`,
|
||||
bottom: `${fabBottom.value}px`,
|
||||
}));
|
||||
|
||||
const isElementVisible = (el: Element) => {
|
||||
const style = window.getComputedStyle(el);
|
||||
if (style.display === "none" || style.visibility === "hidden") {
|
||||
return false;
|
||||
}
|
||||
return (el as HTMLElement).getClientRects().length > 0;
|
||||
};
|
||||
|
||||
const getActiveRightDrawerWidth = (): number => {
|
||||
const drawers = Array.from(document.querySelectorAll(".el-drawer"));
|
||||
for (let i = drawers.length - 1; i >= 0; i--) {
|
||||
const drawer = drawers[i] as HTMLElement;
|
||||
if (!isElementVisible(drawer)) {
|
||||
continue;
|
||||
}
|
||||
const rect = drawer.getBoundingClientRect();
|
||||
if (rect.width > 0 && rect.right >= window.innerWidth - 8) {
|
||||
return rect.width;
|
||||
}
|
||||
}
|
||||
return 0;
|
||||
};
|
||||
|
||||
const updateFabPosition = () => {
|
||||
const safeMargin = 24;
|
||||
const drawerWidth = getActiveRightDrawerWidth() || 0;
|
||||
const baseRight = drawerWidth + 30;
|
||||
|
||||
// base position
|
||||
const nextRight = baseRight;
|
||||
let nextBottom = 80;
|
||||
|
||||
// Avoid Element Plus popper overlays (select dropdown, icon picker, date picker, etc.)
|
||||
// If the FAB would overlap any visible popper, push it upward.
|
||||
const fabSize = fabCollapsed.value ? 42 : 60;
|
||||
const computeFabRect = (rightPx: number, bottomPx: number) => {
|
||||
const right = window.innerWidth - rightPx;
|
||||
const left = right - fabSize;
|
||||
const bottom = window.innerHeight - bottomPx;
|
||||
const top = bottom - fabSize;
|
||||
return { left, right, top, bottom };
|
||||
};
|
||||
|
||||
const intersects = (
|
||||
a: { left: number; right: number; top: number; bottom: number },
|
||||
b: DOMRect
|
||||
) => {
|
||||
return !(a.right <= b.left || a.left >= b.right || a.bottom <= b.top || a.top >= b.bottom);
|
||||
};
|
||||
|
||||
const poppers = Array.from(document.querySelectorAll(".el-popper"));
|
||||
for (const popper of poppers) {
|
||||
if (!isElementVisible(popper)) {
|
||||
continue;
|
||||
}
|
||||
const rect = (popper as HTMLElement).getBoundingClientRect();
|
||||
if (rect.width <= 0 || rect.height <= 0) {
|
||||
continue;
|
||||
}
|
||||
|
||||
const candidateFabRect = computeFabRect(nextRight, nextBottom);
|
||||
if (intersects(candidateFabRect, rect)) {
|
||||
const requiredBottom = Math.ceil(window.innerHeight - rect.top + safeMargin);
|
||||
nextBottom = Math.max(nextBottom, requiredBottom);
|
||||
}
|
||||
}
|
||||
|
||||
// clamp so the button doesn't get pushed off-screen
|
||||
const maxBottom = window.innerHeight - fabSize - safeMargin;
|
||||
nextBottom = Math.min(nextBottom, Math.max(0, maxBottom));
|
||||
|
||||
fabRight.value = nextRight + (drawerWidth > 0 ? safeMargin : 0);
|
||||
fabBottom.value = nextBottom;
|
||||
};
|
||||
|
||||
watch(
|
||||
fabCollapsed,
|
||||
() => {
|
||||
updateFabPosition();
|
||||
},
|
||||
{ flush: "post" }
|
||||
);
|
||||
|
||||
watch(
|
||||
() => settingsStore.settingsVisible,
|
||||
() => {
|
||||
nextTick(() => {
|
||||
scheduleUpdateFabPositionBurst();
|
||||
});
|
||||
},
|
||||
{ flush: "post" }
|
||||
);
|
||||
|
||||
let domObserver: MutationObserver | null = null;
|
||||
let rafId: number | null = null;
|
||||
|
||||
const scheduleUpdateFabPosition = () => {
|
||||
if (rafId != null) {
|
||||
return;
|
||||
}
|
||||
rafId = window.requestAnimationFrame(() => {
|
||||
rafId = null;
|
||||
updateFabPosition();
|
||||
});
|
||||
};
|
||||
|
||||
const scheduleUpdateFabPositionBurst = (frames = 18) => {
|
||||
let count = 0;
|
||||
const tick = () => {
|
||||
scheduleUpdateFabPosition();
|
||||
count += 1;
|
||||
if (count < frames) {
|
||||
window.requestAnimationFrame(tick);
|
||||
}
|
||||
};
|
||||
tick();
|
||||
};
|
||||
|
||||
// 快捷命令示例
|
||||
const examples = [
|
||||
"修改test用户的姓名为测试人员",
|
||||
"获取姓名为张三的用户信息",
|
||||
"跳转到用户管理",
|
||||
"打开角色管理页面",
|
||||
];
|
||||
|
||||
// 打开对话框
|
||||
const handleOpen = () => {
|
||||
dialogVisible.value = true;
|
||||
command.value = "";
|
||||
response.value = null;
|
||||
};
|
||||
|
||||
// 关闭对话框
|
||||
const handleClose = () => {
|
||||
dialogVisible.value = false;
|
||||
command.value = "";
|
||||
response.value = null;
|
||||
};
|
||||
|
||||
// 执行命令
|
||||
const handleExecute = async () => {
|
||||
const rawCommand = command.value.trim();
|
||||
if (!rawCommand) {
|
||||
ElMessage.warning("请输入命令");
|
||||
return;
|
||||
}
|
||||
|
||||
// 优先检测无需调用 AI 的纯跳转命令
|
||||
const directNavigation = tryDirectNavigate(rawCommand);
|
||||
if (directNavigation && directNavigation.action) {
|
||||
response.value = directNavigation;
|
||||
await executeAction(directNavigation.action);
|
||||
return;
|
||||
}
|
||||
|
||||
loading.value = true;
|
||||
|
||||
try {
|
||||
// 调用 AI API 解析命令
|
||||
const result = await AiCommandApi.parseCommand({
|
||||
command: rawCommand,
|
||||
currentRoute: router.currentRoute.value.path,
|
||||
currentComponent: router.currentRoute.value.name as string,
|
||||
context: {
|
||||
userRoles: [],
|
||||
},
|
||||
});
|
||||
|
||||
if (!result.success) {
|
||||
ElMessage.error(result.error || "命令解析失败");
|
||||
return;
|
||||
}
|
||||
|
||||
// 解析 AI 返回的操作类型
|
||||
const action = parseAction(result, rawCommand);
|
||||
response.value = {
|
||||
explanation: result.explanation ?? "命令解析成功，准备执行操作",
|
||||
action,
|
||||
};
|
||||
|
||||
// 等待用户确认后执行
|
||||
if (action) {
|
||||
await executeAction(action);
|
||||
}
|
||||
} catch (error: any) {
|
||||
console.error("AI 命令执行失败:", error);
|
||||
ElMessage.error(error.message || "命令执行失败");
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 路由配置映射表
|
||||
const routeConfig = [
|
||||
{ keywords: ["用户", "user", "user list"], path: "/system/user", name: "用户管理" },
|
||||
{ keywords: ["角色", "role"], path: "/system/role", name: "角色管理" },
|
||||
{ keywords: ["菜单", "menu"], path: "/system/menu", name: "菜单管理" },
|
||||
{ keywords: ["部门", "dept"], path: "/system/dept", name: "部门管理" },
|
||||
{ keywords: ["字典", "dict"], path: "/system/dict", name: "字典管理" },
|
||||
{ keywords: ["日志", "log"], path: "/system/log", name: "系统日志" },
|
||||
];
|
||||
|
||||
// 根据函数名推断路由（如 getUserInfo -> /system/user）
|
||||
const normalizeText = (text: string) => text.replace(/\s+/g, " ").trim().toLowerCase();
|
||||
|
||||
const inferRouteFromFunction = (functionName: string) => {
|
||||
const fnLower = normalizeText(functionName);
|
||||
for (const config of routeConfig) {
|
||||
// 检查函数名是否包含关键词（如 getUserInfo 包含 user）
|
||||
if (config.keywords.some((kw) => fnLower.includes(kw.toLowerCase()))) {
|
||||
return { path: config.path, name: config.name };
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
// 根据命令文本匹配路由
|
||||
const matchRouteFromCommand = (cmd: string) => {
|
||||
const normalized = normalizeText(cmd);
|
||||
for (const config of routeConfig) {
|
||||
if (config.keywords.some((kw) => normalized.includes(kw.toLowerCase()))) {
|
||||
return { path: config.path, name: config.name };
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
const extractKeywordFromCommand = (cmd: string): string => {
|
||||
const normalized = normalizeText(cmd);
|
||||
// 从 routeConfig 动态获取所有数据类型关键词
|
||||
const allKeywords = routeConfig.flatMap((config) =>
|
||||
config.keywords.map((kw) => kw.toLowerCase())
|
||||
);
|
||||
const keywordsPattern = allKeywords.join("|");
|
||||
|
||||
const patterns = [
|
||||
new RegExp(`(?:查询|获取|搜索|查找|找).*?([^\\s，。]+?)(?:的)?(?:${keywordsPattern})`, "i"),
|
||||
new RegExp(`(?:${keywordsPattern}).*?([^\\s，。]+?)(?:的|信息|详情)?`, "i"),
|
||||
new RegExp(
|
||||
`(?:姓名为|名字叫|叫做|名称为|名是|为)([^\\s，。]+?)(?:的)?(?:${keywordsPattern})?`,
|
||||
"i"
|
||||
),
|
||||
new RegExp(`([^\\s，。]+?)(?:的)?(?:${keywordsPattern})(?:信息|详情)?`, "i"),
|
||||
];
|
||||
|
||||
for (const pattern of patterns) {
|
||||
const match = normalized.match(pattern);
|
||||
if (match && match[1]) {
|
||||
let extracted = match[1].trim();
|
||||
extracted = extracted.replace(/姓名为|名字叫|叫做|名称为|名是|为|的|信息|详情/g, "");
|
||||
if (
|
||||
extracted &&
|
||||
!allKeywords.some((type) => extracted.toLowerCase().includes(type.toLowerCase()))
|
||||
) {
|
||||
return extracted;
|
||||
}
|
||||
}
|
||||
}
|
||||
return "";
|
||||
};
|
||||
|
||||
const tryDirectNavigate = (rawCommand: string): AiResponse | null => {
|
||||
const navigationIntents = ["跳转", "打开", "进入", "前往", "去", "浏览", "查看"];
|
||||
const operationIntents = [
|
||||
"修改",
|
||||
"更新",
|
||||
"变更",
|
||||
"删除",
|
||||
"添加",
|
||||
"创建",
|
||||
"设置",
|
||||
"获取",
|
||||
"查询",
|
||||
"搜索",
|
||||
];
|
||||
|
||||
const hasNavigationIntent = navigationIntents.some((keyword) => rawCommand.includes(keyword));
|
||||
const hasOperationIntent = operationIntents.some((keyword) => rawCommand.includes(keyword));
|
||||
|
||||
if (!hasNavigationIntent || hasOperationIntent) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const routeInfo = matchRouteFromCommand(rawCommand);
|
||||
if (!routeInfo) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const keyword = extractKeywordFromCommand(rawCommand);
|
||||
const action: AiAction = {
|
||||
type: "navigate",
|
||||
path: routeInfo.path,
|
||||
pageName: routeInfo.name,
|
||||
query: keyword || undefined,
|
||||
};
|
||||
|
||||
return {
|
||||
explanation: `检测到跳转命令，正在前往 ${routeInfo.name}`,
|
||||
action,
|
||||
};
|
||||
};
|
||||
|
||||
// 解析 AI 返回的操作类型
|
||||
const parseAction = (result: any, rawCommand: string): AiAction | null => {
|
||||
const cmd = normalizeText(rawCommand);
|
||||
const primaryCall = result.functionCalls?.[0];
|
||||
const functionName = primaryCall?.name;
|
||||
|
||||
// 优先从函数名推断路由，其次从命令文本匹配
|
||||
let routeInfo = functionName ? inferRouteFromFunction(functionName) : null;
|
||||
if (!routeInfo) {
|
||||
routeInfo = matchRouteFromCommand(cmd);
|
||||
}
|
||||
|
||||
const routePath = routeInfo?.path || "";
|
||||
const pageName = routeInfo?.name || "";
|
||||
const keyword = extractKeywordFromCommand(cmd);
|
||||
|
||||
if (primaryCall && functionName) {
|
||||
const fnNameLower = functionName.toLowerCase();
|
||||
|
||||
// 1) 查询类函数（query/search/list/get）-> 跳转并执行筛选操作
|
||||
const isQueryFunction =
|
||||
fnNameLower.includes("query") ||
|
||||
fnNameLower.includes("search") ||
|
||||
fnNameLower.includes("list") ||
|
||||
fnNameLower.includes("get");
|
||||
|
||||
if (isQueryFunction) {
|
||||
// 统一使用 keywords 参数（约定大于配置）
|
||||
const args = (primaryCall.arguments || {}) as Record<string, unknown>;
|
||||
const keywords =
|
||||
typeof args.keywords === "string" && args.keywords.trim().length > 0
|
||||
? args.keywords
|
||||
: keyword;
|
||||
|
||||
if (routePath) {
|
||||
return {
|
||||
type: "navigate-and-execute",
|
||||
path: routePath,
|
||||
pageName,
|
||||
functionCall: primaryCall,
|
||||
query: keywords || undefined,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// 2) 其他操作类函数（修改/删除/创建/更新等）-> 跳转并执行
|
||||
const isModifyFunction =
|
||||
fnNameLower.includes("update") ||
|
||||
fnNameLower.includes("modify") ||
|
||||
fnNameLower.includes("edit") ||
|
||||
fnNameLower.includes("delete") ||
|
||||
fnNameLower.includes("remove") ||
|
||||
fnNameLower.includes("create") ||
|
||||
fnNameLower.includes("add") ||
|
||||
fnNameLower.includes("save");
|
||||
|
||||
if (isModifyFunction && routePath) {
|
||||
return {
|
||||
type: "navigate-and-execute",
|
||||
path: routePath,
|
||||
pageName,
|
||||
functionCall: primaryCall,
|
||||
};
|
||||
}
|
||||
|
||||
// 3) 其他未匹配的函数，如果有路由则跳转，否则执行
|
||||
if (routePath) {
|
||||
return {
|
||||
type: "navigate-and-execute",
|
||||
path: routePath,
|
||||
pageName,
|
||||
functionCall: primaryCall,
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
type: "execute",
|
||||
functionName,
|
||||
functionCall: primaryCall,
|
||||
};
|
||||
}
|
||||
|
||||
// 4) 无函数调用，仅跳转
|
||||
if (routePath) {
|
||||
return {
|
||||
type: "navigate",
|
||||
path: routePath,
|
||||
pageName,
|
||||
query: keyword || undefined,
|
||||
};
|
||||
}
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
// 定时器引用（用于清理）
|
||||
let navigationTimer: ReturnType<typeof setTimeout> | null = null;
|
||||
let executeTimer: ReturnType<typeof setTimeout> | null = null;
|
||||
|
||||
// 执行操作
|
||||
const executeAction = async (action: AiAction) => {
|
||||
// 🎯 新增：跳转并执行操作
|
||||
if (action.type === "navigate-and-execute") {
|
||||
ElMessage.success(`正在跳转到 ${action.pageName} 并执行操作...`);
|
||||
|
||||
// 清理之前的定时器
|
||||
if (navigationTimer) {
|
||||
clearTimeout(navigationTimer);
|
||||
}
|
||||
|
||||
// 跳转并传递待执行的操作信息
|
||||
navigationTimer = setTimeout(() => {
|
||||
navigationTimer = null;
|
||||
const queryParams: any = {
|
||||
// 通过 URL 参数传递 AI 操作信息
|
||||
aiAction: encodeURIComponent(
|
||||
JSON.stringify({
|
||||
functionName: action.functionCall.name,
|
||||
arguments: action.functionCall.arguments,
|
||||
timestamp: Date.now(),
|
||||
})
|
||||
),
|
||||
};
|
||||
|
||||
// 如果有查询关键字，也一并传递
|
||||
if (action.query) {
|
||||
queryParams.keywords = action.query;
|
||||
queryParams.autoSearch = "true";
|
||||
}
|
||||
|
||||
router.push({
|
||||
path: action.path,
|
||||
query: queryParams,
|
||||
});
|
||||
|
||||
// 关闭对话框
|
||||
handleClose();
|
||||
}, 800);
|
||||
return;
|
||||
}
|
||||
|
||||
if (action.type === "navigate") {
|
||||
// 检查是否已经在目标页面
|
||||
const currentPath = router.currentRoute.value.path;
|
||||
|
||||
if (currentPath === action.path) {
|
||||
// 如果已经在目标页面
|
||||
if (action.query) {
|
||||
// 有查询关键字，直接在当前页面执行搜索
|
||||
ElMessage.info(`您已在 ${action.pageName} 页面，为您执行搜索：${action.query}`);
|
||||
|
||||
// 触发路由更新，让页面执行搜索
|
||||
router.replace({
|
||||
path: action.path,
|
||||
query: {
|
||||
keywords: action.query,
|
||||
autoSearch: "true",
|
||||
_t: Date.now().toString(), // 添加时间戳强制刷新
|
||||
},
|
||||
});
|
||||
} else {
|
||||
// 没有查询关键字，只是跳转，给出提示
|
||||
ElMessage.warning(`您已经在 ${action.pageName} 页面了`);
|
||||
}
|
||||
|
||||
// 关闭对话框
|
||||
handleClose();
|
||||
return;
|
||||
}
|
||||
|
||||
// 不在目标页面，正常跳转
|
||||
ElMessage.success(`正在跳转到 ${action.pageName}...`);
|
||||
|
||||
// 清理之前的定时器
|
||||
if (navigationTimer) {
|
||||
clearTimeout(navigationTimer);
|
||||
}
|
||||
|
||||
// 延迟一下让用户看到提示
|
||||
navigationTimer = setTimeout(() => {
|
||||
navigationTimer = null;
|
||||
// 跳转并传递查询参数
|
||||
router.push({
|
||||
path: action.path,
|
||||
query: action.query
|
||||
? {
|
||||
keywords: action.query, // 传递关键字参数
|
||||
autoSearch: "true", // 标记自动搜索
|
||||
}
|
||||
: undefined,
|
||||
});
|
||||
|
||||
// 关闭对话框
|
||||
handleClose();
|
||||
}, 1000);
|
||||
} else if (action.type === "execute") {
|
||||
// 执行函数调用
|
||||
ElMessage.info("功能开发中，请前往 AI 命令助手页面体验完整功能");
|
||||
|
||||
// 清理之前的定时器
|
||||
if (executeTimer) {
|
||||
clearTimeout(executeTimer);
|
||||
}
|
||||
|
||||
// 可以跳转到完整的 AI 命令页面
|
||||
executeTimer = setTimeout(() => {
|
||||
executeTimer = null;
|
||||
router.push("/function/ai-command");
|
||||
handleClose();
|
||||
}, 1000);
|
||||
}
|
||||
};
|
||||
|
||||
// 组件卸载时清理定时器
|
||||
onMounted(() => {
|
||||
updateFabPosition();
|
||||
window.addEventListener("resize", updateFabPosition);
|
||||
|
||||
domObserver = new MutationObserver(() => {
|
||||
scheduleUpdateFabPosition();
|
||||
});
|
||||
domObserver.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
attributes: true,
|
||||
attributeFilter: ["class", "style"],
|
||||
});
|
||||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener("resize", updateFabPosition);
|
||||
if (domObserver) {
|
||||
domObserver.disconnect();
|
||||
domObserver = null;
|
||||
}
|
||||
if (rafId != null) {
|
||||
window.cancelAnimationFrame(rafId);
|
||||
rafId = null;
|
||||
}
|
||||
|
||||
if (navigationTimer) {
|
||||
clearTimeout(navigationTimer);
|
||||
navigationTimer = null;
|
||||
}
|
||||
if (executeTimer) {
|
||||
clearTimeout(executeTimer);
|
||||
executeTimer = null;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.ai-assistant {
|
||||
.ai-fab-button {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
box-shadow: 0 4px 12px rgba(2, 119, 252, 0.4);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 6px 20px rgba(2, 119, 252, 0.6);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.ai-icon {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.ai-fab-tab {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
background: var(--el-color-primary);
|
||||
border-radius: 999px;
|
||||
box-shadow: 0 4px 12px rgba(2, 119, 252, 0.35);
|
||||
}
|
||||
}
|
||||
|
||||
.ai-assistant-dialog {
|
||||
.dialog-header {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
|
||||
.header-icon {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.command-input {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.quick-commands {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 8px;
|
||||
font-size: 14px;
|
||||
color: var(--el-text-color-secondary);
|
||||
}
|
||||
|
||||
.command-tag {
|
||||
margin-right: 8px;
|
||||
margin-bottom: 8px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-response {
|
||||
margin-top: 16px;
|
||||
|
||||
.action-preview {
|
||||
padding: 12px;
|
||||
margin-top: 12px;
|
||||
background-color: var(--el-fill-color-light);
|
||||
border-radius: 8px;
|
||||
|
||||
.action-title {
|
||||
margin-bottom: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
.action-content {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
color: var(--el-text-color-regular);
|
||||
|
||||
.el-icon {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.query-info {
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,269 +0,0 @@
|
||||
import { useRoute } from "vue-router";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { onMounted, onBeforeUnmount, nextTick } from "vue";
|
||||
import AiCommandApi from "@/api/ai";
|
||||
|
||||
/**
|
||||
* AI 操作处理器（简化版）
|
||||
*
|
||||
* 可以是简单函数，也可以是配置对象
|
||||
*/
|
||||
export type AiActionHandler<T = any> =
|
||||
| ((args: T) => Promise<void> | void)
|
||||
| {
|
||||
/** 执行函数 */
|
||||
execute: (args: T) => Promise<void> | void;
|
||||
/** 是否需要确认（默认 true） */
|
||||
needConfirm?: boolean;
|
||||
/** 确认消息（支持函数或字符串） */
|
||||
confirmMessage?: string | ((args: T) => string);
|
||||
/** 成功消息（支持函数或字符串） */
|
||||
successMessage?: string | ((args: T) => string);
|
||||
/** 是否调用后端 API（默认 false，如果为 true 则自动调用 executeCommand） */
|
||||
callBackendApi?: boolean;
|
||||
};
|
||||
|
||||
/**
|
||||
* AI 操作配置
|
||||
*/
|
||||
export interface UseAiActionOptions {
|
||||
/** 操作映射表：函数名 -> 处理器 */
|
||||
actionHandlers?: Record<string, AiActionHandler>;
|
||||
/** 数据刷新函数（操作完成后调用） */
|
||||
onRefresh?: () => Promise<void> | void;
|
||||
/** 自动搜索处理函数 */
|
||||
onAutoSearch?: (keywords: string) => void;
|
||||
/** 当前路由路径（用于执行命令时传递） */
|
||||
currentRoute?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* AI 操作 Composable
|
||||
*
|
||||
* 统一处理 AI 助手传递的操作，支持：
|
||||
* - 自动搜索（通过 keywords + autoSearch 参数）
|
||||
* - 执行 AI 操作（通过 aiAction 参数）
|
||||
* - 配置化的操作处理器
|
||||
*/
|
||||
export function useAiAction(options: UseAiActionOptions = {}) {
|
||||
const route = useRoute();
|
||||
const { actionHandlers = {}, onRefresh, onAutoSearch, currentRoute = route.path } = options;
|
||||
|
||||
// 用于跟踪是否已卸载，防止在卸载后执行回调
|
||||
let isUnmounted = false;
|
||||
|
||||
/**
|
||||
* 执行 AI 操作（统一处理确认、执行、反馈流程）
|
||||
*/
|
||||
async function executeAiAction(action: any) {
|
||||
if (isUnmounted) return;
|
||||
|
||||
// 兼容两种入参：{ functionName, arguments } 或 { functionCall: { name, arguments } }
|
||||
const fnCall = action.functionCall ?? {
|
||||
name: action.functionName,
|
||||
arguments: action.arguments,
|
||||
};
|
||||
|
||||
if (!fnCall?.name) {
|
||||
ElMessage.warning("未识别的 AI 操作");
|
||||
return;
|
||||
}
|
||||
|
||||
// 查找对应的处理器
|
||||
const handler = actionHandlers[fnCall.name];
|
||||
if (!handler) {
|
||||
ElMessage.warning(`暂不支持操作: ${fnCall.name}`);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
// 判断处理器类型（函数 or 配置对象）
|
||||
const isSimpleFunction = typeof handler === "function";
|
||||
|
||||
if (isSimpleFunction) {
|
||||
// 简单函数形式：直接执行
|
||||
await handler(fnCall.arguments);
|
||||
} else {
|
||||
// 配置对象形式：统一处理确认、执行、反馈
|
||||
const config = handler;
|
||||
|
||||
// 1. 确认阶段（默认需要确认）
|
||||
if (config.needConfirm !== false) {
|
||||
const confirmMsg =
|
||||
typeof config.confirmMessage === "function"
|
||||
? config.confirmMessage(fnCall.arguments)
|
||||
: config.confirmMessage || "确认执行此操作吗？";
|
||||
|
||||
await ElMessageBox.confirm(confirmMsg, "AI 助手操作确认", {
|
||||
confirmButtonText: "确认执行",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
dangerouslyUseHTMLString: true,
|
||||
});
|
||||
}
|
||||
|
||||
// 2. 执行阶段
|
||||
if (config.callBackendApi) {
|
||||
// 自动调用后端 API
|
||||
await AiCommandApi.executeCommand({
|
||||
originalCommand: action.originalCommand || "",
|
||||
confirmMode: "manual",
|
||||
userConfirmed: true,
|
||||
currentRoute,
|
||||
functionCall: {
|
||||
name: fnCall.name,
|
||||
arguments: fnCall.arguments,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
// 执行自定义函数
|
||||
await config.execute(fnCall.arguments);
|
||||
}
|
||||
|
||||
// 3. 成功反馈
|
||||
const successMsg =
|
||||
typeof config.successMessage === "function"
|
||||
? config.successMessage(fnCall.arguments)
|
||||
: config.successMessage || "操作执行成功";
|
||||
ElMessage.success(successMsg);
|
||||
}
|
||||
|
||||
// 4. 刷新数据
|
||||
if (onRefresh) {
|
||||
await onRefresh();
|
||||
}
|
||||
} catch (error: any) {
|
||||
// 处理取消操作
|
||||
if (error === "cancel") {
|
||||
ElMessage.info("已取消操作");
|
||||
return;
|
||||
}
|
||||
|
||||
console.error("AI 操作执行失败:", error);
|
||||
ElMessage.error(error.message || "操作执行失败");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 执行后端命令（通用方法）
|
||||
*/
|
||||
async function executeCommand(
|
||||
functionName: string,
|
||||
args: any,
|
||||
options: {
|
||||
originalCommand?: string;
|
||||
confirmMode?: "auto" | "manual";
|
||||
needConfirm?: boolean;
|
||||
confirmMessage?: string;
|
||||
} = {}
|
||||
) {
|
||||
const {
|
||||
originalCommand = "",
|
||||
confirmMode = "manual",
|
||||
needConfirm = false,
|
||||
confirmMessage,
|
||||
} = options;
|
||||
|
||||
// 如果需要确认，先显示确认对话框
|
||||
if (needConfirm && confirmMessage) {
|
||||
try {
|
||||
await ElMessageBox.confirm(confirmMessage, "AI 助手操作确认", {
|
||||
confirmButtonText: "确认执行",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
dangerouslyUseHTMLString: true,
|
||||
});
|
||||
} catch {
|
||||
ElMessage.info("已取消操作");
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
await AiCommandApi.executeCommand({
|
||||
originalCommand,
|
||||
confirmMode,
|
||||
userConfirmed: true,
|
||||
currentRoute,
|
||||
functionCall: {
|
||||
name: functionName,
|
||||
arguments: args,
|
||||
},
|
||||
});
|
||||
|
||||
ElMessage.success("操作执行成功");
|
||||
} catch (error: any) {
|
||||
if (error !== "cancel") {
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理自动搜索
|
||||
*/
|
||||
function handleAutoSearch(keywords: string) {
|
||||
if (onAutoSearch) {
|
||||
onAutoSearch(keywords);
|
||||
} else {
|
||||
ElMessage.info(`AI 助手已为您自动搜索：${keywords}`);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 初始化：处理 URL 参数中的 AI 操作
|
||||
*
|
||||
* 注意：此方法只处理 AI 相关参数，不负责页面数据的初始加载
|
||||
* 页面数据加载应由组件的 onMounted 钩子自行处理
|
||||
*/
|
||||
async function init() {
|
||||
if (isUnmounted) return;
|
||||
|
||||
// 检查是否有 AI 助手传递的参数
|
||||
const keywords = route.query.keywords as string;
|
||||
const autoSearch = route.query.autoSearch as string;
|
||||
const aiActionParam = route.query.aiAction as string;
|
||||
|
||||
// 如果没有任何 AI 参数，直接返回
|
||||
if (!keywords && !autoSearch && !aiActionParam) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 在 nextTick 中执行，确保页面数据已加载
|
||||
nextTick(async () => {
|
||||
if (isUnmounted) return;
|
||||
|
||||
// 1. 处理自动搜索
|
||||
if (autoSearch === "true" && keywords) {
|
||||
handleAutoSearch(keywords);
|
||||
}
|
||||
|
||||
// 2. 处理 AI 操作
|
||||
if (aiActionParam) {
|
||||
try {
|
||||
const aiAction = JSON.parse(decodeURIComponent(aiActionParam));
|
||||
await executeAiAction(aiAction);
|
||||
} catch (error) {
|
||||
console.error("解析 AI 操作失败:", error);
|
||||
ElMessage.error("AI 操作参数解析失败");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 组件挂载时自动初始化
|
||||
onMounted(() => {
|
||||
init();
|
||||
});
|
||||
|
||||
// 组件卸载时清理
|
||||
onBeforeUnmount(() => {
|
||||
isUnmounted = true;
|
||||
});
|
||||
|
||||
return {
|
||||
executeAiAction,
|
||||
executeCommand,
|
||||
handleAutoSearch,
|
||||
};
|
||||
}
|
||||
@@ -3,9 +3,5 @@ export { setupWebSocket, cleanupWebSocket } from "./websocket";
|
||||
export { useStomp, useDictSync, useOnlineCount } from "./websocket";
|
||||
export type { DictMessage, DictChangeMessage, DictChangeCallback } from "./websocket";
|
||||
|
||||
// AI 相关
|
||||
export { useAiAction } from "./ai/useAiAction";
|
||||
export type { UseAiActionOptions, AiActionHandler } from "./ai/useAiAction";
|
||||
|
||||
// 表格相关
|
||||
export { useTableSelection } from "./table/useTableSelection";
|
||||
|
||||
@@ -51,7 +51,6 @@ export const STORAGE_KEYS = {
|
||||
SHOW_APP_LOGO: `${APP_PREFIX}:ui:show_app_logo`,
|
||||
SHOW_WATERMARK: `${APP_PREFIX}:ui:show_watermark`,
|
||||
PAGE_SWITCHING_ANIMATION: `${APP_PREFIX}:ui:page_switching_animation`,
|
||||
ENABLE_AI_ASSISTANT: `${APP_PREFIX}:ui:enable_ai_assistant`,
|
||||
LAYOUT: `${APP_PREFIX}:ui:layout`,
|
||||
SIDEBAR_COLOR_SCHEME: `${APP_PREFIX}:ui:sidebar_color_scheme`,
|
||||
THEME: `${APP_PREFIX}:ui:theme`,
|
||||
|
||||
@@ -71,11 +71,6 @@
|
||||
<el-switch v-model="settingsStore.colorWeak" />
|
||||
</div>
|
||||
|
||||
<div class="config-item flex-x-between">
|
||||
<span class="text-xs">AI 助手</span>
|
||||
<el-switch v-model="settingsStore.userEnableAi" />
|
||||
</div>
|
||||
|
||||
<div v-if="!isDark" class="config-item flex-x-between">
|
||||
<span class="text-xs">{{ t("settings.sidebarColorScheme") }}</span>
|
||||
<el-radio-group v-model="sidebarColor" @change="changeSidebarColor">
|
||||
|
||||
@@ -30,10 +30,6 @@ export const useSettingsStore = defineStore("setting", () => {
|
||||
const grayMode = useStorage(STORAGE_KEYS.GRAY_MODE, false);
|
||||
const colorWeak = useStorage(STORAGE_KEYS.COLOR_WEAK, false);
|
||||
|
||||
// AI 助手：用户级开关（默认开启）
|
||||
const userEnableAi = useStorage(STORAGE_KEYS.ENABLE_AI_ASSISTANT, true);
|
||||
const enableAiAssistant = computed(() => userEnableAi.value);
|
||||
|
||||
// 主题变化监听
|
||||
watch(
|
||||
[theme, themeColor],
|
||||
@@ -71,7 +67,6 @@ export const useSettingsStore = defineStore("setting", () => {
|
||||
showAppLogo.value = defaults.showAppLogo;
|
||||
showWatermark.value = defaults.showWatermark;
|
||||
pageSwitchingAnimation.value = defaults.pageSwitchingAnimation;
|
||||
userEnableAi.value = false;
|
||||
grayMode.value = false;
|
||||
colorWeak.value = false;
|
||||
sidebarColorScheme.value = defaults.sidebarColorScheme;
|
||||
@@ -86,8 +81,6 @@ export const useSettingsStore = defineStore("setting", () => {
|
||||
showAppLogo,
|
||||
showWatermark,
|
||||
pageSwitchingAnimation,
|
||||
enableAiAssistant,
|
||||
userEnableAi,
|
||||
grayMode,
|
||||
colorWeak,
|
||||
sidebarColorScheme,
|
||||
|
||||
@@ -1,151 +0,0 @@
|
||||
/**
|
||||
* AI 模块类型定义
|
||||
*/
|
||||
|
||||
import type { BaseQueryParams } from "./common";
|
||||
|
||||
/** AI命令请求参数 */
|
||||
export interface AiCommandRequest {
|
||||
/** 用户输入的自然语言命令 */
|
||||
command: string;
|
||||
/** 当前页面路由（用于上下文） */
|
||||
currentRoute?: string;
|
||||
/** 当前激活的组件名称 */
|
||||
currentComponent?: string;
|
||||
/** 额外上下文信息 */
|
||||
context?: Record<string, any>;
|
||||
}
|
||||
|
||||
/** 函数调用参数 */
|
||||
export interface FunctionCall {
|
||||
/** 函数名称 */
|
||||
name: string;
|
||||
/** 函数描述 */
|
||||
description?: string;
|
||||
/** 参数对象 */
|
||||
arguments: Record<string, any>;
|
||||
}
|
||||
|
||||
/** AI命令解析响应 */
|
||||
export interface AiCommandResponse {
|
||||
/** 解析日志ID（用于关联执行记录） */
|
||||
parseLogId?: string;
|
||||
/** 是否成功解析 */
|
||||
success: boolean;
|
||||
/** 解析后的函数调用列表 */
|
||||
functionCalls: FunctionCall[];
|
||||
/** AI的理解和说明 */
|
||||
explanation?: string;
|
||||
/** 置信度(0-1) */
|
||||
confidence?: number;
|
||||
/** 错误信息 */
|
||||
error?: string;
|
||||
/** 原始LLM响应（用于调试） */
|
||||
rawResponse?: string;
|
||||
}
|
||||
|
||||
/** AI命令执行请求 */
|
||||
export interface AiExecuteRequest {
|
||||
/** 关联的解析日志ID */
|
||||
parseLogId?: string;
|
||||
/** 原始命令（用于审计） */
|
||||
originalCommand?: string;
|
||||
/** 要执行的函数调用 */
|
||||
functionCall: FunctionCall;
|
||||
/** 确认模式：auto=自动执行, manual=需要用户确认 */
|
||||
confirmMode?: "auto" | "manual";
|
||||
/** 用户确认标志 */
|
||||
userConfirmed?: boolean;
|
||||
/** 幂等性令牌（防止重复执行） */
|
||||
idempotencyKey?: string;
|
||||
/** 当前页面路由 */
|
||||
currentRoute?: string;
|
||||
}
|
||||
|
||||
/** AI命令执行响应 */
|
||||
export interface AiExecuteResponse {
|
||||
/** 是否执行成功 */
|
||||
success: boolean;
|
||||
/** 执行结果数据 */
|
||||
data?: any;
|
||||
/** 执行结果说明 */
|
||||
message?: string;
|
||||
/** 影响的记录数 */
|
||||
affectedRows?: number;
|
||||
/** 错误信息 */
|
||||
error?: string;
|
||||
/** 记录ID（用于追踪） */
|
||||
recordId?: string;
|
||||
/** 需要用户确认 */
|
||||
requiresConfirmation?: boolean;
|
||||
/** 确认提示信息 */
|
||||
confirmationPrompt?: string;
|
||||
}
|
||||
|
||||
/** AI命令记录分页查询参数 */
|
||||
export interface AiAssistantRecordQueryParams extends BaseQueryParams {
|
||||
/** 搜索关键字 */
|
||||
keywords?: string;
|
||||
/** 执行状态 */
|
||||
status?: string;
|
||||
/** 执行状态(0:待执行;1:成功;-1:失败) */
|
||||
executeStatus?: number;
|
||||
/** 解析状态 */
|
||||
parseStatus?: number;
|
||||
/** 用户ID */
|
||||
userId?: number;
|
||||
/** AI提供商 */
|
||||
aiProvider?: string;
|
||||
/** AI模型 */
|
||||
aiModel?: string;
|
||||
/** 函数名称 */
|
||||
functionName?: string;
|
||||
/** 创建时间 */
|
||||
createTime?: [string, string];
|
||||
}
|
||||
|
||||
/** AI命令记录视图对象 */
|
||||
export interface AiAssistantRecordItem {
|
||||
/** 记录ID */
|
||||
id: string;
|
||||
/** 用户ID */
|
||||
userId: number;
|
||||
/** 用户名 */
|
||||
username: string;
|
||||
/** 原始命令 */
|
||||
originalCommand: string;
|
||||
/** AI提供商 */
|
||||
aiProvider?: string;
|
||||
/** AI模型 */
|
||||
aiModel?: string;
|
||||
/** 解析状态 */
|
||||
parseStatus?: number;
|
||||
/** 函数调用列表 */
|
||||
functionCalls?: string;
|
||||
/** 解析说明 */
|
||||
explanation?: string;
|
||||
/** 置信度 */
|
||||
confidence?: number;
|
||||
/** 解析错误信息 */
|
||||
parseErrorMessage?: string;
|
||||
/** 输入Token数 */
|
||||
inputTokens?: number;
|
||||
/** 输出Token数 */
|
||||
outputTokens?: number;
|
||||
/** 解析耗时(毫秒) */
|
||||
parseDurationMs?: number;
|
||||
/** 函数名称 */
|
||||
functionName?: string;
|
||||
/** 函数参数 */
|
||||
functionArguments?: string;
|
||||
/** 执行状态 */
|
||||
executeStatus?: number;
|
||||
/** 执行错误信息 */
|
||||
executeErrorMessage?: string;
|
||||
/** IP地址 */
|
||||
ipAddress?: string;
|
||||
/** 创建时间 */
|
||||
createTime?: string;
|
||||
/** 更新时间 */
|
||||
updateTime?: string;
|
||||
}
|
||||
@@ -19,6 +19,5 @@ export * from "./tenant";
|
||||
export * from "./tenant-plan";
|
||||
|
||||
// 其他模块
|
||||
export * from "./ai";
|
||||
export * from "./file";
|
||||
export * from "./codegen";
|
||||
|
||||
3
src/types/components.d.ts
vendored
3
src/types/components.d.ts
vendored
@@ -6,12 +6,11 @@
|
||||
// Generated by unplugin-vue-components
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
|
||||
export {}
|
||||
export {};
|
||||
|
||||
/* prettier-ignore */
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
AiAssistant: typeof import('./../components/AiAssistant/index.vue')['default']
|
||||
AppLink: typeof import('./../components/AppLink/index.vue')['default']
|
||||
Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
|
||||
CommandPalette: typeof import('./../components/CommandPalette/index.vue')['default']
|
||||
|
||||
@@ -18,5 +18,4 @@ export interface AppSettings {
|
||||
showWatermark: boolean;
|
||||
watermarkContent: string;
|
||||
sidebarColorScheme: "classic-blue" | "minimal-white";
|
||||
enableAiAssistant: boolean;
|
||||
}
|
||||
|
||||
@@ -1,374 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 搜索区域 -->
|
||||
<div class="filter-section">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item prop="keywords" label="关键字">
|
||||
<el-input
|
||||
v-model="queryParams.keywords"
|
||||
placeholder="原始命令/函数名称/用户名"
|
||||
clearable
|
||||
style="width: 220px"
|
||||
@keyup.enter="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="aiProvider" label="AI提供方">
|
||||
<el-select
|
||||
v-model="queryParams.aiProvider"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 140px"
|
||||
>
|
||||
<el-option label="通义千问" value="qwen" />
|
||||
<el-option label="OpenAI" value="openai" />
|
||||
<el-option label="DeepSeek" value="deepseek" />
|
||||
<el-option label="Gemini" value="gemini" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="aiModel" label="AI模型">
|
||||
<el-input
|
||||
v-model="queryParams.aiModel"
|
||||
placeholder="如: qwen-plus"
|
||||
clearable
|
||||
style="width: 160px"
|
||||
@keyup.enter="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="parseStatus" label="解析状态">
|
||||
<el-select
|
||||
v-model="queryParams.parseStatus"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 140px"
|
||||
>
|
||||
<el-option label="成功" :value="1" />
|
||||
<el-option label="失败" :value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="executeStatus" label="执行状态">
|
||||
<el-select
|
||||
v-model="queryParams.executeStatus"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 140px"
|
||||
>
|
||||
<el-option label="待执行" :value="0" />
|
||||
<el-option label="成功" :value="1" />
|
||||
<el-option label="失败" :value="-1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="createTime" label="创建时间">
|
||||
<el-date-picker
|
||||
v-model="queryParams.createTime"
|
||||
:editable="false"
|
||||
type="daterange"
|
||||
range-separator="~"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="截止时间"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 260px"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="search-buttons">
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="handleResetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<!-- 数据表格 -->
|
||||
<el-card shadow="hover" class="table-section">
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="pageData"
|
||||
highlight-current-row
|
||||
border
|
||||
class="table-section__content"
|
||||
>
|
||||
<el-table-column label="创建时间" prop="createTime" width="180" />
|
||||
<el-table-column label="用户名" prop="username" width="120" />
|
||||
<el-table-column
|
||||
label="原始命令"
|
||||
prop="originalCommand"
|
||||
min-width="220"
|
||||
show-overflow-tooltip
|
||||
/>
|
||||
<el-table-column
|
||||
label="函数名称"
|
||||
prop="functionName"
|
||||
min-width="160"
|
||||
show-overflow-tooltip
|
||||
/>
|
||||
<el-table-column label="AI提供方" prop="aiProvider" width="120" />
|
||||
<el-table-column label="AI模型" prop="aiModel" width="160" show-overflow-tooltip />
|
||||
<el-table-column label="解析状态" width="110" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.parseStatus === 1 ? 'success' : 'danger'" size="small">
|
||||
{{ row.parseStatus === 1 ? "成功" : "失败" }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="执行状态" width="110" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag
|
||||
v-if="row.executeStatus !== null && row.executeStatus !== undefined"
|
||||
:type="getExecuteStatusTagType(row.executeStatus)"
|
||||
size="small"
|
||||
>
|
||||
{{ getExecuteStatusText(row.executeStatus) }}
|
||||
</el-tag>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="置信度" prop="confidence" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.confidence !== undefined && row.confidence !== null">
|
||||
{{ (row.confidence * 100).toFixed(0) }}%
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="解析耗时(ms)" prop="parseDurationMs" width="120" align="center" />
|
||||
<el-table-column label="IP地址" prop="ipAddress" width="140" />
|
||||
<el-table-column label="操作" width="100" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" link size="small" @click="handleViewDetail(row)">
|
||||
详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-if="total > 0"
|
||||
v-model:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- 详情对话框 -->
|
||||
<el-dialog v-model="detailDialogVisible" title="AI 命令记录详情" width="880px" append-to-body>
|
||||
<el-descriptions v-if="currentRow" :column="2" border>
|
||||
<el-descriptions-item label="记录ID">
|
||||
{{ currentRow.id }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="用户名">
|
||||
{{ currentRow.username }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="AI提供方">
|
||||
{{ currentRow.aiProvider || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="AI模型">
|
||||
{{ currentRow.aiModel || "-" }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="解析状态">
|
||||
<el-tag :type="currentRow.parseStatus === 1 ? 'success' : 'danger'" size="small">
|
||||
{{ currentRow.parseStatus === 1 ? "成功" : "失败" }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="置信度">
|
||||
<span v-if="currentRow.confidence !== undefined && currentRow.confidence !== null">
|
||||
{{ (currentRow.confidence * 100).toFixed(0) }}%
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="解析耗时">
|
||||
{{ formatNumber(currentRow.parseDurationMs) }} ms
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="Token统计">
|
||||
输入 {{ currentRow.inputTokens || 0 }} / 输出 {{ currentRow.outputTokens || 0 }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="原始命令" :span="2">
|
||||
<el-input :model-value="currentRow.originalCommand" type="textarea" :rows="2" readonly />
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-if="currentRow.explanation" label="AI说明" :span="2">
|
||||
{{ currentRow.explanation }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-if="currentRow.functionCalls" label="函数调用" :span="2">
|
||||
<el-input
|
||||
:model-value="formatJson(currentRow.functionCalls)"
|
||||
type="textarea"
|
||||
:rows="6"
|
||||
readonly
|
||||
/>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-if="currentRow.parseErrorMessage" label="解析错误" :span="2">
|
||||
<el-alert :title="currentRow.parseErrorMessage" type="error" :closable="false" />
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="函数名称">
|
||||
{{ currentRow.functionName || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="执行状态">
|
||||
<el-tag
|
||||
v-if="currentRow.executeStatus !== null && currentRow.executeStatus !== undefined"
|
||||
:type="getExecuteStatusTagType(currentRow.executeStatus)"
|
||||
size="small"
|
||||
>
|
||||
{{ getExecuteStatusText(currentRow.executeStatus) }}
|
||||
</el-tag>
|
||||
<span v-else>-</span>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-if="currentRow.functionArguments" label="执行参数" :span="2">
|
||||
<el-input
|
||||
:model-value="formatJson(currentRow.functionArguments)"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
readonly
|
||||
/>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item v-if="currentRow.executeErrorMessage" label="执行错误" :span="2">
|
||||
<el-alert :title="currentRow.executeErrorMessage" type="error" :closable="false" />
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="IP地址">
|
||||
{{ currentRow.ipAddress || "-" }}
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="创建时间">
|
||||
{{ currentRow.createTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="更新时间">
|
||||
{{ currentRow.updateTime || "-" }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<template #footer>
|
||||
<el-button @click="detailDialogVisible = false">关闭</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
defineOptions({
|
||||
name: "AiAssistantRecord",
|
||||
inheritAttrs: false,
|
||||
});
|
||||
|
||||
import AiCommandApi from "@/api/ai";
|
||||
import type { AiAssistantRecordItem, AiAssistantRecordQueryParams } from "@/types/api";
|
||||
import { onMounted, reactive, ref } from "vue";
|
||||
|
||||
const queryFormRef = ref();
|
||||
|
||||
const loading = ref(false);
|
||||
const total = ref(0);
|
||||
|
||||
const queryParams = reactive<AiAssistantRecordQueryParams>({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
keywords: "",
|
||||
aiProvider: "",
|
||||
aiModel: "",
|
||||
parseStatus: undefined,
|
||||
executeStatus: undefined,
|
||||
createTime: ["", ""],
|
||||
});
|
||||
|
||||
const pageData = ref<AiAssistantRecordItem[]>([]);
|
||||
|
||||
const detailDialogVisible = ref(false);
|
||||
const currentRow = ref<AiAssistantRecordItem>();
|
||||
|
||||
function getExecuteStatusText(status: number): string {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return "待执行";
|
||||
case 1:
|
||||
return "成功";
|
||||
case -1:
|
||||
return "失败";
|
||||
default:
|
||||
return "-";
|
||||
}
|
||||
}
|
||||
|
||||
function getExecuteStatusTagType(status: number): "info" | "success" | "danger" {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return "info";
|
||||
case 1:
|
||||
return "success";
|
||||
case -1:
|
||||
return "danger";
|
||||
default:
|
||||
return "info";
|
||||
}
|
||||
}
|
||||
|
||||
function fetchData() {
|
||||
loading.value = true;
|
||||
AiCommandApi.getPage(queryParams)
|
||||
.then((res) => {
|
||||
pageData.value = res.data || [];
|
||||
total.value = res.page?.total ?? 0;
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
function handleQuery() {
|
||||
queryParams.pageNum = 1;
|
||||
fetchData();
|
||||
}
|
||||
|
||||
function handleResetQuery() {
|
||||
queryFormRef.value?.resetFields();
|
||||
queryParams.pageNum = 1;
|
||||
fetchData();
|
||||
}
|
||||
|
||||
function handleViewDetail(row: AiAssistantRecordItem) {
|
||||
currentRow.value = row;
|
||||
detailDialogVisible.value = true;
|
||||
}
|
||||
|
||||
function formatJson(jsonStr?: string) {
|
||||
if (!jsonStr) return "-";
|
||||
try {
|
||||
return JSON.stringify(JSON.parse(jsonStr), null, 2);
|
||||
} catch {
|
||||
return jsonStr;
|
||||
}
|
||||
}
|
||||
|
||||
function formatNumber(value?: number | string | null) {
|
||||
if (value === undefined || value === null || value === "") {
|
||||
return "-";
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.filter-section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.search-buttons {
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -270,7 +270,7 @@ import { useUserStore, useAppStore } from "@/store";
|
||||
import { DeviceEnum, DialogMode, CommonStatus } from "@/enums";
|
||||
|
||||
// ==================== 7. Composables ====================
|
||||
import { useAiAction, useTableSelection } from "@/composables";
|
||||
import { useTableSelection } from "@/composables";
|
||||
|
||||
// ==================== 8. 组件 ====================
|
||||
import UserDeptTree from "./components/UserDeptTree.vue";
|
||||
@@ -561,51 +561,6 @@ async function handleExport(): Promise<void> {
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== AI 助手相关 ====================
|
||||
useAiAction({
|
||||
actionHandlers: {
|
||||
/**
|
||||
* AI 修改用户昵称
|
||||
* 使用配置对象方式：自动处理确认、执行、反馈
|
||||
*/
|
||||
updateUserNickname: {
|
||||
needConfirm: true,
|
||||
callBackendApi: true,
|
||||
confirmMessage: (args: any) =>
|
||||
`AI 助手将执行以下操作：<br/>
|
||||
<strong>修改用户：</strong> ${args.username}<br/>
|
||||
<strong>新昵称：</strong> ${args.nickname}<br/><br/>
|
||||
确认执行吗？`,
|
||||
successMessage: (args: any) => `已将用户 ${args.username} 的昵称修改为 ${args.nickname}`,
|
||||
execute: async () => {
|
||||
// callBackendApi=true 时，execute 可以为空
|
||||
// Composable 会自动调用后端 API
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* AI 查询用户
|
||||
* 使用配置对象方式：查询操作不需要确认
|
||||
*/
|
||||
queryUser: {
|
||||
needConfirm: false, // 查询操作无需确认
|
||||
successMessage: (args: any) => `已搜索：${args.keywords}`,
|
||||
execute: async (args: any) => {
|
||||
queryParams.keywords = args.keywords;
|
||||
await handleQuery();
|
||||
},
|
||||
},
|
||||
},
|
||||
onRefresh: fetchUserList,
|
||||
onAutoSearch: (keywords: string) => {
|
||||
queryParams.keywords = keywords;
|
||||
setTimeout(() => {
|
||||
handleQuery();
|
||||
ElMessage.success(`AI 助手已为您自动搜索：${keywords}`);
|
||||
}, 300);
|
||||
},
|
||||
});
|
||||
|
||||
// ==================== 生命周期 ====================
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user