perf: dynamic and pipeline config ui

This commit is contained in:
Junyan Qin
2025-05-08 18:23:08 +08:00
parent f6d3619bbe
commit a0056eb14c
4 changed files with 13 additions and 49 deletions

View File

@@ -4,7 +4,7 @@ import {
} from '@/app/infra/entities/form/dynamic';
import { Input } from "@/components/ui/input"
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select"
import { Checkbox } from "@/components/ui/checkbox"
import { Switch } from "@/components/ui/switch"
import { ControllerRenderProps } from "react-hook-form";
import { Button } from "@/components/ui/button";
@@ -31,7 +31,7 @@ export default function DynamicFormItemComponent({
case DynamicFormItemType.BOOLEAN:
return (
<Checkbox
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
@@ -41,8 +41,9 @@ export default function DynamicFormItemComponent({
return (
<div className="space-y-2">
{field.value.map((item: string, index: number) => (
<div key={index} className="flex gap-2">
<div key={index} className="flex gap-2 items-center">
<Input
className="w-[200px]"
value={item}
onChange={(e) => {
const newValue = [...field.value];
@@ -50,15 +51,18 @@ export default function DynamicFormItemComponent({
field.onChange(newValue);
}}
/>
<Button
variant="destructive"
<button
type="button"
className="p-2 hover:bg-gray-100 rounded"
onClick={() => {
const newValue = field.value.filter((_: string, i: number) => i !== index);
field.onChange(newValue);
}}
>
</Button>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="w-5 h-5 text-red-500">
<path d="M7 4V2H17V4H22V6H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V6H2V4H7ZM6 6V20H18V6H6ZM9 9H11V17H9V9ZM13 9H15V17H13V9Z"></path>
</svg>
</button>
</div>
))}
<Button

View File

@@ -1,19 +0,0 @@
import { DynamicFormItemConfig } from '@/app/home/components/dynamic-form/DynamicFormItemConfig';
export interface IPipelineChildFormEntity {
name: string;
label: string;
formItems: DynamicFormItemConfig[];
}
export class PipelineChildFormEntity implements IPipelineChildFormEntity {
formItems: DynamicFormItemConfig[];
label: string;
name: string;
constructor(props: IPipelineChildFormEntity) {
this.label = props.label;
this.name = props.name;
this.formItems = props.formItems;
}
}

View File

@@ -5,7 +5,7 @@ import PipelineFormComponent from './components/pipeline-form/PipelineFormCompon
import { httpClient } from '@/app/infra/http/HttpClient';
import { PipelineCardVO } from '@/app/home/pipelines/components/pipeline-card/PipelineCardVO';
import PipelineCard from '@/app/home/pipelines/components/pipeline-card/PipelineCard';
import { PipelineFormEntity } from '@/app/home/pipelines/components/pipeline-form/PipelineFormEntity';
import { PipelineFormEntity } from '@/app/infra/entities/pipeline';
import styles from './pipelineConfig.module.css';
import {
Dialog,
@@ -80,28 +80,7 @@ export default function PluginConfigPage() {
return (
<div className={styles.configPageContainer}>
{/* <Modal
title={isEditForm ? '编辑流水线' : '创建流水线'}
centered
open={modalOpen}
destroyOnClose={true}
onOk={() => setModalOpen(false)}
onCancel={() => setModalOpen(false)}
width={700}
footer={null}
>
<PipelineFormComponent
onFinish={() => {
getPipelines();
setModalOpen(false);
}}
isEditMode={isEditForm}
pipelineId={selectedPipelineId}
disableForm={disableForm}
initValues={selectedPipelineFormValue}
/>
</Modal> */}
<Dialog open={modalOpen} onOpenChange={setModalOpen}>
<DialogContent>
<DialogHeader>