mirror of
https://gitee.com/yudaocode/yudao-ui-admin-vben.git
synced 2025-12-30 10:32:25 +00:00
feat:【antd】【ai】modal 部分的代码优化
This commit is contained in:
@@ -5,6 +5,7 @@ import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
|
||||
import { getDictOptions } from '@vben/hooks';
|
||||
|
||||
import { z } from '#/adapter/form';
|
||||
|
||||
/** 新增/修改的表单 */
|
||||
export function useFormSchema(): VbenFormSchema[] {
|
||||
return [
|
||||
@@ -25,24 +26,33 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
options: getDictOptions(DICT_TYPE.AI_PLATFORM, 'string'),
|
||||
allowClear: true,
|
||||
},
|
||||
rules: z.string().min(1, { message: '请输入平台' }),
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'name',
|
||||
label: '名称',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'apiKey',
|
||||
label: '密钥',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入密钥',
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'url',
|
||||
label: '自定义 API URL',
|
||||
componentProps: {
|
||||
placeholder: '请输入自定义 API URL',
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'status',
|
||||
@@ -65,6 +75,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '名称',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入名称',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'platform',
|
||||
@@ -72,6 +86,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择平台',
|
||||
options: getDictOptions(DICT_TYPE.AI_PLATFORM, 'string'),
|
||||
},
|
||||
},
|
||||
@@ -81,6 +96,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择状态',
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
|
||||
},
|
||||
},
|
||||
@@ -97,18 +113,22 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
name: 'CellDict',
|
||||
props: { type: DICT_TYPE.AI_PLATFORM },
|
||||
},
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
title: '名称',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
field: 'apiKey',
|
||||
title: '密钥',
|
||||
minWidth: 140,
|
||||
},
|
||||
{
|
||||
field: 'url',
|
||||
title: '自定义 API URL',
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
@@ -117,6 +137,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
name: 'CellDict',
|
||||
props: { type: DICT_TYPE.COMMON_STATUS },
|
||||
},
|
||||
minWidth: 80,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
|
||||
@@ -41,9 +41,7 @@ async function handleDelete(row: AiModelApiKeyApi.ApiKey) {
|
||||
});
|
||||
try {
|
||||
await deleteApiKey(row.id as number);
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
|
||||
});
|
||||
message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
|
||||
handleRefresh();
|
||||
} finally {
|
||||
hideLoading();
|
||||
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||
},
|
||||
rowConfig: {
|
||||
keyField: 'id',
|
||||
isHover: true,
|
||||
},
|
||||
toolbarConfig: {
|
||||
refresh: true,
|
||||
|
||||
@@ -27,7 +27,7 @@ const [Form, formApi] = useVbenForm({
|
||||
class: 'w-full',
|
||||
},
|
||||
formItemClass: 'col-span-2',
|
||||
labelWidth: 100,
|
||||
labelWidth: 120,
|
||||
},
|
||||
layout: 'horizontal',
|
||||
schema: useFormSchema(),
|
||||
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal class="w-2/5" :title="getTitle">
|
||||
<Modal :title="getTitle" class="w-2/5">
|
||||
<Form class="mx-4" />
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
@@ -8,6 +8,7 @@ import { z } from '#/adapter/form';
|
||||
import { getSimpleKnowledgeList } from '#/api/ai/knowledge/knowledge';
|
||||
import { getModelSimpleList } from '#/api/ai/model/model';
|
||||
import { getToolSimpleList } from '#/api/ai/model/tool';
|
||||
|
||||
/** 新增/修改的表单 */
|
||||
export function useFormSchema(): VbenFormSchema[] {
|
||||
return [
|
||||
@@ -32,6 +33,9 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '角色名称',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入角色名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'ImageUpload',
|
||||
@@ -62,6 +66,9 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'category',
|
||||
label: '角色类别',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入角色类别',
|
||||
},
|
||||
dependencies: {
|
||||
triggerFields: ['formType'],
|
||||
show: (values) => {
|
||||
@@ -113,6 +120,17 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'mcpClientNames',
|
||||
label: '引用 MCP',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
placeholder: '请选择 MCP',
|
||||
options: getDictOptions(DICT_TYPE.AI_MCP_CLIENT_NAME, 'string'),
|
||||
mode: 'multiple',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'publicStatus',
|
||||
label: '是否公开',
|
||||
@@ -254,6 +272,16 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
: `引用${cellValue.length}个`;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'MCP',
|
||||
field: 'mcpClientNames',
|
||||
minWidth: 100,
|
||||
formatter: ({ cellValue }) => {
|
||||
return !cellValue || cellValue.length === 0
|
||||
? '-'
|
||||
: `引用${cellValue.length}个`;
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'publicStatus',
|
||||
title: '是否公开',
|
||||
|
||||
@@ -41,9 +41,7 @@ async function handleDelete(row: AiModelChatRoleApi.ChatRole) {
|
||||
});
|
||||
try {
|
||||
await deleteChatRole(row.id as number);
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
|
||||
});
|
||||
message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
|
||||
handleRefresh();
|
||||
} finally {
|
||||
hideLoading();
|
||||
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||
},
|
||||
rowConfig: {
|
||||
keyField: 'id',
|
||||
isHover: true,
|
||||
},
|
||||
toolbarConfig: {
|
||||
refresh: true,
|
||||
|
||||
@@ -82,7 +82,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal class="w-2/5" :title="getTitle">
|
||||
<Modal :title="getTitle" class="w-2/5">
|
||||
<Form class="mx-4" />
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
@@ -35,7 +35,7 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
options: getDictOptions(DICT_TYPE.AI_PLATFORM, 'string'),
|
||||
allowClear: true,
|
||||
},
|
||||
rules: z.string().min(1, { message: '请输入平台' }),
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
fieldName: 'type',
|
||||
@@ -56,7 +56,7 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
label: 'API 秘钥',
|
||||
component: 'ApiSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择API 秘钥',
|
||||
placeholder: '请选择 API 秘钥',
|
||||
api: getApiKeySimpleList,
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
@@ -69,12 +69,18 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '模型名字',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入模型名字',
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'model',
|
||||
label: '模型标识',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入模型标识',
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'sort',
|
||||
@@ -161,16 +167,28 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '模型名字',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入模型名字',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'model',
|
||||
label: '模型标识',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入模型标识',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'platform',
|
||||
label: '模型平台',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入模型平台',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
];
|
||||
}
|
||||
@@ -233,7 +251,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
{
|
||||
field: 'temperature',
|
||||
title: '温度参数',
|
||||
minWidth: 80,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '回复数 Token 数',
|
||||
@@ -243,7 +261,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
{
|
||||
title: '上下文数量',
|
||||
field: 'maxContexts',
|
||||
minWidth: 100,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
|
||||
@@ -41,9 +41,7 @@ async function handleDelete(row: AiModelModelApi.Model) {
|
||||
});
|
||||
try {
|
||||
await deleteModel(row.id as number);
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
|
||||
});
|
||||
message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
|
||||
handleRefresh();
|
||||
} finally {
|
||||
hideLoading();
|
||||
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||
},
|
||||
rowConfig: {
|
||||
keyField: 'id',
|
||||
isHover: true,
|
||||
},
|
||||
toolbarConfig: {
|
||||
refresh: true,
|
||||
|
||||
@@ -77,7 +77,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal class="w-2/5" :title="getTitle">
|
||||
<Modal :title="getTitle" class="w-2/5">
|
||||
<Form class="mx-4" />
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
@@ -22,6 +22,9 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '工具名称',
|
||||
rules: 'required',
|
||||
componentProps: {
|
||||
placeholder: '请输入工具名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'Textarea',
|
||||
@@ -52,6 +55,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
fieldName: 'name',
|
||||
label: '工具名称',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入工具名称',
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
fieldName: 'status',
|
||||
@@ -60,6 +67,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
|
||||
placeholder: '请选择状态',
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -80,14 +88,17 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
{
|
||||
field: 'id',
|
||||
title: '工具编号',
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
title: '工具名称',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
field: 'description',
|
||||
title: '工具描述',
|
||||
minWidth: 140,
|
||||
},
|
||||
{
|
||||
field: 'status',
|
||||
@@ -96,6 +107,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
|
||||
name: 'CellDict',
|
||||
props: { type: DICT_TYPE.COMMON_STATUS },
|
||||
},
|
||||
minWidth: 80,
|
||||
},
|
||||
{
|
||||
field: 'createTime',
|
||||
|
||||
@@ -41,9 +41,7 @@ async function handleDelete(row: AiModelToolApi.Tool) {
|
||||
});
|
||||
try {
|
||||
await deleteTool(row.id as number);
|
||||
message.success({
|
||||
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
|
||||
});
|
||||
message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
|
||||
handleRefresh();
|
||||
} finally {
|
||||
hideLoading();
|
||||
@@ -71,6 +69,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||
},
|
||||
rowConfig: {
|
||||
keyField: 'id',
|
||||
isHover: true,
|
||||
},
|
||||
toolbarConfig: {
|
||||
refresh: true,
|
||||
|
||||
@@ -76,7 +76,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal class="w-2/5" :title="getTitle">
|
||||
<Modal :title="getTitle" class="w-2/5">
|
||||
<Form class="mx-4" />
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
@@ -143,6 +143,7 @@ const AI_DICT = {
|
||||
AI_WRITE_LENGTH: 'ai_write_length', // AI 写作长度
|
||||
AI_WRITE_TONE: 'ai_write_tone', // AI 写作语气
|
||||
AI_WRITE_TYPE: 'ai_write_type', // AI 写作类型
|
||||
AI_MCP_CLIENT_NAME: 'ai_mcp_client_name', // AI MCP Client 名字
|
||||
} as const;
|
||||
|
||||
/** ========== IOT - 物联网模块 ========== */
|
||||
|
||||
Reference in New Issue
Block a user