feat(ai-web): 完成任务模板的CRUD
This commit is contained in:
48
service-web/client/src/pages/ai/task/InputSchema.tsx
Normal file
48
service-web/client/src/pages/ai/task/InputSchema.tsx
Normal file
@@ -0,0 +1,48 @@
|
||||
import type {Schema} from 'amis'
|
||||
|
||||
export const typeMap: Record<string, string> = {
|
||||
text: '文本',
|
||||
number: '数字',
|
||||
files: '文件',
|
||||
}
|
||||
|
||||
export type InputField = {
|
||||
type: string
|
||||
label: string
|
||||
description?: string
|
||||
}
|
||||
|
||||
export const generateInputForm: (inputSchema: Record<string, InputField>) => Schema = inputSchema => {
|
||||
let items: Schema[] = []
|
||||
for (const name of Object.keys(inputSchema)) {
|
||||
let field = inputSchema[name]
|
||||
// @ts-ignore
|
||||
let formItem: Schema = {
|
||||
name: name,
|
||||
...field,
|
||||
}
|
||||
switch (field.type) {
|
||||
case 'text':
|
||||
formItem = {
|
||||
...formItem,
|
||||
type: 'input-text',
|
||||
clearValueOnEmpty: true,
|
||||
}
|
||||
break
|
||||
case 'number':
|
||||
formItem.type = 'input-number'
|
||||
break
|
||||
case 'files':
|
||||
formItem.type = 'input-file'
|
||||
break
|
||||
}
|
||||
items.push(formItem)
|
||||
}
|
||||
return {
|
||||
type: 'form',
|
||||
title: '入参表单预览',
|
||||
canAccessSuperData: false,
|
||||
actions: [],
|
||||
body: items,
|
||||
}
|
||||
}
|
||||
@@ -1,8 +1,9 @@
|
||||
import {isEmpty, isEqual} from 'licia'
|
||||
import React from 'react'
|
||||
import {useParams} from 'react-router'
|
||||
import styled from 'styled-components'
|
||||
import {amisRender, commonInfo, horizontalFormOptions} from '../../../../util/amis.tsx'
|
||||
import {isEqual} from 'licia'
|
||||
import {generateInputForm, typeMap} from '../InputSchema.tsx'
|
||||
import { useParams } from 'react-router'
|
||||
|
||||
const TemplateEditDiv = styled.div`
|
||||
.antd-EditorControl {
|
||||
@@ -13,7 +14,6 @@ const TemplateEditDiv = styled.div`
|
||||
const FlowTaskTemplateEdit: React.FC = () => {
|
||||
const {template_id} = useParams()
|
||||
const preloadTemplateId = isEqual(template_id, '-1') ? undefined : template_id
|
||||
console.log('preloadTemplateId', preloadTemplateId)
|
||||
return (
|
||||
<TemplateEditDiv className="task-template-edit h-full">
|
||||
{amisRender({
|
||||
@@ -26,62 +26,130 @@ const FlowTaskTemplateEdit: React.FC = () => {
|
||||
method: 'POST',
|
||||
url: `${commonInfo.baseAiUrl}/flow_task/template/save`,
|
||||
data: {
|
||||
name: '${template.name}',
|
||||
description: '${template.description}',
|
||||
inputSchema: '${template.inputSchema}',
|
||||
flow: '${template.flow}',
|
||||
}
|
||||
id: '${id|default:undefined}',
|
||||
name: '${name}',
|
||||
description: '${description}',
|
||||
inputSchema: '${inputSchema|default:undefined}',
|
||||
},
|
||||
},
|
||||
initApi: preloadTemplateId
|
||||
? {
|
||||
method: 'GET',
|
||||
url: `${commonInfo.baseAiUrl}/flow_task/template/detail/${preloadTemplateId}`,
|
||||
// @ts-ignore
|
||||
adaptor: (payload, response, api, context) => {
|
||||
return {
|
||||
...payload,
|
||||
data: {
|
||||
template: payload.data,
|
||||
},
|
||||
}
|
||||
},
|
||||
}
|
||||
: undefined,
|
||||
wrapWithPanel: false,
|
||||
...horizontalFormOptions(),
|
||||
onEvent: {
|
||||
change: {
|
||||
actions: [
|
||||
{
|
||||
actionType: 'validate',
|
||||
},
|
||||
{
|
||||
actionType: 'custom',
|
||||
// @ts-ignore
|
||||
script: (context, doAction, event) => {
|
||||
let data = event?.data ?? {}
|
||||
let inputSchema = data.inputSchema ?? []
|
||||
if (!isEmpty(inputSchema) && isEmpty(data?.validateResult?.error ?? undefined)) {
|
||||
doAction({
|
||||
actionType: 'setValue',
|
||||
args: {
|
||||
value: {
|
||||
inputPreview: generateInputForm(inputSchema),
|
||||
},
|
||||
},
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
body: [
|
||||
{
|
||||
type: 'hidden',
|
||||
name: 'id',
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'template.name',
|
||||
name: 'name',
|
||||
label: '名称',
|
||||
required: true,
|
||||
clearable: true,
|
||||
},
|
||||
{
|
||||
type: 'textarea',
|
||||
name: 'template.description',
|
||||
name: 'description',
|
||||
label: '描述',
|
||||
required: true,
|
||||
clearable: true,
|
||||
},
|
||||
{
|
||||
type: 'group',
|
||||
body: [
|
||||
{
|
||||
type: 'editor',
|
||||
required: true,
|
||||
label: '入参表单',
|
||||
description: '使用amis代码编写入参表单结构,流程会解析所有name对应的变量传入流程开始阶段;只需要编写form的columns部分',
|
||||
name: 'template.inputSchema',
|
||||
value: '[]',
|
||||
language: 'json',
|
||||
options: {
|
||||
wordWrap: 'bounded',
|
||||
},
|
||||
type: 'wrapper',
|
||||
size: 'none',
|
||||
body: [
|
||||
{
|
||||
type: 'input-kvs',
|
||||
name: 'inputSchema',
|
||||
label: '输入变量',
|
||||
addButtonText: '新增入参',
|
||||
draggable: false,
|
||||
keyItem: {
|
||||
label: '参数名称',
|
||||
...horizontalFormOptions(),
|
||||
validations: {
|
||||
isAlphanumeric: true,
|
||||
},
|
||||
},
|
||||
valueItems: [
|
||||
{
|
||||
...horizontalFormOptions(),
|
||||
type: 'input-text',
|
||||
name: 'label',
|
||||
required: true,
|
||||
label: '中文名称',
|
||||
clearValueOnEmpty: true,
|
||||
clearable: true,
|
||||
},
|
||||
{
|
||||
...horizontalFormOptions(),
|
||||
type: 'input-text',
|
||||
name: 'description',
|
||||
label: '参数描述',
|
||||
clearValueOnEmpty: true,
|
||||
clearable: true,
|
||||
},
|
||||
{
|
||||
...horizontalFormOptions(),
|
||||
type: 'select',
|
||||
name: 'type',
|
||||
label: '参数类型',
|
||||
required: true,
|
||||
selectFirst: true,
|
||||
options: Object.keys(typeMap).map(key => ({label: typeMap[key], value: key})),
|
||||
},
|
||||
{
|
||||
...horizontalFormOptions(),
|
||||
type: 'switch',
|
||||
name: 'required',
|
||||
label: '是否必填',
|
||||
required: true,
|
||||
value: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'amis',
|
||||
name: 'template.inputSchema',
|
||||
}
|
||||
]
|
||||
name: 'inputPreview',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'button-toolbar',
|
||||
|
||||
Reference in New Issue
Block a user